/* ===== /odds v4 — COMMAND DECK (2026-08-29). One screen, zero page scroll.
   Desktop: topbar / rail / leagues / games / STAGE / tiles / dock. Drill, don't scroll.
   Mobile: app screens — Board -> Game (tile grid) -> Module, real back navigation.
   Site chrome off: this page owns the viewport. Serves OddsTerminal.aspx only. ===== */
html, body { overflow: hidden !important; height: 100%; }
header.main-header { display: none !important; }
footer.site-footer { display: none !important; }
.bb-botnav { display: none !important; }
.obt-page{position:fixed;inset:0;background:var(--bg,var(--panel-2));z-index:50}
.obt-page,.obt-page *{box-sizing:border-box}
.obt-app{display:flex;flex-direction:column;height:100%;background:var(--panel-2)}

/* ---------- topbar ---------- */
.obt-top{display:flex;align-items:center;gap:10px;height:44px;padding:0 10px;background:var(--panel);border-bottom:1px solid var(--line)}
.obt-home{display:inline-flex;align-items:center;gap:7px;color:var(--ink);text-decoration:none;font-family:var(--display);font-weight:800;font-size:.95rem;letter-spacing:-.01em;white-space:nowrap}
.obt-home i{color:var(--action-hi)}
input.obt-ctl{appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink);font-family:var(--mono);font-size:.75rem;padding:7px 10px;min-height:32px;width:170px;outline:none}
.obt-heroline{flex:1;min-width:0;font-family:var(--ui);font-size:.82rem;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.obt-heroline b{color:var(--model)}
.obt-heroline .cap{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--model);margin-right:8px}
.obt-tico{appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink-dim);width:32px;height:32px;cursor:pointer;font-size:.8rem}
.obt-tico:hover{color:var(--ink)}
.obt-stamp{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);white-space:nowrap}
.obt-dot{width:6px;height:6px;border-radius:50%;background:var(--action-hi);box-shadow:0 0 0 3px rgba(70,140,255,.22)}
@media (prefers-reduced-motion: no-preference){
    .obt-dot{animation:obtPulse 1.8s ease-in-out infinite}
    .obt-cell.flash{animation:obtFlash 1.6s ease-out}
}
@keyframes obtPulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes obtFlash{0%{background:var(--model-dim);border-color:var(--model)}100%{background:var(--panel-2)}}
#obtCtlHome{display:none}

/* ---------- deck grid (desktop) ---------- */
.obt-deck{flex:1;min-height:0;display:grid;grid-template-columns:60px 116px 240px minmax(0,1fr) 218px;background:var(--panel-2)}
.obt-col{min-height:0;border-right:1px solid var(--line);display:flex;flex-direction:column}
.obt-rail1{align-items:center;gap:4px;padding:8px 0;background:var(--panel)}
.obt-ico{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--ink-dim);font-size:.85rem;cursor:pointer;transition:.15s}
.obt-ico:hover{color:var(--ink);background:var(--panel-2)}
.obt-ico.on{border-color:var(--action-hi);color:var(--action-hi)}
.obt-fly{position:fixed;z-index:9998;min-width:216px;background:var(--panel);border:1px solid var(--line-strong,var(--line));border-radius:0;box-shadow:0 18px 40px -18px rgba(0,0,0,.6);padding:6px}
.obt-fly b{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);padding:5px 10px}
.obt-fly button,.obt-fly a{display:block;width:100%;text-align:left;appearance:none;border:none;background:transparent;color:var(--ink-dim);font-family:var(--ui);font-size:.86rem;padding:8px 10px;border-radius:0;cursor:pointer;text-decoration:none;line-height:1.35}
.obt-fly button:hover,.obt-fly a:hover{background:var(--panel-2);color:var(--ink)}
.obt-lgs{overflow-y:auto;padding:6px 5px;gap:2px;background:var(--panel)}
.obt-lg{display:flex;align-items:center;gap:7px;padding:6px 7px;border:1px solid transparent;border-radius:0;background:transparent;color:var(--ink-dim);font-family:var(--mono);font-size:.7rem;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;white-space:nowrap;text-align:left;min-height:31px;width:100%}
.obt-lg img{width:15px;height:15px;object-fit:contain}
.obt-lg:hover{color:var(--ink);background:var(--panel-2)}
.obt-lg.on{border-color:var(--action-hi);background:var(--panel-2);color:var(--ink)}

/* ---------- games column ---------- */
.obt-gamescol{background:var(--panel)}
.obt-gbar{display:flex;gap:4px;padding:7px 8px;border-bottom:1px solid var(--line)}
.obt-seg{display:inline-flex;border:1px solid var(--line);border-radius:0;overflow:hidden;background:var(--panel-2);width:100%}
.obt-seg button{flex:1;appearance:none;border:none;background:transparent;color:var(--ink-dim);font-family:var(--mono);font-size:.66rem;letter-spacing:.03em;text-transform:uppercase;padding:7px 4px;cursor:pointer;min-height:32px}
.obt-seg button.on{background:var(--action-hi);color:#fff}
.obt-rows{flex:1;overflow-y:auto;min-height:0;-webkit-overflow-scrolling:touch}
.obt-day{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:8px;padding:3px 10px;background:var(--panel-2);border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
/* [2026-09-02] game cards — selection-first: crest + name lead, best price small right */
.obt-row{display:block;padding:7px 10px 8px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .15s}
.obt-row:hover{background:rgba(70,140,255,.05)}
.obt-row.sel{background:rgba(70,140,255,.1);box-shadow:inset 3px 0 0 var(--action-hi)}
.obt-row.started{opacity:.68}
.obt-gch{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:3px;min-height:15px}
.obt-gch i{font-style:normal;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-gch .live{display:inline-block;flex:0 0 auto;font-size:.58rem;letter-spacing:.08em;color:#fff;background:#C43D3D;border-radius:0;padding:0 5px}
.obt-gch .lsf{flex:1;color:var(--ink-faint)}
.obt-gch .gval{flex:0 0 auto;color:var(--model);font-weight:700;letter-spacing:.02em;text-transform:none}
.obt-gch .gstar{flex:0 0 auto;color:var(--gold);font-size:.72rem}
.obt-gside{display:flex;align-items:center;gap:7px;min-width:0;padding:2px 0}
.obt-gside img{width:20px;height:20px;object-fit:contain;flex:0 0 20px}
.obt-gph{width:20px;height:20px;flex:0 0 20px;border-radius:50%;background:var(--panel-2);border:1px solid var(--line)}
.obt-gside .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ui);font-weight:600;font-size:.82rem;color:var(--ink);line-height:1.3}
.obt-gside .sp{flex:0 0 auto;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:.8rem;color:var(--model);padding:1px 5px;border:1px solid transparent;border-radius:0}
.obt-gside .sp:hover{border-color:rgba(52,211,153,.4)}
.obt-gside .sp.flash{animation:obtFlash 1.6s ease-out}
.obt-gside .lsn{flex:0 0 auto;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:.95rem;font-weight:700;color:var(--ink)}
.obt-tn{width:7px;height:7px;border-radius:50%;flex:0 0 7px;background:var(--model)}
.obt-tn.q{background:var(--gold)}
.obt-tn.o{background:#C43D3D}
.obt-when{display:none}
.obt-row .obt-cells{display:flex;gap:5px;align-items:center;margin-top:6px}
.obt-cell{display:flex;flex-direction:column;align-items:flex-end;gap:0;border:1px solid var(--line);border-radius:0;font-variant-numeric:tabular-nums;background:var(--panel-2);padding:3px 7px;min-width:56px;cursor:pointer}
.obt-cell b{font-family:var(--mono);font-size:.8rem;color:var(--model);line-height:1.25}
.obt-cell i{font-style:normal;font-family:var(--mono);font-size:.58rem;color:var(--ink-faint);max-width:7em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.obt-cell u{text-decoration:none;font-family:var(--mono);font-size:.66rem;color:var(--ink-dim)}
.obt-cell .you,.obt-cell .dir{display:none}
.obt-cell.inslip{border-color:var(--action-hi);box-shadow:0 0 0 1px var(--action-hi) inset}
.obt-star{display:none}
.obt-sub{display:none}
.obt-chip{font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;border-radius:0;padding:2px 7px;white-space:nowrap;cursor:pointer;border:1px solid var(--line);color:var(--ink-dim);background:none}
.obt-chip.good{color:var(--model);border-color:rgba(52,211,153,.4)}
.obt-chip.hi{color:var(--gold);border-color:rgba(245,179,1,.35)}
.obt-empty{padding:34px 16px;text-align:center;color:var(--ink-dim);font-size:.86rem;line-height:1.6}
.obt-skel{height:48px;margin:8px 10px;border-radius:0;background:var(--panel-2);border:1px solid var(--line)}
.obt-days{display:none}

/* ---------- stage ---------- */
.obt-stagecol{background:var(--panel-2)}
.obt-stagehead{display:flex;align-items:center;gap:8px;padding:7px 12px;border-bottom:1px solid var(--line);background:var(--panel);min-height:44px}
.obt-back{display:none;appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink-dim);width:36px;height:36px;cursor:pointer;font-size:.9rem;flex:0 0 36px}
.obt-crumb{display:flex;align-items:center;gap:8px;min-width:0;flex:1}
.obt-crumb img{width:20px;height:20px;object-fit:contain}
.obt-crumb b{font-family:var(--display);font-weight:800;font-size:.95rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-crumb .mod{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap}
.obt-crumb .ko{font-family:var(--mono);font-size:.66rem;color:var(--gold);white-space:nowrap}
.obt-lens{display:flex;gap:3px}
.obt-lens button{appearance:none;border:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink-dim);font-family:var(--mono);font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;padding:6px 9px;min-height:30px;cursor:pointer}
.obt-lens button.on{border-color:var(--action-hi);color:var(--action-hi)}
.obt-tnav{display:flex;gap:3px}
.obt-tnav button{appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink-dim);width:30px;height:30px;cursor:pointer}
.obt-stage{flex:1;overflow-y:auto;min-height:0;padding:10px 12px}

.obt-stage .obt-chart{height:200px}
.obt-stage .obt-spark{display:none}
.obt-dh{font-family:var(--display);font-weight:800;color:var(--ink);font-size:1.05rem;margin:0 0 4px;line-height:1.3}
.obt-dsub{font-family:var(--mono);font-size:.72rem;color:var(--ink-faint);margin:0 0 10px}
.obt-dlab{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);display:block;margin:14px 0 7px}

/* ---------- tiles column ---------- */
.obt-tilescol{background:var(--panel);border-right:none}
.obt-gamehead{display:none}
.obt-glens{display:none}
.obt-tiles{flex:1;overflow-y:auto;min-height:0;display:flex;flex-direction:column;gap:0;padding:4px 0;align-content:start}
/* [v6] desktop: tiles are a compact INSTRUMENT LIST -- icon+label left, value right.
   The card form lives in the mobile media block (the app screens keep it). */
.obt-tile{border:none;border-left:2px solid transparent;border-bottom:1px solid var(--line);border-radius:0;font-variant-numeric:tabular-nums;background:none;padding:7px 10px 7px 8px;cursor:pointer;min-height:0;display:flex;flex-direction:row;align-items:center;gap:8px;transition:background .12s}
.obt-tile:hover{background:rgba(70,140,255,.05)}
.obt-tile.on{background:rgba(70,140,255,.09);border-left-color:var(--acc,var(--action-hi))}
.obt-tile .tl{display:flex;align-items:center;gap:7px;flex:1;min-width:0;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-tile .tl i.fas{display:none}
.obt-tile .hl{flex:0 1 auto;font-family:var(--mono);font-weight:700;font-size:.72rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:9em}
.obt-tile .sb{display:none}
.t-h2h{--acc:#8FA3C0} /* ---------- dock ---------- */
.obt-dock{display:flex;align-items:stretch;height:42px;border-top:1px solid var(--card-edge);background:var(--panel)}
.obt-movers{flex:1;display:flex;gap:18px;align-items:center;overflow-x:auto;scrollbar-width:none;padding:0 12px;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);white-space:nowrap;border-right:1px solid var(--line)}
.obt-movers::-webkit-scrollbar{display:none}
.obt-movers .tag{color:var(--gold);letter-spacing:.1em;text-transform:uppercase;font-size:.6rem}
.obt-movers b{color:var(--ink);font-weight:600}
.obt-slipbar{display:flex;align-items:center;gap:10px;padding:0 14px;cursor:pointer;white-space:nowrap}
.obt-slipbar b{font-family:var(--mono);font-size:.72rem;color:var(--ink)}
.obt-slipbar .n{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;border-radius:999px;background:var(--action-hi);color:#fff;font-family:var(--mono);font-size:.68rem;font-weight:700;padding:0 5px}
.obt-slipbar .fair{color:var(--model)}
.obt-slipbar .sgp{font-family:var(--mono);font-size:.56rem;letter-spacing:.05em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(245,179,1,.35);border-radius:0;padding:1px 6px}
.obt-slipbar .hintt{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint);max-width:340px;overflow:hidden;text-overflow:ellipsis}
.obt-slip{position:fixed;right:10px;bottom:50px;width:420px;max-width:94vw;max-height:60vh;overflow-y:auto;background:var(--panel);border:1px solid var(--line-strong,var(--line));border-radius:0;box-shadow:0 24px 60px -18px rgba(0,0,0,.7);padding:12px 14px;z-index:9000}
.obt-sleg{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:.82rem;color:var(--ink)}
.obt-sleg .lg{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--action-hi)}
.obt-sleg b{font-family:var(--mono);color:var(--model)}
.obt-sleg button{margin-left:auto;background:none;border:none;color:var(--ink-faint);cursor:pointer;font-size:1rem;width:34px;height:34px}
.obt-slip .verdict{margin-top:9px;padding:9px 12px;border-left:3px solid var(--model);background:var(--model-dim);border-radius:0;color:var(--ink-dim);font-size:.82rem;line-height:1.5}
.obt-slip .verdict b{color:var(--model);font-family:var(--mono)}
.obt-slip .clear{font-family:var(--mono);font-size:.7rem;color:var(--ink-faint);background:none;border:none;cursor:pointer;margin-top:8px;min-height:34px}
.obt-stake{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.72rem;color:var(--ink-dim)}
.obt-stake input{width:72px;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink);font-family:var(--mono);font-size:.82rem;padding:6px 8px;outline:none}

/* ---------- module content (stage + mobile module screens) ---------- */
.gcm{border:none;border-top:1px solid var(--line);border-radius:0;background:none;padding:9px 12px;margin:0;font-variant-numeric:tabular-nums}
.obt-wsmain>.gcm:first-child,.obt-wsc>.gcm:first-child{border-top:none}
.gcmh{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 6px}
.gcmh i.fas{display:none}
.gcmh i{font-size:.85rem}
.gcmn{font-family:var(--ui);font-size:.78rem;color:var(--ink-faint);margin:6px 0 0;line-height:1.5}
.gclab2{font-family:var(--mono);font-size:.75rem;color:var(--ink-dim);margin:8px 0 3px}
.gclab2 b{color:var(--model)}
.gf-h2h{--acc:#8FA3C0} .gcap{display:inline-block;width:24px;height:24px;border-radius:0;text-align:center;line-height:24px;font-family:var(--mono);font-size:.72rem;font-weight:700;margin:0 3px 3px 0}
.gcap.w{background:rgba(52,211,153,.16);color:var(--model);border:1px solid rgba(52,211,153,.35)}
.gcap.l{background:rgba(196,83,77,.14);color:#E58983;border:1px solid rgba(196,83,77,.35)}
.gcap.d{background:rgba(216,208,106,.12);color:#D8D06A;border:1px solid rgba(216,208,106,.3)}
.gcfrow{display:flex;align-items:center;flex-wrap:wrap;gap:2px 6px;margin:0 0 6px}
.gcft{font-family:var(--mono);font-size:.75rem;color:var(--ink);min-width:72px}
.gcfn{font-family:var(--mono);font-size:.7rem;color:var(--ink-faint);margin-left:4px}
.gsqw{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 4px}
.gsq{font-family:var(--ui);font-size:.78rem;border-radius:0;padding:4px 10px;border:1px solid var(--line);color:var(--ink-dim)}
.gsq.out{background:rgba(196,83,77,.14);color:#E58983;border-color:rgba(196,83,77,.4)}
.gsq.q{background:rgba(245,179,1,.1);color:var(--gold);border-color:rgba(245,179,1,.35)}
.gsq.ok{background:rgba(52,211,153,.1);color:var(--model);border-color:rgba(52,211,153,.3)}
.glucols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:4px 16px}
.gclu{margin:0 0 6px;padding-left:20px;color:var(--ink-dim);font-size:.84rem;line-height:1.7}
.gclu li b{color:var(--ink);font-weight:600}
.gclu li span{font-family:var(--mono);font-size:.7rem;color:var(--ink-faint);margin-left:5px}
.obt-read{border:1px solid var(--line);border-radius:0;border-left:3px solid var(--model);font-variant-numeric:tabular-nums;background:var(--panel);padding:10px 12px;font-family:var(--mono);font-size:.8rem}
.obt-read .rr{display:flex;justify-content:space-between;gap:10px;padding:3px 0;color:var(--ink-dim)}
.obt-read .rr b{color:var(--model);font-weight:600}
.obt-case{border-left:2px solid var(--line);padding:2px 0 2px 10px;margin:0 0 7px;color:var(--ink-dim);font-size:.84rem;line-height:1.55;border-radius:0}
.obt-case b{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em}
.obt-case.for{border-color:rgba(52,211,153,.5)} .obt-case.for b{color:var(--model)}
.obt-case.ag{border-color:rgba(196,61,61,.55)} .obt-case.ag b{color:#E07070}
.obt-case.fl{border-color:rgba(245,179,1,.5)} .obt-case.fl b{color:var(--gold)}
.obt-chart{width:100%;height:130px;background:var(--panel);border:1px solid var(--line);border-radius:0;display:block}
.obt-leg{display:flex;gap:12px;align-items:center;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);margin-top:5px}
.obt-leg i{width:13px;height:3px;border-radius:0;display:inline-block}
.obt-intel{margin:0;padding-left:16px;color:var(--ink-dim);font-size:.84rem;line-height:1.55;display:grid;gap:5px}
.obt-tbl{overflow-x:auto;border:1px solid var(--line);border-radius:0}
.obt-tbl table{width:100%;border-collapse:collapse;min-width:430px}
.obt-tbl th{background:var(--panel-2);color:var(--ink-dim);font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.05em;text-align:left;padding:7px 9px;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0}
.obt-tbl td{padding:6px 9px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.76rem;color:var(--ink-dim);white-space:nowrap}
.obt-tbl td.best{color:var(--model);font-weight:700;background:var(--model-dim)}
.obt-tbl .rg{font-size:.58rem;letter-spacing:.06em;color:var(--ink-faint);border:1px solid var(--line);border-radius:0;padding:0 4px;margin-left:5px}
.obt-links{display:flex;flex-wrap:wrap;gap:10px 16px;margin-top:14px}
.obt-links a{color:var(--action-hi);font-family:var(--mono);font-size:.74rem;text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.obt-links a:hover{color:var(--ink)}
.obt-alt{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:6px}
.obt-alt span{display:flex;flex-direction:column;align-items:center;gap:1px;border:1px solid var(--line);border-radius:0;background:var(--panel-2);padding:6px;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim)}
.obt-alt span b{color:var(--model);font-size:.8rem}
.obt-h2h{font-size:.84rem;color:var(--ink-dim)}
.obt-h2h .mu-section-header,.obt-h2h .tp-section-header{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);margin:4px 0 6px}
.obt-h2h .mu-section-sub,.obt-h2h .tp-section-eyebrow{display:none}
.obt-h2h table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.76rem}
.obt-h2h td,.obt-h2h th{padding:5px 6px;border-bottom:1px solid var(--line);color:var(--ink-dim);text-align:left}
.obt-ang{display:flex;flex-wrap:wrap;gap:6px}
.obt-ang span{font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);border:1px solid var(--line);border-radius:0;background:var(--panel-2);padding:5px 10px}
.obt-ang span b{color:var(--ink)}
.obt-receipt{font-family:var(--mono);font-size:.75rem;line-height:1.55;color:var(--ink-dim);border:1px dashed var(--line);border-radius:0;padding:8px 12px;margin:0 0 12px}
.obt-receipt b{color:var(--model)}
.obt-prow{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.obt-prow img{width:30px;height:30px;border-radius:50%;object-fit:cover;background:var(--panel-2)}
.obt-pwho{min-width:0;flex:1}
.obt-pname{font-family:var(--ui);font-weight:600;font-size:.88rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-pmkt{font-family:var(--mono);font-size:.72rem;color:var(--ink-faint)}
.obt-prate{font-family:var(--mono);font-size:.76rem;font-weight:700;color:var(--model);white-space:nowrap}
.obt-pstreak{font-family:var(--mono);font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.obt-pprice{font-family:var(--mono);font-size:.88rem;font-weight:700;color:var(--ink);border:1px solid var(--line);border-radius:0;background:var(--panel-2);padding:8px 10px;min-height:40px;display:flex;align-items:center}
.obt-note{font-family:var(--ui);font-size:.76rem;color:var(--ink-faint);flex-basis:100%;line-height:1.45}
.obt-r5{font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);white-space:nowrap}
.obt-ghead{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--panel-2);border-bottom:1px solid var(--line);cursor:pointer}
.obt-ghead b{font-family:var(--ui);font-weight:600;font-size:.82rem;color:var(--ink)}
.obt-ghead span{font-family:var(--mono);font-size:.68rem;color:var(--ink-faint)}

/* ---------- overlays: sheets drawer, coach, toast ---------- */
.obt-drawer{position:fixed;top:0;right:-100%;bottom:0;width:94%;max-width:460px;background:var(--drawer-bg,var(--panel));border-left:1px solid var(--line-strong,var(--line));box-shadow:-10px 0 50px rgba(0,0,0,.6);z-index:9999;transition:right .3s cubic-bezier(.19,1,.22,1);padding:18px;overflow-y:auto;-webkit-overflow-scrolling:touch}
@media (prefers-reduced-motion: reduce){.obt-drawer{transition:none}}
.obt-drawer.open{right:0}
.obt-drawer .obt-desk{display:inline-flex !important;margin:0 8px 8px 0}
.obt-drawer select.obt-desk,.obt-drawer select{display:inline-block !important;max-width:100%;appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink);font-family:var(--mono);font-size:.78rem;padding:8px 12px;min-height:38px}
.obt-drawer .obt-seg{width:auto}
.obt-dx{position:absolute;top:12px;right:12px;width:42px;height:42px;border-radius:50%;border:1px solid var(--line-strong,var(--line));background:var(--panel-2);color:var(--ink-dim);font-size:1rem;cursor:pointer;z-index:2}
.obt-dh2{font-family:var(--display);font-weight:800;color:var(--ink);font-size:1.05rem;margin:0 26px 10px 0}
.obt-ctl{appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink-dim);font-family:var(--mono);font-size:.75rem;padding:8px 12px;min-height:38px;cursor:pointer}
.obt-ctl.on{border-color:var(--gold);color:var(--gold)}
select.obt-ctl{text-transform:none}
.obt-veil{position:fixed;inset:0;background:rgba(5,8,14,.55);z-index:10000;display:flex;align-items:flex-end;justify-content:center;padding:16px}
@media(min-width:900px){.obt-veil{align-items:center}}
.obt-card{width:100%;max-width:440px;background:var(--panel);border:1px solid var(--line-strong,var(--line));border-radius:0;padding:20px;color:var(--ink-dim);font-size:.92rem;line-height:1.6;box-shadow:0 24px 60px -20px rgba(0,0,0,.7)}
.obt-card h3{font-family:var(--display);color:var(--ink);font-size:1.05rem;margin:0 0 8px}
.obt-card .acts{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
.obt-card .acts button{appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink-dim);font-family:var(--mono);font-size:.74rem;padding:10px 18px;min-height:40px;cursor:pointer}
.obt-card .acts button.pri{background:var(--action-hi);color:#fff;border-color:transparent}
.obt-card table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.76rem}
.obt-card td{padding:5px 6px;border-bottom:1px solid var(--line);color:var(--ink-dim)}
.obt-card td:first-child{color:var(--ink);white-space:nowrap}
#obtToast{position:fixed;left:50%;transform:translateX(-50%);bottom:56px;z-index:10001;background:var(--panel);border:1px solid var(--line-strong,var(--line));border-radius:0;padding:11px 16px;color:var(--ink);font-size:.84rem;box-shadow:0 16px 40px -14px rgba(0,0,0,.7);display:flex;align-items:center;gap:12px;max-width:92%}
#obtToast button{appearance:none;border:none;background:none;color:var(--action-hi);font-family:var(--mono);font-size:.76rem;cursor:pointer;white-space:nowrap;min-height:34px}
.obt-tabs{display:none}
.obt-heromini{display:none}

