:root {
    --bg:#070a11; --panel:#0c101a; --panel2:#111726; --text:#e9ecf4; --muted:#8d96ab;
    --border:#1d2536; --border2:#2a3450; --accent:#8b7cff; --good:#3ddc97; --warn:#ffb454;
    --front:#8b6cff; --near:#3fb6ff; --gray:#697184;
    --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    --disp:'Space Grotesk',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  }
  * { box-sizing:border-box; margin:0; padding:0; }
  html { scroll-behavior:smooth; }
  body { background:var(--bg); color:var(--text);
    font:14px/1.55 var(--disp); }
  body::before { content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
    background:
      radial-gradient(1000px 520px at 18% -220px, rgba(139,124,255,.13), transparent 70%),
      radial-gradient(760px 460px at 88% -180px, rgba(63,182,255,.07), transparent 70%),
      radial-gradient(600px 600px at 55% 115%, rgba(61,220,151,.04), transparent 70%); }
  ::selection { background:rgba(139,124,255,.35); }
  .wrap { max-width:1240px; margin:0 auto; padding:0 24px 64px; }
  a { color:#7db8ff; text-decoration:none; } a:hover { text-decoration:underline; }

  /* top bar */
  .topbar { position:sticky; top:0; z-index:30; display:flex; align-items:center; justify-content:space-between;
    padding:13px 28px; background:rgba(7,10,17,.78); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid var(--border); }
  .brand { font:600 12px var(--mono); letter-spacing:.14em; color:var(--text); text-transform:uppercase; }
  .brand:hover { text-decoration:none; }
  .brandmark { color:var(--accent); margin-right:7px; font-size:10px; }
  .navlinks { display:flex; gap:22px; }
  .navlinks a { font:500 11px var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted);
    transition:color .15s; }
  .navlinks a:hover { color:var(--text); text-decoration:none; }

  /* hero */
  header { padding:76px 0 8px; }
  .eyebrow { font:600 11px var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); }
  h1 { font:700 clamp(42px,6.4vw,72px)/1.03 var(--disp); letter-spacing:-0.035em; margin:16px 0 18px; }
  h1 .grad { background:linear-gradient(92deg,#a79bff 0%,#5fc5ff 55%,#3ddc97 110%);
    -webkit-background-clip:text; background-clip:text; color:transparent; }
  .hero-sub { max-width:600px; color:var(--muted); font-size:15.5px; line-height:1.65; }
  .hero-sub strong { color:var(--text); font-weight:600; }
  .hero-stats { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
  .hero-stats .chip { font:500 11.5px var(--mono); color:var(--muted); border:1px solid var(--border);
    background:var(--panel); border-radius:20px; padding:5px 12px; white-space:nowrap; }
  .hero-stats .chip b { color:var(--text); font-weight:600; }

  /* award cards */
  .awards { display:grid; grid-template-columns:repeat(auto-fit,minmax(235px,1fr)); gap:12px; margin-top:26px; }
  .award { display:flex; align-items:center; gap:12px; border:1px solid var(--border);
    border-radius:12px; padding:14px 16px; cursor:pointer;
    transition:border-color .15s, transform .15s, box-shadow .15s; }
  .award:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,0,0,.4); }
  .award .medal { font-size:24px; line-height:1; }
  .award img.big { width:36px; height:36px; border-radius:9px; object-fit:contain;
    background:#070a11; border:1px solid rgba(255,255,255,.1); padding:4px; flex:none; }
  .award .who { font-weight:650; font-size:14.5px; white-space:nowrap; letter-spacing:-0.01em; }
  .award .what { font:600 10px var(--mono); text-transform:uppercase; letter-spacing:.14em; white-space:nowrap; }
  .award .stat { font:500 11px var(--mono); color:var(--muted); white-space:nowrap; margin-top:1px; }

  /* section heads */
  section { scroll-margin-top:76px; }
  .sec-head { margin:66px 0 18px; border-top:1px solid var(--border); padding-top:24px; }
  .sec-head h2 { font:650 27px/1.15 var(--disp); letter-spacing:-0.025em; margin:9px 0 6px; }
  .sec-sub { color:var(--muted); font-size:13.5px; max-width:640px; }

  /* tier cards (unused grid kept for compatibility) */
  .cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px; }
  .card { background:var(--panel); border:1px solid var(--border); border-radius:14px;
    padding:18px 18px 14px; position:relative; overflow:hidden; }
  .card::before { content:''; position:absolute; inset:0 auto 0 0; width:4px; background:var(--tc); }
  .card .tier-name { font-size:15px; font-weight:700; color:var(--tc); }
  .card .tier-range { color:var(--muted); font-size:12px; margin-left:8px; font-weight:400; }
  .card .count { font-size:26px; font-weight:700; margin:8px 0 2px; font-variant-numeric:tabular-nums; }
  .card .count small { font-size:12px; color:var(--muted); font-weight:400; margin-left:6px; }
  .card .stat { font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
  .card .pick { margin-top:12px; padding:10px 12px; background:var(--panel2);
    border:1px solid var(--border); border-radius:9px; font-size:12.5px; }
  .card .pick .lab { color:var(--tc); font-weight:650; font-size:11px; text-transform:uppercase; letter-spacing:0.06em; }
  .card .pick .who { font-weight:600; margin:2px 0; }
  .card .top { margin-top:10px; font-size:12px; color:var(--muted); }

  /* shared pick-table styling: value ladder + lab leaderboard (inside .card) */
  .card.pickwrap { padding:8px; overflow-x:auto; }
  .pick { width:100%; }
  .pick th { position:static; background:none; cursor:default; }
  .pick td { padding:10px 12px; }
  .pick td.price { font-weight:650; white-space:nowrap; font-family:var(--mono); font-size:12px; }
  .pick td.near, .pick .near { font-size:12px; color:var(--muted); }
  .pick td.near a { color:#7fb6f5; }
  .pick tr.award-row td { border-bottom-color:transparent; }
  .muted { color:var(--muted); }
  .ico { width:14px; height:14px; border-radius:3px; vertical-align:-2px; margin-right:5px;
    display:inline-block; background:#070a11; border:1px solid rgba(255,255,255,.08); }

  /* controls */
  .controls { display:flex; gap:18px; flex-wrap:wrap; align-items:flex-end; margin-bottom:14px; }
  .field { display:flex; flex-direction:column; gap:7px; }
  .field.grow { flex:1 1 240px; }
  .cap { font:600 10px var(--mono); letter-spacing:.15em; text-transform:uppercase; color:var(--muted); }
  select, input[type=text], input[type=search] { background-color:var(--panel2); color:var(--text);
    border:1px solid var(--border); border-radius:8px; padding:8px 11px; font-size:13px;
    font-family:var(--disp); transition:border-color .15s, box-shadow .15s; }
  select { -webkit-appearance:none; appearance:none; cursor:pointer; width:100%;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238d96ab' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 11px center; padding-right:32px; }
  select:focus, input:focus { outline:none; border-color:var(--accent);
    box-shadow:0 0 0 3px rgba(139,124,255,.18); }
  select:hover, input[type=search]:hover { border-color:var(--border2); }

  /* toggle switch */
  .switchline { display:inline-flex; align-items:center; gap:9px; cursor:pointer;
    font-size:12.5px; color:var(--muted); user-select:none; padding-bottom:9px; }
  .switchline:hover { color:var(--text); }
  .switch { position:relative; width:34px; height:19px; flex:none; }
  .switch input { position:absolute; inset:0; margin:0; opacity:0; cursor:pointer; }
  .switch i { position:absolute; inset:0; background:var(--panel2); border:1px solid var(--border2);
    border-radius:20px; transition:background .18s, border-color .18s; pointer-events:none; }
  .switch i::after { content:''; position:absolute; top:2px; left:2px; width:13px; height:13px;
    border-radius:50%; background:var(--muted); transition:left .18s, background .18s; }
  .switch input:checked + i { background:rgba(139,124,255,.25); border-color:var(--accent); }
  .switch input:checked + i::after { left:17px; background:var(--accent);
    box-shadow:0 0 8px rgba(139,124,255,.6); }
  .switch input:focus-visible + i { box-shadow:0 0 0 3px rgba(139,124,255,.18); }

  /* search box */
  .searchbox { position:relative; display:block; }
  .searchbox svg { position:absolute; left:11px; top:50%; transform:translateY(-50%); pointer-events:none; }
  .searchbox input { padding-left:33px; width:100%; }
  .legend { display:flex; gap:18px; flex-wrap:wrap; margin:4px 0 12px; font:500 11.5px var(--mono); }
  .legend span { display:inline-flex; align-items:center; gap:7px; cursor:pointer; user-select:none;
    color:var(--muted); transition:opacity .15s; }
  .legend span:hover { color:var(--text); }
  .dot { width:9px; height:9px; border-radius:50%; display:inline-block; flex:none;
    box-shadow:0 0 0 3px rgba(255,255,255,.05); }

  /* chart */
  .chart-wrap { background:linear-gradient(180deg,#0d1220, var(--panel) 30%); border:1px solid var(--border);
    border-radius:14px; padding:16px 16px 8px; }
  #chart text { font-family:var(--mono); }
  .tip { position:fixed; background:#131a2c; border:1px solid #36406b; border-radius:10px;
    padding:10px 12px; font-size:12px; pointer-events:none; display:none; z-index:40;
    max-width:280px; box-shadow:0 12px 32px rgba(0,0,0,.5); }
  .tip b { font-size:12.5px; }
  .frontier-halo { filter:drop-shadow(0 0 5px rgba(255,255,255,.65)); }

  /* table */
  .table-card { background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:6px; }
  .table-scroll { overflow-x:auto; max-height:74vh; overflow-y:auto; border-radius:10px;
    scrollbar-width:thin; scrollbar-color:#2c3760 transparent; }
  .table-scroll::-webkit-scrollbar { height:10px; width:10px; }
  .table-scroll::-webkit-scrollbar-thumb { background:#2c3760; border-radius:6px;
    border:2px solid var(--panel); }
  .table-scroll::-webkit-scrollbar-corner { background:transparent; }
  #tbl th, #tbl td { padding:9px 12px; }
  table { width:100%; border-collapse:collapse; font-size:12.5px; }
  th { text-align:left; color:var(--muted); font:600 10.5px var(--mono); letter-spacing:.08em;
    text-transform:uppercase; padding:11px 12px; white-space:nowrap;
    border-bottom:1px solid var(--border2); cursor:pointer; user-select:none;
    position:sticky; top:0; background:var(--panel2); z-index:2; }
  th:hover { color:var(--text); }
  th .arr { color:var(--accent); font-size:10px; }
  td { padding:9px 12px; border-bottom:1px solid #161d2e; white-space:nowrap; }
  td.num, th.num { text-align:right; font-family:var(--mono); font-size:12px; }
  tbody tr:hover td { background:#141b2e; }
  tr.gray td { opacity:.42; }
  tr.gray td:first-child { opacity:.7; }
  .tag { display:inline-flex; align-items:center; gap:5px; padding:2px 9px; border-radius:20px;
    font:600 10.5px var(--mono); letter-spacing:.04em; }
  .tag .sdot { width:5px; height:5px; border-radius:50%; background:currentColor; display:inline-block; }
  .reason { color:var(--muted); font-size:11px; font-style:italic; }
  .src { color:var(--muted); font-size:10.5px; font-family:var(--mono); }

  /* footer */
  .foot { margin-top:56px; color:var(--muted); font-size:12px; line-height:1.75;
    border-top:1px solid var(--border); padding-top:24px;
    display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px 40px; }
  .foot .fhead { font:600 10.5px var(--mono); letter-spacing:.14em; text-transform:uppercase;
    color:var(--accent); display:block; margin-bottom:6px; }

  /* table controls: price cap slider + lab chips */
  .rangeline { display:flex; align-items:center; gap:10px; }
  .slider-val { font:500 11.5px var(--mono); min-width:64px; color:var(--text); text-align:center;
    border:1px solid var(--border); background:var(--panel2); border-radius:7px; padding:5px 8px; }
  input[type=range] { -webkit-appearance:none; appearance:none; width:170px; height:20px;
    background:transparent; cursor:pointer; }
  input[type=range]::-webkit-slider-runnable-track { height:4px; border-radius:2px;
    background:linear-gradient(90deg, var(--accent) var(--p,100%), #232c49 var(--p,100%)); }
  input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; width:14px; height:14px;
    margin-top:-5px; border-radius:50%; background:#0c101a; border:2px solid var(--accent);
    box-shadow:0 0 0 3px rgba(139,124,255,.15); }
  input[type=range]::-moz-range-track { height:4px; border-radius:2px; background:#232c49; }
  input[type=range]::-moz-range-progress { height:4px; border-radius:2px; background:var(--accent); }
  input[type=range]::-moz-range-thumb { width:10px; height:10px; border-radius:50%;
    background:#0c101a; border:2px solid var(--accent); }
  .lab-row { display:flex; gap:14px; align-items:flex-start; margin:0 0 12px; }
  .lab-row .cap { padding-top:7px; flex:none; }
  .lab-chips { display:flex; flex-wrap:wrap; gap:8px; }
  .lab-chip { display:inline-flex; align-items:center; gap:7px; height:28px; padding:0 13px;
    background:var(--panel); border:1px solid var(--border); border-radius:999px;
    color:var(--muted); font:500 11px var(--mono); letter-spacing:.03em; cursor:pointer;
    transition:border-color .15s, color .15s, background .15s; }
  .lab-chip:hover { border-color:#3fb6ff66; color:var(--text); }
  .lab-chip.active { border-color:var(--accent); color:var(--text);
    background:rgba(139,124,255,.1); }

  @media (max-width:720px) {
    .navlinks { display:none; }
    header { padding:52px 0 4px; }
    .hero-sub { font-size:14px; }
    .sec-head { margin:46px 0 14px; }
    .sec-head h2 { font-size:22px; }
    .controls { gap:12px; }
    .controls .field { flex:1 1 100%; }
    .switchline { padding-bottom:0; }
    .lab-row { flex-direction:column; gap:8px; }
    .lab-row .cap { padding-top:0; }
    #chart { height:380px; }
    .tip { max-width:230px; }
    .foot { grid-template-columns:1fr; }
    .wrap { padding:0 14px 48px; }
  }
.blend-sub { font-size:10px; font-weight:400; color:#7c8496; white-space:nowrap; margin-top:1px; }
.pick td.gained { color:var(--accent); }
.pick td.lab { white-space:nowrap; }
.boost-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:18px; }
.boost-group { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:14px 16px 12px; min-width:0; }
.boost-ghead { display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  padding-bottom:10px; margin-bottom:8px; border-bottom:1px solid var(--border2); }
.boost-gt { display:flex; flex-direction:column; gap:2px; min-width:0; }
.boost-glabel { font:600 11px var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.boost-gdesc { font:500 10.5px var(--mono); color:var(--muted); }
.boost-count { font:600 11px var(--mono); color:var(--muted); flex:none; }
.boost-group.big .boost-glabel { color:var(--accent); }
.boost-group.catchup .boost-glabel { color:#3fb6ff; }
.boost-group.settled .boost-glabel { color:#2fe08d; }
.boost-group.stagnant .boost-glabel { color:#697184; }
.boost-list { list-style:none; display:flex; flex-direction:column; }
.boost-list li { display:flex; align-items:center; gap:8px; padding:6px 0; font-size:12.5px; color:var(--text); }
.boost-list li + li { border-top:1px solid #161d2e; }
.boost-list li .ico { flex:none; }
.boost-name { font-weight:600; letter-spacing:-0.01em; }
.boost-stat { margin-left:auto; font:500 11px var(--mono); color:var(--muted); white-space:nowrap; }
@media (max-width:720px) {
  .boost-grid { grid-template-columns:1fr; }
}