/* ============================================================================
   WORKSPACE - the C layout, 2026-10-14. Loaded last, after app.css and
   night.css, by ws.html only. [stated] 2026-10-13: "i like c workspace give
   me a full mockup of the website in the c format", then "sweet go ahead and
   build that full site with this new layout make no mistakes please".

   The approved pictures are promo/redesign_mockups/C_full/C1..C9: a sidebar
   on the left, each tab's list in the middle, the thing you picked in a panel
   on the right. Phone and tablet (<1100px): a dock along the bottom, the panel
   becomes a sheet over the list.
   ========================================================================= */

/* ── the C palette (the mockups'), and the old names pointed at it so every
   component app.css and night.css still draws comes out in the same colours ── */
:root{
  --bg:#0C0D10; --p1:#121419; --p2:#171A20; --p3:#1E222A;
  --ln:#22262E; --ln2:#2E333D; --ln3:#3C424E;
  --ink:#F4F1EA; --ink2:#A8A49B; --ink3:#8C877E;
  --gold:#C9A24B; --gold2:#E3C778;
  --pos2:#6FC28E; --neg2:#E8868A;
  --sur-0:#0C0D10; --sur-1:#121419; --sur-2:#171A20; --sur-3:#1E222A;
  --line-1:#22262E; --line-2:#2E333D; --line-3:#3C424E;
  --ink-1:#F4F1EA; --ink-2:#A8A49B; --ink-3:#8C877E;
  --pos:#45A06A; --pos-2:#6FC28E; --pos-wash:rgba(69,160,106,.14);
  --neg:#DC6469;
  --gold-2:#E3C778; --gold-wash:rgba(201,162,75,.12); --gold-line:rgba(201,162,75,.42);
  --track:#171A20; --seg-on:#1E222A;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,'Roboto Mono',monospace;
  --side-w:236px; --rp-w:430px;
  --r-card:16px;
}
@media(max-width:1499px){ :root{ --rp-w:380px } }
@media(max-width:1279px){ :root{ --rp-w:340px } }

html{background:var(--bg)}
body.ws{
  background:radial-gradient(1200px 520px at 62% -16%, rgba(201,162,75,.075), transparent 60%), var(--bg);
  background-attachment:fixed;
  color:var(--ink); font-size:13.5px; line-height:1.45; min-height:100vh;
}
body.ws::before{display:none}
.ws [hidden]{display:none !important}
.ws a{color:inherit}
.ws .mono{font-family:var(--mono)}
.ws .pos{color:var(--pos2)} .ws .neg{color:var(--neg2)} .ws .gold{color:var(--gold2)} .ws .dim{color:var(--ink3)}

/* ═══════════════ THE SIDEBAR (computer) ═══════════════ */
.ws-side{
  position:fixed; z-index:40; left:0; top:0; bottom:0; width:var(--side-w);
  display:flex; flex-direction:column; gap:4px; padding:18px 14px 14px;
  background:rgba(18,20,25,.72); border-right:1px solid var(--ln);
  overflow-y:auto; overflow-x:hidden;
}
.ws-brand{display:flex; align-items:center; gap:11px; padding:4px 8px 18px; text-decoration:none !important}
.ws-brand img{width:40px; height:40px; border-radius:50%; flex:none; box-shadow:0 0 0 1px rgba(201,162,75,.4)}
.ws-brand b{display:block; font-size:15px; font-weight:700; letter-spacing:-.01em; color:var(--ink)}
.ws-brand i{display:block; font-style:normal; font-size:11px; color:var(--ink3); white-space:nowrap}
.ws-nav{display:flex; flex-direction:column; gap:3px}
.ws-nav a{
  display:flex; align-items:center; gap:11px; height:40px; padding:0 12px; border-radius:10px;
  color:var(--ink2); font-weight:500; font-size:13.5px; text-decoration:none !important;
  transition:background .15s, color .15s;
}
.ws-nav a svg{width:17px; height:17px; flex:none; color:var(--ink3)}
.ws-nav a:hover{background:rgba(255,255,255,.04); color:var(--ink)}
.ws-nav a[aria-current="page"]{
  color:var(--ink); background:linear-gradient(90deg,rgba(201,162,75,.16),rgba(201,162,75,.04));
  box-shadow:inset 0 0 0 1px rgba(201,162,75,.35);
}
.ws-nav a[aria-current="page"] svg{color:var(--gold)}
.ws-nav a em{margin-left:auto; font:600 11px var(--mono); font-style:normal; color:var(--ink3)}
.ws-nav a em:empty{display:none}
.ws-sec{font:600 10.5px/1 var(--f-body); letter-spacing:.14em; text-transform:uppercase; color:var(--ink3); padding:18px 12px 8px}
.ws-dc{
  margin-top:auto; display:block; padding:14px; border-radius:14px; text-decoration:none !important;
  border:1px solid rgba(201,162,75,.3); background:linear-gradient(180deg,rgba(201,162,75,.10),rgba(201,162,75,.02));
}
.ws-dc b{display:block; font-size:13.5px; color:var(--ink)}
.ws-dc > span{display:block; font-size:12px; color:var(--ink2); margin:4px 0 10px; line-height:1.4}
.ws-dc .ws-dcb{margin:0; height:34px; border-radius:9px; border:1px solid var(--ln2); background:var(--p2); color:var(--ink);
  display:flex; align-items:center; justify-content:center; font-weight:600; font-size:12.5px}
.ws-dc:hover .ws-dcb{border-color:var(--gold-line)}
.ws-me{display:flex; align-items:center; gap:10px; padding:12px 6px 0; margin-top:10px; border-top:1px solid var(--ln); font-size:12px; color:var(--ink2); min-width:0}
.ws-me .av{width:28px; height:28px; border-radius:50%; flex:none; background:var(--p3); border:1px solid var(--ln2);
  display:flex; align-items:center; justify-content:center; font:600 10.5px var(--f-body); color:var(--ink)}
.ws-me .nm{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ws-me .prem{flex:none; font:700 9.5px var(--f-body); letter-spacing:.08em; color:#16110A; background:var(--gold2); border-radius:999px; padding:2px 7px}
.ws-me .who2{display:flex; flex-direction:column; min-width:0; flex:1; line-height:1.3}
.ws-me .out{font-size:11px; color:var(--ink3); text-decoration:none}
.ws-me .out:hover{color:var(--ink)}
.ws-me .ws-in-btn{margin-left:auto; flex:none; font-size:12px; font-weight:600; color:var(--gold2); text-decoration:none}
.ws-me:empty{display:none}

/* ═══════════════ THE PAGE ═══════════════ */
.ws-body{margin-left:var(--side-w); min-width:0}
.ws .view{display:none}
.ws .view.on{display:block}
.ws-page{display:grid; grid-template-columns:minmax(0,1fr) var(--rp-w); min-height:100vh; align-items:start}
.ws-main{padding:26px 26px 40px; min-width:0}
.ws-rp{
  position:sticky; top:0; height:100vh; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain;
  display:flex; flex-direction:column; padding:22px 22px 18px;
  border-left:1px solid var(--ln); background:rgba(18,20,25,.86);
}
.ws-foot{margin-left:0; padding:16px 26px 26px; display:flex; flex-wrap:wrap; gap:6px 18px; font-size:11.5px; color:var(--ink3); border-top:1px solid var(--ln)}
.ws-foot b{color:var(--ink2)}
.ws .gate{min-height:100vh}

/* the header: gold eyebrow, title, one line of what it is, LIVE on the right */
.ws-h{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin:0 0 18px}
.ws-h > div:first-child{min-width:0}
.ws-h .eb{display:block; font:700 11px/1 var(--f-body); letter-spacing:.18em; text-transform:uppercase; color:var(--gold)}
.ws-h h1{font-size:28px; font-weight:700; letter-spacing:-.02em; line-height:1.15; margin:8px 0 6px; color:var(--ink)}
.ws-h .lead{margin:0; max-width:620px; font-size:13.5px; line-height:1.55; color:var(--ink2)}
.ws-live{display:flex; flex-direction:column; align-items:flex-end; gap:5px; font:500 11.5px var(--mono); color:var(--ink3); white-space:nowrap; flex:none}
.ws-live b{display:flex; align-items:center; gap:7px; color:var(--pos2); font-weight:600}
.ws-live b::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--pos2); box-shadow:0 0 0 4px rgba(111,194,142,.15)}
.ws-live.plain{gap:0}
.ws-live > span b,.ws-live > span span{display:inline; color:var(--ink2)}
.ws-live > span b::before{display:none}