/* =============================== MOBILE: the app =============================== */
@media(max-width:899px){
    .obt-top{height:42px;gap:8px}
    .obt-home span{display:none}
    .obt-heroline{display:none}
    input.obt-ctl{flex:1;width:auto;min-width:0}
    .obt-deck{display:block;position:relative;overflow:hidden}
    .obt-col{border-right:none}
    .obt-rail1{display:none}
    /* leagues = horizontal chip strip on the board screen */
    .obt-lgs{position:absolute;top:0;left:0;right:0;height:48px;display:flex !important;flex-direction:row;overflow-x:auto;overflow-y:hidden;gap:5px;padding:8px 10px;border-bottom:1px solid var(--line);scrollbar-width:none;z-index:2}
    .obt-lgs::-webkit-scrollbar{display:none}
    .obt-lg{width:auto;min-height:32px;border:1px solid var(--line);border-radius:0;padding:5px 11px;flex:0 0 auto}
    /* board screen */
    .obt-gamescol{position:absolute;inset:0;padding-top:48px;display:flex}
    .obt-gbar{padding:7px 10px}
    .obt-heromini{display:block;margin:8px 10px 0;border:1px solid rgba(52,211,153,.35);border-radius:0;background:var(--model-dim);padding:9px 11px;font-size:.84rem;line-height:1.5;color:var(--ink);cursor:pointer}
    .obt-heromini .cap{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--model);display:block;margin-bottom:3px}
    .obt-heromini b{color:var(--model)}
    .obt-days{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:8px 10px 0}
    .obt-days::-webkit-scrollbar{display:none}
    .obt-days button{appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink-dim);font-family:var(--mono);font-size:.7rem;padding:6px 12px;cursor:pointer;white-space:nowrap;min-height:32px}
    .obt-days button.on{border-color:var(--action-hi);color:var(--action-hi)}
    .obt-row{padding:10px 12px 11px}
    .obt-gch{font-size:.66rem;margin-bottom:4px}
    .obt-gside{padding:3px 0}
    .obt-gside img,.obt-gph{width:22px;height:22px;flex-basis:22px}
    .obt-gside .nm{font-size:.95rem}
    .obt-gside .sp{font-size:.9rem}
    .obt-gside .lsn{font-size:1.05rem}
    .obt-row .obt-cells{margin-top:8px;overflow-x:auto;scrollbar-width:none}
    .obt-row .obt-cells::-webkit-scrollbar{display:none}
    .obt-cell{min-width:78px;padding:6px 9px;min-height:44px;flex:1}
    .obt-cell b{font-size:.92rem}
    .obt-cell i{font-size:.66rem}
    .obt-tabs{display:flex;border-top:1px solid var(--card-edge);background:var(--panel)}
    .obt-tabs button{flex:1;appearance:none;border:none;background:transparent;color:var(--ink-dim);font-family:var(--mono);font-size:.64rem;letter-spacing:.03em;text-transform:uppercase;padding:7px 2px 8px;min-height:52px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px}
    .obt-tabs button i.fas{font-size:1rem}
    .obt-tabs button.on{color:var(--action-hi)}
    .obt-tabs .bdg{position:absolute;transform:translate(14px,-4px);min-width:16px;height:16px;border-radius:999px;background:var(--action-hi);color:#fff;font-size:.6rem;line-height:16px;padding:0 4px}
    /* game screen (tiles) + module screen (stage) slide in as app pages */
    .obt-tilescol,.obt-stagecol{position:absolute;inset:0;background:var(--panel-2);transform:translateX(102%);transition:transform .28s cubic-bezier(.2,.9,.25,1);display:flex;z-index:5}
    @media (prefers-reduced-motion: reduce){.obt-tilescol,.obt-stagecol{transition:none}}
    .obt-app[data-scr="game"] .obt-tilescol{transform:translateX(0)}
    .obt-app[data-scr="module"] .obt-tilescol{transform:translateX(-26%)}
    .obt-app[data-scr="module"] .obt-stagecol{transform:translateX(0);z-index:6}
    .obt-gamehead{display:flex;align-items:center;gap:8px;padding:7px 10px;border-bottom:1px solid var(--line);background:var(--panel);min-height:52px}
    .obt-gamehead .obt-back{display:flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 42px}
    .obt-gamehead .obt-crumb b{font-size:1rem}
    .obt-gamehead .obt-star2{appearance:none;background:none;border:none;color:var(--ink-faint);font-size:1.15rem;width:42px;height:42px;cursor:pointer}
    .obt-gamehead .obt-star2.on{color:var(--gold)}
    .obt-glens{display:flex;gap:4px;padding:8px 10px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none;background:var(--panel)}
    .obt-glens::-webkit-scrollbar{display:none}
    .obt-glens button{appearance:none;border:1px solid var(--line);border-radius:0;background:var(--panel-2);color:var(--ink-dim);font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;text-transform:uppercase;padding:7px 12px;min-height:34px;cursor:pointer;white-space:nowrap}
    .obt-glens button.on{border-color:var(--action-hi);color:var(--action-hi)}
    .obt-tiles{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:10px}
    .obt-tile{border:1px solid var(--line);border-left:3px solid var(--acc,var(--line));background:var(--panel-2);padding:9px 10px;min-height:84px;display:flex;flex-direction:column;align-items:stretch;gap:2px;border-bottom:1px solid var(--line)}
    .obt-tile.on{background:rgba(70,140,255,.08);border-color:var(--action-hi);border-left-color:var(--acc,var(--action-hi))}
    .obt-tile .tl{font-size:.62rem;flex:0 0 auto}
    .obt-tile .hl{font-size:.95rem;max-width:none;flex:0 0 auto}
    .obt-tile .sb{display:-webkit-box;font-family:var(--ui);font-size:.72rem;color:var(--ink-dim);line-height:1.35;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical}
    .obt-stagehead .obt-back{display:flex;align-items:center;justify-content:center}
    .obt-stagehead .obt-lens{display:none}
    .obt-stage{padding:12px}
    .obt-dock{display:none}
    .obt-slipbar2{position:relative}
    .obt-slip{left:8px;right:8px;bottom:60px;width:auto}
}
@media(min-width:900px) and (max-width:1279px){
    .obt-deck{grid-template-columns:60px 104px 216px minmax(0,1fr) 200px}
}

