:root{
    --bg:#0d1117; --bg2:#151b23; --card:#161c24; --line:#252d38;
    --text:#e8edf3; --muted:#93a1b3; --dim:#6b7a8d;
    --good:#2ecc8f; --bad:#ff6b6b; --warn:#ffb02e; --accent:#5aa9ff;
    --grid:#1f2731;
  }
  *{box-sizing:border-box}
  body{
    margin:0; background:var(--bg); color:var(--text);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
    line-height:1.55; -webkit-font-smoothing:antialiased;
  }
  .wrap{max-width:1120px;margin:0 auto;padding:0 20px 80px}
  a{color:var(--accent)}

  /* ---------- header ---------- */
  header.hero{
    padding:56px 0 28px; border-bottom:1px solid var(--line);
    background:radial-gradient(900px 320px at 15% -10%, rgba(90,169,255,.13), transparent 70%);
  }
  .kicker{color:var(--accent);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
  h1{font-size:clamp(30px,5vw,48px);line-height:1.1;margin:12px 0 14px;letter-spacing:-.02em}
  .sub{color:var(--muted);font-size:17px;max-width:720px}
  .stamp{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:var(--dim)}
  .badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:99px;border:1px solid var(--line);background:var(--bg2);font-weight:600;font-size:12px}
  .dot{width:7px;height:7px;border-radius:50%;background:var(--warn)}
  .dot.live{background:var(--good)}

  /* ---------- sidebar layout ---------- */
  .app{display:flex;align-items:flex-start}
  #sidebar{flex:0 0 var(--sbw,258px);width:var(--sbw,258px);position:sticky;top:0;height:100vh;
    overflow-y:auto;background:var(--bg2);border-right:1px solid var(--line);z-index:50}
  #sidebar.collapsed{display:none}
  .sb-inner{padding:18px 12px 40px}
  .sb-brand{display:flex;align-items:center;justify-content:space-between;margin:0 6px 6px}
  .sb-brand .logo{font-weight:800;font-size:19px;letter-spacing:-.02em}
  .sb-brand .logo span{color:var(--accent)}
  .sb-tag{color:var(--dim);font-size:11px;margin:0 8px 16px}
  .menu{display:flex;flex-direction:column;gap:1px}
  .menu a,.mgroup-h{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
    color:var(--muted);text-decoration:none;font-size:13.5px;font-weight:600;
    padding:8px 12px;border-radius:9px;border:none;background:none;cursor:pointer;font-family:inherit}
  .menu a:hover,.mgroup-h:hover{background:var(--card);color:var(--text)}
  .menu a.active{background:rgba(90,169,255,.13);color:var(--accent)}
  .mgroup-h{justify-content:space-between;font-weight:700;color:var(--text)}
  .mgroup-h .caret{transition:transform .2s;color:var(--dim);font-size:11px}
  .mgroup.open .mgroup-h .caret{transform:rotate(90deg)}
  .mgroup-body{display:none;margin:2px 0 6px 12px;padding-left:8px;border-left:1px solid var(--line)}
  .mgroup.open .mgroup-body{display:flex;flex-direction:column;gap:1px}
  .mgroup-body a{font-size:12.8px;font-weight:500;padding:6px 12px}
  #sbResize{position:absolute;top:0;right:0;width:7px;height:100vh;cursor:col-resize;z-index:60}
  #menuToggle{position:fixed;top:14px;left:14px;z-index:70;width:42px;height:42px;border-radius:10px;
    background:var(--bg2);border:1px solid var(--line);color:var(--text);font-size:18px;cursor:pointer;display:none}
  #menuToggle.show{display:block}
  .main{flex:1;min-width:0}
  .view[hidden]{display:none}
  .tool{scroll-margin-top:18px}
  @media(max-width:820px){
    #sidebar{position:fixed;left:0;top:0;box-shadow:0 18px 50px rgba(0,0,0,.55)}
    .main{width:100%}
  }

  /* ---------- verdict ---------- */
  .verdict{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:30px;margin-bottom:14px}
  .vtop{display:flex;gap:30px;align-items:center;flex-wrap:wrap}
  .gauge{flex:0 0 210px}
  .vtext{flex:1;min-width:280px}
  .vtext h2{margin:0 0 8px;font-size:26px;letter-spacing:-.01em}
  .vtext p{margin:0;color:var(--muted);font-size:15.5px}
  .signals{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:10px;margin-top:26px}
  .sig{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
  .sig .n{font-size:11.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.07em;font-weight:700}
  .sig .v{font-size:15px;font-weight:700;margin-top:5px;display:flex;align-items:center;gap:7px}
  .pill{font-size:10.5px;padding:2px 8px;border-radius:99px;font-weight:800;letter-spacing:.04em}
  .p-good{background:rgba(46,204,143,.15);color:var(--good)}
  .p-bad{background:rgba(255,107,107,.15);color:var(--bad)}
  .p-warn{background:rgba(255,176,46,.15);color:var(--warn)}

  /* ---------- sections ---------- */
  section{margin:52px 0 0;scroll-margin-top:70px}
  .shead{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:6px}
  .shead h2{font-size:27px;margin:0;letter-spacing:-.02em}
  .shead .tag{font-size:12px;color:var(--dim);font-weight:700;text-transform:uppercase;letter-spacing:.1em}
  .lede{color:var(--muted);max-width:820px;margin:0 0 22px;font-size:15.5px}

  .grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}
  .card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px}
  .card h3{margin:0 0 4px;font-size:16.5px}
  .card .why{color:var(--dim);font-size:13.5px;margin:0 0 14px}
  .chartbox{position:relative;height:230px}
  .chartbox.tall{height:275px}

  .stat{display:flex;align-items:flex-end;gap:12px;margin:2px 0 12px;flex-wrap:wrap}
  .stat .big{font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1}
  .stat .chg{font-size:13.5px;font-weight:700}
  .up{color:var(--bad)} .down{color:var(--good)}
  .upg{color:var(--good)} .downg{color:var(--bad)}
  .neutral{color:var(--muted)}

  .means{margin-top:14px;border-left:3px solid var(--accent);background:rgba(90,169,255,.06);padding:11px 14px;border-radius:0 10px 10px 0;font-size:13.8px;color:#c9d6e4}
  .means b{color:#fff}

  /* ---------- tools ---------- */
  .tool{background:linear-gradient(180deg,var(--card),#12181f);border:1px solid var(--line);border-radius:16px;padding:22px}
  .tool h3{margin:0 0 3px;font-size:17px}
  .tool .why{color:var(--dim);font-size:13.5px;margin:0 0 16px}
  .row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
  .fld{flex:1;min-width:132px}
  label{display:block;font-size:11.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.07em;font-weight:700;margin-bottom:5px}
  input[type=number],input[type=text],select{
    width:100%;background:#0e141b;border:1px solid var(--line);color:var(--text);
    border-radius:9px;padding:9px 11px;font-size:15px;font-family:inherit;
  }
  input:focus,select:focus{outline:none;border-color:var(--accent)}
  .out{background:#0e141b;border:1px solid var(--line);border-radius:12px;padding:15px;margin-top:6px}
  .out .line{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:14.5px;border-bottom:1px dashed #1e2732}
  .out .line:last-child{border-bottom:none}
  .out .line span:last-child{font-weight:800}
  .verdictline{margin-top:12px;font-size:14px;color:#c9d6e4}

  /* ---------- personal tools ---------- */
  .profile{border-color:rgba(90,169,255,.42)}
  .privtag{font-size:11px;font-weight:700;color:var(--good);background:rgba(46,204,143,.12);padding:2px 9px;border-radius:99px;margin-left:8px;letter-spacing:.01em;text-transform:none;white-space:nowrap}
  .btn{background:var(--bg2);border:1px solid var(--line);color:var(--text);border-radius:9px;padding:8px 15px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit}
  .btn:hover{border-color:var(--accent)}
  .btn.share{background:rgba(90,169,255,.12);border-color:rgba(90,169,255,.4);color:var(--accent)}
  .bigpct{font-size:40px;font-weight:800;letter-spacing:-.02em;line-height:1.05}
  .pbar{height:12px;border-radius:99px;margin:32px 0 6px;position:relative;
    background:linear-gradient(90deg,#2ecc8f 0%,#5aa9ff 45%,#b18cff 72%,#ffb02e 88%,#ff6b6b 100%)}
  .pbar .marker{position:absolute;top:-4px;width:3px;height:20px;background:#fff;border-radius:2px;box-shadow:0 0 0 2px var(--bg)}
  .pbar .mlabel{position:absolute;top:-28px;transform:translateX(-50%);font-size:11.5px;font-weight:800;white-space:nowrap;background:var(--bg2);border:1px solid var(--line);padding:2px 8px;border-radius:6px}
  .scale{display:flex;justify-content:space-between;font-size:11px;color:var(--dim)}
  .chip{display:inline-block;font-size:12px;padding:3px 10px;border-radius:99px;margin:3px 6px 3px 0;font-weight:700}
  .chip.good{background:rgba(46,204,143,.14);color:var(--good)}
  .chip.bad{background:rgba(255,107,107,.14);color:var(--bad)}
  .seg{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
  .seg button{flex:1;min-width:56px;background:#0e141b;border:1px solid var(--line);color:var(--muted);border-radius:8px;padding:8px 4px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit}
  .seg button.on{background:rgba(90,169,255,.15);border-color:var(--accent);color:var(--accent)}
  .scorering{display:flex;align-items:center;gap:20px;flex-wrap:wrap}

  /* ---------- faq ---------- */
  .faq details{background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:10px;overflow:hidden}
  .faq summary{padding:15px 18px;cursor:pointer;font-weight:700;font-size:15.5px;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"+";color:var(--accent);font-weight:800;font-size:20px;line-height:1}
  .faq details[open] summary::after{content:"–"}
  .faq .a{padding:0 18px 16px;color:var(--muted);font-size:14.5px}

  /* ---------- checklist ---------- */
  table.chk{width:100%;border-collapse:collapse;font-size:14px}
  table.chk th{text-align:left;color:var(--dim);font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;padding:8px 10px;border-bottom:1px solid var(--line)}
  table.chk td{padding:11px 10px;border-bottom:1px solid #1b222c;vertical-align:top}
  table.chk td:first-child{font-weight:700;white-space:nowrap}
  .light{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;vertical-align:middle}

  /* ---------- playbook ---------- */
  .pb{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
  .pb .c{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}
  .pb h4{margin:0 0 8px;font-size:15px}
  .pb ul{margin:0;padding-left:18px;color:var(--muted);font-size:14px}
  .pb li{margin-bottom:7px}

  details.setup{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:0;margin-top:14px;overflow:hidden}
  details.setup summary{padding:16px 20px;cursor:pointer;font-weight:700;font-size:15px;list-style:none}
  details.setup summary::-webkit-details-marker{display:none}
  details.setup summary::before{content:"▸ ";color:var(--accent)}
  details.setup[open] summary::before{content:"▾ "}
  details.setup .body{padding:0 20px 20px;border-top:1px solid var(--line);color:var(--muted);font-size:14.3px}
  pre{background:#0a0e13;border:1px solid var(--line);border-radius:10px;padding:14px;overflow-x:auto;font-size:12.6px;color:#c8d6e5;line-height:1.5}
  code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.6px}
  .inlinecode{background:#0a0e13;border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:#a8c7e8}

  .note{color:var(--dim);font-size:12.8px;margin-top:10px}
  footer{margin-top:56px;padding-top:26px;border-top:1px solid var(--line);color:var(--dim);font-size:13px}
  .disc{background:rgba(255,176,46,.07);border:1px solid rgba(255,176,46,.25);border-radius:12px;padding:15px 18px;color:#d9c9a8;font-size:13.6px;margin-top:22px}
  .srcs{columns:2;column-gap:26px;font-size:13px}
  @media(max-width:640px){.srcs{columns:1}.gauge{flex:1 1 100%}}