/* the filter bar: one rounded tray, segment tracks inside it */
.ws-fb{display:flex; flex-direction:column; gap:8px; padding:8px; margin:0 0 14px; border:1px solid var(--ln); border-radius:16px; background:rgba(18,20,25,.7)}
.ws-fr{display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-width:0}
.ws .seg{display:inline-flex; flex-wrap:wrap; gap:2px; padding:3px; border:0; border-radius:11px; background:var(--p2); max-width:100%}
.ws .seg button{border:0; border-radius:9px; padding:7px 12px; font:600 12.5px var(--f-body); color:var(--ink2); background:none; white-space:nowrap; cursor:pointer; min-height:0}
.ws .seg button:hover{color:var(--ink); background:rgba(255,255,255,.03)}
.ws .seg button.on,.ws .seg button[aria-pressed="true"]{background:var(--p3); color:var(--ink); box-shadow:inset 0 0 0 1px var(--ln2)}
.ws .seg button i{font-style:normal; font-weight:500; color:var(--ink3); margin-left:5px; font-size:11.5px}
.ws .seg button .segn{font:600 10.5px var(--mono); margin-left:6px; padding:1px 5px; border-radius:6px; background:rgba(220,100,105,.85); color:#fff}
.ws .seg button .pip{display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--neg); margin-right:6px; vertical-align:middle}
.ws select,.ws textarea,
.ws input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=submit]):not([type=button]){
  height:38px; border-radius:11px; border:1px solid var(--ln); background-color:var(--p2); color:var(--ink);
  font:500 12.5px var(--f-body); padding:0 12px; min-width:0;
}
.ws select{padding-right:30px}
.ws textarea{height:auto; padding:10px 12px}
.ws input:focus,.ws select:focus,.ws textarea:focus{outline:none; border-color:var(--gold-line)}
.ws input[type=search]{flex:1 1 180px; min-width:150px}
.ws input[type=range]{accent-color:var(--gold)}
.ws input[type=checkbox]{accent-color:var(--gold)}
.ws label.ev{display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--ink3); white-space:nowrap}
.ws label.ev input{width:110px}
.ws label.ev b{font:600 12px var(--mono); color:var(--gold2); min-width:44px}
.ws label.tog{display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--ink3); white-space:nowrap}
.ws .ws-note{font-size:11.5px; color:var(--ink3); margin:12px 2px 0; line-height:1.5}
.ws-k,.rp-k{font:600 10px/1.2 var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3); margin:18px 0 8px}
.rp-k{margin:0 0 8px}
.rp-k.gold{color:var(--gold2)}
.ws-card{border:1px solid var(--ln); border-radius:var(--r-card); background:var(--p1)}
.ws .card{border:1px solid var(--ln); border-radius:var(--r-card); background:var(--p1); box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none}
.ws .lg{font:700 10.5px var(--f-body); letter-spacing:.06em; color:var(--gold2); background:rgba(201,162,75,.12); border:1px solid rgba(201,162,75,.3); border-radius:6px; padding:2px 7px; white-space:nowrap; flex:none}
.ws .previewbar{display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:12px 14px; margin:0 0 14px; border-radius:14px; background:var(--p1); border:1px solid var(--gold-line); font-size:13px; color:var(--ink2)}
.ws .previewbar .sp{flex:1}
.ws .empty{padding:48px 20px; text-align:center; color:var(--ink3)}
.ws .livebar{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 12px; padding:10px 14px; border-radius:12px; background:var(--p1); border:1px solid var(--ln); font-size:12.5px; color:var(--ink2)}
.ws .livebar b{color:var(--ink)}
.ws .livebar .pip{width:7px; height:7px; border-radius:50%; background:var(--neg)}