/* ===== wave 3: live / pitch / shots / tape / toss / modal / de-AI extras ===== */
.gcm{--pitch:#10331E;--pitchline:#25603A}
.glscore{display:flex;align-items:center;justify-content:center;gap:12px;margin:2px 0 2px}
.glscore .glteam{font-family:var(--ui);font-weight:600;font-size:.9rem;color:var(--ink-dim);max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glscore .gln{font-family:var(--mono);font-weight:700;font-size:2rem;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}
.glscore .glsep{color:var(--ink-faint)}
.lsn{font-family:var(--mono);font-weight:700;font-size:.85rem;color:var(--ink);margin-left:auto;padding-left:8px;font-variant-numeric:tabular-nums}
.lsf{display:inline-block;font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;color:var(--ink-faint);border:1px solid var(--line);border-radius:0;padding:1px 5px}
.obt-plive{font-family:var(--mono);font-size:.64rem;letter-spacing:.04em;text-transform:uppercase;color:#E8534A;border:1px solid rgba(232,83,74,.4);border-radius:0;padding:1px 5px;margin-left:7px;vertical-align:2px}
.gthead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 4px}
.gthead b{font-family:var(--display);font-weight:800;font-size:1rem;color:var(--ink)}
.gthead span{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint)}
.gtrow{display:flex;align-items:center;gap:8px;margin:0 0 6px}
.gtv{font-family:var(--mono);font-size:.78rem;color:var(--ink);min-width:44px;font-variant-numeric:tabular-nums}
.gtv:last-child{text-align:right}
.gtbars{flex:1;display:flex;align-items:center;gap:6px;min-width:0}
.gtb{height:8px;background:var(--acc,#E8B34A);opacity:.85;min-width:2px}
.gtb.l{margin-left:auto}
.gtb.r{margin-right:auto;background:var(--action-hi)}
.gtlab{font-family:var(--mono);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap}
#obtModal{position:fixed;inset:0;z-index:10002}
#obtModal[hidden]{display:none}
.obt-mback{position:absolute;inset:0;background:rgba(5,8,14,.6)}
.obt-mcard{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(440px,92vw);max-height:80vh;overflow-y:auto;background:var(--panel);border:1px solid var(--line-strong,var(--line));border-left:3px solid var(--action-hi);padding:18px;box-shadow:0 24px 60px -18px rgba(0,0,0,.75)}
.obt-mx{position:absolute;top:8px;right:8px;width:38px;height:38px;border:1px solid var(--line);background:var(--panel-2);color:var(--ink-dim);cursor:pointer;font-size:1rem}
@media(max-width:899px){
    .obt-glens{display:flex}
    .glscore .gln{font-size:2.3rem}
}

/* ---- wave 4 (2026-09-02): pulse / why / receipts / shop / starter duel / defense leaks ---- */
.obt-plsrow{display:flex;gap:10px;align-items:baseline;padding:7px 0;border-top:1px solid var(--line);font-size:.84rem;line-height:1.45}
.obt-plsrow:first-of-type{border-top:0;padding-top:2px}
.obt-plsrow b{color:var(--ink);font-weight:600}
.obt-plsk{flex:0 0 auto;font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);padding-top:2px;min-width:64px}
.obt-plssw{display:block;color:var(--ink-dim);font-size:.8rem;margin-top:1px}
.obt-whyrow{padding:6px 0;border-top:1px solid var(--line);font-size:.86rem;color:var(--ink-dim);line-height:1.5}
.obt-whyrow:first-of-type{border-top:0;padding-top:2px}
.obt-whyrow b{color:var(--ink);font-weight:600}
.obt-whyn{color:var(--ink-faint);font-size:.76rem}
.obt-shoprow{display:flex;align-items:baseline;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:.86rem;flex-wrap:wrap}
.obt-shoprow:first-of-type{border-top:0;padding-top:2px}
.obt-shoprow>div{flex:1 1 40%;min-width:150px;color:var(--ink-dim)}
.obt-shoprow b{color:var(--ink);font-weight:600}
.obt-shopmk{color:var(--ink-faint);font-size:.76rem}
.obt-shopgap{font-family:var(--mono);font-weight:700;color:var(--model);white-space:nowrap}
.obt-shopbk{font-family:var(--mono);color:var(--gold);white-space:nowrap;font-size:.8rem}
.obt-sprow,.obt-parkrow{display:flex;gap:10px;align-items:baseline;padding:7px 0;border-top:1px solid var(--line);font-size:.86rem;line-height:1.5}
.obt-sprow:first-of-type{border-top:0;padding-top:2px}
.obt-sprow b,.obt-parkrow b{color:var(--ink);font-weight:600}
.obt-splab{flex:0 0 auto;font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);padding-top:2px;min-width:64px}
.obt-sphand{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint);border:1px solid var(--line);padding:0 4px;margin-left:6px}
.obt-spline{display:block;color:var(--ink-dim);margin-top:1px}
.obt-spline b{color:var(--model);font-family:var(--mono)}
.obt-parkyrs{font-style:normal;color:var(--ink-faint);font-size:.74rem}
.obt-dvphead{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);margin:8px 0 2px}
.obt-dvphead:first-of-type{margin-top:0}
.obt-dvprow{padding:5px 0;border-top:1px solid var(--line);font-size:.86rem;color:var(--ink-dim);line-height:1.5}
.obt-dvprow b{color:var(--ink);font-weight:700}
.obt-dvpn{color:var(--ink-faint);font-family:var(--mono);font-size:.76rem}
.obt-juice{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.obt-juice span{border:1px solid var(--line);padding:3px 8px;font-family:var(--mono);font-size:.76rem;color:var(--ink-dim)}
.obt-juice span b{color:var(--ink)}
.obt-juice span.cheap{border-color:rgba(52,211,153,.5);color:var(--model)}
.obt-juice span.cheap b{color:var(--model)}
.obt-sparkrow{padding:6px 0;border-top:1px solid var(--line)}
.obt-sparkrow:first-of-type{border-top:0}
.obt-sparklab{display:flex;justify-content:space-between;align-items:baseline;font-size:.8rem;color:var(--ink-dim);margin-bottom:3px;font-family:var(--mono)}
.obt-sparklab b{color:var(--ink)}
.obt-sparksvg{display:block;width:100%;height:44px}
.obt-movers .tag-pl{color:#E8B34A;margin-left:14px}


/* ---- [2026-09-02 v6] the composed workspace (desktop stage) ---- */
.obt-wsid{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border:1px solid var(--line);border-bottom:none;background:var(--panel);padding:8px 12px;margin:0;font-variant-numeric:tabular-nums}
.obt-wsid .tm{display:flex;align-items:center;gap:9px;min-width:0}
.obt-wsid .tm img{width:34px;height:34px;object-fit:contain}
.obt-wsid .tm .ph{width:34px;height:34px;border-radius:50%;background:var(--panel-2);border:1px solid var(--line)}
.obt-wsid .tm b{font-family:var(--display);font-weight:800;font-size:1.02rem;color:var(--ink);white-space:nowrap}
.obt-wsid .mid{display:flex;align-items:center;gap:8px;font-family:var(--mono);color:var(--ink-faint);font-size:.72rem}
.obt-wsid .mid .sc{font-size:1.15rem;color:var(--ink);font-weight:700}
.obt-wsid .mid .live{font-size:.58rem;letter-spacing:.08em;color:#fff;background:#C43D3D;border-radius:0;padding:1px 6px}
.obt-wsid .mid .fin{font-size:.6rem;letter-spacing:.1em;color:var(--ink-faint)}
.obt-wsid .mid i{font-style:normal}
.obt-wsv{margin-left:auto;display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.76rem;color:var(--ink-dim);min-width:0;flex-wrap:wrap}
.obt-wsv .k{font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--model)}
.obt-wsv b{color:var(--ink)}
.obt-wsv em{font-style:normal;color:var(--model);border:1px solid rgba(52,211,153,.4);padding:1px 7px}
.obt-ws{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,330px);gap:1px;align-items:stretch;background:var(--line);border:1px solid var(--line)}
.obt-wsmain{min-width:0;background:var(--panel)}
.obt-wsmain>.gcm:last-child{margin-bottom:0}
.obt-wsside{min-width:0;display:flex;flex-direction:column;gap:1px;background:var(--line)}
.obt-wsc{cursor:pointer;position:relative;background:var(--panel)}
.obt-wsc .gcm{margin:0;max-height:320px;overflow-y:auto;scrollbar-width:thin}
.obt-wsc:hover .gcm{border-color:var(--line-strong,var(--ink-faint))}
.obt-wsc .gcmh::after{content:"focus 92";margin-left:auto;font-size:.56rem;letter-spacing:.08em;color:var(--ink-faint);opacity:0;transition:opacity .12s}
.obt-wsc:hover .gcmh::after{opacity:1}
.obt-wsc .obt-chart{height:140px}
@media (max-width:1420px){.obt-ws{grid-template-columns:minmax(0,1fr)}.obt-wsside{flex-direction:row;flex-wrap:wrap}.obt-wsside .obt-wsc{flex:1 1 300px}}


/* ---- [v7 craft] command palette + quiet affordances ---- */
#obtPal{position:fixed;inset:0;z-index:120;background:rgba(4,8,14,.72);display:flex;align-items:flex-start;justify-content:center;padding-top:12vh}
#obtPal .box{width:min(560px,92vw);background:var(--panel);border:1px solid var(--line-strong,var(--ink-faint))}
#obtPal input{width:100%;box-sizing:border-box;background:var(--panel-2);border:none;border-bottom:1px solid var(--line);color:var(--ink);font-family:var(--mono);font-size:.95rem;padding:13px 14px;outline:none}
#obtPal .list{max-height:46vh;overflow-y:auto}
#obtPal .pi{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:8px 14px;border-top:1px solid var(--line);cursor:pointer;font-variant-numeric:tabular-nums}
#obtPal .pi:first-child{border-top:none}
#obtPal .pi b{font-family:var(--ui);font-weight:600;font-size:.9rem;color:var(--ink)}
#obtPal .pi span{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap}
#obtPal .pi.on{background:rgba(70,140,255,.12);box-shadow:inset 2px 0 0 var(--action-hi)}
#obtPal .pi.none{cursor:default;color:var(--ink-dim);font-size:.84rem}
#obtPal .hint{padding:7px 14px;border-top:1px solid var(--line);font-family:var(--mono);font-size:.62rem;color:var(--ink-faint)}
#obtPalBtn{appearance:none;background:none;border:1px solid var(--line);color:var(--ink-faint);font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;padding:5px 10px;cursor:pointer;white-space:nowrap}
#obtPalBtn b{color:var(--ink-dim);border:1px solid var(--line);padding:0 4px;margin-left:4px}
#obtPalBtn:hover{color:var(--ink-dim);border-color:var(--line-strong,var(--ink-faint))}
.obt-gch .gstar{appearance:none;background:none;border:none;cursor:pointer;padding:0 2px;color:var(--ink-faint);opacity:0;transition:opacity .12s;font-size:.78rem;line-height:1}
.obt-row:hover .obt-gch .gstar{opacity:1}
.obt-gch .gstar.on{opacity:1;color:var(--gold)}
@media (max-width:1149px){#obtPalBtn{display:none}}

/* ---- [v7b] action bar (WoW slots) + rail footer ---- */
#obtBar{display:flex;gap:1px;background:var(--line);border-top:1px solid var(--line);flex:0 0 auto;overflow-x:auto;scrollbar-width:none}
#obtBar::-webkit-scrollbar{display:none}
#obtBar .slot{appearance:none;flex:0 0 auto;min-width:56px;background:var(--panel);border:none;border-top:2px solid transparent;color:var(--ink-faint);font-family:var(--mono);font-size:.56rem;letter-spacing:.07em;text-transform:uppercase;padding:6px 8px 5px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px}
#obtBar .slot svg{width:20px;height:20px;display:block}
#obtBar .slot:hover{color:var(--ink-dim);background:rgba(70,140,255,.05)}
#obtBar .slot.on{color:var(--action-hi);border-top-color:var(--action-hi);background:rgba(70,140,255,.09)}
@media (max-width:1149px){#obtBar{display:none}}
#obtRailFoot{flex:0 0 auto;border-top:1px solid var(--line);background:var(--panel)}
#obtRailFoot .one{padding:8px 10px;border-bottom:1px solid var(--line);cursor:pointer}
#obtRailFoot .one:hover{background:rgba(70,140,255,.05)}
#obtRailFoot .one .k{display:block;font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--model);margin-bottom:2px}
#obtRailFoot .one b{display:block;font-family:var(--ui);font-weight:600;font-size:.8rem;color:var(--ink)}
#obtRailFoot .one i{display:block;font-style:normal;font-family:var(--mono);font-size:.66rem;color:var(--ink-dim);margin-top:1px}
#obtRailFoot .pal{padding:6px 10px;font-family:var(--mono);font-size:.6rem;color:var(--ink-faint);cursor:pointer}
#obtRailFoot .pal b{color:var(--ink-dim);border:1px solid var(--line);padding:0 4px}
#obtRailFoot .pal:hover{color:var(--ink-dim)}
@media (max-width:1149px){#obtRailFoot{display:none}}

/* ---- [v8] the arsenal bar, rebuilt: full-width chunky slots, charges, hotkeys ---- */
#obtBar{display:flex;gap:0;background:var(--panel);border-top:1px solid var(--line-strong,var(--ink-faint));align-items:stretch;overflow-x:auto;scrollbar-width:none;padding:0}
#obtBar .slot{position:relative;flex:1 1 0;min-width:54px;max-width:96px;background:var(--panel);border:none;border-right:1px solid var(--line);border-top:2px solid transparent;color:var(--ink-dim);font-family:var(--mono);font-size:.55rem;letter-spacing:.06em;text-transform:uppercase;padding:7px 4px 5px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;transition:background .1s,color .1s,transform .05s}
#obtBar .slot svg{width:23px;height:23px;display:block;margin:0 auto}
#obtBar .slot:hover{color:var(--ink);background:rgba(70,140,255,.07)}
#obtBar .slot:active{transform:scale(.94)}
#obtBar .slot.on{color:var(--action-hi);border-top-color:var(--action-hi);background:rgba(70,140,255,.12);box-shadow:inset 0 0 0 1px rgba(70,140,255,.35)}
#obtBar .slot .k{position:absolute;top:2px;left:4px;font-style:normal;font-size:.52rem;color:var(--ink-faint)}
#obtBar .slot .c{position:absolute;top:1px;right:3px;font-style:normal;font-size:.55rem;font-weight:700;color:var(--action-hi);background:rgba(70,140,255,.14);padding:0 4px;min-width:14px;text-align:center}
#obtBar .slot .v{position:absolute;top:4px;right:4px;width:6px;height:6px;border-radius:50%;background:var(--model)}
#obtBar .slot .c + .v{right:24px}
#obtBar .baru{display:flex;margin-left:auto;border-left:1px solid var(--line-strong,var(--ink-faint))}
#obtBar .ub{position:relative;flex:0 0 auto;min-width:46px;background:var(--panel-2);border:none;border-left:1px solid var(--line);color:var(--ink-dim);font-family:var(--mono);font-size:.9rem;padding:6px 8px 5px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
#obtBar .ub span{font-size:.52rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
#obtBar .ub:hover{color:var(--ink);background:rgba(70,140,255,.07)}

/* ---- [v8] league exhibit styles ---- */
.aqh{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:10px 0 5px;font-size:.84rem}
.aqh:first-of-type{margin-top:2px}
.aqh b{color:var(--ink);font-family:var(--ui);font-weight:600}
.aqh span{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint)}
.aq{display:grid;grid-template-columns:20px 1fr 30px 1fr 30px;align-items:center;gap:6px;padding:2px 0;font-variant-numeric:tabular-nums}
.aq i{font-style:normal;font-family:var(--mono);font-size:.6rem;color:var(--ink-faint)}
.aq .f{height:8px;background:var(--model);opacity:.85;justify-self:end}
.aq .g{height:8px;background:var(--ink-faint);opacity:.45}
.aq b{font-family:var(--mono);font-size:.7rem;color:var(--ink);text-align:right}
.aq em{font-style:normal;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim)}
.ntrow{padding:7px 0;border-top:1px solid var(--line)}
.ntrow:first-of-type{border-top:0;padding-top:2px}
.ntrow b{font-family:var(--ui);font-weight:600;font-size:.86rem;color:var(--ink)}
.ntrow .ft{float:right;font-family:var(--mono);font-size:.7rem;color:var(--model)}
.ntbar{height:9px;background:var(--panel-2);border:1px solid var(--line);margin:5px 0 3px;position:relative}
.ntbar span{position:absolute;inset:0 auto 0 0;background:var(--model);opacity:.75}
.ntbar::after{content:"HT";position:absolute;left:50%;top:-2px;bottom:-2px;border-left:1px dashed var(--ink-faint);font-family:var(--mono);font-size:.5rem;color:var(--ink-faint);padding-left:2px}
.ntrow i{font-style:normal;font-family:var(--mono);font-size:.68rem;color:var(--ink-dim)}
.nprow{display:flex;align-items:baseline;gap:10px;padding:6px 0;border-top:1px solid var(--line);font-size:.86rem}
.nprow:first-of-type{border-top:0;padding-top:2px}
.nprow b{color:var(--ink);font-family:var(--ui);font-weight:600}
.nprow i{font-style:normal;font-family:var(--mono);font-size:.72rem;color:var(--ink-dim)}
.nkrow{display:flex;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.nkrow img{width:34px;height:34px;object-fit:cover;border-radius:50%;background:var(--panel-2)}
.nkrow b{display:block;font-family:var(--ui);font-weight:600;font-size:.84rem;color:var(--ink)}
.nkrow span{display:block;font-family:var(--mono);font-size:.66rem;color:var(--ink-faint)}
.kbs{display:flex;gap:6px;margin-top:4px}
.kb{border:1px solid var(--line);padding:2px 7px;font-variant-numeric:tabular-nums}
.kb i{display:block;font-style:normal;font-family:var(--mono);font-size:.56rem;color:var(--ink-faint)}
.kb b{font-family:var(--mono);font-size:.78rem;color:var(--ink)}
.cprow{padding:7px 0;border-top:1px solid var(--line)}
.cprow:first-of-type{border-top:0;padding-top:2px}
.cprow b{font-family:var(--ui);font-weight:600;font-size:.86rem;color:var(--ink)}
.cprow .n{float:right;font-family:var(--mono);font-size:.64rem;color:var(--ink-faint)}
.cps{display:flex;gap:8px;margin-top:5px}
.cph{flex:1;border:1px solid var(--line);padding:5px 8px;font-variant-numeric:tabular-nums}
.cph i{display:block;font-style:normal;font-family:var(--mono);font-size:.56rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
.cph b{font-family:var(--mono);font-size:1rem;color:var(--model)}
.cph em{font-style:normal;font-family:var(--mono);font-size:.62rem;color:var(--ink-dim);margin-left:3px}

/* ---- [v9] castable abilities: powers group + sim/calc overlays ---- */
#obtBar .ub.pw{background:rgba(70,140,255,.08);color:var(--ink-dim);border-left:1px solid var(--line)}
#obtBar .ub.pw svg{width:19px;height:19px}
#obtBar .ub.pw:hover{background:rgba(70,140,255,.16);color:var(--action-hi)}
#obtBar .ub.pw:active{transform:scale(.93)}
#obtBar .ub.pw.proc{color:var(--model);background:rgba(52,211,153,.1);animation:obtProc 1.8s ease-in-out infinite}
@keyframes obtProc{0%,100%{box-shadow:inset 0 0 0 1px rgba(52,211,153,.15)}50%{box-shadow:inset 0 0 0 1px rgba(52,211,153,.6)}}
.simbox{min-width:300px}
.simgrid{display:grid;grid-template-columns:repeat(20,1fr);gap:3px;margin:8px 0 12px}
.simgrid span{width:100%;aspect-ratio:1;opacity:0;animation:obtPop .18s ease-out forwards}
@keyframes obtPop{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
.simgrid .s0,.simleg .s0{background:var(--model)}
.simgrid .s1,.simleg .s1{background:var(--ink-faint)}
.simgrid .s2,.simleg .s2{background:#C43D3D}
.simleg{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:.86rem;color:var(--ink-dim)}
.simleg span{width:10px;height:10px;flex:0 0 10px}
.simleg b{color:var(--ink)}
.calcbox{min-width:300px}
.calcin{display:block;font-family:var(--mono);font-size:.95rem;color:var(--ink);margin:6px 0 10px}
.calcin input{width:90px;background:var(--panel-2);border:1px solid var(--line);color:var(--ink);font-family:var(--mono);font-size:1rem;padding:6px 8px;outline:none}
.calcin input:focus{border-color:var(--action-hi)}
.calcrow{display:flex;align-items:baseline;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.calcrow b{font-family:var(--ui);font-weight:600;color:var(--ink);flex:1}
.calcrow i{font-style:normal;font-family:var(--mono);font-size:.72rem;color:var(--ink-faint)}
.calcrow em{font-style:normal;font-family:var(--mono);font-size:.84rem;color:var(--model);white-space:nowrap}
.obt-wsv.flashy{animation:obtFlashy 1.2s ease-out}
@keyframes obtFlashy{0%{background:rgba(52,211,153,.25)}100%{background:none}}

/* ---- [v10] boss frame + procs + tooltips + sweep + castables ---- */
.obt-wsid .tm img{width:40px;height:40px}
.obt-wsid .tm .ph{width:40px;height:40px}
.obt-wsid .tm b{font-size:1.12rem}
.obt-wsid.inplay{box-shadow:inset 0 0 0 1px rgba(196,61,61,.5)}
.obt-wsid .mid.live-mid .bigsc{font-size:1.7rem;letter-spacing:.02em}
.obt-wsv.hero{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.obt-wsv.hero .who{font-family:var(--ui);font-weight:700;font-size:.95rem;color:var(--ink)}
.obt-wsv.hero .big{font-family:var(--mono);font-size:1.65rem;font-weight:700;color:var(--model);line-height:1}
.obt-wsv.hero .per{font-family:var(--mono);font-size:.62rem;color:var(--ink-faint)}
.obt-wsv.hero .pips{display:inline-flex;gap:2.5px;align-self:center}
.obt-wsv.hero .pips span{width:7px;height:11px;background:var(--panel-2);border:1px solid var(--line)}
.obt-wsv.hero .pips span.on{background:var(--model);border-color:var(--model)}
.obt-wsv.hero .cw{font-family:var(--mono);font-size:.7rem;color:var(--ink-dim)}
.obt-wsv.hero em{font-style:normal;font-family:var(--mono);font-size:.72rem;color:var(--model);border:1px solid rgba(52,211,153,.4);padding:2px 8px}
#obtBar .slot.proc-red{color:#E8534A;animation:obtProcR 1.4s ease-in-out infinite}
#obtBar .slot.proc-green{color:var(--model);animation:obtProc 1.8s ease-in-out infinite}
#obtBar .slot.proc-blue{animation:obtProcB 2.2s ease-in-out infinite}
#obtBar .slot.proc-gold{color:var(--gold);animation:obtProcG 1.8s ease-in-out infinite}
@keyframes obtProcR{0%,100%{box-shadow:inset 0 -2px 0 rgba(196,61,61,.2)}50%{box-shadow:inset 0 -2px 0 rgba(196,61,61,.9)}}
@keyframes obtProcB{0%,100%{box-shadow:inset 0 -2px 0 rgba(70,140,255,.15)}50%{box-shadow:inset 0 -2px 0 rgba(70,140,255,.7)}}
@keyframes obtProcG{0%,100%{box-shadow:inset 0 -2px 0 rgba(232,179,74,.2)}50%{box-shadow:inset 0 -2px 0 rgba(232,179,74,.8)}}
#obtBar .slot.pinned .k{color:var(--gold)}
#obtBar .slot.cast{animation:obtCast .35s ease-out}
@keyframes obtCast{0%{transform:scale(1)}40%{transform:scale(.88);background:rgba(70,140,255,.25)}100%{transform:scale(1)}}
#obtBar.sweep::after{content:"";position:absolute;top:0;bottom:0;width:2px;background:rgba(70,140,255,.5);animation:obtSweep 1.1s ease-out forwards;pointer-events:none}
#obtBar{position:relative}
@keyframes obtSweep{from{left:0;opacity:1}to{left:100%;opacity:0}}
#obtTip{position:fixed;z-index:130;width:240px;background:var(--panel);border:1px solid var(--line-strong,var(--ink-faint));padding:9px 11px;pointer-events:none}
#obtTip b{display:block;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--action-hi);margin-bottom:3px}
#obtTip i{display:block;font-style:normal;font-family:var(--mono);font-size:.8rem;color:var(--ink);margin-bottom:3px}
#obtTip span{display:block;font-family:var(--ui);font-size:.76rem;color:var(--ink-dim);line-height:1.45}
.wsmax{position:absolute;top:6px;right:6px;z-index:3;appearance:none;background:var(--panel-2);border:1px solid var(--line);color:var(--ink-faint);font-size:.8rem;width:26px;height:26px;cursor:pointer;opacity:0;transition:opacity .12s}
.obt-wsmain{position:relative}
.obt-wsmain:hover .wsmax{opacity:1}
.wsmax:hover{color:var(--ink);border-color:var(--line-strong,var(--ink-faint))}
.maxbox{min-width:min(880px,80vw);max-height:76vh;overflow-y:auto}
.cstep{margin:0 0 10px;font-size:.92rem;line-height:1.6;color:var(--ink-dim)}
.cstep b{color:var(--ink)}
.cbtns{display:flex;gap:8px;margin-top:4px}
.cb{appearance:none;background:rgba(70,140,255,.1);border:1px solid var(--action-hi);color:var(--action-hi);font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;padding:8px 12px;cursor:pointer}
.cb:hover{background:rgba(70,140,255,.2)}
.tmbox{min-width:320px}
.tmbox input[type=range]{width:100%;margin:10px 0}
.tmrow{display:flex;align-items:baseline;gap:10px;padding:6px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.tmrow b{flex:1;font-family:var(--ui);font-weight:600;color:var(--ink)}
.tmrow i{font-style:normal;font-family:var(--mono);color:var(--ink)}
.tmrow em{font-style:normal;font-family:var(--mono);font-size:.7rem;color:var(--ink-faint)}
.tmrow em.up{color:var(--model)}
.tmrow em.dn{color:#E8534A}
.cmpick .pi{display:flex;justify-content:space-between;gap:10px;padding:8px 4px;border-top:1px solid var(--line);cursor:pointer}
.cmpick .pi:hover{background:rgba(70,140,255,.07)}
.cmpick .pi b{color:var(--ink);font-family:var(--ui);font-weight:600}
.cmpick .pi span{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint)}
.cmpbox{min-width:min(860px,82vw)}
.cmp2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cmh b{font-family:var(--ui);font-weight:700;color:var(--ink)}
.cmv{font-family:var(--mono);font-size:.78rem;color:var(--ink-dim);margin:4px 0 8px}
.cmv b{color:var(--model)}
.cmv em{font-style:normal;color:var(--model)}

/* ==== [v11] E-fixes + MOBILE PROGRAM + EYE-FLOW CRAFT ==== */
/* E3: placeholder crest shows the initial */
.obt-gph{display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.6rem;color:var(--ink-faint)}
/* B6: green means ACT — facts go ink, prices go quiet */
.gcm .fact,.obt-case .fact{color:var(--ink);font-weight:700}
.obt-gside .sp{color:var(--ink-dim)}
.obt-gside .sp:hover{color:var(--model);border-color:rgba(52,211,153,.4)}
.obt-prate{color:var(--ink)}
.ntrow .ft{color:var(--ink)}
.cph b{color:var(--ink)}
.obt-spline b{color:var(--ink)}
/* B9: number rails — prices align to a shared right edge */
.obt-gside .sp{min-width:56px;text-align:right}
.obt-gside .lsn{min-width:56px;text-align:right}
/* B8: 8px rhythm */
.obt-day{margin-top:8px;padding:4px 12px}
.obt-day:first-child{margin-top:0}
.obt-row{padding:8px 12px 9px}
.obt-gch{margin-bottom:4px}
.obt-stage{padding:12px}
.obt-wsid{padding:10px 12px}
/* B7: one primary per region — companions and depth drop half a shade */
.obt-wsside .gcm{opacity:.93}
.obt-wsside .gcmh{color:var(--ink-faint)}
.obt-receipt{opacity:.9}
/* B10: band type scale = 3 sizes */
.obt-wsv.hero .who{font-size:1rem}
.obt-wsv.hero .k,.obt-wsv.hero .per{font-size:.64rem}
.obt-wsv.hero .cw{font-size:.64rem}
.obt-wsv.hero em{font-size:.7rem}
/* B11: skeletons become shimmer frames */
.obt-skel{position:relative;overflow:hidden;background:var(--panel);border:1px solid var(--line);height:56px;margin:8px 10px}
.obt-skel:nth-child(2){width:82%}
.obt-skel:nth-child(3){width:64%}
.obt-skel::after{content:"";position:absolute;top:0;bottom:0;width:38%;left:-40%;background:linear-gradient(90deg,transparent,rgba(70,140,255,.06),transparent);animation:obtShimmer 1.2s ease-in-out infinite}
@keyframes obtShimmer{to{left:110%}}
/* B12: the site scores strip steps back on the terminal */
/* the terminal hides the site scores strip like the rest of the chrome — it has its
   own live layer, and a clamped ticker just looked broken (owner 09-03) */
.site-top{display:none}
/* A3: procs + charge badges on tiles (mobile cards + desktop rows) */
.obt-tile{position:relative}
.obt-tile .tc{position:absolute;top:3px;right:4px;font-style:normal;font-family:var(--mono);font-size:.56rem;font-weight:700;color:var(--action-hi);background:rgba(70,140,255,.14);padding:0 4px;min-width:14px;text-align:center}
.obt-tile.proc-red{box-shadow:inset 3px 0 0 #E8534A}
.obt-tile.proc-green{box-shadow:inset 3px 0 0 var(--model)}
.obt-tile.proc-blue{box-shadow:inset 3px 0 0 var(--action-hi)}
.obt-tile.proc-gold{box-shadow:inset 3px 0 0 var(--gold)}
/* A1: powers FAB + bottom sheet (mobile only) */
#obtFab{position:fixed;right:14px;bottom:78px;z-index:60;appearance:none;border:1px solid var(--action-hi);background:var(--panel);color:var(--action-hi);font-size:1.15rem;width:56px;height:56px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;box-shadow:0 4px 18px rgba(0,0,0,.45)}
#obtFab span{font-family:var(--mono);font-size:.5rem;letter-spacing:.08em;text-transform:uppercase}
@media (min-width:1150px){#obtFab{display:none !important}}
#obtPow{position:fixed;inset:0;z-index:110;background:rgba(4,8,14,.6)}
#obtPow .sheet{position:absolute;left:0;right:0;bottom:0;background:var(--panel);border-top:1px solid var(--line-strong,var(--ink-faint));padding:6px 0 14px;max-height:70vh;overflow-y:auto}
#obtPow .prow{padding:13px 18px;border-top:1px solid var(--line);cursor:pointer;min-height:48px}
#obtPow .prow:first-child{border-top:none}
#obtPow .prow b{display:block;font-family:var(--ui);font-weight:700;font-size:.95rem;color:var(--ink)}
#obtPow .prow span{display:block;font-family:var(--mono);font-size:.66rem;color:var(--ink-faint);margin-top:1px}
#obtPow .prow:active{background:rgba(70,140,255,.1)}
/* A2: compact mobile boss frame (spans the tile grid) */
.obt-mboss{grid-column:1/-1;display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:var(--panel);padding:10px 12px;font-variant-numeric:tabular-nums}
.obt-mboss img{width:38px;height:38px;object-fit:contain}
.obt-mboss .ph{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--panel-2);border:1px solid var(--line);font-family:var(--mono);color:var(--ink-faint)}
.obt-mboss .mid{flex:1;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;justify-content:center}
.obt-mboss .big{font-family:var(--mono);font-size:1.5rem;font-weight:700;color:var(--model);line-height:1}
.obt-mboss .sc{font-family:var(--mono);font-size:1.5rem;font-weight:700;color:var(--ink)}
.obt-mboss .per{font-family:var(--mono);font-size:.64rem;color:var(--ink-faint)}
.obt-mboss .pips{display:inline-flex;gap:2.5px;align-self:center}
.obt-mboss .pips span{width:6px;height:10px;background:var(--panel-2);border:1px solid var(--line)}
.obt-mboss .pips span.on{background:var(--model);border-color:var(--model)}
.obt-mboss em{font-style:normal;font-family:var(--mono);font-size:.66rem;color:var(--model);border:1px solid rgba(52,211,153,.4);padding:1px 6px}
.obt-mboss .live{font-size:.58rem;letter-spacing:.08em;color:#fff;background:#C43D3D;padding:1px 6px}
.obt-mboss.inplay{box-shadow:inset 0 0 0 1px rgba(196,61,61,.5)}
@media (min-width:1150px){.obt-mboss{display:none}}
/* A1b: coach in the game head */
#obtCoach2{appearance:none;background:rgba(70,140,255,.1);border:1px solid var(--action-hi);color:var(--action-hi);font-family:var(--mono);font-size:.64rem;letter-spacing:.04em;text-transform:uppercase;padding:8px 10px;min-height:40px;cursor:pointer;white-space:nowrap;margin-left:auto}
@media (min-width:1150px){#obtCoach2{display:none}}
/* A5: 48px touch targets */
@media (max-width:1149px){
  .obt-days button{min-height:40px;padding:8px 14px}
  .obt-glens button{min-height:40px;padding:9px 13px}
  #obtPal .box{width:94vw}
  #obtPal{padding-top:8vh}
  #obtPal .pi{min-height:48px;align-items:center}
}

/* [v11.1] mobile game-head: crumb yields, the coach button never overlaps */
@media (max-width:1149px){
  .obt-gamehead .obt-crumb{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .obt-gamehead .obt-crumb .ko{display:inline-block;max-width:9em;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
  #obtCoach2{flex:0 0 auto;margin-left:6px}
  .obt-gamehead .obt-star2{flex:0 0 auto}
}

/* ---- [v13] broadcast exhibits + motion + mobile find ---- */
.obt-chartwrap{position:relative}
.obt-stage .obt-chart{height:230px}
.obt-wsc .obt-chart{height:150px}
.obt-chartwrap .xtip{position:absolute;top:8px;background:var(--panel);border:1px solid var(--line-strong,var(--ink-faint));padding:6px 9px;pointer-events:none;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);white-space:nowrap;z-index:5}
.obt-chartwrap .xtip div{display:flex;align-items:center;gap:6px;padding:1px 0}
.obt-chartwrap .xtip b{color:var(--ink)}
.obt-chartwrap .xtip i{width:8px;height:8px;flex:0 0 8px}
.obt-chartwrap .xtip i.c0{background:var(--action-hi)}
.obt-chartwrap .xtip i.c1{background:var(--model)}
.gclab2 .lcr{width:18px;height:18px;object-fit:contain;vertical-align:-4px;margin-right:5px}
.obt-stage.swapin>*{animation:obtSwap .2s ease-out}
@keyframes obtSwap{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.obt-wsid{animation:obtSettle .28s ease-out}
@keyframes obtSettle{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.obt-stage.swapin>*,.obt-wsid{animation:none}}
@media (max-width:1149px){
  #obtSearch{width:64px;min-width:64px;flex:0 0 64px;text-align:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;color:var(--ink-dim);cursor:pointer}
}

/* ---- [v14] THE JOURNEY BAR — six numbered questions, walked left to right ---- */
#obtBar .jstage{position:relative;flex:1 1 0;min-width:96px;background:var(--panel);border:none;border-right:1px solid var(--line);border-top:2px solid transparent;color:var(--ink-dim);text-align:left;padding:7px 10px 6px 30px;cursor:pointer;display:flex;flex-direction:column;justify-content:center;gap:1px;transition:background .1s,color .1s}
#obtBar .jstage b{font-family:var(--ui);font-weight:700;font-size:.8rem;color:var(--ink-dim);letter-spacing:0;text-transform:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#obtBar .jstage span{font-family:var(--mono);font-size:.58rem;letter-spacing:.05em;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#obtBar .jstage .jn{position:absolute;left:9px;top:50%;transform:translateY(-50%);font-style:normal;font-family:var(--mono);font-size:.72rem;color:var(--ink-faint);border:1px solid var(--line);width:16px;height:16px;line-height:15px;text-align:center}
#obtBar .jstage .jc{position:absolute;top:2px;right:4px;font-style:normal;font-family:var(--mono);font-size:.55rem;font-weight:700;color:var(--action-hi);background:rgba(70,140,255,.14);padding:0 4px;min-width:14px;text-align:center}
#obtBar .jstage:hover{background:rgba(70,140,255,.06)}
#obtBar .jstage:hover b{color:var(--ink)}
#obtBar .jstage.on{border-top-color:var(--action-hi);background:rgba(70,140,255,.1)}
#obtBar .jstage.on b{color:var(--action-hi)}
#obtBar .jstage.on .jn{border-color:var(--action-hi);color:var(--action-hi)}
#obtBar .jstage.cast{animation:obtCast .35s ease-out}
#obtBar .jstage.proc-green .jn{border-color:var(--model);color:var(--model)}
#obtBar .jstage.proc-red .jn{border-color:#E8534A;color:#E8534A}
#obtBar .jstage.proc-gold .jn{border-color:var(--gold);color:var(--gold)}
#obtBar .jstage.proc-blue .jn{border-color:var(--action-hi)}

/* ---- [v16] the market spine: selector + take-it live in the boss frame ---- */
.obt-mksel{display:flex;gap:0;border:1px solid var(--line);margin-left:6px}
.obt-mksel button{appearance:none;background:var(--panel-2);border:none;border-left:1px solid var(--line);color:var(--ink-dim);font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;padding:7px 12px;cursor:pointer;min-height:34px}
.obt-mksel button:first-child{border-left:none}
.obt-mksel button:hover{color:var(--ink)}
.obt-mksel button.on{background:var(--action-hi);color:#fff}
.wtake{appearance:none;background:var(--model);border:none;color:#06251A;font-family:var(--mono);font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:8px 13px;cursor:pointer;margin-left:4px}
.wtake:hover{filter:brightness(1.1)}
.wtake:active{transform:scale(.95)}
/* the band owns the market on desktop — the old top tab rows retire there */
@media (min-width:1150px){
  #obtLens{display:none}
  #obtGLens{display:none}
}

/* ---- [v17] gamified journey slots + monitor rail + weather/ranks ---- */
#obtBar .jstage{padding:6px 10px 5px 52px;min-width:118px}
#obtBar .jstage .jg{position:absolute;left:26px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:inherit;opacity:.85}
#obtBar .jstage .jg svg{width:20px;height:20px;display:block}
#obtBar .jstage:hover{transform:translateY(-1px)}
#obtBar .jstage:active{transform:scale(.96)}
#obtBar .jstage.seen .jn{border-color:var(--model);color:var(--model)}
#obtBar .jstage.on .jg{opacity:1}
.wxrow{display:flex;gap:1px;background:var(--line);border:1px solid var(--line);margin:2px 0 8px}
.wxc{flex:1;background:var(--panel);padding:6px 4px;text-align:center;font-variant-numeric:tabular-nums}
.wxc.ko{background:rgba(70,140,255,.1);box-shadow:inset 0 2px 0 var(--action-hi)}
.wxc i{display:block;font-style:normal;font-family:var(--mono);font-size:.56rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint)}
.wxc b{display:block;font-family:var(--mono);font-size:1rem;color:var(--ink);margin:2px 0}
.wxc em{display:block;font-style:normal;font-family:var(--mono);font-size:.6rem;color:var(--ink-dim)}
.pwrow{display:flex;align-items:center;gap:12px;padding:8px 0;border-top:1px solid var(--line)}
.pwrow:first-of-type{border-top:0;padding-top:2px}
.pwrow .rk{font-family:var(--mono);font-size:1.5rem;font-weight:700;color:var(--ink);min-width:52px}
.pwrow div b{display:block;font-family:var(--ui);font-weight:600;font-size:.88rem;color:var(--ink)}
.pwrow div span{display:block;font-family:var(--mono);font-size:.68rem;color:var(--ink-dim);margin-top:1px}
#obtRailFoot .rsec{padding:7px 10px 8px;border-bottom:1px solid var(--line)}
#obtRailFoot .rk{display:block;font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:4px}
#obtRailFoot .rleg{display:flex;align-items:center;gap:6px;padding:3px 0;font-variant-numeric:tabular-nums}
#obtRailFoot .rleg b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ui);font-weight:600;font-size:.76rem;color:var(--ink)}
#obtRailFoot .rleg i{font-style:normal;font-family:var(--mono);font-size:.74rem;color:var(--ink-dim)}
#obtRailFoot .rleg .rx{appearance:none;background:none;border:none;color:var(--ink-faint);font-size:.9rem;cursor:pointer;padding:0 2px;line-height:1}
#obtRailFoot .rleg .rx:hover{color:#E8534A}
#obtRailFoot .rsum{display:flex;align-items:baseline;gap:8px;margin-top:4px;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim)}
#obtRailFoot .rsum b{color:var(--model)}
#obtRailFoot .rsum .ropen{appearance:none;background:none;border:1px solid var(--line);color:var(--ink-dim);font-family:var(--mono);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;cursor:pointer;margin-left:auto}
#obtRailFoot .rsum .ropen:hover{color:var(--action-hi);border-color:var(--action-hi)}
#obtRailFoot .rlink{display:block;font-family:var(--mono);font-size:.7rem;color:var(--action-hi);text-decoration:none;padding:2px 0}
#obtRailFoot .rlink:hover{text-decoration:underline}

/* ==== [v18] THE HUD BAR — permanently dark, framed, lit. Game UI never re-skins. ==== */
#obtBar{--hud:#0B0F16;--hudcell:#131926;--hudline:#26314A;--hudink:#E8EDF6;--huddim:#93A3BC;--hudfaint:#5C6A82;
  background:var(--hudline);border-top:2px solid var(--hudline);gap:1px;padding:0;min-height:56px}
#obtBar .jstage{background:var(--hudcell);color:var(--huddim);border:none;border-top:2px solid transparent;padding:8px 10px 7px 56px;min-width:128px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
#obtBar .jstage b{color:var(--hudink);font-size:.82rem}
#obtBar .jstage span.jq{color:var(--hudfaint)}
#obtBar .jstage .jn{border-color:var(--hudline);color:var(--hudfaint);background:var(--hud);width:17px;height:17px;line-height:16px}
#obtBar .jstage .jg{left:28px;width:22px;height:22px;color:var(--huddim)}
#obtBar .jstage .jg svg{width:22px;height:22px}
#obtBar .jstage:hover{background:#1A2233;color:var(--hudink);transform:none}
#obtBar .jstage:hover .jg{color:var(--hudink)}
#obtBar .jstage.on{background:#18213A;border-top-color:#5B8DEF;box-shadow:inset 0 1px 0 rgba(91,141,239,.35),inset 0 -14px 22px -18px rgba(91,141,239,.8)}
#obtBar .jstage.on b{color:#9DBCFF}
#obtBar .jstage.on .jg{color:#9DBCFF;opacity:1}
#obtBar .jstage.on .jn{border-color:#5B8DEF;color:#9DBCFF}
#obtBar .jstage.seen .jn{border-color:#37C08A;color:#37C08A}
#obtBar .jstage.proc-green .jn{border-color:#37C08A;color:#37C08A;box-shadow:0 0 8px rgba(55,192,138,.55)}
#obtBar .jstage.proc-red .jn{border-color:#E8534A;color:#FF7A72;box-shadow:0 0 8px rgba(232,83,74,.6)}
#obtBar .jstage.proc-gold .jn{border-color:#E8B34A;color:#FFD37A;box-shadow:0 0 8px rgba(232,179,74,.55)}
#obtBar .jc{color:#9DBCFF;background:rgba(91,141,239,.2)}
#obtBar .baru{border-left:2px solid var(--hudline)}
#obtBar .ub{background:var(--hudcell);color:var(--huddim);border:none;border-left:1px solid var(--hudline);min-width:52px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
#obtBar .ub span{color:var(--hudfaint)}
#obtBar .ub:hover{background:#1A2233;color:var(--hudink)}
#obtBar .ub.pw{background:#14202F;color:#7FB0E8}
#obtBar .ub.pw:hover{background:#1A2C42;color:#B7D6FF}
#obtBar .ub.pw.proc{color:#4ADE9C;background:#12291F;animation:obtProc 1.8s ease-in-out infinite}
#obtBar .slot{background:var(--hudcell);color:var(--huddim);border-right:1px solid var(--hudline)}
#obtBar.sweep::after{background:rgba(91,141,239,.6)}
#obtTip{background:#0E1420;border-color:#26314A;color:#93A3BC}
#obtTip b{color:#9DBCFF}
#obtTip i{color:#E8EDF6}
#obtTip span{color:#93A3BC}

/* ---- [v19] model factor marks + key ---- */
.fwm{font-style:normal;font-family:var(--mono);letter-spacing:1px;font-size:.6rem;line-height:1}
.fwm.l3{color:var(--model)}
.fwm.l2{color:var(--model);opacity:.75}
.fwm.l1{color:var(--ink-faint)}
.obt-wsmain>.fwm,.obt-wsc>.fwm{position:absolute;top:8px;right:38px;z-index:3}
.obt-wsc>.fwm{right:10px}
.obt-wsc{position:relative}
.obt-tile .fwm{position:absolute;bottom:3px;right:5px}
@media (max-width:1149px){.obt-tile .fwm{bottom:auto;top:3px;right:24px}}
.fwkey{display:flex;flex-direction:column;gap:2px}
.fwkey span{font-family:var(--mono);font-size:.66rem;color:var(--ink-dim)}
.fwkey .fwm{margin-right:6px}
.fwnote{margin:5px 0 0;font-family:var(--ui);font-size:.68rem;color:var(--ink-faint);line-height:1.45}

/* ---- [v20] H2: the holo hand — hologram card bar, full width above the dock ---- */
#obtBar{--holo:#38C7FF;--holot:#AEE8FF;--holod:#5D9CBD;--hgold:#F5B301;--hgoldt:#FFE9A8;--hact:#22C55E;--hactt:#8DFFB8;
  display:flex;align-items:flex-end;gap:11px;min-height:138px;padding:16px 16px 11px;position:relative;overflow:visible;
  background:linear-gradient(180deg,#02060C,#010409);border-top:1px solid rgba(56,199,255,.5)}
#obtBar::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,rgba(56,199,255,.045) 0 1px,transparent 1px 4px);pointer-events:none}
#obtBar::after{content:"";position:absolute;top:-1px;left:14%;right:14%;height:1px;background:linear-gradient(90deg,transparent,rgba(56,199,255,.75),transparent)}
#obtBar .jstage{flex:1 1 132px;min-width:102px;max-width:210px;height:108px;border-radius:8px;box-sizing:border-box;
  background:linear-gradient(180deg,rgba(23,68,105,.38),rgba(8,26,44,.55));border:1px solid rgba(56,199,255,.5);
  box-shadow:0 0 14px rgba(56,199,255,.16),inset 0 0 20px rgba(56,199,255,.07);
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;
  padding:13px 8px 9px;color:var(--holod);transition:transform .12s ease,box-shadow .12s ease;z-index:1}
#obtBar .jstage:hover{background:linear-gradient(180deg,rgba(23,68,105,.5),rgba(8,26,44,.65));transform:translateY(-4px)}
#obtBar .jstage .jn{position:absolute;left:-9px;top:-9px;transform:none;width:24px;height:24px;line-height:22px;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,rgba(56,199,255,.5),rgba(8,26,44,.92) 70%);border:1px solid var(--holo);
  color:#DFF6FF;font-size:.68rem;text-shadow:0 0 8px var(--holo);box-shadow:0 0 10px rgba(56,199,255,.5)}
#obtBar .jstage .jc{top:-8px;right:-6px;border-radius:9px;background:rgba(8,26,44,.92);border:1px solid var(--hgold);color:var(--hgoldt);
  text-shadow:0 0 6px var(--hgold);box-shadow:0 0 8px rgba(245,179,1,.45);padding:0 5px;line-height:15px}
#obtBar .jstage .jg{position:static;transform:none;left:auto;top:auto;width:54px;height:36px;flex:0 0 auto;border-radius:5px;
  border:1px solid rgba(56,199,255,.4);background:rgba(4,14,26,.6);display:flex;align-items:center;justify-content:center;
  box-shadow:inset 0 0 12px rgba(56,199,255,.14);color:var(--holot);opacity:1;margin:0 0 8px}
#obtBar .jstage .jg svg{width:22px;height:22px}
#obtBar .jstage b{font-family:var(--mono);font-weight:700;font-size:.6rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--holot);text-shadow:0 0 8px rgba(56,199,255,.8);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#obtBar .jstage span.jq{font-family:var(--ui);font-size:.66rem;letter-spacing:0;text-transform:none;color:var(--holod);
  margin-top:3px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#obtBar .jstage::after{content:"";position:absolute;left:14%;right:14%;top:100%;height:11px;
  background:linear-gradient(180deg,rgba(56,199,255,.28),transparent);filter:blur(2px);pointer-events:none}
#obtBar .jstage.seen{border-color:rgba(245,179,1,.55);box-shadow:0 0 12px rgba(245,179,1,.13),inset 0 0 18px rgba(245,179,1,.05)}
#obtBar .jstage.seen .jn{background:radial-gradient(circle at 50% 50%,rgba(245,179,1,.45),rgba(36,24,4,.92) 70%);border-color:var(--hgold);
  color:var(--hgoldt);text-shadow:0 0 8px var(--hgold);box-shadow:0 0 10px rgba(245,179,1,.45)}
#obtBar .jstage.seen b{color:var(--hgoldt);text-shadow:0 0 8px rgba(245,179,1,.65)}
#obtBar .jstage.seen .jg{border-color:rgba(245,179,1,.4);box-shadow:inset 0 0 12px rgba(245,179,1,.1);color:var(--hgoldt)}
#obtBar .jstage.seen::after{background:linear-gradient(180deg,rgba(245,179,1,.22),transparent)}
#obtBar .jstage.on{border-color:#7FDCFF;border-top-color:#7FDCFF;background:linear-gradient(180deg,rgba(23,68,105,.55),rgba(8,26,44,.7));
  box-shadow:0 0 26px rgba(56,199,255,.55),inset 0 0 24px rgba(56,199,255,.18);transform:translateY(-12px) scale(1.05);z-index:2}
#obtBar .jstage.on:hover{transform:translateY(-12px) scale(1.05)}
#obtBar .jstage.on b{color:#fff}
#obtBar .jstage.on span.jq{color:var(--holot)}
#obtBar .jstage.on .jg{color:#fff;border-color:rgba(127,220,255,.7);box-shadow:inset 0 0 14px rgba(56,199,255,.3)}
#obtBar .jstage.proc-green{border-color:rgba(34,197,94,.7);box-shadow:0 0 16px rgba(34,197,94,.35),inset 0 0 18px rgba(34,197,94,.08)}
#obtBar .jstage.proc-green .jn{border-color:var(--hact);color:var(--hactt);text-shadow:0 0 8px var(--hact);box-shadow:0 0 10px rgba(34,197,94,.5)}
#obtBar .jstage.proc-red{border-color:rgba(232,83,74,.7);box-shadow:0 0 16px rgba(232,83,74,.35),inset 0 0 18px rgba(232,83,74,.08)}
#obtBar .jstage.proc-red .jn{border-color:#E8534A;color:#FF9A92;text-shadow:0 0 8px #E8534A;box-shadow:0 0 10px rgba(232,83,74,.5)}
#obtBar .jstage.proc-gold{border-color:rgba(232,179,74,.75)}
#obtBar .jstage.proc-gold .jn{border-color:#E8B34A;color:#FFD37A;text-shadow:0 0 8px #E8B34A}
#obtBar .baru{margin-left:auto;display:flex;align-items:flex-end;gap:6px;border:none;background:transparent;padding-bottom:2px}
#obtBar .ub{background:transparent;border:none;box-shadow:none;min-width:56px;padding:0;color:var(--holod);
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;cursor:pointer}
#obtBar .ub .rg{width:44px;height:44px;border-radius:50%;border:1px solid rgba(56,199,255,.5);
  background:radial-gradient(circle at 50% 42%,rgba(56,199,255,.2),rgba(4,14,26,.72) 72%);
  display:flex;align-items:center;justify-content:center;color:var(--holot);
  box-shadow:0 0 12px rgba(56,199,255,.22),inset 0 0 10px rgba(56,199,255,.1);transition:box-shadow .12s ease,transform .12s ease}
#obtBar .ub .rg svg{width:20px;height:20px;display:block}
#obtBar .ub .lb{font-family:var(--mono);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;color:var(--holod);white-space:nowrap}
#obtBar .ub:hover{background:transparent;color:var(--holot)}
#obtBar .ub:hover .rg{box-shadow:0 0 18px rgba(56,199,255,.45),inset 0 0 12px rgba(56,199,255,.18);transform:translateY(-2px)}
#obtBar .ub:hover .lb{color:var(--holot)}
#obtBar .ub.pw,#obtBar .ub.pw:hover{background:transparent}
#obtBar .ub.go{flex-direction:row;align-self:center;min-width:0;margin-left:8px;padding:13px 18px;border:1px solid rgba(34,197,94,.8);border-radius:4px;
  background:rgba(5,30,16,.55);font-family:var(--mono);font-weight:700;font-size:.78rem;letter-spacing:.07em;color:var(--hactt);
  text-shadow:0 0 10px rgba(34,197,94,.9);box-shadow:0 0 18px rgba(34,197,94,.3),inset 0 0 14px rgba(34,197,94,.1)}
#obtBar .ub.go:hover{background:rgba(7,44,23,.65);color:#B9FFD4;box-shadow:0 0 26px rgba(34,197,94,.5),inset 0 0 16px rgba(34,197,94,.16)}
#obtBar .ub.go.proc{animation:obtProc 1.8s ease-in-out infinite;background:rgba(6,38,20,.65)}
#obtBar.sweep::after{background:linear-gradient(90deg,transparent,rgba(56,199,255,.9),transparent)}
#obtPow2{position:fixed;right:16px;bottom:170px;z-index:60}
#obtPow2 .sheet{background:rgba(4,14,26,.94);border:1px solid rgba(56,199,255,.5);border-radius:6px;min-width:250px;
  box-shadow:0 0 26px rgba(56,199,255,.28);overflow:hidden}
#obtPow2 .prow{display:flex;flex-direction:column;gap:1px;padding:10px 14px;cursor:pointer;border-bottom:1px solid rgba(56,199,255,.14)}
#obtPow2 .prow:last-child{border-bottom:none}
#obtPow2 .prow b{font-family:var(--mono);font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;color:#AEE8FF;text-shadow:0 0 7px rgba(56,199,255,.7)}
#obtPow2 .prow span{font-family:var(--ui);font-size:.66rem;color:#5D9CBD}
#obtPow2 .prow:hover{background:rgba(56,199,255,.1)}
#obtPow2 .prow:hover b{color:#fff}
/* ---- [v20] H3: the switch rail — settings as switchgear ---- */
#obtSw{display:flex;flex-direction:column;align-items:center;gap:11px;width:100%;margin-top:12px;padding-top:11px;position:relative}
#obtSw::before{content:"";position:absolute;top:0;left:16%;right:16%;height:1px;background:linear-gradient(90deg,transparent,rgba(56,199,255,.55),transparent)}
#obtSw .swk{font-family:var(--mono);font-size:.44rem;letter-spacing:.24em;text-transform:uppercase;color:#5D9CBD}
#obtSw .tg{appearance:none;background:transparent;border:none;display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;padding:0;width:100%}
#obtSw .tg .nm{font-family:var(--mono);font-size:.46rem;letter-spacing:.09em;text-transform:uppercase;color:#5D9CBD;white-space:nowrap}
#obtSw .tg .sw{width:20px;height:34px;border-radius:10px;background:rgba(4,14,26,.9);border:1px solid rgba(56,199,255,.5);
  box-shadow:inset 0 2px 5px rgba(0,0,0,.8),0 0 8px rgba(56,199,255,.12);position:relative;display:block}
#obtSw .tg .sw i{position:absolute;left:2px;right:2px;height:14px;border-radius:8px;background:linear-gradient(180deg,#28455F,#132638);
  box-shadow:0 1px 3px rgba(0,0,0,.7);transition:top .12s ease,bottom .12s ease}
#obtSw .tg .sw i.up{top:2px}
#obtSw .tg .sw i.dn{top:16px}
#obtSw .tg .st{font-family:var(--mono);font-size:.5rem;font-weight:700;letter-spacing:.06em;color:#5D9CBD;white-space:nowrap}
#obtSw .tg.armed .sw{border-color:#38C7FF}
#obtSw .tg.armed .sw i{background:linear-gradient(180deg,#7FDCFF,#2A8FC4);box-shadow:0 0 10px rgba(56,199,255,.8)}
#obtSw .tg.armed .st{color:#AEE8FF;text-shadow:0 0 7px rgba(56,199,255,.7)}
#obtSw .tg.grn .sw{border-color:#22C55E}
#obtSw .tg.grn .sw i{background:linear-gradient(180deg,#8DFFB8,#1F9A52);box-shadow:0 0 10px rgba(34,197,94,.8)}
#obtSw .tg.grn .st{color:#8DFFB8;text-shadow:0 0 7px rgba(34,197,94,.7)}
#obtSw .tg:hover .nm{color:#AEE8FF}
@media (max-width:1149px){#obtBar{display:none !important}#obtSw{display:none !important}}
@media (prefers-reduced-motion: reduce){#obtBar .jstage,#obtBar .ub .rg,#obtSw .tg .sw i{transition:none}}
/* ---- [v21] hidden must mean hidden: author display rules were beating the attribute ---- */
#obtBar[hidden]{display:none !important}
#obtToast[hidden]{display:none !important}

/* ---- [v22] the holo frame: rail completed, bar compacted, right column + controls unified ---- */
/* A. tools rail — the H3 strip, whole thing */
.obt-rail1{background:linear-gradient(180deg,#02060C,#010409);border-right:1px solid rgba(56,199,255,.22);gap:7px;padding:10px 0}
.obt-rail1 .obt-ico{width:38px;height:38px;border:1px solid rgba(56,199,255,.28);border-radius:6px;background:rgba(8,26,44,.38);color:#5D9CBD}
.obt-rail1 .obt-ico:hover{color:#AEE8FF;background:rgba(8,26,44,.6);border-color:rgba(56,199,255,.55);box-shadow:0 0 10px rgba(56,199,255,.28)}
.obt-rail1 .obt-ico.on{border-color:#7FDCFF;color:#AEE8FF;background:rgba(12,30,56,.6);box-shadow:0 0 12px rgba(56,199,255,.45)}
/* B. the bar, half the height: cards go horizontal on a grid */
#obtBar{min-height:92px;padding:12px 14px 9px;gap:9px;align-items:center}
#obtBar .jstage{display:grid;grid-template-columns:34px minmax(0,1fr);grid-template-rows:auto auto;align-content:center;column-gap:9px;row-gap:2px;height:62px;padding:8px 12px 8px 14px;text-align:left;flex:1 1 150px;min-width:118px;max-width:236px}
#obtBar .jstage .jg{grid-row:1/3;grid-column:1;position:static;transform:none;width:34px;height:30px;margin:0;align-self:center}
#obtBar .jstage .jg svg{width:19px;height:19px}
#obtBar .jstage b{grid-column:2;justify-self:start;text-align:left;max-width:100%}
#obtBar .jstage span.jq{grid-column:2;justify-self:start;text-align:left;margin-top:0;font-size:.68rem}
#obtBar .jstage .jn{width:20px;height:20px;line-height:18px;left:-7px;top:-7px;font-size:.6rem}
#obtBar .jstage .jc{top:-7px;right:-5px}
#obtBar .jstage::after{height:8px}
#obtBar .jstage:hover{transform:translateY(-2px)}
#obtBar .jstage.on{transform:translateY(-5px) scale(1.02)}
#obtBar .jstage.on:hover{transform:translateY(-5px) scale(1.02)}
#obtBar .ub{min-width:46px;gap:4px}
#obtBar .ub .rg{width:36px;height:36px}
#obtBar .ub .rg svg{width:17px;height:17px}
#obtBar .ub .lb{font-size:.48rem}
#obtBar .ub.go{padding:10px 14px;font-size:.72rem;margin-left:6px}
#obtPow2{bottom:118px}
/* C. right column — same dark holo surface as the bar */
.obt-tilescol{background:linear-gradient(180deg,#02060C,#010409);border-left:1px solid rgba(56,199,255,.22)}
.obt-tile{border-bottom:1px solid rgba(56,199,255,.12)}
.obt-tile .tl{color:#5D9CBD}
.obt-tile .hl{color:#DFE9F5}
.obt-tile:hover{background:rgba(56,199,255,.07)}
.obt-tile.on{background:rgba(12,30,56,.75);border-left-color:#7FDCFF;box-shadow:inset 0 0 14px rgba(56,199,255,.12)}
.obt-tile .tc{color:#AEE8FF;background:rgba(56,199,255,.14)}
.obt-tile.proc-green{box-shadow:inset 3px 0 0 #37C08A}
.obt-tile.proc-red{box-shadow:inset 3px 0 0 #FF7A72}
#obtRailFoot{background:transparent;border-top:1px solid rgba(56,199,255,.2)}
#obtRailFoot .rsec{border-bottom:1px solid rgba(56,199,255,.12)}
#obtRailFoot .rk{color:#5D9CBD}
#obtRailFoot .rleg b{color:#DFE9F5}
#obtRailFoot .rleg i{color:#AEE8FF}
#obtRailFoot .rleg .rx{color:#4A617F}
#obtRailFoot .rsum{color:#8FA7C4}
#obtRailFoot .rsum b{color:#8DFFB8}
#obtRailFoot .rsum .ropen{border-color:rgba(56,199,255,.35);color:#7FDCFF}
#obtRailFoot .rsum .ropen:hover{border-color:#38C7FF;color:#AEE8FF}
#obtRailFoot .rlink{color:#7FDCFF}
#obtRailFoot .one{border-bottom:1px solid rgba(56,199,255,.12)}
#obtRailFoot .one:hover{background:rgba(56,199,255,.06)}
#obtRailFoot .one .k{color:#8DFFB8}
#obtRailFoot .one b{color:#DFE9F5}
#obtRailFoot .one i{color:#8FA7C4}
#obtRailFoot .pal{color:#4A617F}
#obtRailFoot .pal b{color:#7FDCFF;border-color:rgba(56,199,255,.3)}
#obtRailFoot .pal:hover{color:#8FA7C4}
#obtRailFoot .fwkey span{color:#8FA7C4}
#obtRailFoot .fwnote{color:#4A617F}
#obtRailFoot .fwm.l1{color:#4A617F}
/* D. one control language everywhere: rounded, cyan-accented */
.obt-tico,.obt-tnav button,.obt-back,.obt-lens button,.obt-glens button,.obt-lg,.obt-ico{border-radius:6px}
.obt-seg{border-radius:6px;overflow:hidden;border-color:rgba(56,199,255,.4)}
.obt-seg button.on{background:#0C1E38;color:#7FDCFF;text-shadow:0 0 8px rgba(56,199,255,.6)}
.obt-lens button.on,.obt-glens button.on{border-color:#38C7FF;color:#0B72A8;background:rgba(56,199,255,.08)}
.obt-tico:hover,.obt-tnav button:hover,.obt-back:hover{border-color:#38C7FF;color:#0B72A8}
.obt-lg.on{border-color:#38C7FF;background:rgba(56,199,255,.08)}
@media (max-width:1149px){#obtBar{display:none !important}#obtSw{display:none !important}
  .obt-rail1{background:transparent;border-right:none}
  .obt-tilescol{background:var(--panel-2)}
  .obt-tile .tl{color:var(--ink-faint)}
  .obt-tile .hl{color:var(--ink)}
  .obt-tile.on{background:rgba(70,140,255,.08)}
}
.obt-tilescol .obt-skel{background:rgba(56,199,255,.08)}
#obtStage .obt-skel{border-radius:6px}

/* ---- [v23] props board: two calm lines, plain words ---- */
.obt-prow.p2{display:flex;align-items:flex-start;gap:9px;padding:8px 6px 8px 2px}
.obt-prow.p2 img{width:28px;height:28px;margin-top:2px}
.obt-prow.p2 .obt-pmain{flex:1;min-width:0}
.obt-prow.p2 .obt-pl1{display:flex;align-items:baseline;gap:8px}
.obt-prow.p2 .obt-pname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ui);font-weight:700;font-size:.8rem;color:var(--ink)}
.obt-prow.p2 .obt-pprice{flex:0 0 auto;font-family:var(--mono);font-weight:700;font-size:.78rem;color:var(--action-hi)}
.obt-prow.p2 .obt-pl2{font-family:var(--ui);font-size:.72rem;color:var(--ink-dim);line-height:1.4;margin-top:1px}
.obt-prow.p2 .obt-pl2 b{color:var(--model);font-weight:700}
.obt-prow.p2 .obt-pfire{font-style:normal;color:var(--gold,#B8860B);font-weight:600}
.obt-prow.p2 .obt-pl3{font-family:var(--ui);font-size:.66rem;color:var(--ink-faint);margin-top:1px}
.obt-prow.p2:hover{background:rgba(70,140,255,.05)}

/* ---- [v23] light skin for the holo chrome (stamped light, or OS-light with no stamp) ---- */
:root[data-theme="light"] #obtBar{background:linear-gradient(180deg,#FFFFFF,#F0F5FB);border-top:1px solid rgba(11,114,168,.3)}
:root[data-theme="light"] #obtBar::before{background:repeating-linear-gradient(180deg,rgba(11,114,168,.03) 0 1px,transparent 1px 4px)}
:root[data-theme="light"] #obtBar::after{background:linear-gradient(90deg,transparent,rgba(11,114,168,.45),transparent)}
:root[data-theme="light"] #obtBar .jstage{background:linear-gradient(180deg,#FFFFFF,#F4F8FD);border-color:rgba(11,114,168,.3);box-shadow:0 2px 8px rgba(23,37,64,.08);color:#4A7396}
:root[data-theme="light"] #obtBar .jstage:hover{background:linear-gradient(180deg,#FFFFFF,#EAF2FA)}
:root[data-theme="light"] #obtBar .jstage .jn{background:#FFFFFF;border-color:#1B84B8;color:#0B3C5C;text-shadow:none;box-shadow:0 1px 4px rgba(23,37,64,.15)}
:root[data-theme="light"] #obtBar .jstage .jc{background:#FFF7E0;border-color:#C89B24;color:#7A5A10;text-shadow:none;box-shadow:0 1px 4px rgba(23,37,64,.12)}
:root[data-theme="light"] #obtBar .jstage .jg{background:#F2F7FC;border-color:rgba(11,114,168,.25);box-shadow:none;color:#0B72A8}
:root[data-theme="light"] #obtBar .jstage b{color:#0B3C5C;text-shadow:none}
:root[data-theme="light"] #obtBar .jstage span.jq{color:#4A7396}
:root[data-theme="light"] #obtBar .jstage::after{background:linear-gradient(180deg,rgba(11,114,168,.12),transparent)}
:root[data-theme="light"] #obtBar .jstage.seen{border-color:rgba(176,125,10,.45);box-shadow:0 2px 8px rgba(23,37,64,.08)}
:root[data-theme="light"] #obtBar .jstage.seen .jn{background:#FFF7E0;border-color:#C89B24;color:#7A5A10;text-shadow:none}
:root[data-theme="light"] #obtBar .jstage.seen b{color:#7A5A10;text-shadow:none}
:root[data-theme="light"] #obtBar .jstage.seen .jg{border-color:rgba(176,125,10,.35);color:#8A6A1D;box-shadow:none}
:root[data-theme="light"] #obtBar .jstage.seen::after{background:linear-gradient(180deg,rgba(176,125,10,.14),transparent)}
:root[data-theme="light"] #obtBar .jstage.on{background:linear-gradient(180deg,#FFFFFF,#E8F3FB);border-color:#1B84B8;box-shadow:0 6px 18px rgba(27,132,184,.28)}
:root[data-theme="light"] #obtBar .jstage.on b{color:#062B44}
:root[data-theme="light"] #obtBar .jstage.on span.jq{color:#0B72A8}
:root[data-theme="light"] #obtBar .jstage.on .jg{color:#062B44;border-color:rgba(27,132,184,.5);box-shadow:none}
:root[data-theme="light"] #obtBar .jstage.proc-green{border-color:rgba(21,128,61,.55);box-shadow:0 2px 10px rgba(21,128,61,.18)}
:root[data-theme="light"] #obtBar .jstage.proc-green .jn{border-color:#15803D;color:#0B5F2E;text-shadow:none}
:root[data-theme="light"] #obtBar .jstage.proc-red{border-color:rgba(200,45,38,.55);box-shadow:0 2px 10px rgba(200,45,38,.16)}
:root[data-theme="light"] #obtBar .jstage.proc-red .jn{border-color:#C82D26;color:#8F1D18;text-shadow:none}
:root[data-theme="light"] #obtBar .ub{color:#4A7396}
:root[data-theme="light"] #obtBar .ub .rg{background:radial-gradient(circle at 50% 42%,#FFFFFF,#EAF3FB 72%);border-color:rgba(11,114,168,.3);color:#0B72A8;box-shadow:0 1px 5px rgba(23,37,64,.12)}
:root[data-theme="light"] #obtBar .ub .lb{color:#4A7396}
:root[data-theme="light"] #obtBar .ub:hover .rg{box-shadow:0 2px 10px rgba(27,132,184,.3);color:#075A85}
:root[data-theme="light"] #obtBar .ub:hover .lb{color:#0B72A8}
:root[data-theme="light"] #obtBar .ub.go{background:#DFF5E7;border-color:#15803D;color:#0B5F2E;text-shadow:none;box-shadow:0 2px 10px rgba(21,128,61,.2)}
:root[data-theme="light"] #obtBar .ub.go:hover{background:#CBEEDA;color:#07461F;box-shadow:0 3px 14px rgba(21,128,61,.3)}
:root[data-theme="light"] #obtTip{background:#FFFFFF;border-color:rgba(11,114,168,.35);color:#4A7396;box-shadow:0 6px 18px rgba(23,37,64,.18)}
:root[data-theme="light"] #obtTip b{color:#0B3C5C}
:root[data-theme="light"] #obtTip i{color:#14263C}
:root[data-theme="light"] #obtTip span{color:#4A7396}
:root[data-theme="light"] #obtPow2 .sheet{background:#FFFFFF;border-color:rgba(11,114,168,.35);box-shadow:0 10px 26px rgba(23,37,64,.2)}
:root[data-theme="light"] #obtPow2 .prow{border-bottom-color:rgba(11,114,168,.12)}
:root[data-theme="light"] #obtPow2 .prow b{color:#0B3C5C;text-shadow:none}
:root[data-theme="light"] #obtPow2 .prow span{color:#4A7396}
:root[data-theme="light"] #obtPow2 .prow:hover{background:rgba(27,132,184,.07)}
:root[data-theme="light"] #obtPow2 .prow:hover b{color:#062B44}
:root[data-theme="light"] .obt-rail1{background:linear-gradient(180deg,#FFFFFF,#F0F5FB);border-right:1px solid rgba(11,114,168,.22)}
:root[data-theme="light"] .obt-rail1 .obt-ico{background:#F2F7FC;border-color:rgba(11,114,168,.28);color:#4A7396}
:root[data-theme="light"] .obt-rail1 .obt-ico:hover{background:#E8F1FA;border-color:rgba(27,132,184,.5);color:#0B72A8;box-shadow:0 1px 6px rgba(27,132,184,.2)}
:root[data-theme="light"] .obt-rail1 .obt-ico.on{background:#E4F0FA;border-color:#1B84B8;color:#075A85;box-shadow:0 1px 8px rgba(27,132,184,.28)}
:root[data-theme="light"] #obtSw::before{background:linear-gradient(90deg,transparent,rgba(11,114,168,.4),transparent)}
:root[data-theme="light"] #obtSw .swk{color:#4A7396}
:root[data-theme="light"] #obtSw .tg .nm{color:#4A7396}
:root[data-theme="light"] #obtSw .tg .sw{background:#EAF0F8;border-color:rgba(11,114,168,.35);box-shadow:inset 0 1px 3px rgba(23,37,64,.15)}
:root[data-theme="light"] #obtSw .tg .sw i{background:linear-gradient(180deg,#B9C9DC,#8FA6BE);box-shadow:0 1px 2px rgba(23,37,64,.25)}
:root[data-theme="light"] #obtSw .tg .st{color:#4A7396}
:root[data-theme="light"] #obtSw .tg.armed .sw{border-color:#1B84B8}
:root[data-theme="light"] #obtSw .tg.armed .sw i{background:linear-gradient(180deg,#3FA3D6,#1B6FA0);box-shadow:0 0 6px rgba(27,132,184,.5)}
:root[data-theme="light"] #obtSw .tg.armed .st{color:#0B72A8;text-shadow:none}
:root[data-theme="light"] #obtSw .tg.grn .sw{border-color:#15803D}
:root[data-theme="light"] #obtSw .tg.grn .sw i{background:linear-gradient(180deg,#3FBF77,#15803D);box-shadow:0 0 6px rgba(21,128,61,.5)}
:root[data-theme="light"] #obtSw .tg.grn .st{color:#0B5F2E;text-shadow:none}
:root[data-theme="light"] #obtSw .tg:hover .nm{color:#0B72A8}
:root[data-theme="light"] .obt-tilescol{background:linear-gradient(180deg,#FFFFFF,#F2F6FC);border-left:1px solid rgba(11,114,168,.22)}
:root[data-theme="light"] .obt-tile{border-bottom-color:rgba(11,114,168,.12)}
:root[data-theme="light"] .obt-tile .tl{color:#4A7396}
:root[data-theme="light"] .obt-tile .hl{color:#14263C}
:root[data-theme="light"] .obt-tile:hover{background:rgba(27,132,184,.06)}
:root[data-theme="light"] .obt-tile.on{background:rgba(27,132,184,.09);border-left-color:#1B84B8;box-shadow:none}
:root[data-theme="light"] .obt-tile .tc{color:#0B72A8;background:rgba(27,132,184,.12)}
:root[data-theme="light"] #obtRailFoot{border-top:1px solid rgba(11,114,168,.2)}
:root[data-theme="light"] #obtRailFoot .rsec{border-bottom-color:rgba(11,114,168,.12)}
:root[data-theme="light"] #obtRailFoot .rk{color:#4A7396}
:root[data-theme="light"] #obtRailFoot .rleg b{color:#14263C}
:root[data-theme="light"] #obtRailFoot .rleg i{color:#0B72A8}
:root[data-theme="light"] #obtRailFoot .rsum{color:#5A7590}
:root[data-theme="light"] #obtRailFoot .rsum b{color:#0B7A3E}
:root[data-theme="light"] #obtRailFoot .rsum .ropen{border-color:rgba(11,114,168,.35);color:#0B72A8}
:root[data-theme="light"] #obtRailFoot .rlink{color:#0B72A8}
:root[data-theme="light"] #obtRailFoot .one{border-bottom-color:rgba(11,114,168,.12)}
:root[data-theme="light"] #obtRailFoot .one:hover{background:rgba(27,132,184,.05)}
:root[data-theme="light"] #obtRailFoot .one .k{color:#0B7A3E}
:root[data-theme="light"] #obtRailFoot .one b{color:#14263C}
:root[data-theme="light"] #obtRailFoot .one i{color:#5A7590}
:root[data-theme="light"] #obtRailFoot .pal{color:#7A8CA6}
:root[data-theme="light"] #obtRailFoot .pal b{color:#0B72A8;border-color:rgba(11,114,168,.3)}
:root[data-theme="light"] #obtRailFoot .fwkey span{color:#5A7590}
:root[data-theme="light"] #obtRailFoot .fwnote{color:#7A8CA6}
:root[data-theme="light"] #obtRailFoot .fwm.l1{color:#7A8CA6}
:root[data-theme="light"] .obt-tilescol .obt-skel{background:rgba(27,132,184,.08)}
@media (prefers-color-scheme:light){
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar{background:linear-gradient(180deg,#FFFFFF,#F0F5FB);border-top:1px solid rgba(11,114,168,.3)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar::before{background:repeating-linear-gradient(180deg,rgba(11,114,168,.03) 0 1px,transparent 1px 4px)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar::after{background:linear-gradient(90deg,transparent,rgba(11,114,168,.45),transparent)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage{background:linear-gradient(180deg,#FFFFFF,#F4F8FD);border-color:rgba(11,114,168,.3);box-shadow:0 2px 8px rgba(23,37,64,.08);color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage:hover{background:linear-gradient(180deg,#FFFFFF,#EAF2FA)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage .jn{background:#FFFFFF;border-color:#1B84B8;color:#0B3C5C;text-shadow:none;box-shadow:0 1px 4px rgba(23,37,64,.15)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage .jc{background:#FFF7E0;border-color:#C89B24;color:#7A5A10;text-shadow:none;box-shadow:0 1px 4px rgba(23,37,64,.12)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage .jg{background:#F2F7FC;border-color:rgba(11,114,168,.25);box-shadow:none;color:#0B72A8}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage b{color:#0B3C5C;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage span.jq{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage::after{background:linear-gradient(180deg,rgba(11,114,168,.12),transparent)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.seen{border-color:rgba(176,125,10,.45);box-shadow:0 2px 8px rgba(23,37,64,.08)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.seen .jn{background:#FFF7E0;border-color:#C89B24;color:#7A5A10;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.seen b{color:#7A5A10;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.seen .jg{border-color:rgba(176,125,10,.35);color:#8A6A1D;box-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.seen::after{background:linear-gradient(180deg,rgba(176,125,10,.14),transparent)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.on{background:linear-gradient(180deg,#FFFFFF,#E8F3FB);border-color:#1B84B8;box-shadow:0 6px 18px rgba(27,132,184,.28)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.on b{color:#062B44}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.on span.jq{color:#0B72A8}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.on .jg{color:#062B44;border-color:rgba(27,132,184,.5);box-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.proc-green{border-color:rgba(21,128,61,.55);box-shadow:0 2px 10px rgba(21,128,61,.18)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.proc-green .jn{border-color:#15803D;color:#0B5F2E;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.proc-red{border-color:rgba(200,45,38,.55);box-shadow:0 2px 10px rgba(200,45,38,.16)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .jstage.proc-red .jn{border-color:#C82D26;color:#8F1D18;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .ub{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .ub .rg{background:radial-gradient(circle at 50% 42%,#FFFFFF,#EAF3FB 72%);border-color:rgba(11,114,168,.3);color:#0B72A8;box-shadow:0 1px 5px rgba(23,37,64,.12)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .ub .lb{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .ub:hover .rg{box-shadow:0 2px 10px rgba(27,132,184,.3);color:#075A85}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .ub:hover .lb{color:#0B72A8}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .ub.go{background:#DFF5E7;border-color:#15803D;color:#0B5F2E;text-shadow:none;box-shadow:0 2px 10px rgba(21,128,61,.2)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtBar .ub.go:hover{background:#CBEEDA;color:#07461F;box-shadow:0 3px 14px rgba(21,128,61,.3)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtTip{background:#FFFFFF;border-color:rgba(11,114,168,.35);color:#4A7396;box-shadow:0 6px 18px rgba(23,37,64,.18)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtTip b{color:#0B3C5C}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtTip i{color:#14263C}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtTip span{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtPow2 .sheet{background:#FFFFFF;border-color:rgba(11,114,168,.35);box-shadow:0 10px 26px rgba(23,37,64,.2)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtPow2 .prow{border-bottom-color:rgba(11,114,168,.12)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtPow2 .prow b{color:#0B3C5C;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtPow2 .prow span{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtPow2 .prow:hover{background:rgba(27,132,184,.07)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtPow2 .prow:hover b{color:#062B44}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-rail1{background:linear-gradient(180deg,#FFFFFF,#F0F5FB);border-right:1px solid rgba(11,114,168,.22)}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-rail1 .obt-ico{background:#F2F7FC;border-color:rgba(11,114,168,.28);color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-rail1 .obt-ico:hover{background:#E8F1FA;border-color:rgba(27,132,184,.5);color:#0B72A8;box-shadow:0 1px 6px rgba(27,132,184,.2)}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-rail1 .obt-ico.on{background:#E4F0FA;border-color:#1B84B8;color:#075A85;box-shadow:0 1px 8px rgba(27,132,184,.28)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw::before{background:linear-gradient(90deg,transparent,rgba(11,114,168,.4),transparent)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .swk{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg .nm{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg .sw{background:#EAF0F8;border-color:rgba(11,114,168,.35);box-shadow:inset 0 1px 3px rgba(23,37,64,.15)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg .sw i{background:linear-gradient(180deg,#B9C9DC,#8FA6BE);box-shadow:0 1px 2px rgba(23,37,64,.25)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg .st{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg.armed .sw{border-color:#1B84B8}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg.armed .sw i{background:linear-gradient(180deg,#3FA3D6,#1B6FA0);box-shadow:0 0 6px rgba(27,132,184,.5)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg.armed .st{color:#0B72A8;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg.grn .sw{border-color:#15803D}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg.grn .sw i{background:linear-gradient(180deg,#3FBF77,#15803D);box-shadow:0 0 6px rgba(21,128,61,.5)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg.grn .st{color:#0B5F2E;text-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtSw .tg:hover .nm{color:#0B72A8}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tilescol{background:linear-gradient(180deg,#FFFFFF,#F2F6FC);border-left:1px solid rgba(11,114,168,.22)}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tile{border-bottom-color:rgba(11,114,168,.12)}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tile .tl{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tile .hl{color:#14263C}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tile:hover{background:rgba(27,132,184,.06)}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tile.on{background:rgba(27,132,184,.09);border-left-color:#1B84B8;box-shadow:none}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tile .tc{color:#0B72A8;background:rgba(27,132,184,.12)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot{border-top:1px solid rgba(11,114,168,.2)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rsec{border-bottom-color:rgba(11,114,168,.12)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rk{color:#4A7396}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rleg b{color:#14263C}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rleg i{color:#0B72A8}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rsum{color:#5A7590}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rsum b{color:#0B7A3E}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rsum .ropen{border-color:rgba(11,114,168,.35);color:#0B72A8}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .rlink{color:#0B72A8}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .one{border-bottom-color:rgba(11,114,168,.12)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .one:hover{background:rgba(27,132,184,.05)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .one .k{color:#0B7A3E}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .one b{color:#14263C}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .one i{color:#5A7590}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .pal{color:#7A8CA6}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .pal b{color:#0B72A8;border-color:rgba(11,114,168,.3)}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .fwkey span{color:#5A7590}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .fwnote{color:#7A8CA6}
:root:not([data-theme="dark"]):not([data-theme="light"]) #obtRailFoot .fwm.l1{color:#7A8CA6}
:root:not([data-theme="dark"]):not([data-theme="light"]) .obt-tilescol .obt-skel{background:rgba(27,132,184,.08)}
}
/* ---- [v24] the conditions row in the band: what shapes tonight, one tap deep ---- */
.obt-wsid .obt-ctxrow{flex-basis:100%;display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding-top:7px;margin-top:2px;border-top:1px solid var(--line)}
.obt-ctxrow .ctxk{font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
.ctxc{appearance:none;display:inline-flex;align-items:baseline;gap:7px;border:1px solid var(--line);border-radius:6px;background:var(--panel-2);padding:5px 10px;cursor:pointer;max-width:230px}
.ctxc i{font-style:normal;font-family:var(--mono);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap}
.ctxc b{font-family:var(--mono);font-weight:700;font-size:.7rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ctxc:hover{border-color:#38C7FF}
.ctxc:hover i{color:var(--action-hi)}
@media (max-width:1149px){.ctxc b{max-width:120px}}
/* ---- [v25] the doubt list ---- */
.injwrap{display:flex;gap:16px;flex-wrap:wrap}
.injcol{flex:1;min-width:200px}
.injc{display:block;font-family:var(--ui);font-size:.78rem;color:var(--ink-dim);padding:4px 8px;border-left:3px solid var(--line);margin:0 0 4px;background:var(--panel-2)}
.injc b{color:var(--ink)}
.injc.que{border-left-color:#D99A06}
.injc.dbt{border-left-color:#E8702A}
.injc.out{border-left-color:#E8534A}
/* ---- [v26] spray fans ---- */
.sprcol{margin-bottom:10px}
.sprgrid{display:flex;flex-wrap:wrap;gap:10px}
.sprc{width:112px;text-align:center}
.sprc svg{width:84px;height:58px;display:block;margin:0 auto}
.sprc .sprt{font-family:var(--mono);font-size:9px;fill:var(--ink-dim)}
.sprc b{display:block;font-family:var(--ui);font-weight:700;font-size:.74rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sprc span{display:block;font-family:var(--ui);font-size:.62rem;color:var(--ink-faint);line-height:1.35}
/* ---- [v27] the flow: slim games rail + market strip + bet shelf (token-styled, both themes) ---- */
@media (min-width:1150px){
  .obt-gbar{display:none}
  .obt-deck{grid-template-columns:60px 116px 158px minmax(0,1fr) 218px}
  .obt-row.obt-gc .sp{display:none}
  .obt-row.obt-gc{padding:6px 7px}
  .obt-row.obt-gc .obt-gside .nm{font-size:.72rem}
  .obt-row.obt-gc .gval{font-size:.6rem}
}
@media (min-width:1150px) and (max-width:1439px){
  .obt-deck{grid-template-columns:60px 104px 148px minmax(0,1fr) 200px}
}
.obt-mkt2{display:flex;align-items:center;gap:7px;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--panel)}
.obt-mkt2 .mn{appearance:none;width:28px;height:28px;border:1px solid var(--line);border-radius:6px;background:var(--panel-2);color:var(--ink-dim);cursor:pointer;font-size:.85rem}
.obt-mkt2 .mn:hover{border-color:#38C7FF;color:var(--action-hi)}
.obt-mkt2 .obt-mksel.m2{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}
.obt-mkt2 .obt-mksel.m2::-webkit-scrollbar{display:none}
.obt-mkt2 .obt-mksel.m2 button{appearance:none;font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);border:1px solid var(--line);border-radius:6px;background:transparent;padding:6px 12px;cursor:pointer;white-space:nowrap}
.obt-mkt2 .obt-mksel.m2 button.on{color:#7FDCFF;background:#0C1E38;border-color:#38C7FF;text-shadow:0 0 8px rgba(56,199,255,.6)}
.obt-mkt2 .mh{margin-left:auto;font-family:var(--mono);font-size:.58rem;color:var(--ink-faint);white-space:nowrap}
.obt-mkt2 .mh b{border:1px solid var(--line);border-radius:3px;padding:0 4px;color:var(--ink-dim)}
.obt-shelf{display:flex;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--panel);overflow-x:auto;scrollbar-width:thin}
.shb{position:relative;appearance:none;flex:0 0 auto;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);padding:9px 13px;min-width:184px;cursor:pointer;text-align:left}
.shb img{width:26px;height:26px;border-radius:50%;object-fit:contain;background:var(--panel)}
.shb .ph2{width:26px;height:26px;border-radius:50%;background:var(--line);display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:700;font-size:.7rem;color:var(--ink-dim);flex:none}
.shb .tt{min-width:0}
.shb .tt b{display:block;font-family:var(--ui);font-weight:700;font-size:.8rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shb .tt i{display:block;font-style:normal;font-family:var(--mono);font-size:.6rem;color:var(--ink-faint);margin-top:1px}
.shb .pr{margin-left:auto;font-family:var(--mono);font-weight:700;font-size:.88rem;color:var(--action-hi);padding-left:8px}
.shb .bb2{position:absolute;top:-8px;right:8px;font-family:var(--mono);font-weight:700;font-size:.5rem;letter-spacing:.08em;color:#052E14;background:var(--model);border-radius:3px;padding:1px 5px}
.shb .slp2{font-family:var(--mono);font-weight:700;font-size:.6rem;letter-spacing:.05em;color:var(--model);border:1px solid var(--model);border-radius:4px;padding:4px 8px;margin-left:8px}
.shb:hover{border-color:var(--ink-faint)}
.shb.sel{border-color:#38C7FF;box-shadow:0 0 12px rgba(56,199,255,.35)}
.shf{position:relative;appearance:none;flex:0 0 auto;width:132px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);padding:10px 9px 8px;cursor:pointer;text-align:center}
.shf img{width:40px;height:40px;border-radius:50%;object-fit:cover;background:var(--panel);margin:0 auto 5px;display:block}
.shf .fph{width:40px;height:40px;border-radius:50%;background:var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:700;font-size:1rem;color:var(--ink-dim);margin:0 auto 5px}
.shf b{display:block;font-family:var(--ui);font-weight:700;font-size:.72rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shf i{display:block;font-style:normal;font-size:.62rem;color:var(--ink-dim);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shf s{display:block;text-decoration:none;font-family:var(--mono);font-size:.6rem;color:var(--model);margin-top:3px}
.shf .pr2{position:absolute;top:6px;right:7px;font-family:var(--mono);font-weight:700;font-size:.66rem;color:var(--action-hi)}
.shf:hover{border-color:var(--ink-faint)}
.shf.sel{border-color:#38C7FF;box-shadow:0 0 12px rgba(56,199,255,.35)}
.shmore{align-self:center;font-family:var(--mono);font-size:.6rem;color:var(--ink-faint);white-space:nowrap;line-height:1.5}

/* ===================== [v29] THE RESEARCH DESK — additive only, tokens only (themes for free) ===================== */
.obt-focus{display:flex;align-items:center;gap:6px;padding:6px 12px;border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap}
.obt-focus .fk{font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-right:4px}
.obt-focus .obt-fb{appearance:none;font-family:var(--mono);font-size:.64rem;color:var(--ink-dim);border:1px solid var(--line);border-radius:6px;background:transparent;padding:5px 10px;white-space:nowrap;cursor:pointer;max-width:290px;overflow:hidden;text-overflow:ellipsis}
.obt-focus .obt-fb i{font-style:normal;color:var(--action-hi);margin-left:4px}
.obt-focus .obt-fb.on{color:#7FDCFF;background:#0C1E38;border-color:#38C7FF;text-shadow:0 0 8px rgba(56,199,255,.5)}
.obt-focus .obt-fb.add{color:var(--ink-faint);border-style:dashed}
.obt-focus .obt-fb:hover{border-color:#38C7FF}
.obt-focus .fh{margin-left:auto;font-family:var(--mono);font-size:.56rem;color:var(--ink-faint);white-space:nowrap}
.gf-call .obt-callwho{font-family:var(--display);font-weight:800;font-size:1.28rem;letter-spacing:-.01em;color:var(--ink);margin:4px 0 8px;text-wrap:balance}
.obt-chips{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 8px}
.obt-chip{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);border-radius:4px;padding:3px 8px;color:var(--ink-dim)}
.obt-chip.hi{color:#7FDCFF;border-color:rgba(56,199,255,.55)}
.obt-chip.gp{color:var(--model);border-color:rgba(52,211,153,.55)}
.obt-callrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:6px 0 10px}
.obt-callpay{display:inline-flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.obt-callpay .big{font-family:var(--mono);font-weight:700;font-size:1.9rem;color:var(--model);letter-spacing:-.01em;line-height:1}
.obt-callpay .per{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint)}
.obt-callpay .cw{font-family:var(--mono);font-size:.7rem;color:var(--ink-dim)}
.obt-callrow .wtake{appearance:none;font-family:var(--mono);font-weight:700;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:#052E14;background:#22C55E;border:none;border-radius:6px;padding:9px 16px;cursor:pointer;box-shadow:0 0 14px rgba(34,197,94,.35)}
.obt-reason{font-size:.95rem;color:var(--ink);line-height:1.55;max-width:64ch;margin:0 0 10px}
.obt-weigh{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 10px}
.obt-weigh span{font-family:var(--mono);font-size:.64rem;color:var(--ink-dim);border:1px solid var(--line);border-radius:4px;padding:4px 9px;background:var(--panel-2)}
.obt-weigh span.note{border:none;background:none;color:var(--ink-faint);padding:0}
.obt-quiet{font-family:var(--mono);font-size:.68rem;color:var(--ink-dim);border-left:2px solid var(--line);padding:3px 10px;margin:0 0 8px;line-height:1.5}
.obt-quiet b{color:var(--ink)}
.obt-quiet.lock{border-color:var(--gold)}
.obt-unlock{color:var(--action-hi);text-decoration:none}
.obt-unlock:hover{text-decoration:underline}
.obt-facts{display:flex;flex-direction:column;gap:7px;margin:4px 0 10px}
.obt-fact{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:10px;align-items:start;padding:8px 10px;border:1px solid var(--line);background:var(--panel-2);border-radius:4px}
.obt-fact i.fwm{position:static;padding-top:2px}
.obt-fact span{font-size:.9rem;color:var(--ink);line-height:1.45}
.obt-fact b{font-family:var(--mono);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap;padding-top:4px;font-weight:600}
.obt-look{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:1px;background:var(--line);margin:0 0 8px}
.obt-look>div{background:var(--panel);min-width:0}
.obt-canvas{padding:0 12px 10px}
.obt-canvas .gcmh{margin-top:10px}
.obt-canvas svg.obt-oval{width:100%;height:auto;display:block;margin-top:4px}
.obt-bench{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px;font-family:var(--mono);font-size:.62rem;color:var(--ink-dim);line-height:1.5}
.obt-bench span{color:var(--ink-faint);text-transform:uppercase;letter-spacing:.08em;font-size:.56rem;align-self:center}
.obt-bench i{font-style:normal;color:var(--ink)}
.obt-cap{font-family:var(--mono);font-size:.64rem;color:var(--ink-faint);margin:6px 0 0;line-height:1.5}
.obt-aff{padding:12px 12px;display:flex;flex-direction:column;gap:8px}
.obt-affhd{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.obt-callchip{display:flex;justify-content:space-between;align-items:center;gap:8px;font-family:var(--mono);font-size:.64rem;color:var(--ink-dim);border:1px solid rgba(52,211,153,.4);border-radius:4px;padding:6px 9px;background:rgba(52,211,153,.06)}
.obt-callchip b{color:var(--model)}
.obt-callchip .wtake{appearance:none;font-family:var(--mono);font-weight:700;font-size:.58rem;letter-spacing:.06em;text-transform:uppercase;color:var(--model);background:transparent;border:1px solid var(--model);border-radius:4px;padding:4px 8px;cursor:pointer;white-space:nowrap}
.obt-co{border:1px solid var(--line);border-radius:4px;background:var(--panel-2);padding:8px 10px}
.obt-co.warn{border-left:3px solid var(--gold)}
.obt-co .t{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:3px;display:flex;justify-content:space-between}
.obt-co .t i.fwm{position:static}
.obt-co .n{font-family:var(--mono);font-size:.8rem;color:var(--ink);margin-bottom:3px;line-height:1.4}
.obt-co .n .v{color:var(--ink-faint);padding:0 4px}
.obt-co .s{font-size:.8rem;color:var(--ink-dim);line-height:1.45}
.obt-co .bet{margin-top:5px;display:flex;justify-content:flex-end}
.obt-co .bet .wtake{appearance:none;font-family:var(--mono);font-weight:700;font-size:.58rem;letter-spacing:.06em;text-transform:uppercase;color:var(--model);background:transparent;border:1px solid var(--model);border-radius:4px;padding:4px 8px;cursor:pointer}
.obt-qg{display:grid;grid-template-columns:104px repeat(4,1fr);gap:4px;margin:6px 0 4px}
.obt-qg .h{font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);text-align:center;padding:4px 0}
.obt-qg .h.on{color:#7FDCFF}
.obt-qg .tm{display:flex;align-items:center;font-weight:700;font-size:.82rem;padding:6px 4px;color:var(--ink)}
.obt-qg .c{border:1px solid var(--line);border-radius:4px;padding:8px 6px;text-align:center;background:var(--panel-2)}
.obt-qg .c b{display:block;font-family:var(--mono);font-size:1.1rem;color:var(--ink)}
.obt-qg .c i{display:block;font-style:normal;font-family:var(--mono);font-size:.58rem;color:var(--ink-faint);margin-top:2px}
.obt-qg .c.on{border-color:#38C7FF;background:#0C1E38}
.obt-qg .c.hot{box-shadow:inset 0 -3px 0 var(--model)}
.obt-qg .c.cold{box-shadow:inset 0 -3px 0 #E07070}
.obt-rr{display:grid;grid-template-columns:52px repeat(4,1fr) 76px;gap:6px;align-items:center;padding:6px 8px;border:1px solid var(--line);border-radius:4px;background:var(--panel-2);font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);margin:0 0 4px}
.obt-rr b{color:var(--ink)}
.obt-rr span.g{color:var(--model)}
.obt-rr span.r{color:#E07070}
.obt-rr em{font-style:normal;color:var(--ink-faint);font-size:.62rem;text-align:right}
.obt-rr.hd{background:transparent;border-color:transparent;font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);padding-bottom:2px}
.obt-rr.hd b{color:var(--ink-faint);font-weight:600}
.obt-rr.on{border-color:#38C7FF;background:#0C1E38}
.obt-avg{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px;margin:0 0 8px}
.obt-avg div{border:1px solid var(--line);border-radius:4px;background:var(--panel-2);padding:7px 9px}
.obt-avg i{display:block;font-style:normal;font-family:var(--mono);font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.obt-avg b{display:block;font-family:var(--mono);font-size:1.05rem;color:var(--ink)}
.obt-avg em{display:block;font-style:normal;font-family:var(--mono);font-size:.58rem;color:var(--ink-faint)}
.obt-ladder{display:flex;flex-direction:column;gap:6px;margin:4px 0 8px}
.obt-ladder .r{display:grid;grid-template-columns:minmax(0,1fr) 84px 110px;align-items:center;gap:10px;padding:6px 10px;border:1px solid var(--line);background:var(--panel-2);border-radius:4px;font-family:var(--mono);font-size:.76rem}
.obt-ladder .r.best{border-left:3px solid var(--model)}
.obt-ladder .r span{color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-ladder .r b{color:var(--ink);text-align:right}
.obt-ladder .r em{font-style:normal;text-align:right;color:var(--ink-faint);font-size:.64rem}
.obt-ladder .r.best em{color:var(--model)}
.obt-ladder .obt-act{appearance:none;background:none;border:1px solid var(--line);border-radius:4px;color:var(--action-hi);font-family:var(--mono);font-size:.6rem;padding:2px 6px;cursor:pointer}
.obt-more{margin:8px 0 0;font-family:var(--mono);font-size:.7rem;color:var(--ink-dim)}
.obt-more summary{cursor:pointer;color:var(--action-hi);padding:6px 0}
#obtRailFoot .rlink.obt-act{cursor:pointer}
@media (max-width:1420px){.obt-look{grid-template-columns:minmax(0,1fr)}}
@media (max-width:1149px){.obt-focus{display:none}.obt-look{grid-template-columns:minmax(0,1fr)}}
/* [v29] the matchup modal — one v one */
.obt-mu .hd{display:flex;justify-content:space-between;gap:10px;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px}
.obt-mu .hd .a{color:var(--action-hi)}.obt-mu .hd .b{color:var(--gold)}
.obt-mu .r{display:grid;grid-template-columns:120px 44px minmax(0,1fr) 44px;gap:8px;align-items:center;padding:5px 0;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.76rem;color:var(--ink-dim)}
.obt-mu .r b{color:var(--action-hi);text-align:right}.obt-mu .r b.b{color:var(--gold);text-align:left}
.obt-mu .bars{display:flex;flex-direction:column;gap:2px}
.obt-mu .bars i{display:block;height:6px;background:var(--action-hi);border-radius:2px;opacity:.85}
.obt-mu .bars i.b{background:var(--gold)}
.obt-mu .meet{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;padding:5px 0;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.72rem;color:var(--ink-dim)}
.obt-mu .meet i{font-style:normal;color:var(--ink-faint)}.obt-mu .meet b{color:var(--action-hi);font-weight:600}.obt-mu .meet b.b{color:var(--gold)}
.obt-mu .bets{display:flex;flex-direction:column;gap:6px;margin:4px 0 8px}
.obt-mu .obt-addprop.mu{appearance:none;text-align:left;font-family:var(--mono);font-size:.7rem;color:var(--model);background:transparent;border:1px solid rgba(52,211,153,.5);border-radius:6px;padding:8px 10px;cursor:pointer}
.obt-mu .obt-addprop.mu:hover{border-color:var(--model)}
/* [v29c] order lists (MLB, cricket) + asymmetric matchup columns */
.obt-orders{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.obt-order .oh{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 6px}
.obt-pl.or{appearance:none;width:100%;display:grid;grid-template-columns:22px minmax(0,1fr);gap:2px 8px;align-items:center;text-align:left;border:1px solid var(--line);border-radius:4px;background:var(--panel-2);padding:5px 8px;margin:0 0 4px;cursor:pointer;color:var(--ink)}
.obt-pl.or i{grid-row:1 / 3;font-style:normal;font-family:var(--mono);font-size:.62rem;color:var(--ink-faint);text-align:center}
.obt-pl.or b{font-family:var(--ui);font-weight:700;font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-pl.or span{font-family:var(--mono);font-size:.6rem;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-pl.or.sp{border-left:3px solid var(--action-hi)}
.obt-pl.or.me{border-color:var(--model);box-shadow:0 0 10px rgba(52,211,153,.25)}
.obt-pl.or:hover{border-color:#38C7FF}
.obt-mu .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.obt-mu .r1{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.74rem;color:var(--ink-dim)}
.obt-mu .r1 b{color:var(--action-hi)}.obt-mu .r1 b.b{color:var(--gold)}
@media (max-width:640px){.obt-orders{grid-template-columns:1fr}}
/* [v29e] LOOK cards own the stage: no companion track when the numbers column is the companion */
.obt-ws.solo{grid-template-columns:minmax(0,1fr)}
/* [v29f] the picture owns the width; the numbers column becomes a row of cards beneath it */
.obt-look{display:block;background:var(--panel);margin:0 0 8px}
.obt-look>div{background:var(--panel)}
.obt-aff{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;padding:10px 12px 12px;border-top:1px solid var(--line)}
.obt-affhd,.obt-callchip{grid-column:1 / -1}
.obt-affhd{margin-bottom:-2px}
@media (max-width:1149px){.obt-aff{grid-template-columns:1fr}}
/* [v29m] phones: the field scrolls sideways at a readable width; bench tags */
@media (max-width:899px){.obt-canvas{overflow-x:auto;-webkit-overflow-scrolling:touch}.obt-canvas svg.obt-oval{min-width:560px}}
.obt-bench b.in{font-weight:700;color:var(--model);font-style:normal}
.obt-bench b.out{font-weight:700;color:#E07070}
.obt-bench b.emg{font-weight:600;color:var(--ink-faint)}
/* ===================== [v30] THE ONE-SCREEN STAGE — builder row + six-cell bento (additive, tokens only) ===================== */
.obt-build{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:6px 12px;border-bottom:1px solid var(--line);background:var(--panel)}
.obt-build .bs{display:flex;flex-direction:column;gap:3px;min-width:0}
.obt-build .bk{font-family:var(--mono);font-size:.5rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
.obt-build .bl{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;padding-bottom:1px}
.obt-build .bl::-webkit-scrollbar{display:none}
.obt-build .obt-mksel.m2{display:flex;gap:4px}
.obt-build .obt-mksel.m2 button{appearance:none;font-family:var(--mono);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);border:1px solid var(--line);border-radius:6px;background:transparent;padding:6px 10px;cursor:pointer;white-space:nowrap}
.obt-build .obt-mksel.m2 button.on{color:#7FDCFF;background:#0C1E38;border-color:#38C7FF;text-shadow:0 0 8px rgba(56,199,255,.6)}
.obt-lc,.obt-sc,.obt-pc{appearance:none;font-family:var(--mono);font-size:.64rem;color:var(--ink-dim);border:1px solid var(--line);border-radius:6px;background:transparent;padding:5px 9px;white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.obt-lc i,.obt-sc i,.obt-pc i{font-style:normal;color:var(--action-hi);font-weight:700}
.obt-lc.on,.obt-sc.on,.obt-pc.on{color:#7FDCFF;background:#0C1E38;border-color:#38C7FF}
.obt-lc.main::after{content:"main";font-size:.48rem;letter-spacing:.08em;color:var(--ink-faint);margin-left:2px}
.obt-lc:hover,.obt-sc:hover,.obt-pc:hover{border-color:#38C7FF}
.obt-sc img{width:18px;height:18px;border-radius:50%;object-fit:contain;background:var(--panel-2)}
.obt-pc .fc{width:20px;height:20px;border-radius:50%;background:var(--line);display:inline-flex;align-items:center;justify-content:center;overflow:hidden;font-size:.6rem;font-weight:700;color:var(--ink-dim)}
.obt-pc .fc img{width:100%;height:100%;object-fit:cover;display:block}
.obt-pc.more{color:var(--ink-faint);border-style:dashed}
.obt-build .pay2{display:flex;align-items:center;gap:10px;white-space:nowrap}
.obt-build .pay{display:inline-flex;align-items:baseline;gap:8px}
.obt-build .pay b{font-family:var(--mono);font-weight:700;font-size:1.15rem;color:var(--model)}
.obt-build .pay i{font-style:normal;font-family:var(--mono);font-size:.6rem;color:var(--ink-faint)}
/* the house-style slip control everywhere but the bar */
.obt-build .wtake,.obt-mp .wtake,.obt-addprop.wtake,.obt-cos .wtake,.obt-co .bet .wtake{appearance:none;font-family:var(--mono);font-weight:700;font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:#7FDCFF;border:1px solid #38C7FF;border-radius:6px;background:#0C1E38;padding:7px 11px;cursor:pointer;white-space:nowrap;box-shadow:none}
.obt-addprop.wtake{display:inline-block;width:auto}
.wtake.ok,.obt-addprop.ok{color:var(--model)!important;border-color:var(--model)!important;background:rgba(52,211,153,.08)!important}
.wtake.sm{padding:3px 7px;font-size:.54rem}
/* the bento */
.obt-bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:minmax(0,11fr) minmax(0,9fr);gap:1px;background:var(--line);padding:1px;height:600px}
.obt-bento .bc{background:var(--panel);min-width:0;min-height:0;overflow:hidden;display:flex;flex-direction:column;padding:8px 12px 10px}
.obt-bento .bc.span2{grid-column:span 2}
.obt-bento .bc.pic{background:linear-gradient(180deg,rgba(23,68,105,.22) 0,var(--panel) 60%)}
.obt-bento .bh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px;flex:none}
.obt-bento .bh .lab{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--model);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-bento .bh i{font-style:normal;font-family:var(--mono);font-size:.54rem;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-bento .bb{flex:1;min-height:0;overflow:auto;scrollbar-width:thin}
.obt-bento .bc.pic .bb svg.obt-oval{width:auto;max-width:100%;height:100%;max-height:100%;display:block;margin:0 auto}
.obt-bento .obt-cap,.obt-bento .cap{font-family:var(--mono);font-size:.56rem;color:var(--ink-faint);line-height:1.45;margin-top:6px}
.obt-bento .obt-bench{font-size:.58rem}
.obt-bento .obt-cos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;height:100%}
.obt-bento .obt-co{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.obt-bento .obt-co .s{font-size:.74rem}
.obt-bento .obt-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;height:100%;min-height:0}
.obt-bento .obt-two>div{min-width:0;min-height:0;overflow:auto}
.obt-bento .obt-two .obt-cos{grid-template-columns:1fr}
.obt-bento .obt-facts{gap:5px}.obt-bento .obt-fact{padding:6px 8px}.obt-bento .obt-fact span{font-size:.8rem}
.obt-bento .gf-call .obt-callwho{font-size:1.1rem}.obt-bento .obt-callpay .big{font-size:1.5rem}.obt-bento .obt-reason{font-size:.86rem;margin-bottom:6px}
.obt-empty2{font-family:var(--mono);font-size:.7rem;color:var(--ink-faint);padding:10px 0}
/* matchup */
.obt-mp .faces{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
.obt-mp .faces .p{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;cursor:pointer;min-width:0}
.obt-mp .faces .p b{font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.obt-mp .faces .p i{font-style:normal;font-family:var(--mono);font-size:.54rem;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.obt-mp .ph{width:56px;height:56px;border-radius:50%;background:var(--panel-2);border:2px solid var(--line);overflow:hidden;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:700;color:var(--ink-dim)}
.obt-mp .ph img{width:100%;height:100%;object-fit:cover;display:block}
.obt-mp .faces .p.me .ph{border-color:var(--model);box-shadow:0 0 12px rgba(52,211,153,.35)}
.obt-mp .vs{display:flex;flex-direction:column;gap:3px}
.obt-mp .vs .r{display:grid;grid-template-columns:34px minmax(0,1fr) 34px;gap:6px;align-items:center;font-family:var(--mono);font-size:.66rem;margin-top:9px}
.obt-mp .vs .r b{color:var(--model);text-align:right}.obt-mp .vs .r b.b{color:var(--gold);text-align:left}
.obt-mp .vs .bars{display:flex;flex-direction:column;gap:2px;position:relative}
.obt-mp .vs .bars i{display:block;height:5px;border-radius:2px;background:var(--model);opacity:.9}.obt-mp .vs .bars i.b{background:var(--gold)}
.obt-mp .vs .bars span{position:absolute;left:0;right:0;top:-10px;text-align:center;font-size:.5rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* line panel */
.obt-lp{display:flex;flex-direction:column;gap:4px}
.obt-lp .r{appearance:none;width:100%;text-align:left;display:grid;grid-template-columns:44px minmax(0,1fr) 46px 40px;gap:8px;align-items:center;font-family:var(--mono);font-size:.66rem;color:var(--ink-dim);border:1px solid var(--line);border-radius:6px;padding:5px 8px;background:var(--panel-2);cursor:pointer}
.obt-lp .r b{color:var(--ink)}.obt-lp .r em{font-style:normal;color:var(--action-hi);text-align:right;font-weight:700}
.obt-lp .r s{text-decoration:none;font-size:.54rem;color:var(--ink-faint);text-align:right}
.obt-lp .r .hit{height:6px;border-radius:3px;background:rgba(255,255,255,.13);overflow:hidden}.obt-lp .r .hit i{display:block;height:100%;background:var(--model)}
.obt-lp .r.on{border-color:#38C7FF;background:#0C1E38}
.obt-lp .r:hover{border-color:#38C7FF}
/* evidence bars, conditions, faces grid, books */
.obt-ev .r{display:grid;grid-template-columns:76px minmax(0,1fr) 64px;gap:8px;align-items:center;font-family:var(--mono);font-size:.6rem;color:var(--ink-dim);padding:4px 0}
.obt-ev .r b{color:var(--ink);text-align:right;white-space:nowrap}.obt-ev svg{width:100%;height:12px;display:block}
.obt-conds{display:flex;flex-direction:column;gap:4px}
.obt-conds .cd{display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px;font-size:.74rem;color:var(--ink-faint);padding:5px 8px;border:1px solid var(--line);border-radius:6px;background:var(--panel-2)}
.obt-conds .cd i{font-style:normal;font-family:var(--mono);font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;padding-top:2px}
.obt-conds .cd.on{color:var(--ink);border-color:rgba(52,211,153,.4)}.obt-conds .cd.on i{color:var(--model)}
.obt-fg{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px}
.obt-fg .fg{appearance:none;text-align:center;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);padding:8px 6px 6px;cursor:pointer;color:var(--ink);min-width:0;position:relative}
.obt-fg .fg .ph{width:38px;height:38px;border-radius:50%;background:var(--line);margin:0 auto 4px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:700;color:var(--ink-dim);overflow:hidden}
.obt-fg .fg .ph img{width:100%;height:100%;object-fit:cover;display:block}
.obt-fg .fg b{display:block;font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-fg .fg i{display:block;font-style:normal;font-size:.58rem;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.obt-fg .fg s{display:block;text-decoration:none;font-family:var(--mono);font-size:.54rem;color:var(--model)}
.obt-fg .fg em{position:absolute;top:5px;right:6px;font-style:normal;font-family:var(--mono);font-size:.6rem;font-weight:700;color:var(--action-hi)}
.obt-fg .fg.on{border-color:#38C7FF;background:#0C1E38}
.obt-bk .r{display:grid;grid-template-columns:150px minmax(0,1fr) 64px 46px;gap:8px;align-items:center;font-family:var(--mono);font-size:.64rem;color:var(--ink-dim);padding:4px 0;border-bottom:1px solid var(--line)}
.obt-bk .r span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.obt-bk .r b{color:var(--ink);text-align:right}.obt-bk .r em{font-style:normal;color:var(--ink-faint);text-align:right}
.obt-bk .r .bar{height:6px;border-radius:3px;background:rgba(255,255,255,.13);overflow:hidden}.obt-bk .r .bar i{display:block;height:100%;background:var(--action-hi)}
.obt-bk .r.best b{color:var(--model)}.obt-bk .r.best .bar i{background:var(--model)}
.obt-bk .r.my{color:#7FDCFF}.obt-bk .r.my .bar i{background:#38C7FF}
@media (max-width:1149px){.obt-build{grid-template-columns:1fr;gap:8px}.obt-bento{display:block;height:auto!important}.obt-bento .bc{margin-bottom:8px;overflow:visible}.obt-bento .bb{overflow:visible}.obt-bento .obt-cos{grid-template-columns:1fr;height:auto}.obt-bento .obt-two{grid-template-columns:1fr;height:auto}}
/* [v30] picture tabs: the picture owns two columns and both rows; matchup + line stack on the right */
.obt-bento.tall{grid-template-rows:minmax(0,1fr) minmax(0,1fr)}
.obt-bento.tall .bc.a{grid-column:1/3;grid-row:1/3}
.obt-bento.tall .bc.b{grid-column:3;grid-row:1}
.obt-bento.tall .bc.c{grid-column:3;grid-row:2}
.obt-bento .bb.split{display:flex;flex-direction:column;overflow:hidden}
.obt-bento .pic-main{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column}
.obt-bento .pic-main>svg.obt-oval,.obt-bento .pic-main>.obt-fieldwrap{flex:1;min-height:0}
.obt-bento .pic-main svg.obt-oval{height:100%;width:auto;max-width:100%;margin:0 auto;display:block}
.obt-bento .pic-foot{flex:none;max-height:40%;overflow:auto;border-top:1px solid var(--line);padding-top:6px;margin-top:6px}
.obt-bento .pic-foot .bh{margin-bottom:4px}
.obt-bento .pic-foot .obt-cos{height:auto}
.obt-bento .pic-foot .obt-co .s{font-size:.7rem}
@media (max-width:1149px){.obt-bento.tall .bc.a,.obt-bento.tall .bc.b,.obt-bento.tall .bc.c{grid-column:auto;grid-row:auto}.obt-bento .bb.split{overflow:visible}.obt-bento .pic-foot{max-height:none}}
.obt-althead{display:flex;flex-direction:column;gap:2px;padding:6px 8px;margin-bottom:6px;border:1px solid rgba(56,199,255,.45);border-radius:6px;background:#0C1E38}
.obt-althead b{font-size:.8rem;color:#7FDCFF}.obt-althead span{font-family:var(--mono);font-size:.62rem;color:var(--ink)}.obt-althead i{font-style:normal;font-family:var(--mono);font-size:.54rem;color:var(--ink-faint)}
/* [v30 exchanges] prediction-market venues badged wherever a book is named */
.obt-tbl .rg.ex,.obt-bk .r em.ex{display:inline-block;margin-left:6px;padding:1px 5px;border:1px solid #38C7FF;border-radius:4px;font-family:var(--mono);font-size:.5rem;letter-spacing:.1em;text-transform:uppercase;color:#7FDCFF;font-style:normal;vertical-align:middle}
.obt-exline{font-size:.78rem;line-height:1.45;color:var(--ink);padding:7px 9px;margin-bottom:8px;border:1px solid rgba(56,199,255,.35);border-radius:6px;background:rgba(12,30,56,.55)}
.obt-exline b{color:#7FDCFF}.obt-exline i{display:block;font-style:normal;font-family:var(--mono);font-size:.56rem;color:var(--ink-faint);margin-top:3px}
/* ===================== [v30 light] every hard-coded dark chip/badge gets a light twin (same palette as #obtBar light) ===================== */
:root[data-theme="light"] .obt-seg button.on,:root[data-theme="light"] .obt-mkt2 .obt-mksel.m2 button.on,:root[data-theme="light"] .obt-build .obt-mksel.m2 button.on,:root[data-theme="light"] .obt-focus .obt-fb.on,:root[data-theme="light"] .obt-lc.on,:root[data-theme="light"] .obt-sc.on,:root[data-theme="light"] .obt-pc.on,:root[data-theme="light"] .obt-lp .r.on,:root[data-theme="light"] .obt-fg .fg.on,:root[data-theme="light"] .obt-qg .c.on,:root[data-theme="light"] .obt-rr.on{background:#E4F0FA;border-color:#1B84B8;color:#075A85;text-shadow:none}
:root[data-theme="light"] .obt-lp .r.on b,:root[data-theme="light"] .obt-fg .fg.on b,:root[data-theme="light"] .obt-fg .fg.on i,:root[data-theme="light"] .obt-lp .r.on s{color:#0B3C5C}
:root[data-theme="light"] .obt-chip.hi,:root[data-theme="light"] .obt-qg .h.on,:root[data-theme="light"] #obtRailFoot .rlink,:root[data-theme="light"] #obtRailFoot .rsum .ropen,:root[data-theme="light"] #obtRailFoot .pal b,:root[data-theme="light"] .obt-bk .r.my{color:#0B72A8;border-color:rgba(11,114,168,.45)}
:root[data-theme="light"] .obt-bk .r.my .bar i{background:#1B84B8}
:root[data-theme="light"] .obt-build .wtake,:root[data-theme="light"] .obt-mp .wtake,:root[data-theme="light"] .obt-addprop.wtake,:root[data-theme="light"] .obt-cos .wtake,:root[data-theme="light"] .obt-co .bet .wtake{background:#FFFFFF;border-color:#1B84B8;color:#075A85}
:root[data-theme="light"] .wtake.ok,:root[data-theme="light"] .obt-addprop.ok{background:#E9F8F0!important;border-color:#1E9E5A!important;color:#166B3D!important}
:root[data-theme="light"] .obt-tile.on{background:#E4F0FA;border-left-color:#1B84B8;box-shadow:none}
:root[data-theme="light"] .obt-althead,:root[data-theme="light"] .obt-exline{background:#F2F7FC;border-color:rgba(11,114,168,.35)}
:root[data-theme="light"] .obt-althead b,:root[data-theme="light"] .obt-exline b{color:#0B3C5C}
:root[data-theme="light"] .obt-tbl .rg.ex,:root[data-theme="light"] .obt-bk .r em.ex{color:#0B72A8;border-color:#1B84B8;background:#FFFFFF}
:root[data-theme="light"] .obt-lp .r .hit,:root[data-theme="light"] .obt-bk .r .bar{background:rgba(11,114,168,.12)}
:root[data-theme="light"] .obt-bento .bc.pic{background:linear-gradient(180deg,rgba(11,114,168,.07) 0,var(--panel) 60%)}
:root[data-theme="light"] .obt-bento{background:rgba(11,114,168,.18)}
:root[data-theme="light"] .obt-lc:hover,:root[data-theme="light"] .obt-sc:hover,:root[data-theme="light"] .obt-pc:hover,:root[data-theme="light"] .obt-lp .r:hover{border-color:#1B84B8}
:root[data-theme="light"] .obt-pc .fc,:root[data-theme="light"] .obt-fg .fg .ph{background:#E4F0FA;color:#075A85}
/* [v30 exchanges] the crowd in words: board tick, builder chip, three numbers, sure things */
.obt-crowdtick{display:inline-block;margin:0 0 4px 8px;padding:1px 7px;border:1px solid rgba(56,199,255,.5);border-radius:10px;font-family:var(--mono);font-size:.52rem;letter-spacing:.08em;text-transform:uppercase;color:#7FDCFF;vertical-align:middle;white-space:nowrap}
.obt-crowd{display:inline-flex;align-items:baseline;gap:5px;margin-left:10px;font-family:var(--mono);font-size:.58rem;color:var(--ink-faint)}.obt-crowd b{color:#7FDCFF;font-size:.72rem}
.obt-three{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap;margin:8px 0 6px}
.obt-three span{display:flex;flex-direction:column;gap:2px}.obt-three i{font-style:normal;font-family:var(--mono);font-size:.5rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.obt-three b{font-family:var(--mono);font-size:1rem;color:var(--ink)}.obt-three span:nth-child(2) b{color:#7FDCFF}.obt-three span:first-child b{color:var(--model)}
.obt-three em{flex-basis:100%;font-style:normal;font-family:var(--mono);font-size:.54rem;color:var(--ink-faint)}
.obt-arb{font-size:.8rem;line-height:1.5;color:var(--ink);padding:8px 10px;margin:6px 0 8px;border:1px solid rgba(52,211,153,.5);border-radius:6px;background:rgba(52,211,153,.07)}
.obt-arb b{color:var(--model)}.obt-arb i{display:block;font-style:normal;font-family:var(--mono);font-size:.54rem;color:var(--ink-faint);margin-top:3px}
.obt-exline.soft{border-style:dashed}
.obt-lp .r .hit{position:relative}.obt-lp .r .hit u.exn{position:absolute;right:0;top:-11px;text-decoration:none;font-family:var(--mono);font-size:.48rem;letter-spacing:.06em;color:#7FDCFF;white-space:nowrap}
:root[data-theme="light"] .obt-crowdtick,:root[data-theme="light"] .obt-crowd b,:root[data-theme="light"] .obt-three span:nth-child(2) b,:root[data-theme="light"] .obt-lp .r .hit u.exn{color:#0B72A8;border-color:rgba(11,114,168,.5)}
:root[data-theme="light"] .obt-arb{background:#E9F8F0;border-color:#1E9E5A}:root[data-theme="light"] .obt-arb b{color:#166B3D}

/* ---- [v31] six-stop console: the situation grid, roll-up, settle line, pairs ---- */
.obt-sg{margin-top:8px}
.obt-sg .sgr{display:flex;align-items:center;gap:9px;padding:3px 0;font-variant-numeric:tabular-nums}
.obt-sg .sgr i{font-style:normal;font-family:var(--mono);font-size:.56rem;letter-spacing:.1em;color:var(--ink-faint);flex:0 0 92px}
.obt-sg .sgr em{font-style:normal;flex:0 0 26px;font-family:var(--mono);font-size:.6rem;letter-spacing:1px;color:var(--gold);text-align:left}
.obt-sg .sgr .sb{flex:1;height:7px;background:rgba(70,140,255,.09);overflow:hidden}
.obt-sg .sgr .sb b{display:block;height:100%;background:var(--model);opacity:.85}
.obt-sg .sgr s{text-decoration:none;flex:0 0 92px;font-family:var(--mono);font-size:.66rem;color:var(--ink);text-align:right}
.obt-sg .sga{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px;padding-top:7px;border-top:1px solid var(--line)}
.obt-sg .avg i{font-style:normal;display:block;font-family:var(--mono);font-size:.5rem;letter-spacing:.12em;color:var(--ink-faint)}
.obt-sg .avg b{font-family:var(--mono);font-weight:700;font-size:.9rem;color:var(--ink)}
.obt-sg .avg.hot b{color:var(--model)}
.obt-rollup{font-family:var(--mono);font-size:.66rem;letter-spacing:.03em;color:var(--model);padding:4px 0 7px}
.obt-rollup.w{color:var(--gold)}
.obt-settle{font-family:var(--ui);font-size:.74rem;color:var(--ink-dim);line-height:1.5;padding:2px 0 8px}
.obt-settle b{color:var(--ink)}
.obt-pairs{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-top:9px;padding:7px 10px;border:1px solid var(--line);border-left:2px solid var(--model);background:var(--panel-2)}
.obt-pairs i{font-style:normal;font-family:var(--mono);font-size:.52rem;letter-spacing:.12em;color:var(--ink-faint)}
.obt-pairs b{font-family:var(--ui);font-weight:600;font-size:.76rem;color:var(--ink)}
.obt-pairs s{text-decoration:none;font-family:var(--mono);font-size:.62rem;color:var(--ink-dim)}
.obt-pairs .padd{appearance:none;margin-left:auto;border:1px solid var(--model);border-radius:0;background:none;color:var(--model);font-family:var(--mono);font-size:.6rem;letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;cursor:pointer}
.obt-pairs .padd:hover{background:var(--model-dim)}
:root[data-theme="light"] .obt-sg .sgr .sb{background:rgba(29,78,216,.1)}
:root[data-theme="light"] .obt-sg .sgr .sb b{background:var(--model)}
:root[data-theme="light"] .obt-rollup{color:var(--model)}
:root[data-theme="light"] .obt-rollup.w{color:var(--gold)}
:root[data-theme="light"] .obt-pairs{border-left-color:var(--model)}

/* ==== [v37] call line + match pills + picker wells + YOUR BET ==== */
/* the one-line call replacing THE READ hero */
.obt-callline{display:inline-flex;align-items:center;gap:9px;margin-left:auto;white-space:nowrap;font-size:.8rem;color:var(--ink-dim);min-width:0;overflow:hidden}
.obt-callline .st{font-style:normal;color:var(--gold)}
.obt-callline .ck{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;color:var(--ink-faint);text-transform:uppercase}
.obt-callline b{color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis}
.obt-callline .pr{font-family:var(--mono);font-weight:700;color:var(--model)}
.obt-callline .cw{font-family:var(--mono);font-size:.62rem;color:var(--action-hi)}
.obt-callline .wtake.mini{font-family:var(--mono);font-size:.56rem;letter-spacing:.08em;color:var(--gold);background:none;border:1px solid rgba(245,179,1,.5);border-radius:3px;padding:4px 9px;cursor:pointer;box-shadow:none}
/* match pills */
.obt-ctxrow.v37{display:flex;gap:7px;flex-wrap:wrap;align-items:center;flex-basis:100%;margin-top:9px}
.obt-ctxrow.v37 .ctxk{font-family:var(--mono);font-size:.54rem;letter-spacing:.14em;color:var(--ink-faint);text-transform:uppercase;margin-right:2px}
.obt-ctxrow.v37 .ctxc{display:inline-flex;align-items:center;gap:7px;background:var(--panel-2);border:1px solid var(--line);border-radius:99px;padding:5px 12px;font-size:.7rem;color:var(--ink);white-space:nowrap;cursor:pointer;box-shadow:none}
.obt-ctxrow.v37 .ctxc i{font-style:normal;font-family:var(--mono);font-size:.56rem;letter-spacing:.08em;color:var(--ink-faint);text-transform:uppercase}
.obt-ctxrow.v37 .ctxc b{font-weight:600;color:var(--ink);font-size:.7rem}
.obt-ctxrow.v37 .ctxc:hover{border-color:var(--action-hi)}
/* the wells */
.obt-build.v37{display:block !important;container-type:inline-size}
.obt-build.v37 .wells{display:grid;grid-template-columns:max-content max-content max-content minmax(0,1fr);gap:11px;align-items:stretch}
.obt-build.v37 .well{background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:10px 13px 12px;display:flex;flex-direction:column;gap:9px;min-width:0;box-sizing:border-box}
.obt-build.v37 .well.hot{border-color:var(--action-hi);box-shadow:0 0 18px rgba(127,220,255,.07)}
.obt-build.v37 .well.bmkt{max-width:360px}
.obt-build.v37 .wt{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.56rem;letter-spacing:.13em;color:var(--ink-dim);text-transform:uppercase}
.obt-build.v37 .wt .n{width:16px;height:16px;border-radius:50%;background:var(--panel);border:1px solid var(--line);color:var(--action-hi);font-size:.56rem;line-height:15px;text-align:center;flex:0 0 auto}
.obt-build.v37 .well.done .wt .n{background:var(--model);border-color:var(--model);color:#06251a}
.obt-build.v37 .wt .dt{color:var(--model);margin-left:auto;font-style:normal;font-size:.7rem}
.obt-build.v37 .obt-mksel{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.obt-build.v37 .bl{display:flex;flex-wrap:wrap;gap:7px}
.obt-build.v37 .obt-mksel button,.obt-build.v37 .obt-sc,.obt-build.v37 .obt-pc{background:var(--panel);border:1px solid var(--line);border-radius:5px;font-weight:600;font-size:.8rem;padding:8px 13px}
.obt-build.v37 .obt-mksel button.on,.obt-build.v37 .obt-sc.on,.obt-build.v37 .obt-pc.on{background:rgba(127,220,255,.16);border-color:var(--action-hi);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(127,220,255,.5)}
.obt-build.v37 .obt-sc.on::before,.obt-build.v37 .obt-mksel button.on::before,.obt-build.v37 .obt-pc.on::before{content:"\2713 ";color:var(--action-hi);font-weight:800}
.obt-build.v37 .bl2{max-width:100%;overflow-x:auto;display:flex;flex-wrap:nowrap;gap:7px;padding-bottom:2px;scrollbar-width:thin;align-items:center}
.obt-build .obt-lc.lc2{display:inline-flex;flex-direction:column;align-items:center;padding:6px 12px 5px;flex:0 0 auto}
.obt-lc.lc2 .n{font-family:var(--mono);font-weight:700;white-space:nowrap;font-size:.8rem}
.obt-lc.lc2 .n i{font-style:normal;color:var(--model);font-weight:500;margin-left:6px}
.obt-lc.lc2 .w{font-family:var(--ui);font-size:.6rem;color:var(--ink-faint);margin-top:2px;white-space:nowrap}
.obt-lc.lc2.on .w{color:var(--action-hi)}
.obt-lc.lc2 .w .mn,.obt-lc.lc2 .w .st{color:var(--gold);font-weight:600;font-style:normal}
.obt-lc.lc2.star{border-color:rgba(245,179,1,.5)}
.obt-lselw{display:inline-block}
.obt-lsel{appearance:none;-webkit-appearance:none;background:rgba(127,220,255,.14) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' stroke='%237fdcff' stroke-width='1.6' fill='none'/></svg>") no-repeat right 12px center;border:1px solid var(--action-hi);border-radius:5px;color:var(--ink);font-family:var(--mono);font-size:.78rem;font-weight:700;padding:10px 34px 10px 13px;cursor:pointer;max-width:340px;min-width:210px;box-shadow:inset 0 0 0 1px rgba(127,220,255,.35)}
.obt-lsel:focus{outline:none;box-shadow:inset 0 0 0 1px rgba(127,220,255,.6)}
.lselcap{display:block;font-family:var(--mono);font-size:.5rem;letter-spacing:.1em;color:var(--ink-faint);margin-top:5px;text-transform:uppercase}
/* conditions: dashed = information, not choices */
.obt-build.v37 .condw{border:1px dashed var(--line);border-radius:6px;padding:10px 13px;display:flex;flex-direction:column;gap:5px;min-width:0;box-sizing:border-box}
.obt-build.v37 .condw .wt{margin-bottom:1px}
.obt-build.v37 .condw .crow{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:.71rem;color:var(--ink-dim);white-space:nowrap;overflow:hidden;width:100%}
.obt-build.v37 .condw .crow span{overflow:hidden;text-overflow:ellipsis}
.obt-build.v37 .condw .crow em{font-style:normal;font-family:var(--mono);font-size:.54rem;letter-spacing:.06em;flex:0 0 auto}
.obt-build.v37 .condw .crow em.good{color:var(--model)}
.obt-build.v37 .condw .crow em.watch{color:var(--gold)}
.obt-build.v37 .condw .cfoot{margin-top:auto;padding-top:5px;border-top:1px solid var(--line)}
.obt-build.v37 .condw .obt-rollup{padding:0;font-size:.56rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* YOUR BET line */
.obt-ybet{display:flex;align-items:center;gap:13px;margin-top:11px;padding-top:10px;border-top:1px solid var(--line);min-width:0}
.obt-ybet .lbl{font-family:var(--mono);font-size:.54rem;letter-spacing:.14em;color:var(--ink-faint);text-transform:uppercase;flex:0 0 auto}
.obt-ybet b{font-size:.95rem;font-weight:700;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.obt-ybet .pr{font-family:var(--mono);font-weight:700;color:var(--model);flex:0 0 auto}
.obt-ybet .pf{font-family:var(--mono);font-size:.6rem;color:var(--ink-dim);flex:0 0 auto}
.obt-ybet .wtake{margin-left:auto;font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:#06251a;background:var(--model);border:0;border-radius:5px;padding:9px 16px;cursor:pointer;font-weight:700;box-shadow:0 0 14px rgba(52,211,153,.25);flex:0 0 auto}
.obt-mksel .xsep{width:1px;height:16px;background:var(--line);display:inline-block;margin:0 5px;vertical-align:middle}
/* conditions always rides the flexible last track (empty max-content tracks collapse to 0) */
.obt-build.v37 .wells .bcond{grid-column:4}
/* width behaviour: never cover, always stack cleanly */
@container (max-width:1150px){
  .obt-build.v37 .wells{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .obt-build.v37 .well.bmkt{max-width:none}
  .obt-build.v37 .wells .bcond{grid-column:auto}
  .obt-build.v37 .wells > .bcond:nth-child(3){grid-column:1 / -1}
}
@container (max-width:800px){
  .obt-build.v37 .wells{grid-template-columns:minmax(0,1fr)}
  .obt-build.v37 .wells .bcond,.obt-build.v37 .wells > .bcond:nth-child(3){grid-column:auto}
  .obt-ybet{flex-wrap:wrap}
}
/* no container-query support: fall back to safe wrapping */
@supports not (container-type: inline-size){
  .obt-build.v37 .wells{display:flex;flex-wrap:wrap}
  .obt-build.v37 .well,.obt-build.v37 .condw{flex:1 1 260px}
}

/* ==== [v38] the one-strip picker: market > selection > line + slip, console owns the rest ==== */
.obt-build.v38{display:block;margin:3px 0 10px}
.obt-build.v38 .strip{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;min-width:0}
.obt-ddw{display:inline-flex;flex-direction:column;gap:3px;min-width:0}
.obt-ddw>i{font-style:normal;font-family:var(--mono);font-size:.52rem;letter-spacing:.13em;color:var(--ink-faint);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.obt-ddw select{appearance:none;-webkit-appearance:none;background:var(--panel-2) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' stroke='%237fdcff' stroke-width='1.6' fill='none'/></svg>") no-repeat right 10px center;border:1px solid var(--line);border-radius:5px;color:var(--ink);font-family:var(--mono);font-size:.72rem;font-weight:700;padding:8px 28px 8px 11px;cursor:pointer;max-width:300px;min-width:0}
.obt-ddw select:focus{outline:none;border-color:var(--action-hi)}
.obt-ddw.hot select{border-color:var(--action-hi);box-shadow:0 0 14px rgba(127,220,255,.08)}
.obt-ddw.lit select{background-color:rgba(127,220,255,.12);border-color:var(--action-hi);box-shadow:inset 0 0 0 1px rgba(127,220,255,.3)}
.obt-build.v38 .obt-lsel{min-width:180px;max-width:340px;box-shadow:none;padding:8px 28px 8px 11px;font-size:.72rem}
.obt-build.v38 .obt-one{display:inline-flex;align-items:center;font-family:var(--mono);font-size:.72rem;font-weight:700;border:1px solid var(--line);border-radius:5px;padding:8px 11px;color:var(--ink);white-space:nowrap}
.obt-build.v38 .wtake{align-self:flex-end;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:#06251a;background:var(--model);border:0;border-radius:5px;padding:9px 15px;cursor:pointer;font-weight:700;box-shadow:0 0 14px rgba(52,211,153,.25)}
@media (max-width:800px){ .obt-build.v38 .obt-lsel{max-width:100%} .obt-ddw select{max-width:100%} }

/* ==== [v39] the compact top: teams + picker on ONE line, call + pills on ONE clipped micro-row ==== */
.obt-wsid.v39{display:block;padding:7px 12px 8px}
.obt-wsid.v39 .hr1{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.obt-wsid.v39 .tm img,.obt-wsid.v39 .tm .ph{width:24px;height:24px}
.obt-wsid.v39 .tm b{font-size:.92rem}
.obt-wsid.v39 .mid{font-size:.62rem}
.obt-wsid.v39 .mid .sc{font-size:.95rem}
/* the strip dissolves into the header row */
.obt-wsid.v39 .hr1 .obt-build.v38{display:contents}
.obt-wsid.v39 .hr1 .obt-build.v38 .strip{display:contents}
.obt-wsid.v39 .strip label.obt-ddw:first-child{margin-left:auto}
.obt-wsid.v39 .obt-ddw{flex-direction:row}
.obt-wsid.v39 .obt-ddw select{padding:6px 26px 6px 10px;font-size:.68rem;max-width:270px}
.obt-wsid.v39 .obt-build.v38 .obt-lsel{min-width:150px;max-width:260px;padding:6px 26px 6px 10px;font-size:.68rem}
.obt-wsid.v39 .obt-build.v38 .obt-one{padding:6px 10px;font-size:.68rem}
.obt-wsid.v39 .obt-build.v38 .wtake{align-self:center;padding:7px 13px}
/* the micro-row: never taller than one line, pills fill the remainder and clip */
.obt-wsid.v39 .hr2{display:flex;align-items:center;gap:12px;margin-top:6px;flex-wrap:nowrap;overflow:hidden;min-width:0;white-space:nowrap}
.obt-wsid.v39 .hr2 .obt-callline{margin-left:0;flex:0 0 auto;overflow:visible}
.obt-wsid.v39 .hr2 .obt-ctxrow.v37{flex:1 1 auto;flex-basis:auto;margin-top:0;flex-wrap:nowrap;overflow:hidden;justify-content:flex-end;min-width:0}
.obt-wsid.v39 .hr2 .obt-ctxrow.v37 .ctxc{padding:3px 10px;font-size:.66rem;flex:0 1 auto;overflow:hidden;text-overflow:ellipsis}
.obt-wsid.v39 .hr2 .obt-ctxrow.v37 .ctxk{display:none}
@media (max-width:800px){ .obt-wsid.v39 .hr2{flex-wrap:wrap;white-space:normal} }

/* ==== [v40] the crumb row goes on the desktop game view -- its height goes to the console ==== */
@media (min-width:900px){
  .obt-stagecol:has(.obt-wsid.v39) .obt-stagehead{display:none}
}
/* [v40] modern load-in: every select / re-select fades the console organs in, softly staggered */
@keyframes obtIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.obt-stage .bc{animation:obtIn .26s ease both}
.obt-stage .bc:nth-child(2){animation-delay:.035s}
.obt-stage .bc:nth-child(3){animation-delay:.07s}
.obt-stage .bc:nth-child(4){animation-delay:.105s}
.obt-stage .bc:nth-child(5){animation-delay:.14s}
.obt-stage .bc:nth-child(n+6){animation-delay:.17s}
@media (prefers-reduced-motion:reduce){ .obt-stage .bc{animation:none} }

/* [v41] the grid block riding other stops */
.obt-gridf{margin-top:11px;padding-top:10px;border-top:1px solid var(--line-soft, var(--line))}

/* [contrast audit 2026-09-13 · WP-CONTRAST · round-9 item 16] The site faint ink is 3.09-3.50:1 on the odds page in
   both themes - under the 4.5:1 floor WCAG 2.2 AA 1.4.3 asks for small text. Same hue, one step stronger: the two
   values the console has run since the 14:20 respin. Measured after: dark 4.61-5.17:1, light 4.80-5.31:1. */
#obtStage,#obtBar,#obtRail,#obtRows,#obtDays,.obt-top,.obt-ghead,.obt-gamehead,.obt-gch,.hr1,.hr2{--ink-faint:#78879E}
html[data-theme="light"] #obtStage,html[data-theme="light"] #obtBar,html[data-theme="light"] #obtRail,html[data-theme="light"] #obtRows,html[data-theme="light"] #obtDays,html[data-theme="light"] .obt-top,html[data-theme="light"] .obt-ghead,html[data-theme="light"] .obt-gamehead,html[data-theme="light"] .obt-gch,html[data-theme="light"] .hr1,html[data-theme="light"] .hr2{--ink-faint:#606C80}
/* the rail's book-name glyph paints a shade under the token in some leagues (#445062 on #15171f = 2.19:1) */
#obtRows i{color:var(--ink-faint)}

/* [contrast audit 2026-09-13 · WP-CONTRAST] every bottom-bar tile glyph paints half its shapes at fill-opacity .5:
   #404B5C on #080F19 = 2.18:1 dark, #A9B2BE on #F2F7FC = 2.00:1 light (SC 1.4.11 asks 3:1). The colour is already the
   right ink - only the 50% has to go. Measured after: 5.26:1 dark, 4.93:1 light. Prefer dropping the .5 at source. */
#obtBar svg rect,#obtBar svg circle,#obtBar svg path,#obtBar svg polygon{fill-opacity:1}

/* [contrast audit 2026-09-13 · WP-CONTRAST] the light theme's green prices measure 3.15-3.49:1 (floor 4.5:1) and the
   green chip block 2.16:1 (floor 3:1). One step darker, light theme only: measured after 4.87-5.38:1. */
html[data-theme="light"] #obtStage,html[data-theme="light"] #obtBar,html[data-theme="light"] #obtRail,html[data-theme="light"] #obtRows,html[data-theme="light"] #obtTiles,html[data-theme="light"] .obt-top,html[data-theme="light"] .obt-ghead,html[data-theme="light"] .hr1,html[data-theme="light"] .hr2{--model:#0A7A4C}

/* [contrast audit 2026-09-13 · WP-CONTRAST] light-theme gold: "TAKE IT", the kick-off time and the star measure
   3.86:1 on white (floor 4.5:1). Measured after: 5.53:1. Light theme only. */
html[data-theme="light"] .obt-ghead,html[data-theme="light"] .obt-gamehead,html[data-theme="light"] .hr1,html[data-theme="light"] .hr2,html[data-theme="light"] #obtStage{--gold:#8A6110}

/* [contrast audit 2026-09-13 · WP-CONTRAST] the "In play" chip is #ECC1C1 on #C43D3D = 3.18:1 (floor 4.5:1).
   White on the same red: 5.14:1. */
.obt-ghead .live,.obt-gamehead .live,.hr1 .live,.hr2 .live{color:#FFFFFF}

/* ===== BB_TOPBAR_V49 [2026-09-13, WP-TOPBAR] the approved top bar =====================================================
   48px, one hairline under it, three zones, one typeface (var(--ui)), two inks (var(--ink) / var(--ink-faint)), hairlines
   only. No pills, no gold, no gradients, no coloured tags, no mono caps, no avatars. Values are the owner-approved mock's.
   TONIGHT'S ONE THING leaves the chrome and becomes the first row of the board (.obt-heromini, now at every width) and the
   sentence on the empty stage (.bbt-stageone).                                                                        */

.obt-top{height:48px!important;min-height:0!important;padding:0 18px!important;display:flex!important;align-items:center!important;gap:0!important;background:var(--page,#0f1118)!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important;font-family:var(--ui)!important}
html[data-theme="light"] .obt-top{--ink:#0f1118;--ink-faint:#606C80;--page:#ffffff;--line:#e3e7ee;background:#fff!important}
#obtTopKeep[hidden],.obt-top [hidden]{display:none!important}

/* LEFT: the wordmark, then the modes as plain tabs */
.obt-top .obt-home{font-family:var(--ui)!important;font-weight:700!important;font-size:15px!important;letter-spacing:0!important;color:var(--ink)!important;margin-right:28px;white-space:nowrap;gap:0!important}
.obt-top .obt-home img,.obt-top .obt-home i{display:none!important}
.obt-top .obt-home span{display:inline!important}
.obt-top .tb-modes{display:flex;gap:22px;align-items:center;height:48px}
.obt-top .tb-modes a,.obt-top .tb-modes button{appearance:none;background:none;border:0;padding:0;margin:0;font-family:var(--ui);font-size:13px;color:var(--ink-faint);text-decoration:none;height:48px;display:flex;align-items:center;border-bottom:2px solid transparent;white-space:nowrap;cursor:pointer}
.obt-top .tb-modes a:hover,.obt-top .tb-modes button:hover{color:var(--ink)}
.obt-top .tb-modes a.on,.obt-top .tb-modes button.on{color:var(--ink);font-weight:600;border-bottom-color:var(--ink)}

/* CENTRE: the day */
.obt-top .tb-day{appearance:none;background:none;border:0;padding:0;margin:0 auto;font-family:var(--ui);font-size:13px;color:var(--ink);font-weight:500;display:flex;align-items:center;gap:6px;white-space:nowrap;cursor:pointer}
.obt-top .tb-day i{font-style:normal;color:var(--ink-faint);font-size:10px}

/* RIGHT */
.obt-top .tb-right{display:flex;align-items:center;gap:22px;white-space:nowrap;margin-left:auto}
/* inline-flex makes every child a flex item, so the word gap is set here, not by the collapsed whitespace */
.obt-top .tb-it{appearance:none;background:none;border:0;padding:0;margin:0;font-family:var(--ui);font-size:12.5px;color:var(--ink-faint);text-decoration:none;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;cursor:pointer}
.obt-top .tb-it b{color:var(--ink);font-weight:600}
.obt-top .tb-it:hover{color:var(--ink)}
.obt-top .tb-it svg{width:15px;height:15px;stroke:var(--ink-faint);fill:none;stroke-width:1.6;flex:0 0 auto}
.obt-top .tb-fbtn{appearance:none;background:none;border:0;padding:0;margin:0;font-family:var(--ui);font-size:12.5px;color:var(--ink-faint);display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.obt-top .tb-fbtn:hover{color:var(--ink)}
.obt-top .tb-fbtn svg{width:15px;height:15px;stroke:var(--ink-faint);fill:none;stroke-width:1.6}
.obt-top .tb-find .tb-fw b{border:1px solid var(--line);padding:0 5px;font-weight:500;margin-left:6px;color:var(--ink-faint)}
.obt-top .tb-find #obtSearch{display:none}
.obt-top .tb-find.open #obtSearch{display:block;width:220px;appearance:none;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;outline:none;height:26px;padding:0 2px;margin-left:8px;font-family:var(--ui);font-size:13px;color:var(--ink)}
.obt-top .tb-find.open .tb-fw{display:none}
/* the freshness line speaks only when the prices are stale */
.obt-top .obt-stamp{font-family:var(--ui)!important;font-size:12.5px!important;color:var(--ink-faint)!important;gap:0!important}
.obt-top .obt-stamp .obt-dot{display:none!important}
.obt-top .obt-stamp[hidden]{display:none!important}
/* initials: a hairline square, never an image */
.obt-top .tb-ini{appearance:none;background:none;width:26px;height:26px;padding:0;border:1px solid var(--line);border-radius:0;display:grid;place-items:center;font-family:var(--ui);font-size:11px;font-weight:600;color:var(--ink);cursor:pointer}
.obt-top .tb-ini.word{width:auto;padding:0 9px;font-weight:500;color:var(--ink-faint)}
.obt-top .tb-ini:hover{color:var(--ink);border-color:var(--ink-faint)}

/* the menus the bar opens: plain ink on the page ground, one hairline */
.tb-menu{position:fixed;z-index:80;min-width:190px;background:var(--page,#0f1118);border:1px solid var(--line);padding:5px 0;font-family:var(--ui);box-shadow:none}
html[data-theme="light"] .tb-menu{--page:#ffffff;--line:#e3e7ee;background:#fff}
.tb-menu button{display:block;width:100%;text-align:left;appearance:none;background:none;border:0;padding:8px 14px;font-family:var(--ui);font-size:13px;color:var(--ink-faint);cursor:pointer;white-space:nowrap}
.tb-menu button:hover{color:var(--ink)}
.tb-menu button.on{color:var(--ink);font-weight:600}

/* TONIGHT'S ONE THING, in the page: the first row of the board */
.obt-heromini{display:block!important;margin:0!important;padding:11px 14px!important;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;background:none!important;font-family:var(--ui)!important;font-size:13.5px!important;line-height:1.55!important;color:var(--ink-faint)!important;cursor:pointer}
.obt-heromini .cap{display:none!important}
.obt-heromini b{color:var(--ink)!important;font-weight:600}
.obt-heromini .k{color:var(--ink);font-weight:600}
.obt-heromini .r{color:var(--ink);text-decoration:underline;text-underline-offset:2px;margin-left:4px;white-space:nowrap}
.obt-heromini[hidden]{display:none!important}

/* the same sentence, large, on the stage before a game is picked */
.bbt-stageone{padding:40px 34px;max-width:640px;font-family:var(--ui)}
.bbt-stageone p{margin:0;font-size:24px;line-height:1.42;color:var(--ink-faint);font-weight:400}
.bbt-stageone p b{color:var(--ink);font-weight:600}
.bbt-stageone .r{appearance:none;background:none;border:0;padding:0;margin-top:18px;font-family:var(--ui);font-size:15px;color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* the phone: wordmark, Find, the slip count, the initials. The modes fold into the initials menu. */
/* [integrator 2026-09-14, BB_INTEGR_V57] 699 -> 899: the phone top bar now switches where isDesk() and the scene engine switch, killing the 700-899 half-state */
@media (max-width:899px){
  .obt-top{height:48px!important;padding:0 14px!important}
  .obt-top .obt-home{margin-right:auto;font-size:14px!important}
  .obt-top .tb-modes,.obt-top .tb-day,.obt-top .tb-apps,.obt-top .tb-month,.obt-top .obt-stamp{display:none!important}
  .obt-top .tb-right{gap:16px}
  .obt-top .tb-find .tb-fw{display:none}
  .bbt-stageone{padding:26px 16px}
  .bbt-stageone p{font-size:19px}
}
/* =====================================================================================================================
   BB_BOTTOM_V50 [2026-09-13 · WP-BOTTOM] THE BOTTOM OF THE READ, as the owner approved it.
   One typeface (var(--ui)), two inks (var(--ink) / var(--ink-faint)), hairlines (var(--line)). No pills, no gold, no
   gradients, no coloured tags, no mono caps, no avatars. The five question tiles are untouched: everything here styles
   the new utility cluster (.bf), the one verb (.bk), the phone bar and the two sheets those taps open.
   ===================================================================================================================== */

/* ---- the five things about this bet: a glyph over a short label, the number in ink ---- */
#obtBar .bf {
    appearance: none; flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 4px; padding: 0 13px; height: 60px; min-width: 74px; background: transparent; border: 0;
    border-left: 1px solid var(--line); border-radius: 0; color: var(--ink-faint); font-family: var(--ui);
    font-size: 10.5px; line-height: 1.25; letter-spacing: 0; text-transform: none; white-space: nowrap; cursor: pointer;
}
#obtBar .bf svg { width: 18px; height: 18px; display: block; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#obtBar .bf .lb { display: block; max-width: 108px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; font-family: var(--ui); font-size: 10.5px; }
#obtBar .bf b { font-weight: 600; font-size: 10.5px; color: var(--ink); }
#obtBar .bf:hover { color: var(--ink); background: transparent; }
#obtBar .bf:active { transform: scale(.96); }
#obtBar .bf:focus-visible { outline: 1px solid var(--ink); outline-offset: -2px; }

/* ---- ONE VERB, ONE PLACE ---- */
#obtBar .bk {
    appearance: none; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
    margin: 12px 2px 12px 14px; padding: 0 18px; height: 36px; border: 0; border-radius: 0;
    background: var(--ink); color: var(--page, #0f1118); font-family: var(--ui); font-size: 13px; font-weight: 600;
    letter-spacing: 0; text-transform: none; white-space: nowrap; cursor: pointer;
}
#obtBar .bk:hover { opacity: .88; }
#obtBar .bk:active { transform: scale(.98); }
#obtBar .bk:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
html[data-theme="light"] #obtBar .bk { color: #fff; }
html[data-theme="light"] #obtBar { --page: #ffffff; }

/* ---- the bar is the read's chrome at every width (the v8 rule hid it below 1150). It belongs to the READ: on the
       board, and whenever the host hides it, it is gone - a forced display must never outrank that. ---- */
@media (max-width: 1149px) { #obtBar { display: flex !important; } }
#obtBar[hidden] { display: none !important; }
/* data-scr only leaves "board" on a phone (a desktop keeps it while a game is open), so this stays inside the phone
   query: there the bar is fixed to the screen and must not sit under the board. */
@media (max-width: 899px) { #obtApp[data-scr="board"] #obtBar { display: none !important; } }

/* ---- phone: the five questions stay, the five things collapse into a More sheet, Back it is a full-width block on
       the bottom edge. Below 900px the scene engine does not mark the app .r9-game, so every v8/v9 gradient, glow,
       rounded corner and coloured state on the bar is put back to the house style right here. ---- */
@media (max-width: 899px) {
    #obtBar {
        position: fixed !important; left: 0; right: 0; bottom: 0; z-index: 60; display: flex !important; flex-wrap: wrap !important;
        align-items: stretch !important; gap: 0 !important; padding: 0 0 env(safe-area-inset-bottom, 0px) !important;
        background: var(--panel) !important; background-image: none !important; border: 0 !important;
        border-top: 1px solid var(--line) !important; box-shadow: none !important; overflow: visible !important; transform: none !important;
    }
    #obtBar::before, #obtBar::after { display: none !important; content: none !important; }
    #obtBar .slot { display: none !important; }
    #obtBar .jstage,
    #obtBar .jstage.on, #obtBar .jstage.seen, #obtBar .jstage.cast,
    #obtBar .jstage.proc-green, #obtBar .jstage.proc-red, #obtBar .jstage.proc-gold, #obtBar .jstage.proc-blue, #obtBar .jstage.pinned {
        position: relative !important; flex: 1 1 0 !important; min-width: 0 !important; max-width: none !important;
        height: auto !important; padding: 9px 4px 8px !important; margin: 0 !important; display: flex !important;
        flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 3px !important;
        background: transparent !important; background-image: none !important; border: 0 !important;
        border-right: 1px solid var(--line) !important; border-top: 2px solid transparent !important; border-radius: 0 !important;
        box-shadow: none !important; text-shadow: none !important; transform: none !important; animation: none !important;
        color: var(--ink-faint) !important; font-family: var(--ui) !important; text-align: center !important;
    }
    #obtBar .jstage::before, #obtBar .jstage::after { display: none !important; content: none !important; }
    #obtBar .jstage:last-of-type { border-right: 0 !important; }
    #obtBar .jstage .jn, #obtBar .jstage .jc, #obtBar .jstage .jq { display: none !important; }
    #obtBar .jstage .jg, #obtBar .jstage.on .jg, #obtBar .jstage.seen .jg {
        position: static !important; grid-row: auto; grid-column: auto; transform: none !important; width: 20px !important;
        height: 20px !important; margin: 0 !important; padding: 0 !important; display: block !important; opacity: 1 !important;
        background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: inherit !important;
    }
    #obtBar .jstage .jg svg { width: 20px !important; height: 20px !important; display: block !important; }
    #obtBar .jstage b, #obtBar .jstage.on b, #obtBar .jstage.seen b {
        grid-column: auto; font-family: var(--ui) !important; font-weight: 500 !important; font-size: 10.5px !important;
        color: inherit !important; text-shadow: none !important; letter-spacing: 0 !important; text-transform: none !important;
        max-width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
    }
    #obtBar .jstage.on { color: var(--ink) !important; border-top-color: var(--ink) !important; }
    #obtBar .jstage.on b { font-weight: 600 !important; }
    /* the cluster's children become the bar's own children, so Back it can wrap to its own full-width row */
    #obtBar .baru { display: contents !important; margin: 0 !important; border: 0 !important; }
    #obtBar .bf.bfmore { flex: 0 0 auto; height: auto; min-width: 62px; padding: 9px 12px 8px; gap: 3px; border-left: 1px solid var(--line); }
    #obtBar .bf.bfmore svg { width: 20px; height: 20px; }
    #obtBar .bk { flex: 1 0 100%; order: 9; margin: 0; height: 48px; border-top: 1px solid var(--line); font-size: 14px; }
    .obt-app .obt-stage { padding-bottom: 124px; }
    .obt-app .obt-tiles { padding-bottom: 124px; }
    #obtFab { bottom: 122px; }
    .obt-slip { bottom: 112px; }
}

/* ---- "Do it 100 times": one sentence, in counts and dollars ---- */
.bbhx .gcmh, .bbsheet .gcmh { font-family: var(--ui); font-size: .78rem; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-faint); margin: 0 0 6px; }
.bbhx .gcmn, .bbsheet .gcmn { font-family: var(--ui); }
.bbhx { min-width: 280px; max-width: 460px; }
.bbhx .bbh1 { font-family: var(--ui); font-size: 1rem; line-height: 1.5; color: var(--ink); margin: 6px 0 0; }
.bbhx .bbh1 b { font-weight: 600; color: var(--ink); }

/* ---- the phone More sheet: the same five things as rows ---- */
.bbsheet { min-width: 260px; max-width: 460px; }
.bbsheet .bbrow {
    appearance: none; display: flex; width: 100%; align-items: center; gap: 12px; text-align: left;
    background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 13px 2px;
    color: var(--ink-faint); font-family: var(--ui); font-size: .88rem; line-height: 1.4; cursor: pointer;
}
.bbsheet .bbrow:first-of-type { border-top: 0; }
.bbsheet .bbrow svg { flex: 0 0 20px; width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.bbsheet .bbrow b { display: block; font-weight: 600; color: var(--ink); }
.bbsheet .bbrow i { display: block; font-style: normal; color: var(--ink-faint); font-size: .8rem; margin-top: 2px; }
.bbsheet .bbrow:hover { color: var(--ink); }

/* 30_phone.css — [WP-M1, 2026-09-14] BB_PHONE_V55 · THE PHONE HEAD.
   MOBILE_OVERHAUL_SPEC.md §3.1: the phone gets its own head — one line of teams + a countdown, one 48px line that says the bet
   in words and what $10 gets, and an "our call" line only when the call is a different bet from the one in focus. The desktop
   head (the two-row .hr1/.hr2 band with the three <select>s, OUR CALL, the context chips and the venue sentence) is untouched.

   ⛔ EVERY rule in this file sits inside @media (max-width:899px). The desktop head must be byte-identical after this block —
   a rule outside the media query would change 1600px too. 899 is the one phone token (spec D13).

   Design law: one typeface var(--ui), two inks var(--ink) / var(--ink-faint), hairlines var(--line). No gradients, no pills,
   no gold, no coloured tags, no mono caps, no rounded card stacks, no avatars.
   ICP law: the head names ONE bet, in words, with dollars — never a percentage, never edge/EV/CLV/ROI/vig/implied/steam. */

@media (max-width:899px){

  /* --- the back row goes, but only once the phone head has actually rendered ---------------------------------------
     The desktop already hides .obt-stagehead when the v39 band is on screen (host css :1693 `@media (min-width:900px)`).
     The phone head carries its own back arrow, so the row is duplication — but if phoneHead() ever returns nothing and the
     old band renders instead, the reader must keep a way back to the board. :has() makes the hide conditional on the new
     head being there, which is strictly safer than the blanket hide the spec asked for. */
  .obt-stagecol:has(.obt-wsid.phh) .obt-stagehead{display:none}

  /* --- the head itself ---------------------------------------------------------------------------------------------
     Full-bleed: .obt-stage has padding:12px on a phone (host css :319), so the head pulls out of it and puts its own 12px
     back, giving one hairline that runs the whole width. Heights: row A 32 + row B 48 + row C 24 + 4 pad + 1 rule = 109px
     measured at 390px, against a 112px budget (spec §3). */
  .obt-stage .obt-wsid.phh{display:block;border:0;border-bottom:1px solid var(--line);background:var(--panel);
    margin:-12px -12px 10px;padding:0 12px 4px;font-family:var(--ui);font-variant-numeric:tabular-nums}
  .obt-stage .obt-wsid.phh,.obt-stage .obt-wsid.phh *{box-sizing:border-box;font-family:var(--ui)}

  /* row A — back · crests · teams · when it starts */
  .obt-stage .phh-a{display:flex;align-items:center;gap:8px;height:32px;min-width:0}
  /* 44x44 (WCAG 2.5.5 / Apple HIG) inside a 32px row: the row's height is fixed, so the extra 12px of hit area overflows
     invisibly above and below the arrow instead of making the head taller. */
  .obt-stage .phh-back{appearance:none;border:0;background:none;color:var(--ink-faint);font-size:1.25rem;line-height:1;
    display:flex;align-items:center;justify-content:flex-start;
    width:44px;height:44px;margin:-6px 0 -6px -12px;padding:0 0 0 8px;cursor:pointer;flex:0 0 auto}
  .obt-stage .phh-crs{display:flex;align-items:center;gap:3px;flex:0 0 auto}
  .obt-stage .phh-cr{width:16px;height:16px;object-fit:contain}
  .obt-stage .phh-teams{flex:1 1 auto;min-width:0;font-size:.94rem;font-weight:600;color:var(--ink);line-height:1.2}
  .obt-stage .phh-when{flex:0 0 auto;font-size:.8rem;font-weight:400;color:var(--ink-faint);line-height:1.2}

  /* row B — THE BET. The whole row is the tap target (48px, WCAG 2.5.5 / Apple HIG 44pt): it opens the "Change the bet"
     sheet WP-M2 builds next wave, through the agreed hook data-r9="sheet" (a no-op until that lands). Nothing is clipped —
     a long player bet wraps to a second line rather than ellipsising, so the reader never sees half a bet name. */
  .obt-stage .phh-b{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:5px 0;margin:0;
    appearance:none;background:none;border:0;border-top:1px solid var(--line);text-align:left;cursor:pointer}
  .obt-stage .phh-bet{flex:1 1 auto;min-width:0;font-size:.86rem;font-weight:400;color:var(--ink-faint);line-height:1.28}
  .obt-stage .phh-bet b{font-weight:600;color:var(--ink)}
  .obt-stage .phh-tail{font-style:normal;color:var(--ink-faint);white-space:nowrap}
  .obt-stage .phh-chg{flex:0 0 auto;font-size:.8rem;color:var(--ink-faint);white-space:nowrap;text-decoration:none}
  .obt-stage .phh-chg u{text-decoration:underline}

  /* row C — our call, only when it is a different bet from the one in focus. No star, no colour, no price. */
  .obt-stage .phh-c{display:flex;align-items:center;gap:6px;margin:0;min-height:24px;font-size:.8rem;
    color:var(--ink-faint);line-height:1.3}
  .obt-stage .phh-show{appearance:none;border:0;background:none;padding:0 2px;min-height:24px;font-size:.8rem;
    color:var(--ink);text-decoration:underline;cursor:pointer;white-space:nowrap}

  /* --- clean-up on any head that is NOT the new one (spec D7 / D9) --------------------------------------------------
     phoneHead() prints none of these, so this only bites the fallback band: no gold star, no green/cyan price words, no
     rounded mono-caps context pills, no clipped venue sentence, and the crumb in one typeface. Two inks, one face. */
  .obt-wsid .obt-ghwx{display:none}
  .obt-wsid .obt-ctxrow,.obt-wsid .ctxc{display:none}
  .obt-wsid .obt-callline .st{display:none}
  .obt-wsid .obt-callline .pr,.obt-wsid .obt-callline .cw{color:var(--ink)}
  .obt-crumb b{font-family:var(--ui);font-weight:600}
  .obt-crumb .mod{display:none}
  .obt-crumb .ko{color:var(--ink-faint);font-family:var(--ui)}
}

/* =====================================================================================================================
   ⛔ EVERYTHING ABOVE THIS LINE IS WP-M1's (BB_PHONE_V55, the phone head). Do not edit it from another package.
   ⬇ WP-M3 [BB_PHONEBARS_V56, 2026-09-14] THE BARS AND THE CHROME. Appended section, owned by WP-M3.

   MOBILE_OVERHAUL_SPEC.md §3.3 + D3/D4/D4b/D5/D8/D10/D13. The phone said the five stops twice - an in-content strip and
   a bottom bar - with three of the bar's five labels ellipsised, a gold POWERS tile floating on the reader's paragraph,
   and a whole desktop tile deck laid out off the right-hand edge of the screen. What is left is one bar: row 1 the five
   stops in labels that fit, row 2 More and the one verb, no rule between them because they are one object.

   Budget at 390x844 (measured, not estimated): site bar 48 + head 109 + bar 101 = 258px of chrome, 586px to read in;
   scrolled, the head drops its third row to 81px and the chrome is 230px.

   ⛔ Every rule below sits in one of three queries: @media (max-width:899px) - the phone - @media (max-width:359px) for
   the narrow phone inside it, and @media (min-width:900px) and (max-width:1149px), the small-tablet band the spec calls
   D13. Nothing at 1150px and wider is touched, and it is proved, not asserted: a 1600x900 bench capture of nfl with this
   package on disk and the same capture with 71_phonebars.py and this section removed came back md5-identical, twice
   (shots/m3/band/nfl_1600_dark.png and nfl_1600_dark_WITHOUT_M3.png).
   Design law: one typeface var(--ui), two inks, hairlines, no gradients / pills / gold / coloured tags / mono caps / avatars.
   ===================================================================================================================== */

@media (max-width:899px){

  /* --- the tab strip inside the read is the bar, said twice (spec D4b / D10) ------------------------------------------
     33px of height, "Where to put it" scrolled off the right edge with no affordance, and its own active-stop underline
     disagreeing with the bar's. The bar is the navigation; the read never repeats it. Its two links ("See the teams",
     "The words") are not lost - they are rows in the More sheet now, so the glossary stays one tap away.
     The DOM is still built: deleting it is one line in round9/src/04_engine.js (E.stage's unused `mobile` argument),
     which WP-M3 does not own and has handed to the lane lead. This rule and that line agree; neither needs the other. */
  #obtStage .r9-tabs{display:none!important}

  /* --- the POWERS tile is out of the document (renderFab), this is the belt and braces ------------------------------- */
  #obtFab,#obtPow{display:none!important}

  /* --- the desktop tile deck is no longer built on a phone, so its column claims no room --------------------------- */
  .obt-app .obt-tiles{padding-bottom:0}

  /* --- ONE BAR ------------------------------------------------------------------------------------------------------
     Row 1: the five stops, 20% each (78px at 390, 64px at 320), glyph over label, active = ink + a 2px top rule.
     Row 2: More (62px) then the one verb filling the rest. No hairline between the rows.
     The break is a zero-height full-width flex item the bar prints between the stops and More (.barbrk56): a flex line
     only wraps on the items' BASE sizes, so five 20% stops plus a 100% break is the one arrangement that still breaks
     correctly when a league is missing a stop and there are only four. */
  #obtBar .barbrk56{flex:1 0 100%!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;
    border:0!important;overflow:hidden!important}
  #obtBar .jstage,#obtBar .jstage.on,#obtBar .jstage.seen,#obtBar .jstage.cast{
    flex:1 1 20%!important;min-width:0!important;height:52px!important;padding:0 4px!important;gap:3px!important;
    justify-content:center!important}
  /* a stop label may never ellipsise: S.TAB_SHORT is sized so it does not have to (longest "What stops it", ~69px in
     78px), and if a future label ever did overflow we want the gate to SEE it, not a tidy "..." hiding it. */
  #obtBar .jstage b,#obtBar .jstage.on b,#obtBar .jstage.seen b{
    line-height:1.25!important;overflow:visible!important;text-overflow:clip!important;max-width:none!important}
  #obtBar .bf.bfmore{order:0!important;flex:0 0 62px!important;min-width:62px!important;max-width:62px!important;
    height:48px!important;padding:0!important;gap:3px!important;border-left:0!important;border-top:0!important}
  #obtBar .bf.bfmore .lb{max-width:58px}
  #obtBar .bk{flex:1 1 auto!important;order:9!important;margin:0!important;height:48px!important;border-top:0!important;
    font-size:14px}

  /* --- the read ends above the bar, at the bar's REAL height (safe area included) ------------------------------------
     The host hard-coded 124px, which was wrong the moment the bar changed shape and wrong again on a phone with a home
     indicator. --bb-barh is written from getBoundingClientRect after every bar render and on resize, by this package's
     host block. WP-M4 already consumes it from the scene sheet - `.obt-app #obtStage{padding-bottom:var(--bb-barh,124px)}`,
     src/scenes.css:638 - and that id selector outranks this one whenever the scene engine is loaded, which is every read
     on a phone. This rule is the fallback for the one screen the engine does not own: the old v41 phone stage, where the
     bar still renders and 124px is still guesswork. */
  .obt-app .obt-stage{padding-bottom:calc(var(--bb-barh, 101px) + 14px)}
  .obt-slip{bottom:calc(var(--bb-barh, 101px) + 8px)}

  /* --- the head sticks and collapses (spec §3, WP-M1 handed this over) ------------------------------------------------
     .obt-wsid is already position:sticky in the host sheet, so the head stays on screen; past 120px of reading the third
     row (our call, with its "Show me") goes and the head is rows A and B - the teams and THE BET - at 81px. Nothing that
     names the bet is ever scrolled away. */
  #obtStage.bb-ph-scrolled .obt-wsid.phh .phh-c{display:none}
  #obtStage.bb-ph-scrolled .obt-wsid.phh{padding-bottom:0}
  /* [integrator 2026-09-14, WP-M7 G2] rows A(32)+B(48)+the 1px hairline measured 81px against the spec's 80px
     ceiling. One pixel comes off row A when collapsed; its 44px back-arrow hit area overflows the row anyway. */
  #obtStage.bb-ph-scrolled .obt-wsid.phh .phh-a{min-height:31px;height:31px}

  /* --- "You" in the top bar (spec §3.4): the bottom bar keeps exactly five stops and one verb --------------------- */
  .obt-top .tb-you{min-height:44px;font-size:12.5px}
  .obt-top .tb-you b{font-weight:600;color:var(--ink)}
}

/* --- the narrow phone (iPhone SE and anything under 360px) -----------------------------------------------------------
   A 320px screen gives each stop a 64px tile, and the longest short label - "What stops it" - measures 64.9px at 10.5px
   in var(--ui): it lands exactly on the hairlines either side of it. One notch down to 10px (the kit's floor, never
   under it) with a 2px gutter puts every label back inside its own tile with room to spare. Still no ellipsis. */
@media (max-width:359px){
  #obtBar .jstage b,#obtBar .jstage.on b,#obtBar .jstage.seen b{font-size:10px!important}
  #obtBar .jstage,#obtBar .jstage.on,#obtBar .jstage.seen,#obtBar .jstage.cast{padding:0 2px!important}
}

/* --- the 900-1149 band (spec D13): a desktop console must get desktop chrome ------------------------------------------
   isDesk() in the client is min-width:900px, but the sheet switched at 1149, so between them the reader got a desktop
   three-column console with the phone's floating POWERS tile on it and a bottom bar whose five stops overlapped each
   other (measured at 1024: 37px of room for a 118px label, tiles printing "$..", "t..", "#.."). The client now folds the
   five utility buttons into More below 1150 and prints the short stop names; this is the matching type. */
@media (min-width:900px) and (max-width:1149px){
  #obtFab,#obtPow{display:none!important}
  /* the scene sheet owns the desktop bar at !important weight (src/scenes.css:403-410, `.r9-game #obtBar .jstage`), and
     .r9-game is on the app from 900px up - so the band has to answer at the same weight and the same selector. Only the
     three numbers that made the tiles collide change: the glyph gutter, the label size, and the answer line. */
  .r9-game #obtBar .jstage,#obtBar .jstage{padding:0 8px 0 30px!important;min-width:0!important}
  .r9-game #obtBar .jstage .jg,#obtBar .jstage .jg{left:5px!important;width:20px!important;height:20px!important}
  .r9-game #obtBar .jstage .jg svg,#obtBar .jstage .jg svg{width:20px!important;height:20px!important}
  .r9-game #obtBar .jstage .jn,#obtBar .jstage .jn{display:none!important}   /* the number and the glyph both mark the stop */
  .r9-game #obtBar .jstage b,#obtBar .jstage b{font-size:12px!important;overflow:visible!important;text-overflow:clip!important}
  /* the answer line keeps its place - it had 37px to say "$21.50 for $10" in and printed "$..", and it has 109px now. */
  .r9-game #obtBar .jstage .jq,#obtBar .jstage .jq{font-size:11px!important}
}

/* =====================================================================================================================
   BB_INTEGR_V57 [integrator 2026-09-14] — cross-package integration, appended below WP-M1's and WP-M3's sections.
   ===================================================================================================================== */
@media (max-width:899px){
  /* lane ruling on WP-M1's owner item: "Show me" keeps its 24px row (head budget untouched) but gains an invisible
     44px hit area, the same way the back arrow overflows row A. */
  .obt-stage .phh-show{position:relative}
  .obt-stage .phh-show::after{content:"";position:absolute;left:-10px;right:-10px;top:-11px;bottom:-11px}
}
@media (min-width:900px) and (max-width:1149px){
  /* WP-M3's flag: in the band the mid column is 300-443px and the in-scene tab strip wrapped into four lines with
     "The words" clipped. The bar carries the same five stops here without collision, so the strip says it twice. */
  #obtStage .r9-tabs{display:none!important}
}
@media (min-width:1150px) and (max-width:1449px){
  /* pre-existing defect WP-M3 measured and left (its brief pinned the band at 900-1149): the bar's stop labels clip
     up to ~1450 ("The call" 37/47px at 1150; "What could stop it?" 87/118px at 1400). The same three numbers the band
     changes fix it: the glyph gutter, the label size, the answer line. 1450 and wider was measured clean and is untouched. */
  .r9-game #obtBar .jstage,#obtBar .jstage{padding:0 8px 0 30px!important;min-width:0!important}
  .r9-game #obtBar .jstage .jg,#obtBar .jstage .jg{left:5px!important;width:20px!important;height:20px!important}
  .r9-game #obtBar .jstage .jg svg,#obtBar .jstage .jg svg{width:20px!important;height:20px!important}
  .r9-game #obtBar .jstage .jn,#obtBar .jstage .jn{display:none!important}
  .r9-game #obtBar .jstage b,#obtBar .jstage b{font-size:12px!important;overflow:visible!important;text-overflow:clip!important}
  .r9-game #obtBar .jstage .jq,#obtBar .jstage .jq{font-size:11px!important}
}

/* 40_mine.css — [WP-P6, 2026-09-14] BB_MINE_V58 · THE BOARD MARK.
   One plain word in a game's head row when the reader has money running on that game: "your bet" / "2 of your bets"
   (PBI_TOPTIER_SPEC.md S4 + 9.8). Paid only, drawn by tools/host_blocks/73_mine.py after every board render.

   Design law: one typeface var(--ui), two inks var(--ink) / var(--ink-faint), hairlines var(--line). No colour, no
   dot, no badge, no pill, no gold, no avatar — the mark is a word, and the row it sits in already carries the rules.
   ICP law: the mark is the whole sentence. Never a number of dollars here, never a percentage, never "due".

   NO LAYOUT SHIFT. .obt-gch is a flex row whose countdown <i> is flex:1 and already ellipsises; the mark is
   flex:0 0 auto and is inserted before the star, so at 320px the countdown gives up the width and the row's
   min-height (15px) is untouched. line-height is pinned under that 15px so a taller mark can never grow the row.
   The whole file is one rule plus a phone-scoped width cap: nothing else on the board changes. */

.obt-gch .bb-mine73{
  flex:0 0 auto;
  font-family:var(--ui);
  font-size:.68rem;
  line-height:14px;
  letter-spacing:0;
  text-transform:none;
  font-weight:600;
  color:var(--ink);
  white-space:nowrap;
  max-width:10em;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* the phone board is narrower and the head row also carries the price cells below it, so the mark gives up width
   before the countdown and the "$N more" tile do. 899 is the one phone token (MOBILE_OVERHAUL_SPEC.md D13). */
@media (max-width:899px){
  .obt-gch .bb-mine73{font-size:.66rem;max-width:8em}
}

/* BB_LIVE_V60 - WP-L3, the live group in the games column (tools/host_blocks/75_live.py).
   House rules kept: NO new colour, NO new chip, NO badge. The one coloured element on a board row is still the
   "In play" mark the column already ships (.obt-gch .live). The only difference a live group makes is weight:
   its header reads at full ink where every other day header reads faint, so the eye finds it without a decoration. */
.obt-day.obt-daylive { color: var(--ink); border-bottom: 1px solid var(--line-strong, var(--line)); }

/* the state words that now ride beside the mark ("2nd quarter, 5:00 left", "Top 5th", "score not in yet").
   .obt-gch i already ellipsises; this only stops the score cell being crowded out of a narrow rail. */
.obt-gch .live + i { flex: 1 1 auto; min-width: 0; }

/* a row in the live group sits a hair proud of the rest of the column: one hairline, no fill, no glow. */
.obt-day.obt-daylive + .obt-row { border-top: 0; }

@media (max-width: 899px) {
  .obt-day.obt-daylive { letter-spacing: .12em; }
}

/* BB_RAILFIX_V62 - WP-M3 2026-09-15, the left column's settings (tools/host_blocks/78_railfix.py).
   Sizes and focus only: no new colour, no new fill, no new shape. Both themes come free because nothing here
   names a colour - the rules borrow --ink / --line / the accent the page already focuses with. */

/* The five tool-group buttons measured 38 x 13 px on the live page (the Font Awesome glyph is the whole height
   of the button, and one of them had no glyph at all). A real target, and the icon centred in it. */
.obt-rail1 .obt-grp { min-height: 34px; display: flex; align-items: center; justify-content: center; }
.obt-rail1 .obt-grp svg { width: 15px; height: 15px; display: block; }

/* On a 1366x768 laptop the switch column runs past the bottom of the window - measured: the last switch sits at
   y=865 in a 768px viewport - and the rail did not scroll (overflow: visible), so the reader simply could not
   reach it. The leagues column beside it already solves this exactly this way: it scrolls, and draws no bar. */
@media (min-width: 900px) {
  .obt-rail1 { overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
  .obt-rail1::-webkit-scrollbar { display: none; }
}

/* The rail flyout is a menu now: the item under the keyboard has to be visible as such. */
.obt-fly [role="menuitem"]:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }

@media (max-width: 899px) {
  /* On a phone the rail is gone and every setting lives in the drawer, so the drawer IS the settings screen.
     Measured before this block: the selects 38-39px, the odds-format pair 32px, the three links 32px, the close
     42px - every one of them under a thumb's 44. */
  #obtDrawer select,
  #obtDrawer .obt-ctl,
  #obtDrawer button.obt-ctl { min-height: 44px; }
  #obtDrawer #obtFmt { min-height: 44px; }
  #obtDrawer #obtFmt button { min-height: 44px; padding-top: 10px; padding-bottom: 10px; }
  #obtDrawer .obt-links a { display: flex; align-items: center; min-height: 44px; }
  #obtDx { min-width: 44px; min-height: 44px; }
}

/* =====================================================================================================================
   BB_SWITCHES_V68 - [WP-W6F 2026-09-15] THE SWITCH COLUMN, PUT BACK INTO THE HOUSE RULES.

   OWNER NOTE OFF THE WAVE-4 WALK (changelog 2026-09-15 16:00): "switch column styling = the rejected pills/glow/
   mono-caps look". WP-M3 made every control in that column WORK; nobody made it look like the rest of the product.
   What was actually on the page, measured off the live stylesheet (assets/bb-oddst.ecacd8ca.css):
     * a mono-caps eyebrow - `SWITCHES` in var(--mono) at .44rem with .24em of letter-spacing - which is the exact
       shape the owner struck everywhere else on the site;
     * every label and every state value also in var(--mono), also uppercase, also letter-spaced;
     * a 20 x 34 iOS-shaped pill (border-radius:10px) per switch, with an inset shadow, a gradient thumb, and
       `box-shadow:0 0 10px` of cyan or green glow around the thumb when the switch is on;
     * `text-shadow:0 0 7px` behind the state word when it is on - a lit-neon readout;
     * three more gradients: the rail's own background, the divider above the switches, and the tool buttons, each
       with its own hard-coded cyan/green literal per theme (four near-identical blocks of them).
   None of that is in the design law and none of it is how the console reads. THE RULE HERE: one typeface - var(--ui);
   three inks - var(--ink) / var(--ink-dim) / var(--ink-faint); hairlines - var(--line) / var(--line-strong); and the
   STATE OF A SWITCH IS SHOWN BY WEIGHT AND INK, never by light. On is the darker ink and the heavier word; off is the
   faint ink and the regular word. Nothing glows, nothing is filled, nothing has a colour of its own.

   THE SWITCH ITSELF IS STILL A SWITCH. The metaphor was right - this column is switchgear, and a reader flicking
   "prices" between 1.91 and -110 is throwing a switch - so it stays a two-position toggle. It is just drawn the way
   the rest of the terminal draws things: a square-cornered track in a hairline, a solid block for the lever, and the
   lever moves. It reads as a breaker on a panel, not as a phone setting.

   NOT ONE COLOUR IS NAMED IN THIS FILE. Every value is a token, so light and dark both come free and stay right if
   the palette ever moves. The GREEN "best 1st" switch loses its green on purpose: a switch that is on is a switch
   that is on, and two different on-colours taught the reader a distinction that does not exist.

   ---------------------------------------------------------------------------------------------------------------
   WHY EVERY SELECTOR STARTS WITH THE SAME PREFIX. The rules being replaced are written FOUR times in the live
   stylesheet - once bare, once under `:root[data-theme="light"]`, and once under
   `:root:not([data-theme="dark"]):not([data-theme="light"])` inside `@media (prefers-color-scheme:light)` (twice,
   in two v-blocks). That last one carries three class-points of specificity, so a plain `#obtSw .tg .st` here would
   simply lose to it on a light-preference machine with no explicit theme - the worst kind of bug, because it is
   invisible on the box you test on. The prefix
        :root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme])
   reads "every root, however its theme is set" (no attribute -> the first arm; dark or light -> the second), and
   :is() takes the specificity of its most specific arm, which is exactly the three points those blocks carry. Equal
   specificity, and this file is appended last, so these win - in all three theme states and no other way.
   Everything here is token-only, so ONE declaration block serves every theme; there are no per-theme copies below.
   ---------------------------------------------------------------------------------------------------------------

   THE MARKER. BB_SWITCHES_V68, and it has never been minted, so it can still be renamed - after a mint it is frozen
   (see the note in tools/host_blocks/78_railfix.py about why). V66 is 90_names.py and V67 is the speed package's
   BB_FASTOPEN_V67, so 68 is the first free number at the time of writing. A clash of NUMBERS would in fact be
   harmless - mint_host_css.py and patch_host_v44.py both guard on the literal marker STRING and neither keeps a
   registry of numbers - but two blocks called V67 is a thing a reader has to stop and check, so it is worth a minute.

   SCOPE. Nothing outside the far-left rail is touched: every selector is under `.obt-rail1` or `#obtSw`, and #obtSw
   only exists on a desktop (renderSwitches returns early otherwise). The container rule is fenced to >=1150px
   because the live sheet deliberately strips the rail's background and border below that
   (`@media (max-width:1149px){.obt-rail1{background:transparent;border-right:none}}`) and a higher-specificity rule
   here would have quietly put them back on a 1024px laptop.
   ===================================================================================================================== */

/* ---- the column itself: a panel with a hairline edge, not a gradient with a lit border ---- */
@media (min-width: 1150px) {
  :root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) .obt-rail1 {
    background: var(--panel);
    border-right: 1px solid var(--line);
  }
}

/* ---- the five tool buttons: quiet by default, a hairline on hover, ink when their menu is open ----
   THE INK HERE IS --ink-dim AND NOT --ink-faint, ON PURPOSE, and it is the one place in this file where quieter
   would have been wrong. Taking the resting box away leaves the GLYPH as the whole control: there is no border and
   no fill behind it any more, so if the glyph is also the faintest ink in the palette then five live controls -
   Find, Good prices, Mine, the help card, the theme - read as an empty strip of column. The old sheet drew them at
   rgb(74,115,150) on light / a lit cyan on dark, which sits at about --ink-dim's weight, so this KEEPS the resting
   legibility the reader already had and drops only the chrome the owner struck. Hover then adds the hairline and
   open goes to full ink, so the three states still separate. CANNOT BE JUDGED ON THE BENCH: the bench does not
   serve bb-fa-subset.min.css, so four of the five glyphs are absent in every capture here and only WP-M3's inline
   dollar fallback draws. Look at these five on prod after the publish - that is the only honest test of this line. */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) .obt-rail1 .obt-ico {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 3px;
  color: var(--ink-dim);
  box-shadow: none;
  transition: color .12s ease, border-color .12s ease;
}
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) .obt-rail1 .obt-ico:hover {
  background: transparent;
  border-color: var(--line-strong);
  color: var(--ink);
  box-shadow: none;
}
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) .obt-rail1 .obt-ico.on,
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) .obt-rail1 .obt-grp[aria-expanded="true"] {
  background: transparent;
  border-color: var(--ink-faint);
  color: var(--ink);
  box-shadow: none;
}

/* ---- the divider above the switches: a hairline, the full width of the column, no fade ---- */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw::before {
  left: 0;
  right: 0;
  background: var(--line);
}

/* ---- the group label. `capitalize` renders the host's own lower-case word as "Switches": sentence case, one
        typeface, no tracking, no caps. The word itself stays in the host, so a screen reader hears it unchanged. ---- */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .swk {
  font-family: var(--ui);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: capitalize;
  color: var(--ink-faint);
}

/* ---- the name of each switch: plain, lower case, quiet ---- */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg .nm {
  font-family: var(--ui);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-faint);
}
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg:hover .nm {
  color: var(--ink-dim);
}

/* ---- the toggle: a square-cornered track in a hairline and a solid lever. No pill, no inset, no gradient. ---- */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg .sw {
  width: 18px;
  height: 28px;
  border: 1px solid var(--line-strong);
  border-radius: 2px;
  background: transparent;
  box-shadow: none;
}
/* The lever is a BAR, not a dot: wide and shallow, so which end of the track it is at is the thing the eye reads
   first, before it reads the ink. A square in a square is a button; a bar at one end is a switch. */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg .sw i {
  left: 2px;
  right: 2px;
  height: 8px;
  border-radius: 1px;
  background: var(--ink-faint);
  box-shadow: none;
}
/* 28px track, 1px borders, 26px inside, an 8px bar: 3px of clearance at whichever end it is resting on. */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg .sw i.up { top: 3px; bottom: auto; }
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg .sw i.dn { top: 15px; bottom: auto; }

/* ---- the state value: the host writes it in caps (AU, VALUE, $10, 1.91) and caps is right for a readout, but it
        is our typeface, on the number-aligned figures, with no tracking and no light behind it. ---- */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg .st {
  font-family: var(--ui);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  color: var(--ink-faint);
  text-shadow: none;
}

/* ---- ON. The whole state change is: the lever goes to full ink, the track's hairline firms up, and the value gets
        one weight heavier and one ink darker. `.grn` (best 1st) is treated identically to `.armed` - see the header. ---- */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.armed .sw,
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.grn .sw {
  border-color: var(--ink-faint);
  box-shadow: none;
}
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.armed .sw i,
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.grn .sw i {
  background: var(--ink);
  box-shadow: none;
}
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.armed .st,
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.grn .st {
  color: var(--ink);
  font-weight: 600;
  text-shadow: none;
}
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.armed .nm,
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg.grn .nm {
  color: var(--ink-dim);
}

/* ---- the keyboard. renderSwitches rewrites the whole column on every flick and BB_RAILFIX_V62 puts the focus back
        on the button that was pressed; a reader driving this column from the keyboard has to be able to SEE that. ---- */
:root:is(:not([data-theme="dark"]):not([data-theme="light"]),[data-theme]) #obtSw .tg:focus-visible {
  outline: 2px solid var(--ink-dim);
  outline-offset: 2px;
  border-radius: 2px;
}