:root{--bg:#0b1526;--panel:#12203a;--panel2:#0f1b31;--line:#24365a;--text:#e6e9ef;--muted:#9aa6b8;--gold:#c8a24a;--red:#c0504d}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:#7fb6ff}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 20px;border-bottom:1px solid var(--line);background:var(--panel2);position:sticky;top:0;z-index:20;flex-wrap:wrap}
.brand{color:var(--gold);text-decoration:none;font-weight:700;letter-spacing:.08em;font-size:14px;display:flex;flex-direction:column;min-height:44px;justify-content:center}
.brand-sub{color:var(--muted);font-weight:500;font-size:13px;letter-spacing:.06em}
nav{display:flex;gap:4px;flex-wrap:wrap}nav a{color:var(--text);text-decoration:none;padding:10px 10px;min-height:44px;display:inline-flex;align-items:center;font-size:14px;border-radius:6px}nav a:hover{background:var(--panel)}
.layout{display:block;max-width:1500px;margin:0 auto}
aside{position:sticky;top:66px;align-self:start;max-height:calc(100vh - 66px);overflow:auto;padding:16px;border-right:1px solid var(--line);background:var(--panel2)}
.sheethead{display:none}
#ftoggle{display:none}
.sh{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold);margin:18px 0 8px}
.sh:first-of-type{margin-top:0}
select{width:100%;min-height:44px;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:8px;font-size:14px}
.muted{color:var(--muted);font-size:13px}
.legend div,.tg{display:flex;align-items:center;gap:8px;font-size:13px;min-height:28px}
.sw{width:14px;height:14px;border-radius:50%;flex:none;display:inline-block}.sq{border-radius:3px}
.tg{width:100%;min-height:44px;background:transparent;border:1px solid var(--line);color:var(--text);border-radius:6px;margin-bottom:6px;padding:0 10px;cursor:pointer;font-size:14px}
.tg[aria-pressed=false]{opacity:.45}
main{padding:20px 28px 60px;min-width:0}
h1{font-size:30px;margin:4px 0 8px}
.intro{max-width:none;width:100%;color:var(--text);margin:0 0 6px}
.cover{color:var(--muted);font-size:13px;margin:0 0 14px}
.heads{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:18px}
.head{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.head b{display:block;font-size:26px;color:var(--gold);line-height:1.1}.head span{font-size:13px;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}
.chip{min-height:44px;padding:0 14px;border-radius:22px;background:var(--panel2);color:var(--text);border:1px solid var(--line);font-size:14px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.chip .m{color:var(--muted);font-size:13px}.chip[aria-pressed=true]{border-color:var(--gold);box-shadow:inset 0 0 0 2px var(--gold);font-weight:600}
.chip .sw{box-sizing:border-box}
.m{color:var(--muted);font-size:13px}
.sh3{font-size:16px;margin:18px 0 4px}
.bgroups{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.bg{background:var(--panel2);border:1px solid var(--line);border-left:6px solid var(--gold);border-radius:8px;padding:10px 12px}
.bg h3{font-size:15px;margin:0 0 6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.bg h3 .sw{box-sizing:border-box}
.br{display:block;width:100%;text-align:left;background:transparent;color:var(--text);border:0;border-top:1px solid var(--line);padding:8px 2px;min-height:44px;cursor:pointer;font:inherit;font-size:14px}
.br:hover{background:#16284a}.br span{display:block}.bw{color:var(--gold);font-size:13px}.bq{color:var(--muted);font-size:13px;font-style:italic}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:18px;scroll-margin-top:80px}
.sh2{font-size:19px;margin:0 0 4px}.sub{color:var(--muted);font-size:14px;margin:0 0 10px;max-width:none}
.ctl{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.btn,.seg button{min-height:44px;min-width:44px;padding:0 16px;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:6px;font-size:14px;cursor:pointer}
.btn:hover,.seg button:hover{border-color:var(--gold)}
.seg{display:flex;flex-wrap:wrap;gap:4px}.seg button[aria-pressed=true]{background:var(--gold);color:#0b1526;border-color:var(--gold);font-weight:600}
input[type=range]{flex:1;min-width:160px;height:44px;accent-color:var(--gold)}
.viz{width:100%;position:relative}.viz svg{display:block;width:100%;height:auto}.viz svg.native{width:auto;max-width:none}
.scrollx{overflow-x:auto}
svg text{fill:var(--text);font-size:13px}
.note{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px 16px;font-size:14px;color:var(--muted)}
.note summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--text)}
.tip{position:fixed;z-index:60;pointer-events:none;background:#0f1b31;border:1px solid var(--gold);border-radius:6px;padding:8px 10px;font-size:13px;max-width:300px;box-shadow:0 4px 18px #0008}
.panel{position:fixed;top:0;right:0;bottom:0;width:min(460px,100vw);background:var(--panel2);border-left:1px solid var(--line);z-index:50;overflow:auto;padding:16px;box-shadow:-8px 0 30px #0009;transform:translateX(0);transition:transform .25s}
.phead{display:flex;justify-content:space-between;align-items:center;gap:8px}.phead h2{font-size:17px;margin:0}
.phead button,.sheethead button{min-width:44px;min-height:44px;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;font-size:16px;cursor:pointer}
.post{border-top:1px solid var(--line);padding:10px 0;font-size:14px}.post .m{color:var(--muted);font-size:13px}.post a{display:inline-flex;min-height:44px;align-items:center}
.bh{color:var(--gold);font-size:14px;margin:14px 0 4px;font-weight:600}
@media (max-width:700px){
  .bgroups{grid-template-columns:1fr}
 body{font-size:15px}header{padding:6px 12px}nav{display:none}
 .layout{display:block}
 #ftoggle{display:block;position:fixed;bottom:0;left:0;right:0;width:100%;z-index:40;min-height:56px;padding:0 20px calc(env(safe-area-inset-bottom));background:var(--gold);color:#0b1526;border:0;border-top:1px solid #0b1526;border-radius:0;font-weight:700;font-size:15px}
 aside{position:fixed;left:0;right:0;bottom:0;top:auto;max-height:75vh;border-right:0;border-top:2px solid var(--gold);border-radius:14px 14px 0 0;z-index:45;transform:translateY(105%);visibility:hidden;transition:transform .25s,visibility .25s}
 aside.open{transform:none;visibility:visible}
 .sheethead{display:flex;justify-content:space-between;align-items:center;font-weight:700;margin-bottom:6px}
 main{padding:14px 12px 90px}h1{font-size:24px}
 .heads{grid-template-columns:repeat(2,1fr)}.head b{font-size:22px}
 .card{padding:12px}
 .panel{top:auto;height:80vh;border-left:0;border-top:2px solid var(--gold);border-radius:14px 14px 0 0}
}
#tpview{margin:8px 0 10px;gap:0}#tpview button{border-radius:0;min-width:84px}#tpview button:first-child{border-radius:6px 0 0 6px}#tpview button:last-child{border-radius:0 6px 6px 0}
.says{font-size:15px;line-height:1.55;margin:4px 0 12px}
.legend.inline{display:flex;flex-wrap:wrap;gap:6px 16px;margin:4px 0 8px}.legend.inline .li{display:inline-flex;align-items:center;gap:6px;font-size:13px}

.dd summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600;font-size:15px}
.ddb{padding:4px 0 8px}
.accl{display:grid;grid-template-columns:minmax(120px,200px) 1fr;gap:6px 14px;margin:0 0 10px}.accl dt{color:var(--gold);font-size:14px}.accl dd{margin:0;display:flex;flex-wrap:wrap;gap:4px 14px}
.accl a{color:var(--text);font-size:14px;min-height:28px;display:inline-flex;align-items:center;gap:4px}
.af{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:6px 0 10px}
.af label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.af input,.af select{min-height:44px;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:0 10px;font-size:14px;color-scheme:dark}
.acards{display:grid;gap:8px;margin:8px 0}.acard{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px}
@media (max-width:700px){.accl{grid-template-columns:1fr}.af{grid-template-columns:1fr 1fr}.af label:first-child{grid-column:1/-1}}

.thead{font-size:18px;font-weight:600;color:var(--text);margin:4px 0 6px}#tzoom{margin:4px 0 8px}#tmap{overflow:hidden}
.ttop{list-style:none;padding:0;margin:6px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}.tli{width:100%;min-height:44px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;text-align:left;background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:6px 10px;font-size:14px;cursor:pointer}.tli:hover,.tli:focus-visible{border-color:var(--gold)}.tli span:last-child{color:var(--muted);font-size:13px}
.thead{font-size:16px}.tli{font-family:inherit}
@media (max-width:700px){.tam{display:block}ul.tam{display:grid}}
.win{display:inline-block;margin:0 0 6px;padding:3px 10px;border:1px solid var(--gold);border-radius:12px;color:var(--gold);font-size:13px}

.mxstrip{display:flex;height:12px;border-radius:3px;overflow:hidden;margin-top:4px}.mxstrip span{flex:1}.mxnum,.mxends{display:flex;font-size:13px;color:var(--muted)}.mxnum span{flex:1;text-align:center}.mxends{justify-content:space-between}

/* per-section left columns (replaces the page-wide sidebar) */
.cols{display:grid;grid-template-columns:240px minmax(0,1fr);gap:20px;align-items:start}
.lc{display:flex;flex-direction:column;gap:8px;min-width:0}.lc .chips{flex-direction:column;align-items:stretch}.lc .chip{justify-content:flex-start;text-align:left}
.lh{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold);margin:6px 0 0}
.mc{min-width:0}
.lcd>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:14px;color:var(--gold)}
@media (min-width:701px){.lcd>summary{display:none}}
@media (max-width:700px){.cols{display:block}.lc{margin-bottom:10px}.lc .chips{flex-direction:row;flex-wrap:wrap}}

.types{display:flex;flex-wrap:wrap;gap:6px}.types .tg{width:auto;margin:0;gap:6px}.ti{flex:none;vertical-align:middle}
#spread .lc{gap:4px}#spread .lc .lh{margin:2px 0 0}#spread #tpdesc{font-size:13px;margin:0}
#spread .lc .chips{gap:4px}
.lnk{background:none;border:0;color:var(--gold);font-size:14px;text-align:left;padding:0;min-height:44px;cursor:pointer;text-decoration:underline}
.legend.g2{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}.legend.g2 div{min-height:24px}
#spread .types{display:grid;grid-template-columns:1fr 1fr;gap:4px}#spread .types .tg{font-size:13px;padding:0 6px;min-height:44px}
.mxnote{margin:8px 0 0;font-size:14px;color:var(--muted)}
