/* Layout: один вопрос на экран, фиксированная шкала прогресса сверху, карточка сферы при смене блока, варианты ответа списком */
  /* Тема одна, под лендинг: графит с оранжевым акцентом */
  :root{
    --bg:#0A0A0B;
    --surface:#151517;
    --surface-2:#1C1C20;
    --ink:#FFFFFF;
    --muted:#9A9AA2;
    --line:#2A2A30;
    --accent:#F26A33;
    --accent-dim:rgba(242,106,51,.18);
    --on-accent:#0A0A0B;
    --low:#F26A33;
    --mid:#E0A83C;
    --high:#4FBF86;
    --f-display:"Manrope",system-ui,-apple-system,sans-serif;
    --f-body:"Manrope",system-ui,-apple-system,sans-serif;
    --f-mono:"Manrope",ui-monospace,monospace;
    color-scheme:dark;
  }

  *{box-sizing:border-box}
  [hidden]{display:none!important}
  body{background:var(--bg);color:var(--ink);font-family:var(--f-body);margin:0;line-height:1.55;-webkit-font-smoothing:antialiased}
  button{font:inherit;cursor:pointer}

  .wrap{max-width:720px;margin:0 auto;padding:0 20px;padding-block:36px 72px}

  /* шапка прогресса */
  .topbar{position:fixed;top:0;left:0;right:0;z-index:10;background:var(--bg);border-bottom:1px solid var(--line);
    padding:0 20px;padding-top:env(safe-area-inset-top,0px)}
  .topbar-in{max-width:720px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;
    height:46px;font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
  .tb-sphere{color:var(--accent);font-weight:700}
  .tb-count{color:var(--muted);font-variant-numeric:tabular-nums}
  .tb-track{height:3px;background:var(--line);max-width:720px;margin:0 auto;border-radius:2px}
  .tb-fill{height:100%;width:0;background:var(--accent);border-radius:2px;
    box-shadow:0 0 12px rgba(242,106,51,.7);transition:width .3s ease}

  /* интро */
  .eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:0 0 14px;font-weight:700}
  h1{font-family:var(--f-display);font-weight:800;font-size:clamp(34px,7.5vw,54px);line-height:1.02;letter-spacing:-.03em;margin:0 0 18px;text-wrap:balance}
  h1 em{font-style:normal;color:var(--accent)}
  .lede{font-size:17px;color:var(--muted);margin:0 0 28px;max-width:58ch}
  .facts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
  .fact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px 14px;font-family:var(--f-mono);font-size:12px;color:var(--muted)}
  .fact b{display:block;font-family:var(--f-display);font-size:24px;color:var(--accent);font-weight:800;line-height:1.1;letter-spacing:-.02em}
  .spheres{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:32px}
  @media(max-width:560px){.spheres{grid-template-columns:1fr}}
  .sphere{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;min-width:0;position:relative}
  .sphere::before{content:"";position:absolute;top:0;left:18px;right:18px;height:2px;background:var(--accent);
    box-shadow:0 0 10px rgba(242,106,51,.6)}
  .sphere h3{font-family:var(--f-display);font-size:18px;margin:0 0 6px;font-weight:800;letter-spacing:-.01em}
  .sphere p{margin:0;font-size:14px;color:var(--muted)}

  .btn{background:var(--accent);color:#fff;border:none;border-radius:14px;padding:17px 26px;font-weight:700;font-size:16.5px;width:100%;
    box-shadow:0 8px 28px rgba(242,106,51,.28);transition:transform .12s, box-shadow .12s}
  .btn:hover{transform:translateY(-1px);box-shadow:0 10px 32px rgba(242,106,51,.38)}
  .btn:disabled{opacity:.35;cursor:not-allowed}
  .btn-ghost{background:none;border:1px solid var(--line);color:var(--muted);border-radius:14px;padding:11px 18px;font-size:14px}
  .btn:focus-visible,.btn-ghost:focus-visible,.opt:focus-visible,.back:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

  /* экран вопроса */
  #quiz{padding-top:84px}
  .sphere-card{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);
    border-left:3px solid var(--accent);border-radius:14px;padding:16px 18px;margin-bottom:26px}
  .sphere-card .idx{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 2px;font-weight:700}
  .sphere-card h2{font-family:var(--f-display);font-size:21px;font-weight:800;margin:0 0 2px;letter-spacing:-.015em}
  .sphere-card p{margin:0;font-size:14px;color:var(--muted)}

  .qtext{font-family:var(--f-display);font-size:clamp(25px,5.4vw,34px);font-weight:800;line-height:1.14;letter-spacing:-.025em;
    margin:0 0 26px;text-wrap:balance;max-width:24ch}

  .opts{display:flex;flex-direction:column;gap:10px}
  .opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--surface);
    border:1px solid var(--line);border-radius:14px;padding:17px 18px;font-size:16px;color:var(--ink);
    transition:border-color .12s, background .12s}
  .opt:hover{border-color:var(--accent);background:var(--surface-2)}
  .opt .n{flex:0 0 30px;height:30px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);
    display:flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--muted);font-weight:600}
  .opt span.t{min-width:0}
  .opt.sel{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700;
    box-shadow:0 8px 28px rgba(242,106,51,.3)}
  .opt.sel .n{background:#0A0A0B;border-color:#0A0A0B;color:#fff;font-weight:700}

  .back{display:block;margin:26px auto 0;background:none;border:none;color:var(--muted);font-size:14px;padding:8px 14px}
  .back:hover{color:var(--ink)}

  /* результат */
  #result{padding-top:8px}
  .chart-box{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 14px 14px;margin:0 0 26px}
  .chart-box svg{display:block;width:100%;height:auto;max-width:100%}
  .chart-note{margin:6px 0 0;text-align:center;font-size:13px;color:var(--muted)}
  .rx-name{font-family:var(--f-display);font-size:15px;font-weight:800;letter-spacing:-.01em}
  .rx-val{font-family:var(--f-display);font-size:22px;font-weight:800;letter-spacing:-.02em}
  .rx-zone{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}
  .meters{margin:0 0 30px}
  .meter{padding:16px 0;border-bottom:1px solid var(--line)}
  .meter:first-child{border-top:1px solid var(--line)}
  .meter-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:9px}
  .meter-name{font-family:var(--f-display);font-size:19px;font-weight:800;letter-spacing:-.01em}
  .meter-right{display:flex;align-items:baseline;gap:12px}
  .zone{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
  .meter-val{font-family:var(--f-display);font-size:28px;font-weight:800;font-variant-numeric:tabular-nums;min-width:56px;text-align:right;letter-spacing:-.02em}
  .track{height:8px;background:var(--surface-2);border:1px solid var(--line);border-radius:5px;overflow:hidden}
  .fill{height:100%;width:0;transition:width .7s cubic-bezier(.2,.7,.3,1)}
  .meter p{margin:10px 0 0;font-size:14.5px;color:var(--muted);max-width:60ch}

  .card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;margin-bottom:16px}
  .tag{display:inline-block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;font-weight:700}
  .card p{margin:0;font-size:16px}

  .insights{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 26px}
  @media(max-width:620px){.insights{grid-template-columns:1fr}}
  .insight{position:relative;display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);
    border-radius:14px;padding:22px 20px;min-width:0}
  .insight--pinch{background:linear-gradient(180deg, rgba(242,106,51,.10), rgba(242,106,51,.02));border-color:rgba(242,106,51,.45)}
  .ins-num{flex:0 0 auto;font-family:var(--f-display);font-size:13px;font-weight:800;letter-spacing:.08em;
    color:var(--muted);opacity:.65;padding-top:2px}
  .insight--pinch .ins-num{color:var(--accent);opacity:1}
  .insight .tag{margin-bottom:8px}
  .insight p:last-child{margin:0;font-size:16px;line-height:1.5}

  .cta-box{background:var(--surface);border:1px solid rgba(242,106,51,.5);border-radius:14px;padding:26px 24px;margin-bottom:16px;
    box-shadow:0 18px 50px rgba(242,106,51,.10)}
  .cta-title{font-family:var(--f-display);font-size:clamp(24px,5vw,30px);font-weight:800;letter-spacing:-.025em;margin:0 0 10px}
  .cta-lede{margin:0;font-size:15.5px;color:var(--muted);max-width:56ch}
  .quote{font-family:var(--f-display);font-size:clamp(19px,4vw,24px);line-height:1.28;font-weight:700;letter-spacing:-.015em;
    margin:18px 0 20px;padding:16px 18px;border-left:3px solid var(--accent);background:var(--surface-2);border-radius:0 12px 12px 0}
  .cta-row{display:flex;gap:10px;flex-wrap:wrap}
  .cta-row .btn{text-decoration:none;display:block;text-align:center;flex:1 1 220px;width:auto}
  .cta-row .btn-ghost{flex:0 0 auto}
  .hint{font-size:13.5px;color:var(--muted);margin:14px 0 0}
  .reset{display:block;margin:28px auto 0;background:none;border:none;color:var(--muted);font-size:13px;text-decoration:underline;padding:8px}
  @media (prefers-reduced-motion:reduce){*{transition:none!important}}

  /* форма контакта */
  .field{margin:0 0 14px}
  .field label{display:block;font-size:13px;color:var(--muted);margin:0 0 7px}
  .field input,.field textarea{width:100%;box-sizing:border-box;background:var(--surface-2);border:1px solid var(--line);color:var(--ink);
    font-family:var(--f-body);font-size:16px;line-height:1.45;padding:14px 16px;border-radius:12px;outline:none;resize:vertical}
  .field input:focus,.field textarea:focus{border-color:var(--accent)}
  .field input::placeholder,.field textarea::placeholder{color:#6B6B74}
  .skip{display:block;margin:16px auto 0;background:none;border:none;color:var(--muted);font-size:13px;text-decoration:underline;padding:8px}
  .err{color:var(--accent);font-size:13px;margin:10px 0 0}

  /* админ-панель */
  .adm h1{margin:0 0 6px}
  .adm-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:18px 0 24px}
  .adm-bar .btn-ghost{flex:0 0 auto}
  .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:0 0 24px}
  .kpi{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px}
  .kpi b{display:block;font-family:var(--f-display);font-size:28px;font-weight:800;letter-spacing:-.02em;line-height:1}
  .kpi span{display:block;font-size:12.5px;color:var(--muted);margin-top:6px}
  .adm-block{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;margin:0 0 18px}
  .adm-block h3{font-family:var(--f-display);font-size:15px;font-weight:800;margin:0 0 14px;letter-spacing:-.01em}
  .bars{display:grid;gap:9px}
  .bar-row{display:grid;grid-template-columns:1fr 46px;gap:10px;align-items:center;font-size:14px}
  .bar-row .bl{min-width:0}
  .bar-row .bt{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .bar-row .bg{height:6px;background:var(--surface-2);border-radius:99px;margin-top:6px;overflow:hidden}
  .bar-row .bf{height:100%;background:var(--accent);border-radius:99px}
  .bar-row .bv{text-align:right;font-variant-numeric:tabular-nums;color:var(--muted);font-size:13px}
  .rows{display:grid;gap:8px}
  .row{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
  .row-head{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:14px 16px;cursor:pointer}
  .row-head:hover{background:var(--surface-2)}
  .row-who{min-width:0}
  .row-who b{display:block;font-size:15px;font-weight:700}
  .row-who span{display:block;font-size:12.5px;color:var(--muted);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .row-sc{display:flex;gap:8px;align-items:center;font-variant-numeric:tabular-nums;font-size:13px}
  .row-sc i{font-style:normal;padding:3px 7px;border-radius:7px;background:var(--surface-2)}
  .row-body{border-top:1px solid var(--line);padding:16px;display:none}
  .row.open .row-body{display:block}
  .row-body h4{font-family:var(--f-display);font-size:13px;font-weight:800;margin:16px 0 8px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
  .row-body h4:first-child{margin-top:0}
  .qa{display:grid;grid-template-columns:28px 1fr;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px}
  .qa:last-child{border-bottom:none}
  .qa .qn{font-variant-numeric:tabular-nums;color:var(--accent);font-weight:700}
  .qa .qq{color:var(--muted);margin:0 0 3px}
  .qa .qv{margin:0}
  .adm-note{font-size:13px;color:var(--muted);line-height:1.55}

  /* регистрация на эфир */
  .reg-title{font-family:var(--f-display);font-size:17px;font-weight:800;letter-spacing:-.01em;margin:0 0 16px}
  .reg-q{font-size:14px;color:var(--muted);margin:18px 0 10px}
  .opts--compact .opt{padding:13px 14px;margin:0 0 8px}
  .opts--compact .opt .t{font-size:15px}
  #regForm .field{max-width:420px}
  #regForm .btn{margin-top:18px}
  .reg-done-title{font-family:var(--f-display);font-size:19px;font-weight:800;letter-spacing:-.015em;margin:0 0 10px;color:var(--high)}
  #regDone .btn-ghost{display:inline-block;margin-top:14px;text-decoration:none}