  :root {
    --bg: #ffffff; --bg-2: #f4f5f7; --ink: #0b0d12; --ink-soft: #5a6072;
    --accent: #1ec8ff; --accent-2: #b794f4; --accent-3: #6ee7a8;
    --line: rgba(11,13,18,0.10); --card: #ffffff;
    --risk-min: #6ee7a8; --risk-low: #1ec8ff; --risk-high: #f59e0b; --risk-banned: #ef4444;
  }
  * { box-sizing: border-box; }
  html, body { margin:0; padding:0; background:var(--bg); color:var(--ink); font-family:"Inter Tight","Inter",sans-serif; -webkit-font-smoothing:antialiased; }
  body { overflow-x:hidden; }
  main { position:relative; z-index:2; }

  .calc-wrap { max-width: 980px; margin: 0 auto; padding: 140px 5vw 80px; }
  .calc-eyebrow { display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);background:rgba(30,200,255,.08);padding:6px 14px;border-radius:999px;margin-bottom:24px }
  .calc-eyebrow .dot { width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent) }
  .calc-h1 { font-size:clamp(32px,5.5vw,52px);font-weight:900;letter-spacing:-.03em;line-height:1.05;margin:0 0 22px }
  .calc-h1 em { font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;color:var(--accent) }
  .calc-lede { font-size:clamp(16px,2vw,19px);color:var(--ink-soft);line-height:1.6;max-width:680px;margin:0 0 12px }
  .calc-source { font-size:13px;color:var(--ink-soft);line-height:1.55;max-width:680px;font-style:italic;margin:6px 0 0 }

  .quiz-card { background:var(--card);border:1px solid var(--line);border-radius:20px;padding:36px clamp(20px,4vw,44px);box-shadow:0 12px 40px rgba(11,13,18,.06),0 2px 6px rgba(11,13,18,.04);margin-top:48px }

  .progress-bar { height:4px;background:var(--bg-2);border-radius:999px;overflow:hidden;margin-bottom:28px }
  .progress-bar-fill { height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:999px;width:0%;transition:width .35s ease }
  .progress-label { font-size:13px;color:var(--ink-soft);margin-bottom:24px;font-weight:600 }

  .q-block { display:none }
  .q-block.active { display:block }
  .q-num { font-size:13px;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-bottom:10px }
  .q-text { font-size:clamp(20px,3vw,26px);font-weight:800;letter-spacing:-.01em;line-height:1.25;margin:0 0 8px;color:var(--ink) }
  .q-hint { font-size:14px;color:var(--ink-soft);line-height:1.55;margin:0 0 24px }

  .q-options { display:flex;flex-direction:column;gap:12px;margin-bottom:28px }
  .q-option { display:flex;align-items:flex-start;gap:14px;padding:18px 20px;border:1.5px solid var(--line);border-radius:14px;cursor:pointer;background:var(--card);transition:border-color .15s, background .15s, transform .1s }
  .q-option:hover { border-color:var(--accent);background:rgba(30,200,255,.04) }
  .q-option.selected { border-color:var(--accent);background:rgba(30,200,255,.08);box-shadow:0 0 0 3px rgba(30,200,255,.10) }
  .q-option input { margin-top:3px;flex-shrink:0;accent-color:var(--accent) }
  .q-option-text { font-size:15.5px;line-height:1.5;color:var(--ink) }
  .q-option-text strong { font-weight:700;display:block;margin-bottom:2px }
  .q-option-text em { font-style:normal;color:var(--ink-soft);font-size:14px }

  .quiz-nav { display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:24px }
  .quiz-btn { font-family:inherit;font-size:15px;font-weight:700;padding:13px 24px;border-radius:999px;border:none;cursor:pointer;transition:transform .12s,opacity .12s }
  .quiz-btn.primary { background:var(--ink);color:#fff }
  .quiz-btn.primary:hover { transform:translateY(-1px) }
  .quiz-btn.ghost { background:transparent;color:var(--ink-soft);border:1.5px solid var(--line) }
  .quiz-btn:disabled { opacity:.35;cursor:not-allowed;transform:none }

  /* RESULT */
  .result-card { display:none;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:0;overflow:hidden;margin-top:48px;box-shadow:0 12px 40px rgba(11,13,18,.06),0 2px 6px rgba(11,13,18,.04) }
  .result-card.active { display:block }
  .result-head { padding:36px clamp(22px,4vw,44px);color:#fff;position:relative }
  .result-head.risk-min { background:linear-gradient(135deg,#10b981,#6ee7a8) }
  .result-head.risk-low { background:linear-gradient(135deg,#0891b2,#1ec8ff) }
  .result-head.risk-high { background:linear-gradient(135deg,#d97706,#f59e0b) }
  .result-head.risk-banned { background:linear-gradient(135deg,#991b1b,#ef4444) }
  .result-tier { font-size:13px;text-transform:uppercase;letter-spacing:.1em;font-weight:700;opacity:.85;margin-bottom:10px }
  .result-title { font-size:clamp(26px,4vw,38px);font-weight:900;letter-spacing:-.02em;line-height:1.1;margin:0 0 16px }
  .result-summary { font-size:16px;line-height:1.6;opacity:.95;max-width:680px;margin:0 }

  .result-body { padding:36px clamp(22px,4vw,44px) }
  .result-body h3 { font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-weight:700;margin:0 0 16px }
  .result-body h3:not(:first-child) { margin-top:36px }
  .result-body ul { margin:0;padding-left:22px;line-height:1.75;color:var(--ink) }
  .result-body ul li { margin-bottom:6px }
  .result-body p { line-height:1.65;color:var(--ink);margin:0 0 16px }
  .result-body p:last-child { margin-bottom:0 }
  .result-body strong { font-weight:700 }
  .result-body a { color:var(--accent);text-decoration:underline;text-underline-offset:3px }

  .result-cta { background:#0b0d12;color:#fff;padding:36px clamp(22px,4vw,44px) }
  .result-cta h3 { color:#fff;font-size:clamp(20px,3vw,26px);font-weight:800;margin:0 0 14px }
  .result-cta p { color:rgba(255,255,255,.78);line-height:1.6;font-size:15.5px;margin:0 0 22px;max-width:680px }
  .result-cta a.primary { display:inline-block;background:var(--accent);color:#0b0d12;font-weight:700;padding:13px 26px;border-radius:999px;text-decoration:none;font-size:15px }
  .result-cta a.ghost { display:inline-block;border:1.5px solid rgba(255,255,255,.25);color:#fff;font-weight:600;padding:12px 24px;border-radius:999px;text-decoration:none;font-size:15px;margin-left:10px }
  .result-restart { margin-top:24px;text-align:center }
  .result-restart button { background:none;border:none;color:var(--ink-soft);text-decoration:underline;cursor:pointer;font-family:inherit;font-size:14px }

  .calc-explain { margin-top:60px;padding:32px clamp(20px,4vw,40px);border-left:3px solid var(--accent);background:var(--bg-2);border-radius:0 14px 14px 0 }
  .calc-explain h3 { font-size:18px;font-weight:800;margin:0 0 14px }
  .calc-explain p { font-size:15px;line-height:1.65;color:var(--ink);margin:0 0 12px }
  .calc-explain a { color:var(--accent);text-decoration:underline;text-underline-offset:3px }

  .calc-disclaimer { margin-top:48px;padding-top:28px;border-top:1px solid var(--line);font-size:13px;color:var(--ink-soft);line-height:1.6 }