/* buttons */
.ws .btn{display:inline-flex; align-items:center; justify-content:center; gap:6px; border:0; border-radius:11px; min-height:38px; padding:0 16px;
  font:700 13px var(--f-body); color:#16110A; background:linear-gradient(140deg,#E3C778,#C29A42); box-shadow:none; text-decoration:none !important; cursor:pointer}
.ws .btn:hover{filter:brightness(1.06)}
.ws .btn.sm{min-height:32px; padding:0 12px; font-size:12px; border-radius:9px}
.ws .btn.ghost{background:var(--p2); border:1px solid var(--ln2); color:var(--ink); font-weight:600}
.ws .btn.ghost:hover{border-color:var(--ln3)}

/* the EV pill, price tags */
.evp{display:inline-block; font:700 12.5px var(--mono); border-radius:9px; padding:5px 9px; white-space:nowrap; border:1px solid transparent}
.evp.p1,.evp.p2,.evp.p3{color:var(--pos2); background:rgba(69,160,106,.14); border-color:rgba(69,160,106,.35)}
.evp.p3{background:rgba(69,160,106,.24)}
.evp.z{color:var(--ink3); background:rgba(255,255,255,.04); border-color:var(--ln)}
.evp.n{color:var(--neg2); background:rgba(220,100,105,.1); border-color:rgba(220,100,105,.3)}
.ws .flag{display:inline-block; font:600 9.5px var(--f-body); letter-spacing:.06em; text-transform:uppercase; color:var(--ink3); border:1px solid var(--ln2); border-radius:5px; padding:0 5px; margin-left:6px; vertical-align:1px}
.ws .blogo{width:22px; height:22px; border-radius:6px; flex:none; display:block; object-fit:cover; background:#fff}
.ws .glyph{display:inline-grid; place-items:center; width:22px; height:22px; border-radius:6px; flex:none; background:var(--p3); font-size:11px}
.ws .mask{filter:blur(5px); opacity:.55; user-select:none}
.ws .code{display:inline-flex; align-items:center; gap:4px; font:600 11px var(--mono); color:var(--ink2); background:var(--p2); border:1px solid var(--ln2); border-radius:7px; padding:1px 6px; white-space:nowrap}
.ws .code button{background:none; border:0; color:var(--ink3); cursor:pointer; padding:0 1px; font-size:11px}
.ws .code.copied{border-color:var(--pos); color:var(--pos2)}
.livedot,.staledot{display:inline-block; width:6px; height:6px; border-radius:50%; margin-right:6px; vertical-align:2px}
.livedot{background:var(--pos2)} .staledot{background:#C77B39}

/* ═══════════════ THE RIGHT PANEL ═══════════════ */
.ws-rp > *{flex-shrink:0}
.rp-top{display:flex; align-items:center; justify-content:space-between; gap:10px}
.rp-x{width:30px; height:30px; flex:none; border-radius:50%; border:1px solid var(--ln2); background:none; color:var(--ink3); font-size:16px; line-height:1; cursor:pointer; display:grid; place-items:center}
.rp-x:hover{color:var(--ink); border-color:var(--ln3)}
.ws-rp h2{font-size:20px; font-weight:700; letter-spacing:-.015em; line-height:1.25; margin:10px 0 3px; color:var(--ink); text-transform:none}
.ws-rp .sub{color:var(--ink2); font-size:12.5px; line-height:1.5; display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px}
.rp-tabs{display:flex; gap:2px; padding:3px; margin:16px 0 14px; border-radius:11px; background:var(--p2); flex:none}
.rp-tabs button{flex:1; border:0; background:none; border-radius:9px; padding:7px 6px; font:600 12.5px var(--f-body); color:var(--ink2); cursor:pointer; white-space:nowrap}
.rp-tabs button.on{background:var(--p3); color:var(--ink); box-shadow:inset 0 0 0 1px var(--ln2)}
.rp-tabs button i{font-style:normal; font:500 11px var(--mono); color:var(--ink3); margin-left:3px}
.rp-body{flex:1 0 auto; min-height:0}
.rp-foot{margin-top:auto; padding-top:14px; flex:none}
.go{display:flex; align-items:center; justify-content:center; height:44px; border-radius:12px; font-weight:700; font-size:14px; color:#16110A !important;
  background:linear-gradient(140deg,#E3C778,#C29A42); text-decoration:none !important; padding:0 14px; text-align:center}
.go:hover{filter:brightness(1.06)}
.go.ghosty{background:var(--p2); border:1px solid var(--gold-line); color:var(--ink) !important}
.go.off{background:var(--p2); color:var(--ink3) !important; border:1px solid var(--ln); cursor:default}
.ws-rp .two{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.ws-rp .two .go,.ws-rp .two .btn{margin:0; width:100%}
.on3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--ln); border-radius:12px; overflow:hidden; margin-bottom:12px; background:var(--p1)}
.on3 > div{padding:10px 12px; border-right:1px solid var(--ln); min-width:0}
.on3 > div:last-child{border-right:0}
.on3 s{display:block; text-decoration:none; font:600 9.5px var(--f-body); letter-spacing:.12em; color:var(--ink3)}
.on3 b{display:block; font:600 18px var(--mono); color:var(--ink); white-space:nowrap}
.on3 b.pos{color:var(--pos2)} .on3 b.gold{color:var(--gold2)}
.on3 i{display:block; font-style:normal; font-size:11px; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.rp-mini{border:1px solid var(--ln); border-radius:12px; padding:10px 12px 8px; margin-bottom:12px; background:var(--p1)}
.rp-mini-h{display:flex; justify-content:space-between; gap:10px; font:600 9.5px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3); margin-bottom:6px}
.rp-mini-h span:first-child{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.rp-mini-h .pos{color:var(--pos2)}
.rp-mini-svg{display:block; width:100%; height:92px}
.rp-mini-k{display:flex; gap:14px; font-size:11px; color:var(--ink3); margin-top:4px}
.rp-mini-k span{display:inline-flex; align-items:center; gap:6px}
.rp-mini-k i{width:14px; height:2px; display:inline-block; border-radius:2px}
.rp-mini-k i.k-bk{background:#6FC28E}
.rp-mini-k i.k-fr{background:repeating-linear-gradient(90deg,#C9A24B 0 4px,transparent 4px 7px)}
.rp-facts{display:flex; flex-wrap:wrap; gap:4px 14px; font-size:11.5px; color:var(--ink3); margin:0 2px 12px}
.rp-facts b{color:var(--ink2); font-weight:600}
.rp-facts .aged{color:#C77B39}
.rp-note{font-size:11.5px; color:var(--ink3); margin:10px 2px 0; line-height:1.5}
.rp-empty{display:flex; flex-direction:column; gap:6px; align-items:center; justify-content:center; text-align:center; min-height:60vh; color:var(--ink3); padding:20px}
.rp-empty b{color:var(--ink); font-size:15px}
.rp-empty.sm{min-height:0; padding:24px 10px; border:1px dashed var(--ln2); border-radius:12px}
.rp-up{margin-top:14px; padding:16px; border-radius:14px; border:1px solid var(--gold-line); background:var(--gold-wash); display:flex; flex-wrap:wrap; gap:8px}
.rp-up p{flex-basis:100%; margin:0 0 6px; font-size:13px; color:var(--ink2); line-height:1.55}
.rp-up b{color:var(--ink)}
.rp-link{display:block; margin-top:10px; font-size:12.5px; color:var(--gold2) !important; text-decoration:none !important}
.rp-chart{display:flex; flex-direction:column}
.rp-chart .ch-stage{flex:none; height:280px; min-height:0}
.rp-chart .ch-legend{max-height:none}
.rp-list{display:flex; flex-direction:column; gap:6px}
.rp-li{display:grid; grid-template-columns:22px minmax(0,1fr) auto auto; align-items:center; gap:10px; width:100%; text-align:left;
  border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:7px 10px; color:var(--ink); cursor:pointer; font:inherit}
.rp-li:hover{border-color:var(--ln3)}
.rp-li .nm{min-width:0; display:flex; flex-direction:column; line-height:1.3}
.rp-li .nm b{font-size:12.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.rp-li .nm i{font-style:normal; font-size:11px; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.rp-li .px{font:600 12.5px var(--mono)}
.rp-li .evp{font-size:11.5px; padding:3px 7px}

/* the book ladder in the panel: both sides, one row per book */
.lad{display:flex; flex-direction:column; gap:5px}
.lad-cap{font-size:12px; color:var(--ink2); margin:0 2px 2px; font-weight:600}
.lad-r{display:grid; grid-template-columns:minmax(0,1fr) 92px 92px; gap:8px; align-items:center; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:5px 8px; min-height:40px}
.lad.one .lad-r{grid-template-columns:minmax(0,1fr) 110px}
.lad-h{background:none; border:0; min-height:0; padding:0 8px 2px; font:600 9.5px var(--f-body); letter-spacing:.1em; text-transform:uppercase; color:var(--ink3)}
.lad-h span{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.lad-h span:nth-child(n+2){text-align:right}
.lad-s{background:var(--p1); min-height:34px}
.lad-s.end{margin-bottom:4px}
.lad-s .lab{font-size:11.5px; color:var(--ink3); font-weight:600; padding-left:4px}
.lad-r.me{border-color:rgba(69,160,106,.45); background:rgba(69,160,106,.07)}
.lad-r.anchor{opacity:.8}
.lad .lb{min-width:0}
.lad .lb .book{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink); min-width:0; text-decoration:none}
.lad .lb .book > span:not(.ext){min-width:0}
.lad .lb a.book:hover{color:var(--gold2)}
.lad .lb .book .ext{color:var(--gold2); font-size:11px; flex:none}
.lad .lb .book .site{font-size:10px; color:var(--ink3); flex:none}
.lc{display:flex; flex-direction:column; align-items:flex-end; line-height:1.2; min-width:0}
.lc b{font:600 13px var(--mono); color:var(--ink); white-space:nowrap}
.lc small{font:600 10.5px var(--mono); color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.lc small.p1,.lc small.p2,.lc small.p3{color:var(--pos2)}
.lc small.n{color:var(--neg2)}
/* LIMIT (Pinnacle) and LIQ (an exchange) under the price, 2026-10-14 */
.lc small.sz{font:600 9.5px var(--mono); letter-spacing:.02em; color:var(--gold2); opacity:.9}
.lc.best b{color:var(--pos2)}
.lc.none{color:var(--ink3); align-items:flex-end}
.lc.up b{color:var(--pos2)} .lc.dn b{color:var(--neg2)}

/* ═══════════════ BOARD ═══════════════ */
.bd-list{display:flex; flex-direction:column; gap:12px}
.bd-game{border:1px solid var(--ln); border-radius:16px; background:var(--p1); overflow:hidden}
.bd-gh{display:flex; align-items:center; gap:12px; padding:11px 16px; border-bottom:1px solid var(--ln); background:linear-gradient(180deg,rgba(255,255,255,.025),transparent)}
.bd-gh b{font-weight:600; font-size:14px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.bd-t{margin-left:auto; font:500 12px var(--mono); color:var(--ink3); white-space:nowrap; flex:none}
.bd-t.live{color:var(--neg2); font-weight:700; letter-spacing:.04em}
.bd-row{display:grid; grid-template-columns:minmax(0,1fr) 196px 72px 92px 64px; align-items:center; gap:14px; padding:9px 16px;
  border-bottom:1px solid var(--ln); cursor:pointer; position:relative; transition:background .12s}
.bd-row:last-child{border-bottom:0}
.bd-row:hover{background:rgba(255,255,255,.025)}
.bd-row.on{background:rgba(201,162,75,.07); box-shadow:inset 3px 0 0 var(--gold)}
.bd-row:focus-visible{outline:2px solid var(--gold); outline-offset:-2px}
.bd-row.aged .bd-px b{color:#C9A26A}
.bd-n{min-width:0}
.bd-n b{display:block; font-weight:600; font-size:13.5px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bd-n i{display:block; font-style:normal; color:var(--ink3); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bd-px{display:flex; align-items:center; justify-content:space-between; gap:8px; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:5px 10px 5px 7px; min-width:0}
.bd-bk{display:flex; align-items:center; gap:7px; min-width:0}
.bd-bn{font-size:12px; color:var(--ink2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bd-px > b{font:600 13.5px var(--mono); color:var(--ink); white-space:nowrap; flex:none}
.bd-fair{font:500 12.5px var(--mono); color:var(--ink2); text-align:right; white-space:nowrap}
.bd-fair s{display:block; text-decoration:none; font:600 9.5px var(--f-body); letter-spacing:.1em; color:var(--ink3)}
.bd-ev{text-align:right}
.bd-bet{display:inline-flex; align-items:center; justify-content:center; height:30px; border-radius:9px; font-weight:700; font-size:12px;
  color:#16110A !important; background:linear-gradient(140deg,#E3C778,#C29A42); text-decoration:none !important; white-space:nowrap}
.bd-bet.home{background:var(--p2); color:var(--ink) !important; border:1px solid var(--gold-line)}
.bd-bet.off{background:none; color:var(--ink3) !important; border:1px solid var(--ln)}
.bd-bet.lock{background:var(--p2); border:1px solid var(--ln2); color:var(--ink2) !important; font-size:13px}
.bd-row.new{animation:ws-new 2.4s ease-out}
@keyframes ws-new{from{background:rgba(201,162,75,.16)}to{background:transparent}}
.bd-px.up > b,.bd-ev.up .evp{color:var(--pos2); animation:ws-up 2s ease-out}
.bd-px.dn > b,.bd-ev.dn .evp{animation:ws-dn 2s ease-out}
@keyframes ws-up{from{text-shadow:0 0 10px rgba(111,194,142,.9)}to{text-shadow:none}}
@keyframes ws-dn{from{color:var(--neg2)}to{}}
@media(max-width:1399px){ .bd-row{grid-template-columns:minmax(0,1fr) 150px 66px 88px 58px} .bd-bn{display:none} .bd-px{justify-content:space-between} }
/* ── the flat board (2026-10-13 night): one list in one card, a sortable
   header, the game as its own column when the list is wide enough ── */
.bd-flat{display:block; border:1px solid var(--ln); border-radius:16px; background:var(--p1); overflow:hidden; container-type:inline-size}
.bd-hd{display:grid; grid-template-columns:minmax(0,1fr) 196px 72px 92px 64px; gap:14px; align-items:center; padding:9px 16px;
  border-bottom:1px solid var(--ln2); background:linear-gradient(180deg,rgba(255,255,255,.03),transparent)}
.bd-hd button{all:unset; cursor:pointer; font:600 10.5px var(--f-body); letter-spacing:.09em; text-transform:uppercase; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bd-hd button:hover{color:var(--ink)}
.bd-hd button:focus-visible{outline:2px solid var(--gold); outline-offset:2px; border-radius:4px}
.bd-hd .c-f,.bd-hd .c-e{text-align:right}
.bd-hd button.sorted{color:var(--gold2)}
.bd-hd button.sorted::after{content:" ↓"}
.bd-hd button.sorted.asc::after{content:" ↑"}
.bd-hd .c-g,.bd-g{display:none}
.bd-gi{display:block; font-style:normal; color:var(--ink3); font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px}
.bd-gi .live,.bd-g .live{color:var(--neg2); font-weight:700}
.bd-g{min-width:0}
.bd-g .lg{display:inline-block; font:700 9px var(--mono); letter-spacing:.06em; color:var(--gold2); border:1px solid var(--gold-line); border-radius:5px; padding:0 4px; margin-right:6px; vertical-align:1px}
.bd-g b{display:block; font-weight:600; font-size:12.5px; color:var(--ink2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bd-g i{display:block; font:500 11px var(--mono); font-style:normal; color:var(--ink3); white-space:nowrap; margin-top:2px}
@media(min-width:1100px){ .bd-flat .bd-fair s{display:none} }
@media(max-width:1399px){ .bd-hd{grid-template-columns:minmax(0,1fr) 150px 66px 88px 58px} }
@media(min-width:1100px){
  @container (min-width:860px){
    .bd-hd,.bd-flat .bd-row{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr) 196px 72px 92px 64px}
    .bd-hd .c-g,.bd-flat .bd-g{display:block}
    .bd-flat .bd-gi{display:none}
  }
  @container (min-width:860px) and (max-width:1000px){
    .bd-hd,.bd-flat .bd-row{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr) 150px 66px 88px 58px}
  }
}

/* ═══════════════ PHONE AND TABLET (<1100px) ═══════════════ */
.ws-dock,.ws-more,.ws-scrim{display:none}
@media(max-width:1099px){
  .ws-side{display:none}
  .ws-body{margin-left:0}
  .ws-page{display:block; min-height:0}
  .ws-main{padding:18px 14px 110px}
  .ws-foot{padding:14px 14px 110px}
  .ws-h{flex-direction:column; align-items:flex-start; gap:10px}
  .ws-h h1{font-size:23px}
  .ws-live{align-items:flex-start; white-space:normal}
  .ws-dock{
    display:flex; position:fixed; z-index:60; left:50%; transform:translateX(-50%);
    bottom:calc(10px + env(safe-area-inset-bottom, 0px)); width:min(520px, calc(100vw - 20px)); height:62px;
    padding:6px; gap:2px; border-radius:20px; border:1px solid rgba(255,255,255,.08);
    background:rgba(18,20,25,.94); -webkit-backdrop-filter:blur(20px) saturate(160%); backdrop-filter:blur(20px) saturate(160%);
    box-shadow:0 10px 40px rgba(0,0,0,.55);
  }
  .ws-dock a,.ws-dock button{flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    border:0; background:none; border-radius:14px; font:600 10.5px var(--f-body); color:var(--ink3); text-decoration:none !important; cursor:pointer; padding:0}
  .ws-dock svg{width:19px; height:19px}
  .ws-dock a[aria-current="page"],.ws-dock button.on{color:var(--gold2); background:rgba(255,255,255,.07)}
  .ws-more:not([hidden]){display:block; position:fixed; inset:0; z-index:70; background:rgba(0,0,0,.5)}
  .ws-more-card{position:absolute; left:10px; right:10px; bottom:calc(84px + env(safe-area-inset-bottom, 0px)); border-radius:20px; padding:8px 10px 12px;
    background:#14161B; border:1px solid var(--ln2); box-shadow:0 -10px 40px rgba(0,0,0,.6); max-width:520px; margin:0 auto}
  .ws-more-card .grab{width:38px; height:5px; border-radius:3px; background:#3C424E; margin:4px auto 10px}
  .ws-more-card a{display:flex; align-items:center; gap:12px; height:48px; padding:0 12px; border-radius:12px; color:var(--ink); text-decoration:none !important; font-weight:600; font-size:14px}
  .ws-more-card a svg{width:19px; height:19px; color:var(--ink3)}
  .ws-more-card a[aria-current="page"]{background:rgba(201,162,75,.1); box-shadow:inset 0 0 0 1px rgba(201,162,75,.3)}
  .ws-more-card a[aria-current="page"] svg{color:var(--gold2)}
  .ws-more-card .ws-me{margin-top:8px; padding:12px 6px 2px}
  /* a panel that holds the thing you tapped is a sheet over the list */
  .ws-rp.sheet{position:fixed; z-index:80; left:0; right:0; bottom:0; top:auto; height:auto; max-height:88vh; border-left:0;
    border-top:1px solid var(--ln2); border-radius:22px 22px 0 0; background:#14161B; box-shadow:0 -20px 50px rgba(0,0,0,.65);
    padding:16px 16px calc(18px + env(safe-area-inset-bottom, 0px)); transform:translateY(105%); transition:transform .22s ease; visibility:hidden}
  .ws-rp.sheet.up{transform:none; visibility:visible}
  .ws-rp.sheet::before{content:""; display:block; width:38px; height:5px; border-radius:3px; background:#3C424E; margin:-6px auto 8px; flex:none}
  .ws-scrim:not([hidden]){display:block; position:fixed; inset:0; z-index:75; background:rgba(0,0,0,.5)}
  body.ws-lock{overflow:hidden}
  /* a panel that is part of the page (filters, the chart list, the preview) sits in the flow */
  .ws-rp:not(.sheet){position:static; height:auto; overflow:visible; border-left:0; background:none; padding:0 14px 24px}
  .bd-row{grid-template-columns:minmax(0,1fr) auto auto; grid-template-areas:"n px ev" "n fair bet"; gap:4px 10px; padding:10px 12px}
  .bd-n{grid-area:n} .bd-px{grid-area:px} .bd-ev{grid-area:ev} .bd-fair{grid-area:fair} .bd-bet{grid-area:bet; height:26px; padding:0 8px}
  .bd-fair{display:flex; gap:5px; align-items:baseline; justify-content:flex-end}
  .bd-fair s{display:inline}
  .bd-bn{display:none}
  .bd-n b{white-space:normal}
  .bd-gh{padding:10px 12px}
  .bd-hd{display:none}
  .bd-flat{border-radius:14px}
}
@media(max-width:560px){
  .ws-fr > select{flex:1 1 140px}
  .ws label.ev input{width:90px}
  .on3 b{font-size:16px}
  .lad-r{grid-template-columns:minmax(0,1fr) 84px 84px}
}

/* ── the phone's filter tray: sports and search stay, the rest behind "Filters" ── */
.ws-ftog{display:none}
@media(max-width:1099px){
  .ws-fb .fx{display:none !important}
  .ws-fb.open .fx{display:inline-flex !important}
  .ws-fb.open select.fx{display:block !important}
  .ws-ftog{display:inline-flex; align-items:center; gap:6px; height:38px; padding:0 14px; border-radius:11px; border:1px solid var(--ln2);
    background:var(--p2); color:var(--ink); font:600 12.5px var(--f-body); cursor:pointer; flex:none}
  .ws-ftog i{font-style:normal; font:700 10.5px var(--mono); color:#16110A; background:var(--gold2); border-radius:999px; padding:0 6px; line-height:17px}
  .ws-ftog i:empty{display:none}
  .ws-fb.open .ws-ftog{border-color:var(--gold-line)}
}

/* ═══════════════ MARKET ═══════════════ */
.mk-head,.mk-row{display:grid; grid-template-columns:92px minmax(0,1fr) repeat(3,minmax(140px,168px)); gap:10px}
.mk-head{padding:0 15px 8px; font:600 10px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3)}
.mk-head span:nth-child(n+3){padding-left:2px}
.mk-list{display:flex; flex-direction:column; gap:10px}
.mk-row{align-items:start; padding:10px 14px; border:1px solid var(--ln); border-radius:16px; background:var(--p1); cursor:pointer; transition:border-color .12s, background .12s}
.mk-row:hover{border-color:var(--ln3)}
.mk-row.on{border-color:rgba(201,162,75,.55); box-shadow:0 0 0 1px rgba(201,162,75,.2), 0 10px 30px rgba(201,162,75,.06)}
.mk-row:focus-visible{outline:2px solid var(--gold); outline-offset:2px}
.mk-when{display:flex; flex-direction:column; gap:2px; padding-top:8px; min-width:0}
.mk-when b{font:600 12.5px var(--mono); color:var(--ink); white-space:nowrap}
.mk-when small{font-size:11px; color:var(--ink3); white-space:nowrap}
.mk-when em{font-style:normal; font-weight:700; letter-spacing:.06em; color:var(--neg2)}
.mk-props{display:inline-block; margin-top:5px; width:max-content; font-size:10.5px; font-weight:600; color:var(--ink2); background:var(--p2); border:1px solid var(--ln2); border-radius:999px; padding:1px 7px}
.mk-teams{display:flex; flex-direction:column; gap:6px; min-width:0}
.mk-tm{display:flex; align-items:center; gap:8px; height:34px; min-width:0; font-weight:600; font-size:13.5px; color:var(--ink)}
.mk-tm span.full,.mk-tm span.nick{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mk-tm .nick{display:none}
.mk-tm.dim{color:var(--ink3); font-size:12.5px}
.mk-tm .lg.sp{visibility:hidden}
.mk-tm .lg{min-width:38px; text-align:center}
.mk-comp{display:block; font-size:11px; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:-2px}
.mk-cells{display:flex; flex-direction:column; gap:6px; min-width:0}
.mk-px{display:flex; align-items:center; gap:6px; height:34px; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:0 6px 0 10px; min-width:0}
.mk-px b{font:600 12.5px var(--mono); color:var(--ink); white-space:nowrap}
.mk-px .ln{font:500 11px var(--mono); color:var(--ink3); white-space:nowrap}
.mk-px .lim{font:500 10px var(--mono); color:var(--ink3); white-space:nowrap; margin-left:auto}
.mk-px .mk-logo{margin-left:auto; display:inline-flex; flex:none}
.mk-px .lim + .mk-logo{margin-left:4px}
.mk-px.nil{justify-content:center; color:var(--ink3)}
.mk-px.none{visibility:hidden}
.mk-logo .blogo,.mk-logo .glyph{width:22px; height:22px; border-radius:6px}
.mk-pre{margin-left:8px; border:1px solid var(--ln2); background:var(--p2); color:var(--ink); border-radius:9px; padding:5px 10px; font:600 12px var(--f-body); cursor:pointer}
/* the panel */
.mk-hist{display:flex; align-items:center; gap:10px; border:1px solid var(--ln); background:var(--p2); border-radius:12px; padding:10px 12px; margin:0 0 12px; text-decoration:none !important; color:var(--ink) !important}
.mk-hist:hover{border-color:var(--gold-line)}
.mk-hist b{font-size:13px; flex:none}
.mk-hist span{font-size:12px; color:var(--ink3); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mk-hist i{margin-left:auto; font-style:normal; color:var(--ink3); font-size:16px}
.mk-bt{display:flex; flex-direction:column; gap:6px}
.mk-br{display:grid; grid-template-columns:22px minmax(0,1fr) 96px 96px; gap:10px; align-items:center; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:5px 10px; font-size:12.5px; min-height:38px}
.mk-bt.three .mk-br{grid-template-columns:22px minmax(0,1fr) 74px 74px 74px; gap:6px}
.mk-bh{background:none; border:0; min-height:0; padding:0 10px 2px; font:600 9.5px var(--f-body); letter-spacing:.08em; text-transform:uppercase; color:var(--ink3)}
.mk-bh span:first-child{grid-column:1 / 3}
.mk-bh span{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mk-bh span:nth-child(n+2){text-align:right}
.mk-br .bn{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink)}
.mk-br .tg,.ws .tg{font:600 9px var(--f-body); letter-spacing:.08em; color:var(--gold2); margin-left:6px}
.mp{justify-self:end; display:inline-flex; align-items:baseline; gap:4px; font:600 13px var(--mono); color:var(--ink) !important; text-decoration:none !important; border-radius:7px; padding:3px 7px; white-space:nowrap; border:1px solid transparent}
a.mp:hover{border-color:var(--ln3)}
.mp small{font:500 9.5px var(--mono); color:var(--ink3)}
.mp.top{color:var(--pos2) !important; background:rgba(69,160,106,.14); border-color:rgba(69,160,106,.4)}
.mp.none{color:var(--ink3) !important}
.mk-gos{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.mk-gos.three{grid-template-columns:1fr 1fr 1fr; gap:8px}
.mk-gos .go{font-size:13px; height:42px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mk-gos.three .go{font-size:12px; padding:0 6px}
.mk-gatewrap:not([hidden]){position:fixed; inset:0; z-index:90; background:rgba(0,0,0,.6); display:flex; align-items:center; justify-content:center; padding:20px}
.mk-gatecard{max-width:420px; width:100%; text-align:center; display:flex; flex-direction:column; gap:10px; padding:26px 24px !important}
.mk-gatecard h2{margin:0; font-size:22px; letter-spacing:-.02em}
.mk-gatecard p{margin:0 0 6px; color:var(--ink2); font-size:13.5px; line-height:1.5}
.mk-gatecard .eyebrow{font:700 10.5px var(--f-body); letter-spacing:.18em; text-transform:uppercase; color:var(--gold)}
@media(max-width:1399px) and (min-width:1100px){
  .mk-head,.mk-row{grid-template-columns:76px minmax(0,1fr) repeat(3,minmax(112px,140px)); gap:8px}
  .mk-px .lim{display:none}
}
@media(max-width:1099px){
  .mk-head,.mk-row{grid-template-columns:minmax(0,1fr) repeat(3,minmax(66px,92px)); gap:6px}
  .mk-head span:first-child{display:none}
  .mk-head{padding:0 13px 6px}
  .mk-row{grid-template-areas:"when when when when" "teams ml sp tt"; padding:10px 12px; row-gap:6px}
  .mk-when{grid-area:when; flex-direction:row; align-items:center; gap:8px; padding:0}
  .mk-when small,.mk-when .mk-props{margin:0}
  .mk-teams{grid-area:teams}
  .mk-cells{grid-area:ml} .mk-cells.c-sp{grid-area:sp} .mk-cells.c-tt{grid-area:tt}
  .mk-px,.mk-tm{height:40px}
  .mk-px{flex-wrap:wrap; align-content:center; gap:0 4px; padding:2px 5px 2px 7px}
  .mk-px .ln{flex-basis:100%; font-size:9.5px; line-height:1}
  .mk-px b{font-size:12px}
  .mk-px .lim{display:none}
  .mk-logo .blogo,.mk-logo .glyph{width:16px; height:16px; border-radius:4px}
  .mk-tm{font-size:13px}
  .mk-tm .lg{display:none}
  .mk-tm .full{display:none} .mk-tm .nick{display:block}
  .mk-row.mlonly .mk-cells.c-sp,.mk-row.mlonly .mk-cells.c-tt{display:none}
  .mk-row.mlonly{grid-template-areas:"when when when when" "teams teams teams ml"}
}

/* ═══════════════ OUTLIERS ═══════════════ */
.ol-head,.ol-row{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(120px,1fr) 176px 88px 74px; gap:14px; align-items:center}
.ol-head{padding:0 16px 8px; font:600 10px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3)}
.ol-head span:nth-child(n+3){text-align:right}
.ol-list{display:flex; flex-direction:column; gap:8px}
.ol-row{padding:10px 16px; border:1px solid var(--ln); border-radius:14px; background:var(--p1); cursor:pointer; transition:border-color .12s}
.ol-row:hover{border-color:var(--ln3)}
.ol-row.on{border-color:rgba(201,162,75,.55); box-shadow:0 0 0 1px rgba(201,162,75,.2), 0 10px 30px rgba(201,162,75,.06)}
.ol-row:focus-visible{outline:2px solid var(--gold); outline-offset:2px}
.ol-n{min-width:0}
.ol-n b{display:block; font-weight:600; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ol-n i{display:block; font-style:normal; color:var(--ink3); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ol-strip{position:relative; height:24px; margin:0 6px}
.ol-strip::before{content:""; position:absolute; left:0; right:0; top:11px; height:2px; border-radius:2px; background:var(--ln2)}
.ol-strip .d{position:absolute; top:7px; width:10px; height:10px; margin-left:-5px; border-radius:50%; background:#5A5F69; box-shadow:0 0 0 2px var(--p1)}
.ol-strip .d.x{background:#3A3E46}
.ol-strip .d.o{z-index:2; width:14px; height:14px; top:5px; margin-left:-7px; background:var(--gold2); box-shadow:0 0 0 2px var(--p1), 0 0 12px rgba(227,199,120,.5)}
.ol-strip .a{position:absolute; z-index:1; top:2px; width:2px; height:20px; margin-left:-1px; background:var(--ink2); border-radius:1px}
.ol-strip.blur{filter:blur(3px); opacity:.5}
.ol-strip.big{height:32px; margin:6px 6px 2px}
.ol-strip.big::before{top:15px}
.ol-strip.big .d{top:11px} .ol-strip.big .d.o{top:9px} .ol-strip.big .a{top:4px; height:24px}
.ol-px{display:flex; align-items:center; gap:7px; justify-content:flex-end; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:5px 10px 5px 7px; min-width:0}
.ol-px .ol-bn{font-size:12px; color:var(--ink2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-right:auto}
.ol-px b{font:600 13.5px var(--mono); white-space:nowrap}
.ol-avg{font:500 12.5px var(--mono); color:var(--ink2); text-align:right; white-space:nowrap}
.ol-avg s{display:block; text-decoration:none; font:600 9.5px var(--f-body); letter-spacing:.1em; color:var(--ink3)}
.ol-pct{text-align:right}
.pctp{display:inline-block; font:700 12.5px var(--mono); color:var(--gold2); background:rgba(201,162,75,.12); border:1px solid rgba(201,162,75,.38); border-radius:9px; padding:5px 8px; white-space:nowrap}
.ol-big{display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--ln); border-radius:14px; overflow:hidden; margin:16px 0 12px; background:var(--p1)}
.ol-big > div{padding:12px 14px; min-width:0}
.ol-big > div + div{border-left:1px solid var(--ln)}
.ol-big s{display:block; text-decoration:none; font:600 9.5px var(--f-body); letter-spacing:.1em; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ol-big b{display:block; font:600 22px var(--mono)}
.ol-big i{display:flex; align-items:center; gap:6px; font-style:normal; font-size:11.5px; color:var(--ink3); margin-top:2px}
.ol-big i .blogo,.ol-big i .glyph{width:16px; height:16px; border-radius:4px}
.ol-call{border:1px solid rgba(201,162,75,.35); background:linear-gradient(180deg,rgba(201,162,75,.10),rgba(201,162,75,.02)); border-radius:12px; padding:11px 13px; font-size:12.5px; color:var(--ink2); line-height:1.5; margin-bottom:12px}
.ol-call b{color:var(--gold2)}
.ol-sbox{border:1px solid var(--ln); border-radius:12px; padding:12px 14px 8px; margin-bottom:12px; background:var(--p1)}
.ol-ax{display:flex; justify-content:space-between; font:500 10.5px var(--mono); color:var(--ink3)}
.ol-lh,.ol-lr{display:grid; grid-template-columns:minmax(0,1fr) 84px 60px; gap:10px; align-items:center}
.ol-lh{padding:0 10px 4px; font:600 9.5px var(--f-body); letter-spacing:.1em; text-transform:uppercase; color:var(--ink3)}
.ol-lh span:nth-child(n+2){text-align:right}
.ol-list2{display:flex; flex-direction:column; gap:6px}
.ol-lr{border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:5px 10px; min-height:40px}
.ol-lr .lb{display:flex; align-items:center; gap:6px; min-width:0}
.ol-lr .lb .book{display:flex; align-items:center; gap:8px; font-size:12.5px; min-width:0; color:var(--ink); text-decoration:none}
.ol-lr .lb .book .ext{color:var(--gold2); font-size:11px}
.ol-lr .lb .book .site{display:none}
.ol-lr .tg{margin-left:4px; white-space:nowrap}
.ol-lr .tg.dim{color:var(--ink3)}
.ol-lr > b{font:600 13px var(--mono); text-align:right}
.ol-lr > span{font:600 12px var(--mono); text-align:right}
.ol-lr.out{border-color:rgba(201,162,75,.5); background:rgba(201,162,75,.08)}
.ol-lr.x{opacity:.6}
.lvtag{color:var(--neg2); font-weight:700; letter-spacing:.04em; white-space:nowrap}
@media(max-width:1399px) and (min-width:1100px){
  .ol-head,.ol-row{grid-template-columns:minmax(0,1.2fr) minmax(90px,.8fr) 120px 76px 68px; gap:10px}
  .ol-px .ol-bn{display:none}
}
@media(max-width:1099px){
  .ol-head{display:none}
  .ol-row{grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"n pct" "strip strip" "px avg"; gap:6px 10px; padding:10px 12px}
  .ol-n{grid-area:n} .ol-strip{grid-area:strip} .ol-px{grid-area:px; justify-self:start} .ol-avg{grid-area:avg; display:flex; gap:6px; align-items:baseline; justify-content:flex-end} .ol-pct{grid-area:pct}
  .ol-avg s{display:inline}
  .ol-px .ol-bn{display:inline}
}

/* ═══════════════ PARLAY SEARCH ═══════════════ */
.p-form{padding:12px; margin-bottom:12px}
.p-quick{display:grid; grid-template-columns:minmax(0,1.6fr) minmax(140px,1fr) 110px 140px; gap:10px; align-items:end}
.p-quick .btn{height:38px}
.p-quick2{display:flex; flex-wrap:wrap; gap:10px 16px; margin-top:12px}
.p-form .field{display:flex; flex-direction:column; gap:5px; min-width:0}
.p-form .field > label{font:600 9.5px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3); margin:0 0 0 2px}
.p-form .field > label .dim{text-transform:none; letter-spacing:0; font-weight:500}
.ws .chips{display:flex; flex-wrap:wrap; gap:6px}
.ws .chips label{display:inline-flex; align-items:center; gap:7px; border:1px solid var(--ln); background:var(--p2); border-radius:999px; padding:6px 12px; font-size:12px; color:var(--ink2); cursor:pointer; min-height:0}
.ws .chips label:has(input:checked){border-color:rgba(201,162,75,.5); background:rgba(201,162,75,.10); color:var(--ink)}
.ws .chips input{position:absolute; opacity:0; width:0; height:0}
.ws .chips label .blogo,.ws .chips label .glyph{width:16px; height:16px; border-radius:4px}
.p-more{margin-top:12px; border-top:1px solid var(--ln); padding-top:10px}
.p-more summary{cursor:pointer; font-weight:600; font-size:12.5px; color:var(--gold2); list-style:none}
.p-more summary::-webkit-details-marker{display:none}
.p-more summary::after{content:" ⌄"}
.p-more[open] summary::after{content:" ⌃"}
.p-more .p-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr)); gap:12px 14px; margin-top:12px}
.p-more .p-wide{grid-column:1 / -1}
.p-more .p-actions{margin-top:12px}
.p-status{display:flex; align-items:center; gap:9px; margin-top:12px; font-size:13px; color:var(--ink2)}
.p-status.bad{color:var(--neg2)}
.pc-fun{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 12px; font:500 11.5px var(--mono); color:var(--ink3)}
.pc-fun span{border:1px solid var(--ln); border-radius:999px; padding:4px 10px; background:var(--p1)}
.pc-fun span b{color:var(--ink); font-weight:600}
.pc-fun span.g{border-color:rgba(201,162,75,.4); color:var(--gold2)}
.pc-fun span.g b{color:var(--gold2)}
.pc-fun i{font-style:normal; color:var(--ln3)}
.pc-fun em{margin-left:auto; font-style:normal}
.pc-list{display:flex; flex-direction:column; gap:10px}
.pc-card{display:grid; grid-template-columns:minmax(0,1fr) repeat(3,124px) 88px; gap:10px; align-items:stretch; padding:10px 14px;
  border:1px solid var(--ln); border-radius:16px; background:var(--p1); cursor:pointer; transition:border-color .12s}
.pc-card:hover{border-color:var(--ln3)}
.pc-card.on{border-color:rgba(201,162,75,.55); box-shadow:0 0 0 1px rgba(201,162,75,.2), 0 10px 30px rgba(201,162,75,.06)}
.pc-card .pc-tiles{display:contents}
.pc-h{display:flex; align-items:center; gap:8px; font-size:11.5px; color:var(--ink3); margin-bottom:6px; min-width:0}
.pc-h .g{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pc-h code{margin-left:auto; font:600 10.5px var(--mono); color:var(--ink2); flex:none}
.pc-legs div{display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:1px 0; min-width:0}
.pc-legs div span{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pc-legs div b{font:600 12px var(--mono); color:var(--ink2); flex:none}
.pt{border:1px solid var(--ln); background:var(--p2); border-radius:11px; padding:8px 10px; display:flex; flex-direction:column; justify-content:center; gap:3px; min-width:0}
.pt .bk{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--ink2); font-weight:600; min-width:0; white-space:nowrap; overflow:hidden}
.pt .bk .blogo,.pt .bk .glyph{width:16px; height:16px; border-radius:4px}
.pt b{font:600 15px var(--mono); white-space:nowrap}
.pt i{font-style:normal; font:600 8.5px var(--f-body); letter-spacing:.07em; color:var(--ink3); white-space:nowrap}
.pt.real{border-color:rgba(201,162,75,.45); background:linear-gradient(180deg,rgba(201,162,75,.10),rgba(201,162,75,.03))}
.pt.real i{color:var(--gold2)}
.pt.none b{font:500 11px var(--f-body); color:var(--ink3); white-space:normal}
.pc-gap{display:flex; flex-direction:column; align-items:flex-end; justify-content:center; gap:4px}
.pc-gap s{text-decoration:none; font:600 9.5px var(--f-body); letter-spacing:.1em; color:var(--ink3)}
.pc-gap small{font:500 11px var(--mono); color:var(--ink3); white-space:nowrap}
.pc-card.old{display:block; padding:0; overflow:hidden}
.pc-card.old .p-img{display:block; width:100%; max-height:280px; object-fit:contain; background:var(--p2)}
.pc-card.old .p-text,.pc-text{padding:12px 14px; font-size:13px; line-height:1.6; color:var(--ink2); overflow-wrap:anywhere}
.pc-text b{color:var(--ink)}
.pc-text .btn{margin-top:8px}
.pc-img{display:block; width:100%; border-radius:12px; margin-top:10px}
.pc-legbox{border:1px solid var(--ln); border-radius:12px; background:var(--p1); padding:4px 12px; margin:14px 0 12px}
.pc-legbox div{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid var(--ln); font-size:12.5px}
.pc-legbox div:last-child{border:0}
.pc-legbox div span{min-width:0}
.pc-legbox div i{display:block; font-style:normal; color:var(--ink3); font-size:11.5px}
.pc-legbox b{font:600 13px var(--mono); flex:none}
.on3.two-up{grid-template-columns:1fr 1fr}
.pc-shop{display:flex; flex-direction:column; gap:6px; margin-bottom:12px}
.pc-sr{display:grid; grid-template-columns:22px minmax(0,1fr) auto; gap:10px; align-items:center; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:6px 10px}
.pc-sr .nm{display:flex; flex-direction:column; line-height:1.25; min-width:0; font-size:12.5px}
.pc-sr .nm i{font-style:normal; font:600 9px var(--f-body); letter-spacing:.08em; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pc-sr > b{font:600 13px var(--mono)}
.pc-sr.real{border-color:rgba(201,162,75,.45); background:rgba(201,162,75,.07)}
.pc-sr.real .nm i{color:var(--gold2)}
.pc-sr.me{box-shadow:inset 3px 0 0 var(--gold)}
.pc-sr.miss{opacity:.6}
.pc-sr.miss > b{font:500 11.5px var(--f-body); color:var(--ink3)}
.pc-slip{margin:0 0 12px; border:1px solid var(--ln); border-radius:12px; background:var(--p1)}
.pc-slip summary{cursor:pointer; padding:10px 12px; font-size:12.5px; font-weight:600; color:var(--ink2)}
.pc-slip img{display:block; width:100%; border-radius:0 0 12px 12px}
.p-list{margin-top:14px; padding:12px 14px}
.p-list-h{display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-weight:600; font-size:13px; margin-bottom:8px}
.p-list-h input{margin-left:auto; max-width:220px}
.p-tblw{max-height:420px; overflow:auto}
.ws .p-tbl{width:100%; border-collapse:collapse; font-size:12.5px}
.ws .p-tbl th{position:sticky; top:0; background:var(--p1); text-align:left; font:600 9.5px var(--f-body); letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); padding:7px 8px; border-bottom:1px solid var(--ln)}
.ws .p-tbl td{padding:7px 8px; border-bottom:1px solid var(--ln); vertical-align:top}
.ws .p-tbl td small{display:block; font-size:11px}
.ws .p-tbl .t-r{text-align:right; white-space:nowrap}
.ws .p-tbl .num{font-family:var(--mono)}
.spin{width:14px; height:14px; border-radius:50%; border:2px solid var(--ln3); border-top-color:var(--gold); animation:ws-spin .8s linear infinite; flex:none; display:inline-block}
@keyframes ws-spin{to{transform:rotate(360deg)}}
@media(max-width:1399px) and (min-width:1100px){ .pc-card{grid-template-columns:minmax(0,1fr) repeat(3,108px) 76px; gap:8px} .pt b{font-size:13.5px} }
@media(max-width:1099px){
  .p-quick{grid-template-columns:1fr 1fr}
  .p-quick .p-sp{grid-column:1 / -1}
  .p-quick .btn{grid-column:1 / -1}
  .pc-card{grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-areas:"l l l" "t1 t2 t3" "gap gap gap"; padding:10px 12px}
  .pc-card .pc-l{grid-area:l}
  .pc-gap{grid-area:gap; flex-direction:row; justify-content:space-between; align-items:center}
  .pc-gap s{display:none}
  .pt{padding:6px 8px}
  .pt b{font-size:12.5px}
  .pt i{font-size:7.5px}
}

/* ═══════════════ LINE DATA ═══════════════ */
.ws .chartpanel{padding:14px 16px; display:flex; flex-direction:column; gap:10px}
.ws .charthead{display:flex; align-items:flex-start; gap:14px; flex-wrap:wrap}
.ws .charthead > div{flex:1 1 260px; min-width:0}
.ws .charthead h2{font-size:17px; color:var(--ink); letter-spacing:-.01em; margin:0; text-transform:none}
.ws .charthead p{margin:3px 0 0; font-size:12.5px; color:var(--ink3)}
.ws #ln-note{font-size:12px; flex:0 1 auto}
.ws .chartbox{height:auto; display:flex; flex-direction:column}
.ws .chartbox .ch-stage{flex:none; height:min(46vh,460px)}
.ln-facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-top:12px}
.ln-facts:empty{display:none}
.lf{border:1px solid var(--ln); border-radius:12px; background:var(--p1); padding:10px 12px; min-width:0}
.lf s{display:block; text-decoration:none; font:600 9.5px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3)}
.lf b{display:block; font:600 16px var(--mono); color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:3px 0 1px}
.lf b.gold{color:var(--gold2)}
.lf i{display:block; font-style:normal; font-size:11px; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ln-search{display:flex; gap:8px; margin-bottom:10px}
.ln-search input{flex:1 1 auto; min-width:0}
.ws .picklist{flex:1 1 auto; min-height:200px; overflow:auto; border:1px solid var(--ln); border-radius:14px; background:var(--p1); box-shadow:none; max-height:none}
.ws .pickrow{display:block; width:100%; text-align:left; background:none; border:0; border-bottom:1px solid var(--ln); padding:10px 12px; cursor:pointer; color:var(--ink); font:inherit}
.ws .pickrow:hover{background:rgba(255,255,255,.03)}
.ws .pickrow.on{background:rgba(201,162,75,.08); box-shadow:inset 3px 0 0 var(--gold)}
.ws .pickrow .n{display:block; font-size:13px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ws .pickrow .g{display:flex; gap:7px; align-items:center; margin-top:3px; font-size:11.5px; color:var(--ink3); white-space:nowrap; overflow:hidden}
.ws .pickrow .g .gm{min-width:0; overflow:hidden; text-overflow:ellipsis}
.ws .pickrow .g .lg{font-size:9px; padding:1px 5px}
.ws .pickrow .g .dim{margin-left:auto; flex:none}
.ln-rp .ws-note{margin-top:10px}
@media(max-width:1099px){
  #v-lines .ws-page{display:flex; flex-direction:column; align-items:stretch}
  #v-lines .ln-rp{order:-1; padding:18px 14px 0}
  #v-lines .ws-main{padding-top:6px}
  #v-lines .ws-main .ws-h{display:none}
  .ws .picklist{max-height:34vh}
  .ws .chartbox .ch-stage{height:min(48vh,380px)}
}

/* ═══════════════ HISTORY ═══════════════ */
.hs-rp .hs-form{display:flex; flex-direction:column; gap:14px; margin-top:16px}
.hs-rp .field{display:flex; flex-direction:column; gap:6px; min-width:0}
.hs-rp .field > label{font:600 9.5px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3); margin:0}
.hs-rp .field > label .dim{text-transform:none; letter-spacing:0; font-weight:500}
.hs-rp .seg{width:100%}
.hs-rp .seg button{flex:1 1 auto}
.hs-rp .hs-bookchips{display:grid; grid-template-columns:1fr 1fr; gap:6px}
.hs-rp .hs-bookchips label{border-radius:10px; padding:7px 9px; min-width:0}
.hs-rp .hs-bookchips label:has(input:checked)::after{content:"✓"; margin-left:auto; color:var(--gold2); font-size:11px; font-weight:700}
.hs-two-f{display:grid; grid-template-columns:1fr 1fr; gap:10px 12px}
.hs-rp .rp-foot{position:sticky; bottom:-18px; margin:14px -22px -18px; padding:12px 22px 18px; background:linear-gradient(180deg,rgba(18,20,25,0),rgba(18,20,25,.96) 30%)}
.hs-rp .rp-foot .p-status{margin:0 0 10px}
.hs-note{font-size:11.5px; color:var(--ink3); margin:0}
.ws .hs-tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px}
.ws .hs-tile{background:var(--p1); border:1px solid var(--ln); border-radius:14px; padding:12px 14px; min-width:0}
.ws .hs-tile small{font:600 9.5px var(--f-body); letter-spacing:.12em; color:var(--ink3)}
.ws .hs-tile b{font:600 19px var(--mono); margin-top:3px; white-space:nowrap}
.ws .hs-bk{white-space:nowrap}
.ws .hs-bk .blogo,.ws .hs-bk .glyph,.ws .hs-c-book .blogo{display:inline-block; vertical-align:middle; width:20px; height:20px; margin-right:8px}
.ws .hs-tile b.pos{color:var(--pos2)} .ws .hs-tile b.neg{color:var(--neg2)}
.ws .hs-two{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:12px}
.ws .hs-chart{background:var(--p1); border:1px solid var(--ln); border-radius:16px; padding:12px 14px}
.ws .hs-tables{background:var(--p1); border:1px solid var(--ln); border-radius:16px; padding:14px; margin-top:12px}
.ws .hs-chart h3,.ws .hs-tables h3{font-size:13.5px; font-weight:650; color:var(--ink); margin:0 0 8px; text-transform:none; letter-spacing:-.01em}
.ws .hs-sub{color:var(--ink3)}
@media(max-width:1099px){
  #v-history .ws-page{display:flex; flex-direction:column; align-items:stretch}
  #v-history .hs-rp{order:0; padding:0 14px 8px}
  #v-history .ws-main{order:1; padding-top:10px}
  #v-history .hs-rp{order:-1}
  #v-history .ws-main .ws-h{display:none}
  .hs-rp .rp-foot{position:static; margin:14px 0 0; padding:0; background:none}
  .ws .hs-two{grid-template-columns:minmax(0,1fr)}
  .ws .hs-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.hs-rp-h{display:none}
@media(max-width:1099px){ .hs-rp-h{display:block} }

/* ═══════════════ BOT SETUP ═══════════════ */
.ws .statusbar{display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:0; margin:0 0 14px; background:none; border:0; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none}
.ws .statusbar .sp{flex:1}
.ws .pill{display:inline-flex; align-items:center; gap:7px; border:1px solid var(--ln); background:var(--p1); border-radius:999px; padding:6px 12px; font-size:12px; font-weight:600; color:var(--ink2)}
.ws .pill.ok{border-color:rgba(69,160,106,.4); color:var(--pos2); background:rgba(69,160,106,.06)}
.ws .pill.ok::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--pos2)}
.ws .pill.no{border-color:rgba(199,123,57,.4); color:#D9A066; background:rgba(199,123,57,.06)}
.ws .steps{display:flex; flex-direction:column; gap:12px}
.ws .step{position:relative; border:1px solid var(--ln); border-radius:16px; background:var(--p1); padding:16px 18px 18px 64px}
.ws .step::before{content:attr(data-n); position:absolute; left:18px; top:16px; width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  font:700 13px var(--mono); background:rgba(201,162,75,.14); color:var(--gold2); box-shadow:inset 0 0 0 1px rgba(201,162,75,.4); border:0}
.ws .step.done::before{content:"✓"; background:var(--pos); color:#0C0D10; box-shadow:none}
.ws .step h3{font-size:15px; font-weight:700; margin:4px 0 2px; color:var(--ink)}
.ws .step .sub{font-size:12.5px; color:var(--ink3); margin:0 0 12px}
.ws .ws-in{border:1px solid var(--ln); background:var(--p2); border-radius:12px; padding:12px 14px}
.ws .lbl{font:600 9.5px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3)}
.ws .grid2{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr)); gap:16px}
.ws .field > label{font:600 9.5px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3)}
.ws .codebox{font:600 19px var(--mono); letter-spacing:.12em; background:var(--p1); border:1px dashed var(--gold-line); border-radius:12px; padding:12px 16px; color:var(--gold2); display:inline-block}
.ws .row2{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.ws label.sw{display:inline-flex; align-items:center; gap:9px; cursor:pointer; font-size:13px; font-weight:600}
.bot-rp #step-4{border:0; background:none; padding:0; margin-top:14px}
.bot-rp #step-4::before{display:none}
.bot-big{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
.bot-big .bigcount{font:600 40px var(--mono); color:var(--gold2); line-height:1}
.bot-big .dim{font-size:13px}
.dm{border:1px solid var(--ln); border-radius:14px; background:#1A1C22; padding:12px; margin:14px 0 4px}
.dm-who{display:flex; align-items:center; gap:9px; margin-bottom:8px}
.dm-who img{width:30px; height:30px; border-radius:50%}
.dm-who b{font-size:13px}
.dm-who em{font-style:normal; font:700 9px var(--f-body); background:#5865F2; color:#fff; border-radius:4px; padding:1px 4px}
.dm-who i{font-style:normal; color:var(--ink3); font-size:11px}
.dm-emb{border-left:3px solid var(--gold); background:#22252C; border-radius:4px 8px 8px 4px; padding:10px 12px}
.dm-emb .t{display:block; font-size:13.5px; margin-bottom:2px}
.dm-emb .gm{color:var(--ink3); font-size:11.5px; margin-bottom:8px}
.dm-r{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px}
.dm-r s{display:block; text-decoration:none; font:600 9px var(--f-body); letter-spacing:.1em; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.dm-r b{font:600 14px var(--mono)}
.bot-rp .preview-list{display:flex; flex-direction:column; gap:6px; border:0; border-radius:0; overflow:visible}
.bot-rp .pv{display:grid; grid-template-columns:22px minmax(0,1fr) auto auto; gap:10px; align-items:center; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:6px 10px}
.bot-rp .pv > .dim{grid-column:1 / -1}
.bot-rp .pv .nm{display:flex; flex-direction:column; line-height:1.3; min-width:0}
.bot-rp .pv .nm b{font-size:12.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bot-rp .pv .nm i{font-style:normal; font-size:11px; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bot-rp .pv .px{font:600 12.5px var(--mono)}
.bot-rp .pv .evp{font-size:11.5px; padding:3px 7px}
.ws .savebar{position:sticky; bottom:-18px; display:flex; align-items:center; gap:12px; margin:auto -22px -18px; padding:14px 22px 18px; border:0; border-top:1px solid var(--ln); border-radius:0; background:rgba(18,20,25,.97); -webkit-backdrop-filter:none; backdrop-filter:none}
.ws .savebar .sp{flex:1}
.ws .savebar .btn{min-width:110px}
#bot-msg.ok{color:var(--pos2)} #bot-msg.bad{color:var(--neg2)}
@media(max-width:1099px){
  .ws .step{padding:14px 14px 16px 56px}
  .ws .step::before{left:14px; top:14px}
  .bot-rp{padding:4px 14px 24px}
  .ws .savebar{position:sticky; bottom:calc(84px + env(safe-area-inset-bottom, 0px)); margin:14px 0 0; border:1px solid var(--ln); border-radius:16px; padding:12px 14px}
}

/* ═══════════════ ARB CALCULATOR ═══════════════ */
.ws .legs{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.ws .arb-legs{grid-template-columns:1fr 44px 1fr; gap:0; align-items:center; margin-bottom:12px}
.arb-x{width:40px; height:40px; border-radius:50%; justify-self:center; border:1px solid var(--ln2); background:var(--p2); display:grid; place-items:center; color:var(--gold2); font-size:16px}
.ws .leg{padding:16px 18px}
.ws .leg-top{display:flex; align-items:center; gap:9px; margin-bottom:12px; min-width:0}
.ws .leg-top .d{width:9px; height:9px; border-radius:50%; flex:none}
.ws .leg-top span{font-size:13px; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ws .leg input{width:100%; height:46px !important; font:600 20px var(--mono) !important}
.ws .stake{margin-top:14px; padding-top:0; border:0; display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap}
.ws .stake-v{font:600 28px var(--mono); letter-spacing:-.02em}
.ws .stake-sub{font-size:12px; color:var(--ink3)}
.ws .arb-total{display:grid; grid-template-columns:1fr auto; gap:16px; align-items:end; padding:14px 18px; margin-bottom:12px}
.ws .arb-total input{height:46px !important; font:600 20px var(--mono) !important; width:100%}
.ws .verdict{display:flex; align-items:center; gap:14px; padding:14px 18px; margin-bottom:12px; flex-wrap:wrap}
.ws .verdict p{margin:0; font-size:13.5px; color:var(--ink2)}
.ws .metrics{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:0; overflow:hidden; margin-bottom:12px}
.ws .metrics .metric{padding:14px 18px; border-right:1px solid var(--ln)}
.ws .metrics .metric:last-child{border-right:0}
.ws .metrics.inset{border:1px solid var(--ln); border-radius:12px; margin:14px 0 0}
.ws .metric .k{font:600 9.5px var(--f-body); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3)}
.ws .metric .v{font:600 22px var(--mono); margin-top:3px}
.ws .note{margin-top:12px; border-left:1px solid var(--ln)}
.ws .note h2{font-size:13.5px; font-weight:650; color:var(--ink); margin:0 0 6px; text-transform:none; letter-spacing:-.01em}
.ws .note p{margin:0 0 8px; font-size:12.5px; color:var(--ink2); line-height:1.6}
.ws .note p:last-child{margin:0}
.ab{border:1px solid rgba(201,162,75,.45); background:rgba(201,162,75,.05); border-radius:14px; padding:12px 14px; margin:14px 0 0}
.ab .h{display:flex; align-items:center; gap:8px; margin-bottom:4px; min-width:0}
.ab .h b{font-size:13.5px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ab .h .pct{margin-left:auto; flex:none; font:700 12.5px var(--mono); color:var(--pos2); background:rgba(69,160,106,.14); border:1px solid rgba(69,160,106,.35); border-radius:8px; padding:3px 8px}
.ab .sub2{color:var(--ink3); font-size:11.5px; margin-bottom:8px}
.ab-r{display:grid; grid-template-columns:22px minmax(0,1fr) auto; gap:10px; align-items:center; border:1px solid var(--ln); background:var(--p2); border-radius:10px; padding:7px 10px; margin-top:6px; text-decoration:none !important; color:var(--ink) !important; font-size:12.5px}
a.ab-r:hover{border-color:var(--gold-line)}
.ab-r span{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ab-r i{font-style:normal; color:var(--ink3)}
.ab-r b{font:600 13px var(--mono)}
.ab-load{margin-top:10px; width:100%}
@media(max-width:1099px){
  .ws .arb-legs{grid-template-columns:1fr; gap:10px}
  .arb-x{display:none}
  .arb-rp{padding:0 14px 24px}
}
@media(max-width:560px){
  .ws .legs{grid-template-columns:1fr}
  .ws .arb-total{grid-template-columns:1fr}
  .ws .metrics{grid-template-columns:1fr 1fr}
}
.ph-only{display:none !important}
@media(max-width:1099px){ .ws-h.ph-only{display:flex !important; margin-bottom:14px} }

/* ── a laptop (1100-1365px): the sidebar folds to its icons so the list keeps
   its room; the names come back as tooltips ── */
@media(min-width:1100px) and (max-width:1365px){
  :root{ --side-w:76px; --rp-w:360px }
  .ws-side{padding:16px 10px 12px; align-items:center}
  .ws-brand{padding:4px 0 16px}
  .ws-brand > span,.ws-sec,.ws-nav a span,.ws-nav a em,.ws-me .who2,.ws-me .prem,.ws-me .nm,.ws-me .ws-in-btn{display:none}
  .ws-nav{width:100%}
  .ws-nav a{justify-content:center; padding:0; height:42px}
  .ws-nav a svg{width:19px; height:19px}
  .ws-nav a[data-nav="bot"]{margin-top:18px}
  .ws-dc{padding:0; width:44px; height:44px; border-radius:12px; display:grid; place-items:center}
  .ws-dc > *{display:none !important}
  .ws-dc::before{content:""; width:20px; height:20px; background:var(--gold2);
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'/%3E%3Cpath d='M10.3 21a1.94 1.94 0 0 0 3.4 0'/%3E%3C/svg%3E") center/contain no-repeat;
            mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9'/%3E%3Cpath d='M10.3 21a1.94 1.94 0 0 0 3.4 0'/%3E%3C/svg%3E") center/contain no-repeat}
  .ws-me{justify-content:center; padding:12px 0 0; width:100%}
  .ws-me .out{display:none}
}
@media(min-width:1100px) and (max-width:1365px){ .lad-r{grid-template-columns:minmax(0,1fr) 84px 84px; gap:6px} }

/* SWIPE DOWN TO CLOSE (2026-10-13 night): the sheet follows the finger with no
   lag while dragging, then the normal slide carries it out or springs it back */
.ws-rp.sheet.dragging,.ws-more-card.dragging{transition:none !important}
.ws-more-card{transition:transform .2s ease}
#ws-scrim{transition:opacity .2s ease}