/* ═══════════════════════════════════════════════════════════════
   NEXUS — app shell (forge UI language: dark, Cinzel/Cormorant)
   ═══════════════════════════════════════════════════════════════ */
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;overflow:hidden;}   /* app view — focus() was scrolling the top bar off-screen */
:root{
  --ui-bg:#0b0b18; --ui-panel:#121226; --ui-topbar:#0e0e20; --ui-stage:#0a0a16;
  --ui-border:#232238; --ui-border2:#1a1930; --ui-input:#141330; --ui-input-bdr:#2c2a44;
  --ui-text:#e6e2d4; --ui-text2:#a89ec0; --ui-text3:#6a6788; --ui-muted:#343250;
  --gold:#c9b97a; --gold-dim:rgba(201,185,122,.45);   /* was only in home.css → undefined on app pages (invisible dropdown border) */
}
body.day{
  --ui-bg:#e8e4da; --ui-panel:#f2efe8; --ui-topbar:#ece8de; --ui-stage:#dedad0;
  --ui-border:#c8c4ba; --ui-border2:#d8d4ca; --ui-input:#faf8f4; --ui-input-bdr:#b8b4aa;
  --ui-text:#1a1820; --ui-text2:#4a4858; --ui-text3:#6a6878; --ui-muted:#9a9898;
  --gold:#8a7020; --gold-dim:rgba(138,112,32,.4);
}
body{
  background:var(--ui-bg);color:var(--ui-text);
  font-family:'Cormorant Garamond',Georgia,serif;
  display:flex;flex-direction:column;height:100vh;overflow:hidden;font-size:15px;
}

/* ── SITE NAV (same grammar as home/forge/learn) ── */
.site-nav{
  display:flex;align-items:center;gap:30px;
  padding:10px 18px;background:var(--ui-topbar);
  border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
}
.sn-links{display:flex;gap:24px;align-items:center;}
.sn-links a{
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:2.5px;
  text-transform:uppercase;color:var(--ui-text2);text-decoration:none;
  transition:color .15s;cursor:pointer;
}
.sn-links a:hover{color:var(--gold);}
.sn-links a.on{color:var(--ui-text);border-bottom:1.5px solid var(--gold);padding-bottom:2px;}
.sn-links a.soon{opacity:.4;cursor:default;}
.sn-links a.soon:hover{color:var(--ui-text2);}
/* Watch ▾ dropdown — same grammar as the home nav */
.sn-drop{position:relative;display:inline-flex;align-items:center;}
.sn-drop-menu{
  display:none;position:absolute;top:calc(100% + 8px);left:-12px;z-index:120;min-width:216px;
  background:var(--ui-panel);border:1px solid var(--gold-dim);border-radius:12px;
  padding:7px;flex-direction:column;gap:1px;
  box-shadow:0 14px 34px rgba(0,0,0,.24), 0 2px 6px rgba(0,0,0,.12);
}
.sn-drop:hover .sn-drop-menu,.sn-drop:focus-within .sn-drop-menu{display:flex;}
.sn-drop-menu a{display:flex;flex-direction:column;gap:2px;padding:8px 12px;border-radius:9px;text-transform:none;letter-spacing:.4px;transition:background .12s ease;}
.sn-drop-menu a:hover{background:rgba(201,185,122,.14);}
.sn-drop-menu a b{font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold);}
.sn-drop-menu a em{font-family:'Spectral',serif;font-size:12px;font-style:italic;color:var(--ui-text2);}
/* 📜 game-log overlay rows */
.glog-list{display:flex;flex-direction:column;gap:10px;padding:4px 2px;}
.glog-r{border:.5px solid var(--ui-border2);border-radius:10px;padding:9px 12px;}
.glog-hd{font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;color:var(--ui-text3);text-transform:uppercase;}
.glog-hd b{color:var(--gold);}
.glog-win{font-family:'Cormorant Garamond',serif;font-size:15px;color:var(--ui-text);margin-top:3px;}
.glog-why{font-family:'Spectral',serif;font-size:12px;font-style:italic;color:var(--ui-text2);margin-top:3px;}
.glog-st{font-size:11px;color:var(--ui-text3);margin-top:5px;}
.glog-st b{color:var(--ui-text2);}
.glog-none{font-family:'Spectral',serif;font-style:italic;color:var(--ui-text3);padding:14px 4px;}
.sn-right{margin-left:auto;display:flex;gap:8px;align-items:center;}
.app-ver{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:9.5px;letter-spacing:.3px;
  color:var(--ui-text3);opacity:.7;white-space:nowrap;cursor:default;}

/* ── TABLE TOOLS BAR ── */
.top-bar{
  display:flex;align-items:center;
  padding:7px 18px;background:var(--ui-topbar);
  border-bottom:.5px solid var(--ui-border);flex-shrink:0;gap:14px;
}
.logo{font-family:'Cinzel',serif;font-size:20px;letter-spacing:5px;color:#c9b97a;white-space:nowrap;}
body.day .logo{color:#8a7020;}
.daynight{
  background:none;border:.5px solid var(--ui-border);border-radius:20px;
  padding:4px 12px;cursor:pointer;font-size:13px;color:var(--ui-text3);
  transition:all .2s;
}
.daynight:hover{border-color:var(--gold);color:var(--gold);}
.logo em{font-size:9px;letter-spacing:2px;color:var(--ui-text3);font-style:normal;display:block;margin-top:1px;font-family:'Cormorant Garamond',serif;}
.bar-group{display:flex;align-items:center;gap:8px;}
.bar-lbl{font-size:8px;letter-spacing:2px;color:var(--ui-text3);font-family:'Cinzel',serif;text-transform:uppercase;}

.seg{display:flex;gap:3px;background:var(--ui-panel);border:.5px solid var(--ui-border);border-radius:7px;padding:3px;}
.seg button{
  background:none;border:none;border-radius:5px;padding:5px 12px;cursor:pointer;
  font-family:'Cinzel',serif;font-size:9px;letter-spacing:1.5px;color:var(--ui-text3);
  text-transform:uppercase;transition:all .15s;
}
.seg button:hover{color:var(--ui-text2);}
.seg button.active{background:var(--ui-stage);color:var(--gold);}

.tbtn{
  background:var(--ui-panel);border:.5px solid var(--ui-border);border-radius:7px;
  padding:6px 13px;cursor:pointer;font-family:'Cinzel',serif;font-size:9px;
  letter-spacing:1.5px;color:var(--ui-text3);text-transform:uppercase;transition:all .15s;
  white-space:nowrap;   /* buttons never break into two lines */
}
/* narrow windows: the button row wraps as a whole, buttons stay intact */
.top-bar{flex-wrap:wrap;row-gap:6px;}
.bar-group{flex-wrap:wrap;row-gap:6px;}
.tbtn:hover{border-color:var(--gold);color:var(--gold);}
.tbtn.active{border-color:rgba(201,185,122,.55);color:var(--gold);background:var(--ui-stage);}
.tbtn.danger:hover{border-color:#8a3030;color:#c05050;}

/* ── MAIN ── */
.main{display:flex;flex:1;min-height:0;}

/* ── LEFT TRAY ── */
.tray{
  width:250px;flex-shrink:0;background:var(--ui-panel);
  border-right:.5px solid var(--ui-border);
  display:flex;flex-direction:column;min-height:0;
  transition:margin-left .25s ease;
  position:relative;
}
.tray.hidden{margin-left:-250px;}
/* the little arrow — rides the tray's right edge, stays visible when hidden */
.tray-toggle{
  position:absolute;top:50%;right:-17px;transform:translateY(-50%);
  width:17px;height:52px;z-index:90;
  background:var(--ui-panel);border:.5px solid var(--ui-border);border-left:none;
  border-radius:0 7px 7px 0;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:var(--ui-text3);font-size:9px;
  transition:color .15s;
  padding:0;
}
.tray-toggle:hover{color:var(--gold);}
.tray-toggle .arr{display:inline-block;transition:transform .25s;}
.tray.hidden .tray-toggle .arr{transform:rotate(180deg);}
.tray-sec{padding:12px 13px;border-bottom:.5px solid var(--ui-border2);}
.lbl{font-size:9px;letter-spacing:2px;color:var(--ui-text3);text-transform:uppercase;margin-bottom:7px;font-family:'Cinzel',serif;font-weight:600;}

.sw{position:relative;}
.si{
  width:100%;background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:7px;
  padding:8px 11px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:14px;
  outline:none;transition:border-color .18s;
}
.si:focus{border-color:var(--gold);}
.si::placeholder{color:var(--ui-muted);}
.acl{
  position:absolute;top:calc(100% + 3px);left:0;right:0;background:var(--ui-input);
  border:.5px solid var(--ui-input-bdr);border-radius:6px;z-index:200;overflow:hidden;display:none;
}
.acl.open{display:block;}
.aci{padding:7px 11px;font-size:12px;color:var(--ui-text2);cursor:pointer;border-bottom:.5px solid var(--ui-border2);}
.aci:last-child{border-bottom:none;}
.aci:hover,.aci.sel{background:var(--ui-stage);color:var(--ui-text);}
.aci-d{font-size:9px;color:var(--ui-text3);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-style:italic;margin-top:1px;}

.hint{font-size:10px;color:var(--ui-text3);font-style:italic;line-height:1.5;margin-top:7px;}
.status{font-size:10px;color:var(--ui-text3);font-style:italic;min-height:14px;margin-top:6px;}
.status.err{color:#a05050;}

.sacred-btn{
  width:100%;margin-top:8px;
  background:linear-gradient(135deg,#1a1408,#241c0c);border:.5px solid rgba(201,185,122,.35);
  border-radius:7px;padding:8px 0;color:var(--gold);font-family:'Cinzel',serif;font-size:9px;
  letter-spacing:2px;cursor:pointer;text-transform:uppercase;transition:all .18s;
}
.sacred-btn:hover{border-color:var(--gold);box-shadow:0 0 18px rgba(201,185,122,.18);}
.sacred-btn:disabled{opacity:.45;cursor:default;box-shadow:none;}

/* Tray collection grid */
.tray-coll{flex:1;overflow-y:auto;padding:11px 13px;scrollbar-width:thin;scrollbar-color:var(--ui-border) transparent;}
.cgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;}
.cempty{color:var(--ui-text3);font-style:italic;font-size:11px;text-align:center;padding:16px 0;}
.tray-card{position:relative;}
.tray-card.on-board{opacity:.35;}
.tray-card .add-tip{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(6,6,14,.55);opacity:0;transition:opacity .15s;border-radius:5px;
  font-family:'Cinzel',serif;font-size:8px;letter-spacing:1.5px;color:var(--gold);
}
.tray-card:not(.on-board):hover .add-tip{opacity:1;}

/* ── BOARD AREA ── */
.board-wrap{flex:1;position:relative;min-width:0;}

/* ── Empty-board hint (shown until you pick a mode) ── */
.board-hint{
  position:absolute;inset:0;z-index:1;pointer-events:none;padding:24px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;
}
.board-hint .bh-title{
  font-family:'Cinzel',serif;font-size:clamp(17px,2.4vw,22px);letter-spacing:4px;
  text-transform:uppercase;color:var(--ui-text2);
}
.board-hint .bh-sub{font-family:'Cormorant Garamond',serif;font-size:15px;font-style:italic;color:var(--ui-text3);}
.board-hint .bh-sub b{color:var(--gold);font-style:normal;font-weight:600;}

/* ── YOUR HAND (collapsible bottom box) ── */
.hand{
  position:absolute;left:50%;bottom:12px;transform:translateX(-50%);z-index:80;
  pointer-events:none;
  /* one knob sizes the whole dock: card box, inner scale, fan overlap.
     .38 was unreadable on big monitors — titles rendered ~8px effective */
  --hc-scale:.56;
}
/* while a game panel is open the hand centers in the space LEFT of the panel
   (340px + margins) and shrinks on mid-size screens — it must never slide
   under the sidebar */
body:has(.game-panel.open) .hand{left:calc((100vw - 364px) / 2);}
@media (max-width:1500px){body:has(.game-panel.open) .hand{--hc-scale:.46;}}
@media (max-width:1200px){body:has(.game-panel.open) .hand{--hc-scale:.4;}}
/* "THE TABLE IS SET" is a sandbox hint — never show it while a game is open */
body:has(.game-panel.open) .board-hint{display:none !important;}
@media (min-width:1600px){.hand{--hc-scale:.55;}}
.hand.empty{display:none;}
.hand-box{
  pointer-events:auto;
  background:color-mix(in srgb, var(--ui-panel) 88%, transparent);
  backdrop-filter:blur(8px);
  border:.5px solid var(--ui-border);
  border-radius:11px;
  padding:7px 16px 10px;
  box-shadow:0 8px 30px rgba(0,0,0,.45);
}
body.day .hand-box{box-shadow:0 8px 24px rgba(0,0,0,.18);}
.hand-hdr{
  display:flex;align-items:center;justify-content:center;gap:9px;
  cursor:pointer;user-select:none;
  padding:2px 4px;
}
.hand-hdr:hover .hand-lbl,.hand-hdr:hover .hand-chev{opacity:1;}
.hand-lbl{
  font-family:'Cinzel',serif;font-size:9px;letter-spacing:3px;
  color:var(--gold);opacity:.8;
}
/* the game-dock label (esp. the long SWAP prompt) was 9px gold on a light
   parchment dock — unreadable. Bigger, bolder, and dark in day mode. */
.hand.game-hand .hand-lbl{font-size:11px;opacity:1;font-weight:600;}
body.day .hand.game-hand .hand-lbl{color:#6a5716;}
.hand-chev{
  font-size:13px;color:var(--gold);opacity:.9;
  transition:transform .2s;
}
.hand.collapsed .hand-chev{transform:rotate(180deg);}
.hand.collapsed .hand-cards{display:none;}
.hand.collapsed .hand-box{padding:6px 16px;}
.hand-cards{
  display:flex;justify-content:center;align-items:flex-end;
  height:calc(392px * var(--hc-scale) + 10px);margin-top:8px;
  padding:0 28px;   /* room for the outer halves of the fanned end-cards */
}
.hand-card{
  width:calc(280px * var(--hc-scale));height:calc(392px * var(--hc-scale));
  margin:0 calc(280px * var(--hc-scale) * -.22);   /* fan overlap */
  position:relative;
  cursor:pointer;
  transition:transform .18s ease;
  z-index:1;
}
.hand-card:hover{
  transform:translateY(-12px) scale(1.28);
  z-index:10;
}
.hand-card .card-wrap{transform:scale(var(--hc-scale));transform-origin:0 0;}
/* the hand is where you READ your options — text runs ~25% larger inside
   dock cards; the excerpt fitter still shrinks long extracts to fit */
.hand-card .card-excerpt{font-size:18px !important;line-height:1.38 !important;}
.hand-card .card-title{font-size:21px !important;}
.hand-card .card-dates{font-size:11px !important;}
.hand-card .play-tip{
  position:absolute;top:-18px;left:50%;transform:translateX(-50%);
  font-family:'Cinzel',serif;font-size:8px;letter-spacing:2px;color:var(--gold);
  opacity:0;transition:opacity .15s;pointer-events:none;
  text-shadow:0 1px 4px rgba(0,0,0,.9);
}
.hand-card:hover .play-tip{opacity:1;}

/* ── game hand (Play vs AI): pick from real cards ── */
.hand.game-hand .hand-lbl{opacity:1;color:#e8d48a;}
/* far less fan overlap while you're PICKING a card — the 22% fan buried each
   card's title behind the next, so you couldn't tell them apart. ~8% keeps a
   slight fan but leaves every title legible (hover still lifts for detail). */
.hand.game-hand:not(.dock-wide):not(.view-node):not(.view-list) .hand-card{margin:0 calc(280px * var(--hc-scale) * -.08);}
.hand-card.sel{transform:translateY(-16px) scale(1.3);z-index:11;}
.hand-card.sel .nx{outline:2.5px solid #d4bd6b;box-shadow:0 0 22px rgba(201,185,122,.65);}
/* SWAP dock: a selected card is going BACK to the deck. Gold reads as
   "winner" and confuses the swap, so mark it in red with a clear ribbon. */
.hand.dock-wide .hand-card.sel .nx{outline-color:#c86a6a;box-shadow:0 0 22px rgba(180,70,70,.6);}
.hand.dock-wide .hand-card.sel::after{
  content:'↩ SWAP';position:absolute;top:4px;left:50%;transform:translateX(-50%);z-index:12;
  font-family:'Cinzel',serif;font-size:8.5px;letter-spacing:1.5px;color:#fbeaea;
  background:#a23a3a;padding:3px 9px;border-radius:8px;white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.55);
}
.gh-ph{
  width:calc(280px * var(--hc-scale));height:calc(392px * var(--hc-scale));
  border-radius:7px;border:.5px solid var(--ui-border);
  background:var(--ui-panel);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;padding:8px;text-align:center;
  font-family:'Cormorant Garamond',serif;font-size:12.5px;line-height:1.2;color:var(--ui-text2);
}
.gh-ph em{font-family:'Cinzel',serif;font-size:6.5px;letter-spacing:1.5px;color:var(--ui-text3);font-style:normal;text-transform:uppercase;}

/* ── Hand view toggle: Cards / List / Node ── */
.hand-view{display:none;gap:2px;margin-left:auto;margin-right:12px;}
.hand.game-hand .hand-view{display:inline-flex;}
.hand-view button{background:none;border:none;color:var(--ui-text3);font-size:13px;cursor:pointer;padding:2px 6px;border-radius:5px;line-height:1;}
.hand-view button.active{color:var(--gold);background:rgba(201,185,122,.16);}
.hand-view button:hover{color:var(--gold);}

/* LIST view — text rows with a domain-coloured glyph */
.hand.view-list .hand-cards{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:1px;
  height:auto;max-height:min(46vh,420px);overflow-y:auto;max-width:min(560px,90vw);padding:4px 8px;}
.hand.view-list .hand-card{width:auto;height:auto !important;transform:none !important;margin:0;}
.hl-row{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:7px;cursor:pointer;transition:background .12s;}
.hl-row:hover{background:rgba(201,185,122,.08);}
.hl-glyph{font-size:18px;flex:none;width:24px;text-align:center;}
.hl-t{flex:1;min-width:0;font-family:'Spectral',serif;font-size:15px;color:var(--ui-text);white-space:normal;line-height:1.3;}
.hl-tier{font-family:'Cinzel',serif;font-size:8px;letter-spacing:1px;text-transform:uppercase;color:var(--ui-text3);flex:none;}
.hl-row .hc-kojin{position:static;font-family:'Cinzel',serif;font-size:11px;color:var(--gold);flex:none;}

/* NODE view — domain-coloured circles + labels, like the board */
.hand.view-node .hand-cards{flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:14px;
  height:auto;max-height:min(46vh,420px);overflow-y:auto;max-width:min(84vw,1000px);padding:10px;}
.hand.view-node .hand-card{width:auto;height:auto !important;transform:none !important;margin:0;display:flex;flex-direction:column;align-items:center;gap:3px;}
.hn-node{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;
  background:radial-gradient(circle,color-mix(in srgb,var(--acc,#c9b97a) 32%,#0a0a16) 0%,#0a0a16 100%);
  border:2px solid var(--acc,#c9b97a);transition:transform .12s;}
.hn-cell:hover .hn-node{transform:scale(1.12);}
.hn-glyph{font-size:24px;line-height:1;}
.hn-lbl{font-family:'Spectral',serif;font-size:12px;color:var(--ui-text);max-width:90px;text-align:center;line-height:1.25;white-space:normal;overflow-wrap:break-word;}
.hn-cell .hc-kojin{position:static;font-family:'Cinzel',serif;font-size:10px;color:var(--gold);}

/* wide dock (swap / liquidation): a WRAPPING grid of SMALLER cards so a whole
   hand fits in a row or two without scrolling the bottom row out of reach */
.hand.dock-wide{--hc-scale:.42;}
@media (min-width:1600px){.hand.dock-wide{--hc-scale:.5;}}
.hand.dock-wide .hand-cards{
  flex-wrap:wrap;justify-content:center;align-items:flex-start;
  /* width:max-content is load-bearing — the dock is an absolutely-positioned
     shrink-to-fit box, and without a defined width a flex-wrap child COLLAPSES
     to ~1 card wide, stacking a 7-card hand into rows that overflow and scroll
     the bottom row out of the clickable area. max-content packs each row full. */
  width:max-content;max-width:min(92vw, 1200px);
  height:auto;max-height:min(64vh, 560px);overflow-y:auto;overflow-x:hidden;
  padding:18px 10px 12px;gap:8px;
}
.hand.dock-wide .hand-card{margin:0;flex:none;}
/* in the wrapping grid a card must GROW IN PLACE, never translate up (it pokes
   above the container and clips) — scale only, for both hover and selection */
.hand.dock-wide .hand-card:hover{transform:scale(1.08);}
.hand.dock-wide .hand-card.sel{transform:scale(1.1);}
.hc-kojin{
  /* bottom corner — top-right sat ON the title band and hid card names */
  position:absolute;bottom:6px;right:5px;z-index:3;pointer-events:none;
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:.5px;color:#e8d48a;
  background:rgba(10,8,20,.85);border:.5px solid rgba(201,185,122,.4);
  border-radius:8px;padding:2px 6px;
}

/* table talk during the base vote */
.gp-talk{display:flex;flex-direction:column;gap:7px;margin:2px 0 8px;}
.gp-talk-line{
  display:flex;align-items:baseline;gap:7px;
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:14.5px;
  color:var(--ui-text2);line-height:1.4;
}
.gp-talk-line i{width:7px;height:7px;border-radius:50%;flex:none;align-self:center;}
.gp-talk-line b{font-family:'Spectral',serif;font-style:normal;font-size:12px;color:var(--ui-text3);}
.gp-prize{font-size:14px;padding:8px 10px;border:.5px solid rgba(201,185,122,.4);border-radius:8px;
  background:color-mix(in srgb,var(--ui-stage) 60%,transparent);}
.gp-prize.loss{color:color-mix(in srgb,#d8442f 58%,var(--ui-text));border-color:rgba(192,80,64,.4);background:color-mix(in srgb,#c05040 8%,var(--ui-stage));}
.gp-prize.loss b{color:color-mix(in srgb,#d8442f 62%,var(--ui-text));}
.jp-backers{
  font-family:'Spectral',serif;font-size:10.5px;line-height:1.45;color:var(--ui-text3);
  border-top:.5px dotted var(--ui-border2);padding-top:6px;margin-top:2px;
}
.jp-backers b{color:var(--gold);}
.jp-card.win .jp-backers{color:var(--ui-text2);}
.jp-nobackers{opacity:.6;font-style:italic;}

/* base-card vote tally */
.gp-votes{display:flex;flex-direction:column;gap:6px;margin:4px 0 10px;}
.gp-vote{
  display:flex;align-items:center;gap:7px;font-family:'Spectral',serif;font-size:13px;
  color:var(--ui-text2);padding:5px 9px;border-radius:7px;border:.5px solid transparent;
}
.gp-vote i{width:8px;height:8px;border-radius:50%;flex:none;}
.gp-vote.won{border-color:rgba(201,185,122,.45);background:color-mix(in srgb,var(--ui-stage) 65%,transparent);}
.gp-note.gold{color:var(--gold);font-style:normal;}
.gp-card-lnk{cursor:zoom-in;border-bottom:.5px dotted rgba(201,185,122,.5);}
.gp-card-lnk:hover{color:var(--gold);}

.red-round{color:#c05040;}
/* betting-round action feed */
.gp-betfeed{margin:8px 0;display:flex;flex-direction:column;gap:2px;}
.gp-betpot{font-family:'Cinzel',serif;font-size:11px;letter-spacing:2px;color:var(--gold);margin-bottom:3px;}
.gp-betline{font-size:12.5px;color:var(--ui-text2);font-family:'Cormorant Garamond',serif;}

/* kojin poker bet row */
/* betting-round quick amounts (common denominations) */
.gp-denoms{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 4px;}
.gp-denom{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:.5px;padding:6px 12px;
  border:.5px solid rgba(201,185,122,.45);background:rgba(201,185,122,.06);color:var(--gold,#c9b97a);
  border-radius:8px;cursor:pointer;transition:all .12s;
}
.gp-denom:hover{background:rgba(201,185,122,.16);border-color:var(--gold,#c9b97a);}
.gp-denom.sel{background:var(--gold,#c9b97a);color:#241c04;border-color:var(--gold,#c9b97a);font-weight:600;}
.gp-chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0;}
.gp-chips .gp-bet{flex:1;min-width:120px;accent-color:var(--gold,#c9b97a);}
.gp-chips .gp-bet-val{min-width:52px;color:var(--gold,#c9b97a);font-family:'Cinzel',serif;}
.gp-chip{font-size:10px;letter-spacing:1px;padding:4px 9px;border:1px solid rgba(201,185,122,.4);
  background:transparent;color:inherit;border-radius:4px;cursor:pointer;text-transform:uppercase;}
.gp-chip:hover{border-color:var(--gold,#c9b97a);color:var(--gold,#c9b97a);}
.gp-sitout{font-size:10px;letter-spacing:1px;padding:4px 9px;margin-left:6px;border:1px solid rgba(180,180,180,.25);
  background:transparent;color:inherit;border-radius:4px;cursor:pointer;text-transform:uppercase;opacity:.7;}
/* pivot palette tags — badge + instruction accents per connection frame */
.pv-tag{letter-spacing:.4px;font-weight:700;}
/* keep the semantic hue but blend toward --ui-text so it reads in BOTH themes
   (the pale dark-theme tints were near-invisible on the light table panel) */
.pv-dissimilar{color:color-mix(in srgb,#d8442f 58%,var(--ui-text));}
.pv-contains{color:color-mix(in srgb,#c69a2a 60%,var(--ui-text));}
.pv-precludes{color:color-mix(in srgb,#a06fe0 58%,var(--ui-text));}
.pv-begets,.pv-caused_by{color:color-mix(in srgb,#4a90d9 58%,var(--ui-text));}
.pv-becomes{color:color-mix(in srgb,#d99038 60%,var(--ui-text));}
.pv-mirrors{color:color-mix(in srgb,#3fb0b0 60%,var(--ui-text));}
.pv-stands_for{color:#c07ea6;}
/* the round's judgment style — always visible */
/* the judgment badge — deliberately loud so you always register which judge is
   ruling. Base look, then a per-style ACCENT COLOUR (--jb) so the type reads
   at a glance: AI gold · Wiki blue · Player violet · Vibes green. */
.gp-judge-badge{
  --jb:#a8912e;
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:1.5px;font-weight:700;
  /* mix the accent toward --ui-text (dark on the light table, light on dark) so
     the badge stays legible in either theme — it was near-white on parchment */
  color:color-mix(in srgb,var(--jb) 50%,var(--ui-text));
  text-transform:uppercase;border:1.5px solid var(--jb);border-radius:8px;
  padding:8px 12px;margin-bottom:11px;text-align:center;line-height:1.35;
  background:color-mix(in srgb,var(--jb) 18%,var(--ui-panel));
  box-shadow:0 0 14px color-mix(in srgb,var(--jb) 30%,transparent);
}
.gp-jb-wiki_degrees{--jb:#4a90d9;}
.gp-jb-human{--jb:#a06bd0;}
.gp-jb-vibes{--jb:#3fa864;}
.gp-jb-group_vote{--jb:#cf7d4a;}
/* group-vote ballot — click a play to cast your vote */
.gp-votes{display:flex;flex-direction:column;gap:7px;margin-top:10px;}
.gp-vote-op{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;
  padding:9px 12px;background:rgba(207,125,74,.08);border:.5px solid rgba(207,125,74,.34);border-radius:9px;
  color:var(--ui-text);font-family:'Cormorant Garamond',serif;cursor:pointer;transition:border-color .15s,background .15s;}
.gp-vote-op:hover{border-color:rgba(207,125,74,.7);background:color-mix(in srgb,var(--ui-stage) 70%,transparent);}
.gp-vote-op b{font-size:15px;}
.gp-vote-by{font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:1px;color:var(--ui-text3);text-transform:uppercase;}
.gp-vote-peek{font-size:11px;opacity:.5;cursor:pointer;margin-left:2px;}
.gp-vote-peek:hover{opacity:1;}
.gp-vote-arg{font-style:italic;font-size:13px;color:var(--ui-text);opacity:.82;line-height:1.35;margin-top:2px;}
/* the pre-base round-frame announcement */
.gp-round-ann{display:flex;flex-direction:column;gap:9px;align-items:center;text-align:center;padding:6px 0;animation:clIn .25s ease-out;}
.gp-round-ann .gp-judge-badge{margin-bottom:2px;font-size:12.5px;padding:10px 14px;}
.gp-note.dim{opacity:.55;font-style:italic;}

/* mulligan */
.gp-mullrow{margin-top:10px;text-align:center;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;}
/* forced-sale: pick a buyer from the table, each with their lowball bid */
.gp-buyers{display:flex;flex-direction:column;gap:6px;margin:10px auto 0;max-width:360px;}
.gp-buyer{display:flex;align-items:center;gap:9px;width:100%;padding:8px 12px;border-radius:9px;cursor:pointer;
  background:rgba(201,185,122,.09);border:.5px solid rgba(201,185,122,.32);color:var(--ui-text);
  font-family:'Spectral',serif;font-size:14px;transition:background .13s,border-color .13s;text-align:left;}
.gp-buyer:hover{background:rgba(201,185,122,.2);border-color:rgba(201,185,122,.6);}
.gp-buyer-nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gp-buyer-bid{font-family:'Cinzel',serif;color:var(--gold);flex:none;}
/* sit-out + mulligan-swap: real buttons, not fine print — same look for the
   host's combined button and the guest's split pair ("looks different on host
   and guest" + "color these buttons and make them larger", bug log 7/9) */
.gp-mull,.gp-mull-swap{
  background:rgba(201,185,122,.1);border:1px solid var(--gold-dim,rgba(201,185,122,.4));border-radius:9px;
  padding:9px 16px;cursor:pointer;font-family:'Cormorant Garamond',serif;
  font-style:italic;font-size:15px;color:var(--ui-text);transition:all .15s;
}
.gp-mull:hover,.gp-mull-swap:hover{color:var(--gold);border-color:var(--gold);background:rgba(201,185,122,.18);}

/* an empty table hides the board tools — nothing to view/fit/clear yet */
body.table-idle #viewSeg, body.table-idle #locusGroup, body.table-idle #blendRange, body.table-idle .bar-lbl,
body.table-idle #connectBtn, body.table-idle #rationaleBtn,
body.table-idle #fitBtn, body.table-idle #clearBtn{display:none;}
/* CARD view = clean article photos: the Locus glyph dusting (.nx-locus) only
   paints in Hybrid / Node / Locus views (Chairman 7/11: "in card mode you
   should not be seeing glyphs"). The blend slider tunes it in those views. */
body[data-glyph-view="card"] .nx-locus{display:none !important;}
/* a LIVE GAME hides the sandbox editing tools — hand-drawn links or a
   canvas wipe would corrupt the game (View/Rationales/Fit stay) */
body.game-live #connectBtn, body.game-live #clearBtn{display:none;}

/* stall rescue: the host's "seat isn't answering" toast */
.stall-bar{
  position:fixed;left:50%;bottom:88px;transform:translateX(-50%);z-index:130;
  display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:12px;
  background:var(--ui-panel,#141020);border:1px solid rgba(200,120,80,.55);
  box-shadow:0 10px 34px rgba(0,0,0,.4);font-family:'Spectral',serif;font-size:14px;color:var(--ui-text);
}
.stall-bar b{color:var(--gold);}
.stall-bar .st-ai{
  font-family:'Cinzel',serif;font-size:10.5px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;
  background:linear-gradient(135deg,#c9b97a,#a98f4a);color:#241c04;border:none;border-radius:9px;padding:7px 13px;
}
.stall-bar .st-x{background:none;border:none;color:var(--ui-text3);cursor:pointer;font-size:14px;}

/* one-click rejoin after a refresh/crash (mp_join is idempotent) */
.rejoin-bar{
  position:fixed;left:50%;top:64px;transform:translateX(-50%);z-index:120;
  display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:12px;
  background:var(--ui-panel,#141020);border:1px solid var(--gold-dim,rgba(201,185,122,.45));
  box-shadow:0 10px 34px rgba(0,0,0,.4);font-family:'Spectral',serif;font-size:14px;color:var(--ui-text);
}
.rejoin-bar b{color:var(--gold);letter-spacing:1px;}
.rejoin-bar .rj-go{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;
  background:linear-gradient(135deg,#c9b97a,#a98f4a);color:#241c04;border:none;border-radius:9px;padding:7px 15px;
}
.rejoin-bar .rj-x{background:none;border:none;color:var(--ui-text3);cursor:pointer;font-size:14px;}

/* sway / bribe mini-forms (guest + host) — were raw browser controls */
.gp-sway-row,.gp-bribe-row{margin-top:12px;}
.gp-sway-row .gp-note,.gp-bribe-row .gp-note{
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  background:rgba(201,185,122,.07);border:.5px solid var(--gold-dim,rgba(201,185,122,.35));
  border-radius:10px;padding:10px 12px;
}
.gp-sway-row select,.gp-bribe-row select,
.gp-sway-row input,.gp-bribe-row input{
  font-family:'Spectral',serif;font-size:13px;color:var(--ui-text);
  background:var(--ui-panel,rgba(255,255,255,.06));border:.5px solid var(--ui-border);
  border-radius:8px;padding:6px 9px;max-width:100%;
}
.gp-sway-row button,.gp-bribe-row button{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;
  background:linear-gradient(135deg,#c9b97a,#a98f4a);color:#241c04;border:none;border-radius:9px;
  padding:8px 16px;transition:filter .15s;
}
.gp-sway-row button:hover,.gp-bribe-row button:hover{filter:brightness(1.1);}
.gp-sway-row .gs-note,.gp-bribe-row .gb-note{flex-basis:100%;font-style:italic;color:var(--ui-text3);}

/* ── staking phase ── */
.gp-stake-pick{cursor:pointer;border:.5px solid transparent;border-radius:8px;padding:7px 9px;transition:all .13s;}
.gp-stake-pick:hover{border-color:var(--ui-border);background:var(--ui-input);}
.gp-stake-pick.sel{border-color:rgba(201,185,122,.6);background:color-mix(in srgb,var(--ui-stage) 70%,transparent);}
/* vibes: your own play — can't self-vote (the money is the vote for a peer) */
.gp-stake-pick.own-play{opacity:.4;filter:grayscale(.4);cursor:default;}
.gp-stake-pick.own-play:hover{border-color:transparent;background:none;}
.gp-stakerow .gp-picked{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13.5px;color:var(--gold);}
.gp-pot-val{margin-left:auto;font-family:'Cinzel',serif;font-size:10px;color:var(--gold);}
.gp-pot-pick .gp-sub-hd{width:100%;}

/* judge's brief editor in the setup dialog */
#setupJudgePrompt{
  width:100%;margin:6px 0 10px;padding:10px 12px;
  background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:8px;
  color:var(--ui-text2);font-family:'Spectral',serif;font-size:12px;line-height:1.5;
  resize:vertical;outline:none;
}
#setupJudgePrompt:focus{border-color:var(--gold);}

/* setup dialog modality row */
.setup-modwrap{display:flex;align-items:center;gap:10px;flex:1;justify-content:flex-end;}
.setup-modwrap b{font-family:'Spectral',serif;font-size:13px;color:var(--gold);font-weight:600;}
.setup-modedit{
  background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:7px;
  padding:6px 12px;cursor:pointer;font-family:'Cinzel',serif;font-size:9px;
  letter-spacing:1.5px;color:var(--ui-text2);text-transform:uppercase;transition:all .15s;white-space:nowrap;
}
.setup-modedit:hover{border-color:var(--gold);color:var(--gold);}

/* connect-mode banner */
.connect-banner{
  position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:70;
  background:rgba(10,9,24,.92);border:.5px solid rgba(201,185,122,.4);border-radius:8px;
  padding:7px 18px;font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;color:var(--gold);
  display:none;pointer-events:none;
}
.connect-banner.show{display:block;}

/* ── RATIONALE DIALOG ── */
.dlg-overlay{
  position:fixed;inset:0;background:rgba(4,3,12,.7);backdrop-filter:blur(4px);
  display:none;align-items:center;justify-content:center;z-index:900;
}
.dlg-overlay.open{display:flex;}
.dlg-overlay.mod-raised{z-index:940;}   /* editing rules from the mp lobby (z900) → sit on top */
.dlg{
  background:var(--ui-panel);border:.5px solid rgba(201,185,122,.35);border-radius:10px;
  padding:26px 30px;width:430px;max-width:92vw;box-shadow:0 20px 60px rgba(0,0,0,.6);
  max-height:calc(100vh - 32px);overflow-y:auto;
}
.dlg h3{font-family:'Cinzel',serif;font-size:13px;letter-spacing:3px;color:var(--gold);margin-bottom:4px;text-transform:uppercase;}
.dlg .dlg-sub{font-size:12px;color:var(--ui-text2);font-style:italic;margin-bottom:14px;}
.dlg textarea{
  width:100%;height:84px;background:var(--ui-input);border:.5px solid var(--ui-input-bdr);
  border-radius:7px;padding:10px 12px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;
  font-size:14px;font-style:italic;outline:none;resize:none;
}
.dlg textarea:focus{border-color:var(--gold);}
.dlg-count{font-size:10px;color:var(--ui-text3);text-align:right;margin-top:3px;}
.dlg-count.over{color:#a05050;}
.dlg-row{display:flex;gap:8px;margin-top:14px;align-items:center;}
.dlg-type{display:flex;gap:3px;background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:7px;padding:3px;margin-right:auto;}
.dlg-type button{background:none;border:none;border-radius:5px;padding:4px 10px;cursor:pointer;font-family:'Cinzel',serif;font-size:8px;letter-spacing:1px;color:var(--ui-text3);text-transform:uppercase;}
.dlg-type button.active.sim{background:#0a2012;color:#4a9a6a;}
.dlg-type button.active.dis{background:#200a0a;color:#c05050;}
.dlg-btn{
  background:linear-gradient(135deg,#c9b97a,#a89048);border:none;border-radius:7px;
  padding:9px 22px;color:#06040c;font-family:'Cinzel',serif;font-size:10px;letter-spacing:2px;
  cursor:pointer;text-transform:uppercase;transition:all .18s;
}
.dlg-btn:hover{opacity:.9;}
.dlg-cancel{background:none;border:.5px solid var(--ui-border);color:var(--ui-text3);}
.dlg-cancel:hover{opacity:1;border-color:var(--ui-text3);color:var(--ui-text2);}

/* ── SPECTATE BANNER ── */
.spectate-banner{
  position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:70;
  background:rgba(10,9,24,.92);border:.5px solid rgba(201,185,122,.4);border-radius:8px;
  padding:7px 18px;font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:1.5px;color:var(--gold);
  white-space:nowrap;max-width:92%;overflow:hidden;text-overflow:ellipsis;
}
.spectate-banner .sb-names{color:var(--ui-text2);letter-spacing:.5px;font-family:'Spectral',serif;font-size:10px;text-transform:none;}
.sb-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:4px;vertical-align:middle;}
.spectate-banner a{color:var(--ui-text3);text-decoration:underline;cursor:pointer;}
.spectate-banner a:hover{color:var(--gold);}
body.day .spectate-banner{
  background:rgba(244,241,232,.95);border-color:rgba(138,112,32,.4);color:#8a7020;
  box-shadow:0 4px 18px rgba(40,32,10,.14);
}
body.day .spectate-banner .sb-names{color:#4c4658;}
body.day .spectate-banner a{color:#8a8496;}
body.day .spectate-banner a:hover{color:#8a7020;}

/* spectating: no deck, no tray, no hand */
body.spectating .tray{display:none;}
body.spectating .hand{display:none;}

/* ── SPECTATE PANEL (OGS-style right sidebar) ── */
.spectate-panel{
  position:absolute;top:12px;right:12px;bottom:12px;width:452px;z-index:76;
  background:color-mix(in srgb, var(--ui-panel) 95%, transparent);
  backdrop-filter:blur(9px);
  border:.5px solid var(--ui-border);border-radius:11px;
  display:flex;flex-direction:column;
  /* overflow VISIBLE so the minimize tab (which hangs off the left edge) isn't
     clipped away — the scrolling log clips itself. This is the button that
     "disappeared". */
  overflow:visible;
  box-shadow:0 12px 44px rgba(0,0,0,.45);
}
/* the log carries the scroll; round its bottom so nothing pokes the corner */
.spectate-panel .sp-log{border-bottom-left-radius:11px;}
.sp-hdr{
  display:flex;align-items:center;gap:10px;
  padding:11px 15px;border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
}
.sp-title{font-family:'Cinzel',serif;font-size:11px;letter-spacing:2.5px;color:var(--gold);}
.sp-modality{font-family:'Cinzel',serif;font-size:9px;letter-spacing:1.5px;color:var(--ui-text3);text-transform:uppercase;}
.sp-leave{margin-left:auto;font-family:'Cinzel',serif;font-size:9px;letter-spacing:1.5px;color:var(--ui-text3);text-decoration:none;text-transform:uppercase;}
.sp-leave:hover{color:var(--gold);}
.sp-players{
  display:flex;flex-direction:column;gap:3px;padding:10px 15px;
  border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
}
.sp-player{display:flex;align-items:center;gap:8px;font-family:'Spectral',serif;font-size:13px;color:var(--ui-text2);}
.sp-player i{width:9px;height:9px;border-radius:50%;flex-shrink:0;}
.sp-pname{color:var(--ui-text);}
.sp-prank{color:var(--ui-text3);font-size:11px;}
.sp-pscore{margin-left:auto;color:var(--gold);font-weight:600;font-variant-numeric:tabular-nums;}
.sp-status{
  padding:8px 15px;font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:1.5px;
  color:var(--gold);text-transform:uppercase;border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
}
.sp-log{flex:1;overflow-y:auto;padding:6px 12px 12px;scrollbar-width:thin;}
.sp-empty{color:var(--ui-text3);font-style:italic;font-size:12px;padding:14px 4px;}
.sp-round{
  padding:9px 8px;margin:6px 0;border-radius:8px;
  border:.5px solid transparent;cursor:pointer;transition:all .15s;
}
.sp-round:hover{background:color-mix(in srgb, var(--ui-stage) 60%, transparent);}
.sp-round.current{background:var(--ui-stage);border-color:rgba(201,185,122,.35);}
.sp-round.future{opacity:.4;}
.sp-round-hd{
  font-family:'Cinzel',serif;font-size:9px;letter-spacing:1px;color:var(--ui-text3);
  text-transform:uppercase;margin-bottom:6px;
}
.sp-round-hd .sp-rn{color:var(--gold);margin-right:6px;}
.sp-round-hd b{color:var(--ui-text2);}
.sp-sub{padding:4px 0 4px 4px;border-left:2px solid transparent;margin-bottom:3px;}
.sp-sub.won{border-left-color:var(--gold);}
.sp-sub-hd{font-family:'Spectral',serif;font-size:13.5px;color:var(--ui-text3);display:flex;align-items:center;gap:5px;flex-wrap:wrap;}
.sp-sub-hd i{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.sp-sub-name{color:var(--ui-text2);}
.sp-sub.won .sp-sub-name{color:var(--ui-text);}
.sp-sub-card{color:var(--gold);}
.sp-plus{margin-left:auto;font-family:'Cinzel',serif;font-size:9px;color:var(--gold);}
/* readable rationale: clean upright serif, high contrast (was faint italic) */
.sp-sub-arg{
  font-family:'Spectral',Georgia,serif;font-style:normal;font-size:15px;
  color:var(--ui-text);line-height:1.6;margin-top:5px;padding-left:12px;
  border-left:2px solid var(--ui-border2);
}
.sp-sub.won .sp-sub-arg{color:var(--ui-text);border-left-color:rgba(201,185,122,.4);}
/* hovering the matching rationale on the BOARD lights this entry */
.sp-sub.lit{
  outline:1.5px solid rgba(201,185,122,.55);outline-offset:2px;border-radius:8px;
  background:color-mix(in srgb,var(--ui-stage) 70%,transparent);
}
.sp-round *{cursor:pointer;}
.sp-round .sp-sub-arg:hover{color:var(--gold);}
/* edge-click: flash the matching round in the log */
.sp-round.flash{animation:spRoundFlash 1.3s ease-out;}
@keyframes spRoundFlash{
  0%{background:rgba(201,185,122,.35);border-color:rgba(201,185,122,.8);}
  100%{background:transparent;border-color:transparent;}
}
.sp-speed{
  display:flex;align-items:center;gap:5px;padding:8px 12px 0;flex-shrink:0;
}
.sp-speed-lbl{font-family:'Cinzel',serif;font-size:8px;letter-spacing:1.5px;color:var(--ui-text3);text-transform:uppercase;margin-right:4px;}
.sp-speed button{
  flex:1;background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:6px;
  padding:5px 0;cursor:pointer;color:var(--ui-text3);
  font-family:'Cinzel',serif;font-size:8.5px;letter-spacing:1px;text-transform:uppercase;transition:all .13s;
}
.sp-speed button:hover{color:var(--ui-text2);}
.sp-speed button.active{border-color:rgba(201,185,122,.55);color:var(--gold);background:var(--ui-stage);}
.sp-controls{
  display:flex;align-items:center;gap:4px;padding:9px 12px;
  border-top:.5px solid var(--ui-border2);flex-shrink:0;
}
.sp-controls .pb-count{margin-left:auto;}

/* clickable card / player names in the log + roster */
.sp-card-lnk{color:var(--gold);border-bottom:.5px dotted rgba(201,185,122,.5);transition:color .13s;}
.sp-card-lnk:hover{color:#e8d48a;border-bottom-color:#e8d48a;}
.sp-player-lnk{cursor:pointer;}
.sp-sub-name.sp-player-lnk{border-bottom:.5px dotted rgba(160,170,190,.4);}
.sp-sub-name.sp-player-lnk:hover{color:var(--ui-text);}
.sp-player.sp-player-lnk{border-radius:6px;transition:background .13s;}
.sp-player.sp-player-lnk:hover{background:var(--ui-stage);}

/* ghost mode control */
.sp-opt{display:flex;align-items:center;gap:10px;padding:8px 12px 2px;flex-shrink:0;}
.sp-opt-lbl{font-size:11.5px;color:var(--ui-text3);font-style:italic;}
.sp-opt select{
  margin-left:auto;background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:6px;
  padding:4px 8px;color:var(--ui-text2);font-family:'Cinzel',serif;font-size:9px;letter-spacing:1px;
  text-transform:uppercase;cursor:pointer;outline:none;
}
.sp-opt select:focus{border-color:var(--gold);}

/* ── players + points as a top bar ── */
.sp-topbar{
  position:absolute;top:12px;left:12px;z-index:75;
  background:color-mix(in srgb, var(--ui-panel) 92%, transparent);
  backdrop-filter:blur(9px);border:.5px solid var(--ui-border);border-radius:11px;
  padding:7px 10px;box-shadow:0 8px 26px rgba(0,0,0,.4);
  /* cap the width but NEVER let it collapse — the old calc(100% - 480px) went
     tiny/negative on a smallish containing block, wrapping the scoreboard into a
     cramped 1-per-line column so only a couple players showed */
  max-width:min(680px, calc(100% - 24px));
}
.sp-topbar-players{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.sp-topbar .sp-player{
  display:flex;align-items:center;gap:6px;cursor:pointer;
  background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:8px;
  padding:5px 10px;font-family:'Spectral',serif;font-size:13px;color:var(--ui-text2);transition:all .13s;
}
.sp-topbar .sp-player:hover{border-color:var(--ui-text3);}
.sp-topbar .sp-player i{width:9px;height:9px;border-radius:50%;flex:none;}
.sp-topbar .sp-pname{color:var(--ui-text);}
.sp-topbar .sp-prank{color:var(--ui-text3);font-size:10.5px;}
.sp-topbar .sp-pscore{color:var(--gold);font-weight:600;font-variant-numeric:tabular-nums;margin-left:2px;}
.sp-topbar .sp-player.leader{border-color:rgba(201,185,122,.55);background:color-mix(in srgb,var(--ui-stage) 70%,transparent);}
.sp-topbar .sp-player.me{box-shadow:0 0 0 1px rgba(201,185,122,.5) inset;}
.sp-topbar .sp-player.me .sp-pname{color:var(--gold);}
.sp-topbar .sp-player.me .sp-pname::after{content:' · you';color:var(--ui-text3);font-size:10px;}

/* ── minimize / restore the side panel — big mid-edge tabs ── */
.sp-min{
  /* hangs OUTSIDE the panel's left edge — sitting on the edge covered text */
  position:absolute;right:100%;left:auto;top:50%;transform:translateY(-50%);z-index:6;
  background:var(--ui-input);border:.5px solid var(--ui-border);border-right:none;
  border-radius:9px 0 0 9px;color:var(--gold);cursor:pointer;
  font-size:17px;line-height:1;padding:26px 7px;
}
.sp-min:hover{background:var(--ui-stage);}
.spectate-panel{transition:transform .22s ease, opacity .22s ease;}
.spectate-panel.collapsed{transform:translateX(calc(100% + 24px));opacity:0;pointer-events:none;}
.sp-reveal{
  position:absolute;top:50%;right:0;transform:translateY(-50%);z-index:77;display:none;
  background:color-mix(in srgb, var(--ui-panel) 92%, transparent);backdrop-filter:blur(8px);
  border:.5px solid var(--ui-border);border-right:none;border-radius:9px 0 0 9px;
  padding:26px 8px;cursor:pointer;
  color:var(--gold);font-size:17px;line-height:1;box-shadow:0 8px 26px rgba(0,0,0,.4);
}
.sp-reveal.show{display:block;}

/* ── Nexus highlighted in the chat (not on the board) ── */
.sp-nexus{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:8px 15px;border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
}
.spn-tag{font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;color:var(--gold);text-transform:uppercase;}
.spn-card{font-family:'Spectral',serif;font-size:14px;color:var(--ui-text);cursor:zoom-in;
  border-bottom:.5px dotted rgba(201,185,122,.5);}
.spn-card:hover{color:var(--gold);}
.spn-deg{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:12.5px;color:var(--ui-text3);margin-left:auto;}

/* player-cards modal (everything a player played this game) */
.player-cards{
  position:fixed;inset:0;z-index:955;background:rgba(4,3,12,.78);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;animation:clIn .18s ease-out;
}
.pc-inner{
  width:min(560px,92vw);max-height:86vh;overflow-y:auto;display:flex;flex-direction:column;gap:14px;
  background:var(--ui-panel);border:.5px solid var(--ui-border);border-radius:14px;padding:22px 24px;
  box-shadow:0 24px 70px rgba(0,0,0,.55);
}
.pc-hd{font-family:'Cinzel',serif;font-size:14px;letter-spacing:2px;color:var(--ui-text);text-transform:uppercase;
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.pc-hd i{width:11px;height:11px;border-radius:50%;flex:none;}
.pc-sub{font-family:'Cormorant Garamond',serif;font-size:13px;letter-spacing:.3px;color:var(--ui-text3);
  text-transform:none;font-style:italic;}
.pc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pc-card{
  text-align:left;display:flex;flex-direction:column;gap:4px;cursor:zoom-in;
  background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:9px;padding:11px 12px;transition:all .14s;
}
.pc-card:hover{border-color:rgba(201,185,122,.5);transform:translateY(-2px);}
.pc-card.won{border-color:rgba(201,185,122,.55);background:color-mix(in srgb,var(--ui-stage) 70%,transparent);}
.pc-rn{font-family:'Cinzel',serif;font-size:8px;letter-spacing:1.5px;color:var(--ui-text3);text-transform:uppercase;}
.pc-card.won .pc-rn{color:var(--gold);}
.pc-t{font-family:'Spectral',serif;font-size:14.5px;font-weight:600;color:var(--ui-text);line-height:1.15;}
.pc-base{font-size:11.5px;color:var(--ui-text3);}
.pc-arg{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;line-height:1.4;color:var(--ui-text2);margin-top:2px;}
.pc-note{font-size:11px;font-style:italic;color:var(--ui-text3);text-align:center;}
.pc-empty{grid-column:1/-1;color:var(--ui-text3);font-style:italic;text-align:center;padding:12px;}
@media(max-width:560px){.pc-grid{grid-template-columns:1fr;}}

/* board spotlight — big current rationale during autoplay */
/* (the board-spotlight rationale overlay was removed — the log carries the
   rationale, and clicking a connection jumps straight to it) */

/* narrower screens: panel shrinks */
@media(max-width:900px){
  .spectate-panel{width:340px;}
}

/* ── PLAYBACK (OGS-style transport controls) ── */
.playback{
  position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:80;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  pointer-events:none;max-width:92%;
}
.pb-arg{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;
  color:var(--ui-text2);background:color-mix(in srgb, var(--ui-panel) 90%, transparent);
  border:.5px solid var(--ui-border);border-radius:8px;padding:5px 14px;
  max-width:640px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  backdrop-filter:blur(6px);
}
.pb-arg:empty{display:none;}
.pb-arg.fresh{animation:argIn .55s ease-out;}
@keyframes argIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
/* during autoplay the argument is the show — big, wrapped, lingering */
.playback.playing .pb-arg{
  font-size:19px;line-height:1.55;
  white-space:normal;text-align:center;
  max-width:min(760px, 84vw);
  padding:13px 26px;
  border-color:rgba(201,185,122,.4);
  box-shadow:0 8px 30px rgba(0,0,0,.3);
}
.pb-row{
  display:flex;align-items:center;gap:4px;pointer-events:auto;
  background:color-mix(in srgb, var(--ui-panel) 92%, transparent);
  border:.5px solid var(--ui-border);border-radius:9px;padding:5px;
  backdrop-filter:blur(8px);box-shadow:0 6px 24px rgba(0,0,0,.35);
}
.pb-btn{
  background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:6px;
  min-width:44px;padding:7px 10px;cursor:pointer;color:var(--ui-text2);
  font-size:13px;line-height:1;transition:all .13s;
}
.pb-btn:hover:not(:disabled){color:var(--gold);border-color:var(--gold);}
.pb-btn:disabled{opacity:.3;cursor:default;}
.pb-play{min-width:52px;color:var(--gold);}
.pb-count{
  font-family:'Cinzel',serif;font-size:9px;letter-spacing:1.5px;color:var(--ui-text3);
  padding:0 10px;white-space:nowrap;
}

/* ── CARD LIGHTBOX (click-to-zoom) ── */
.card-lightbox{
  position:fixed;inset:0;z-index:950;
  background:rgba(4,3,12,.72);backdrop-filter:blur(7px);
  display:flex;align-items:center;justify-content:center;
  animation:clIn .18s ease-out;
}
@keyframes clIn{from{opacity:0;}to{opacity:1;}}
.cl-inner{display:flex;flex-direction:column;align-items:center;gap:16px;}
.cl-card{
  /* size set inline by the fit() in openCardLightbox (scales to the window) */
  display:flex;align-items:flex-start;justify-content:flex-start;
}
/* zoom lives on the wrapper; holo's rotateX/Y stays on .card-wrap inside it,
   so hovering tilts the card without resetting its scale. */
.cl-scale{transform-origin:top left;cursor:zoom-in;}
/* bigger, clearer text on the zoomed card (board hides body text; here it's the point) */
.cl-card .card-title{font-size:21px !important;}
.cl-card .card-excerpt{font-size:16px !important;line-height:1.5 !important;color:rgba(234,230,216,.92) !important;font-style:normal !important;}
.cl-card .card-dates{font-size:11px !important;}
.cl-bar{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center;
  background:color-mix(in srgb, var(--ui-panel) 92%, transparent);
  border:.5px solid var(--ui-border);border-radius:10px;padding:10px 20px;
  backdrop-filter:blur(6px);
}
.cl-credit{text-align:center;margin-top:7px;}
.cl-credit a{font-family:'Spectral',serif;font-size:10.5px;font-style:italic;color:var(--ui-text3);text-decoration:none;}
.cl-credit a:hover{color:var(--gold);}
/* provenance — how an EARNED card was won (first Daily victory etc.) */
.cl-prov{font-family:'Spectral',serif;font-size:11.5px;font-style:italic;color:var(--gold);margin-bottom:3px;}
.cl-wiki,.cl-forge{
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--gold);text-decoration:none;border-bottom:.5px solid var(--gold);padding-bottom:1px;
}
.cl-wiki:hover,.cl-forge:hover{opacity:.8;}
.cl-claim{
  background:linear-gradient(135deg,#c9b97a,#a89048);border:none;border-radius:7px;
  padding:8px 18px;color:#06040c;font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:2px;
  cursor:pointer;text-transform:uppercase;
}
.cl-claim:hover{opacity:.9;}
.cl-claim:disabled{opacity:.5;cursor:default;}
.cl-status{font-size:13px;font-style:italic;color:var(--ui-text2);}

/* ── THE JUDGE'S TABLE (contender popup) ── */
.judge-popup{
  position:fixed;inset:0;z-index:960;
  background:rgba(4,3,12,.8);backdrop-filter:blur(9px);
  display:flex;align-items:center;justify-content:center;
  animation:clIn .2s ease-out;
}
.jp-inner{
  display:flex;flex-direction:column;align-items:center;gap:18px;
  max-width:min(94vw,1080px);max-height:92vh;overflow-y:auto;padding:22px;
}
.jp-hd{
  font-family:'Cinzel',serif;font-size:16px;letter-spacing:4px;color:var(--gold);
  text-transform:uppercase;text-align:center;display:flex;flex-direction:column;gap:5px;
}
/* the popup overlay is ALWAYS dark (it dims the board), so its text must be
   light in BOTH themes — themed --ui-text goes dark-on-dark in day mode. */
.jp-base{font-family:'Cormorant Garamond',serif;font-size:16px;letter-spacing:.5px;
  color:#b8b2a0;text-transform:none;font-style:italic;}
.jp-base b{color:#f2ede0;font-style:normal;}
.jp-cards{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;align-items:flex-start;}
.jp-card{
  width:186px;display:flex;flex-direction:column;gap:9px;
  border:.5px solid var(--acc,rgba(201,185,122,.4));border-radius:12px;
  /* the popup is ALWAYS dark, so the card must be dark too — themed --ui-panel
     went LIGHT in day mode, hiding the light rationale/name text on it */
  background:color-mix(in srgb,#16142a 90%,transparent);
  padding:11px 11px 13px;transition:transform .3s, box-shadow .3s, opacity .3s, border-color .3s;
}
.jp-art{width:164px;height:230px;overflow:hidden;border-radius:8px;align-self:center;
  background:radial-gradient(ellipse at 50% 40%,rgba(30,26,44,.7),rgba(6,5,14,.9));
  position:relative;display:flex;align-items:center;justify-content:center;}
/* the card's LAYOUT box is 280×392 (transforms don't shrink layout) — pin it
   to the art box's top-left or flex centering shows the card's middle */
.jp-scale{position:absolute;top:0;left:0;transform:scale(.586);transform-origin:top left;width:280px;height:392px;}
.jp-load{font-family:'Cormorant Garamond',serif;font-size:16px;text-align:center;padding:0 12px;opacity:.85;line-height:1.25;}
/* who-played-what: this is the thing you're squinting at during judging, so
   keep it BIG and bright (10px on a dim overlay was unreadable) */
.jp-who{font-family:'Cinzel',serif;font-size:12.5px;letter-spacing:1.2px;color:#f4eedd;
  text-transform:uppercase;display:flex;align-items:center;gap:7px;font-weight:600;}
.jp-who i{width:10px;height:10px;border-radius:50%;flex:none;}
.jp-anon{font-family:'Cinzel',serif;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#b8b2a0;}
.jp-arg{font-family:'Cormorant Garamond',serif;font-size:15px;line-height:1.42;color:#d6cfbc;font-style:italic;}
.jp-card.win{border-color:#d4bd6b;box-shadow:0 0 26px rgba(201,185,122,.55);transform:translateY(-4px) scale(1.03);}
/* losers are de-emphasised but must stay READABLE (who played what). Dim the
   ART, not the whole card, and keep the name/domain label full strength. */
.jp-card.lose{opacity:.82;}
.jp-card.lose .jp-art{opacity:.5;}
.jp-card.lose .jp-who,.jp-card.lose .jp-arg{opacity:1;}
/* a folded card is still shown (so nothing vanishes when you fold), but read
   as out of the running — greyed with a tag; a Salon fold can still win */
.jp-card.folded{opacity:.86;}
.jp-card.folded .jp-art{filter:grayscale(.12);}
.jp-card.folded.win{opacity:1;}
.jp-card.folded.win .jp-art{filter:none;}
.jp-fold{display:inline-block;align-self:flex-start;max-width:100%;font-family:'Cinzel',serif;font-size:7.5px;
  letter-spacing:1px;color:#e6d9a4;background:rgba(201,185,122,.16);border:.5px solid rgba(201,185,122,.45);
  border-radius:6px;padding:2px 7px;text-transform:uppercase;line-height:1.3;}
/* the verdict is the payoff — give it its own readable plate (a distinct
   panel, not just text floating on the dim) and force light text. */
.jp-verdict{min-height:40px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;
  background:rgba(22,20,34,.82);border:.5px solid rgba(201,185,122,.28);border-radius:14px;
  padding:20px 34px;max-width:700px;box-shadow:0 10px 34px rgba(0,0,0,.4);}
.jp-delib{font-family:'Cinzel',serif;font-size:12px;letter-spacing:2px;color:#8f8a78;text-transform:uppercase;}
.jp-dots::after{content:'…';animation:jpDots 1.4s steps(4,end) infinite;}
@keyframes jpDots{0%{content:'';}25%{content:'.';}50%{content:'..';}75%{content:'...';}}
.jp-crown{font-family:'Cinzel',serif;font-size:16px;letter-spacing:2px;color:#e8d48a;text-transform:uppercase;}
.jp-reason{font-family:'Spectral',Georgia,serif;font-size:16px;font-style:normal;
  color:#ece8da;line-height:1.62;max-width:600px;overflow-wrap:break-word;}
.jp-next{
  background:linear-gradient(135deg,#c9b97a,#a89048);border:none;border-radius:8px;
  padding:10px 26px;color:#06040c;font-family:'Cinzel',serif;font-size:11px;letter-spacing:2px;
  cursor:pointer;text-transform:uppercase;
}
.jp-next:hover{opacity:.9;}

/* ── The online Judge's Table: collapsible (doesn't gate the round) ── */
.judge-popup.mpjt .jp-inner{position:relative;}
.jp-collapse{position:absolute;top:10px;right:12px;z-index:2;background:none;border:.5px solid rgba(201,185,122,.4);
  color:var(--gold);border-radius:6px;width:26px;height:24px;cursor:pointer;font-size:12px;line-height:1;}
.jp-collapse:hover{background:color-mix(in srgb,var(--gold) 14%,transparent);}
.jp-who i{width:10px;height:10px;border-radius:50%;flex:none;display:inline-block;}
/* collapsed → a compact bar at the bottom; the board is visible + interactive */
.judge-popup.mpjt.collapsed{background:none;backdrop-filter:none;align-items:flex-end;justify-content:center;pointer-events:none;}
.judge-popup.mpjt.collapsed .jp-inner{pointer-events:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px;
  max-height:none;padding:9px 16px 9px 18px;margin-bottom:14px;
  background:color-mix(in srgb,#16142a 94%,transparent);border:.5px solid rgba(201,185,122,.4);border-radius:12px;box-shadow:0 10px 34px rgba(0,0,0,.5);}
.judge-popup.mpjt.collapsed .jp-collapse{position:static;}
.judge-popup.mpjt.collapsed .jp-cards,
.judge-popup.mpjt.collapsed .jp-base,
.judge-popup.mpjt.collapsed .jp-reason{display:none;}
.judge-popup.mpjt.collapsed .jp-hd{flex-direction:row;font-size:11px;letter-spacing:2px;gap:0;}
.judge-popup.mpjt.collapsed .jp-verdict{background:none;border:none;box-shadow:none;padding:0;min-height:0;flex-direction:row;gap:14px;max-width:none;}
.judge-popup.mpjt.collapsed .jp-crown{font-size:12px;}

/* ── MODALITY PANEL ── */
.mod-dlg{width:560px;max-height:86vh;display:flex;flex-direction:column;}
.mod-presets{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px;}
.mod-preset{
  background:var(--ui-input);border:.5px solid var(--ui-border);border-radius:7px;
  padding:6px 13px;cursor:pointer;font-family:'Cinzel',serif;font-size:9px;
  letter-spacing:1.5px;color:var(--ui-text3);text-transform:uppercase;transition:all .15s;
}
.mod-preset:hover{color:var(--ui-text2);border-color:var(--ui-text3);}
.mod-preset.active{border-color:rgba(201,185,122,.55);color:var(--gold);background:var(--ui-stage);}
.mod-preset.mod-saved{border-style:solid;border-color:rgba(201,185,122,.35);}
.mod-preset.mod-saveas{border-style:dashed;opacity:.85;}
.mod-preset.mod-saveas:hover{opacity:1;border-color:var(--gold);color:var(--gold);}
/* ── resume bar — an unfinished game waits after a refresh ── */
.resume-bar{
  position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:95;
  display:flex;align-items:center;gap:12px;
  background:color-mix(in srgb, var(--ui-panel) 94%, transparent);
  backdrop-filter:blur(8px);
  border:.5px solid rgba(201,185,122,.45);border-radius:11px;
  padding:10px 16px;font-size:13.5px;
  box-shadow:0 8px 30px rgba(0,0,0,.45);
}
.resume-bar b{color:var(--gold);}
/* once a game is live the panel is .open — get the resume bar out of the way
   so it doesn't crowd the table; it returns when the game ends */
body:has(.game-panel.open) .resume-bar{display:none;}
.resume-bar button{
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;
  padding:6px 13px;border-radius:7px;cursor:pointer;background:transparent;
  border:.5px solid rgba(201,185,122,.5);color:var(--gold);
}
.resume-bar button:hover{border-color:var(--gold);}
.resume-bar .rb-x{border-color:var(--ui-border);color:var(--ui-text3);}

/* ── online table lobby ── */
.mp-code{font-family:'Cinzel',serif;font-size:11px;letter-spacing:2px;color:var(--ui-text3);margin:8px 0 10px;}
.mp-code b{color:var(--gold);font-size:20px;letter-spacing:6px;margin-left:6px;}
.mp-roster{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;}
.mp-seat{display:flex;align-items:center;gap:9px;padding:7px 10px;border:.5px solid var(--ui-border);border-radius:7px;font-size:13.5px;}
.mp-seat i{width:8px;height:8px;border-radius:50%;background:var(--ui-muted);flex:none;}
.mp-seat i.on{background:#7ec08a;box-shadow:0 0 8px rgba(126,192,138,.6);}
.mp-seat span{margin-left:auto;font-size:10px;letter-spacing:1.5px;color:var(--ui-text3);font-family:'Cinzel',serif;text-transform:uppercase;}
.mp-seat.empty{opacity:.5;font-style:italic;}
.mp-seat.mp-ai{border-color:rgba(74,144,217,.4);background:color-mix(in srgb,#4a90d9 7%,transparent);}
.mp-aitag{font-family:'Cinzel',serif;font-size:8.5px;letter-spacing:1px;color:#4a90d9;border:.5px solid rgba(74,144,217,.5);border-radius:4px;padding:1px 4px;margin-left:5px;vertical-align:middle;}
.mp-rmai{margin-left:auto;background:none;border:none;color:var(--ui-text3);cursor:pointer;font-size:12px;padding:0 4px;}
.mp-rmai:hover{color:#c05040;}
.mp-rules{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;padding:7px 10px;border:.5px solid var(--ui-border2);border-radius:7px;background:color-mix(in srgb,var(--ui-stage) 50%,transparent);}
.mp-rules-line{flex:1;font-size:12.5px;color:var(--ui-text2);font-family:'Cormorant Garamond',serif;}
.mp-rules-line b{color:var(--ui-text);}
.mp-editrules{background:none;border:.5px solid rgba(201,185,122,.5);border-radius:6px;color:var(--gold);font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:1px;text-transform:uppercase;padding:4px 9px;cursor:pointer;}
.mp-editrules:hover{background:color-mix(in srgb,var(--gold) 14%,transparent);}
.mp-hostrow{flex-wrap:wrap;gap:6px;align-items:center;}
.mp-addlbl{font-family:'Cinzel',serif;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ui-text3);}
.mp-addpat{background:color-mix(in srgb,#4a90d9 8%,transparent);border:.5px solid rgba(74,144,217,.4);border-radius:7px;
  color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:14px;padding:5px 10px;cursor:pointer;}
.mp-addpat:hover{border-color:rgba(74,144,217,.7);background:color-mix(in srgb,#4a90d9 16%,transparent);}
.mp-pat-em{font-size:15px;line-height:1;vertical-align:middle;margin-right:1px;}
.mp-deckrow{display:flex;align-items:center;gap:9px;margin:2px 0 10px;flex-wrap:wrap;}
.mp-deckrow label{font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ui-text3);}
.mp-deckrow select{background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:7px;color:var(--ui-text);
  font-family:'Cormorant Garamond',serif;font-size:14px;padding:5px 9px;cursor:pointer;}
.mp-deck-note{font-size:12px;font-style:italic;color:var(--ui-text3);}
.mp-note{font-size:12px;font-style:italic;color:var(--ui-text3);min-height:16px;margin-top:6px;}
/* online game (mpgame.js) — hand of card-title buttons in the panel */
.mpg-hand{display:flex;flex-direction:column;gap:6px;margin:10px 0;}
.mpg-card{text-align:left;padding:9px 12px;background:rgba(201,185,122,.09);border:.5px solid rgba(201,185,122,.32);
  border-radius:8px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:15px;cursor:pointer;transition:all .13s;}
.mpg-card:hover{border-color:rgba(201,185,122,.6);background:color-mix(in srgb,var(--ui-stage) 70%,transparent);}
.mpg-tally{margin-top:8px;}
.mpg-next{margin-top:14px;}
.mp-sched{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.mp-sched input[type=datetime-local]{
  flex:1;min-width:150px;background:var(--ui-input);border:.5px solid var(--ui-input-bdr);
  border-radius:7px;padding:7px 10px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;
}
.mp-sched a.dlg-btn{text-decoration:none;display:inline-flex;align-items:center;}
.mp-video{display:flex;gap:8px;align-items:center;margin-top:4px;}
.mp-video input{background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:7px;padding:7px 10px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;}
.mp-video-join{text-decoration:none;display:block;text-align:center;margin-top:4px;border-color:rgba(201,185,122,.5);color:var(--gold);}

/* the crown-holder's chip glows — you always know who judges next */
.gp-p.crowned{
  border:.5px solid rgba(201,185,122,.55);border-radius:6px;
  padding:1px 6px;background:rgba(201,185,122,.08);
}

/* the claim, spelled out with real names — "Ideology caused Painted turtle" */
.gp-claim{
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:1px;
  margin:3px 0 1px;opacity:.92;
}
.gp-pitch:empty{display:none;}

/* per-variant weight (×N) inside the pivot palette */
.mod-w-wrap{margin-left:auto;display:inline-flex;align-items:center;gap:4px;color:var(--ui-text3);font-size:11px;}
.mod-w-pct{min-width:30px;text-align:right;color:var(--gold);font-family:'Cinzel',serif;font-size:10px;font-variant-numeric:tabular-nums;}
.mod-w{width:38px;background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:5px;
  padding:2px 4px;color:var(--gold);font-family:'Cinzel',serif;font-size:11px;text-align:center;}

/* slider knobs (obliqueness, frequencies, ante, rake, cooldown) */
.mod-slider{display:flex;align-items:center;gap:10px;min-width:170px;}
.mod-slider input[type=range]{flex:1;accent-color:var(--gold);}
.mod-slider-val{min-width:26px;text-align:right;color:var(--gold);font-family:'Cinzel',serif;font-size:12px;}

/* settings tabs — Table · Rounds · Judging · Economy */
.mod-tabs{display:flex;gap:4px;margin:2px 0 12px;border-bottom:.5px solid var(--ui-border);flex:none;}
.mod-tab{
  background:none;border:none;border-bottom:2px solid transparent;
  padding:8px 14px;cursor:pointer;font-family:'Cinzel',serif;font-size:10px;
  letter-spacing:1.5px;color:var(--ui-text3);text-transform:uppercase;transition:color .15s;
}
.mod-tab:hover{color:var(--ui-text2);}
.mod-tab.active{color:var(--gold);border-bottom-color:var(--gold);}

/* everything except the scrolling grid keeps its natural height — flexbox
   was crushing the desc to min-height and its text painted over the rows */
.mod-dlg > h3, .mod-dlg > .dlg-sub, .mod-dlg > .mod-presets, .mod-dlg > .mod-desc, .mod-dlg > .dlg-row, .mod-dlg > .mod-tabs{flex:none;}
.mod-desc{font-size:13px;font-style:italic;color:var(--ui-text2);margin-bottom:12px;line-height:1.45;}
.mod-grid{
  overflow-y:auto;overflow-x:hidden;flex:1;
  display:flex;flex-direction:column;gap:0;
  padding-right:8px;scrollbar-width:thin;
}
.mod-row{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:7px 0;border-bottom:.5px solid var(--ui-border2);min-width:0;
}
.mod-lbl{font-size:12.5px;color:var(--ui-text2);cursor:help;flex-shrink:0;width:150px;}
.mod-row input[type=number]{
  width:64px;background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:5px;
  padding:4px 8px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:13px;outline:none;
}
.mod-row input[type=number]:focus{border-color:var(--gold);}
.mod-row select{
  flex:1;min-width:0;max-width:320px;
  background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:5px;
  padding:5px 8px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:12.5px;outline:none;
  text-overflow:ellipsis;
}
.mod-row select:focus{border-color:var(--gold);}
.mod-row input[type=checkbox]{accent-color:#c9b97a;width:15px;height:15px;cursor:pointer;}
.mod-multi{display:flex;flex-direction:column;gap:4px;align-items:flex-start;flex:1;min-width:0;max-width:320px;}
.mod-multi label{
  font-size:12px;color:var(--ui-text3);display:flex;align-items:flex-start;gap:7px;cursor:pointer;
  line-height:1.35;
}
.mod-multi label:hover{color:var(--ui-text2);}
.mod-multi input{accent-color:#c9b97a;flex-shrink:0;margin-top:2px;}
.mod-row.disabled{opacity:.35;pointer-events:none;}

/* ── PLAY VS AI ── */
.tbtn.primary{border-color:rgba(201,185,122,.6);color:var(--gold);background:linear-gradient(135deg,rgba(201,185,122,.14),rgba(201,185,122,.04));}
.tbtn.primary:hover{border-color:var(--gold);box-shadow:0 0 14px rgba(201,185,122,.2);}

/* Save / load games list */
.games-list{display:flex;flex-direction:column;gap:3px;max-height:46vh;overflow-y:auto;margin:4px 0 6px;}
.games-sec{font-family:'Cinzel',serif;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ui-text3);margin:12px 0 4px;}
.games-row{display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:8px;border:.5px solid var(--ui-border2);}
.games-row:hover{background:var(--ui-input);}
.gr-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.gr-info b{font-family:'Cinzel',serif;font-size:12px;letter-spacing:.5px;color:var(--gold);}
.gr-info span{font-family:'Cormorant Garamond',serif;font-size:12.5px;color:var(--ui-text3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gr-btns{display:flex;gap:6px;flex:none;}
.gr-del{padding:5px 10px;}
.setup-row{display:flex;align-items:center;gap:12px;margin-bottom:9px;}
.setup-row label{font-size:12px;color:var(--ui-text2);width:110px;flex-shrink:0;}
.setup-row input,.setup-row select{
  flex:1;background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:6px;
  padding:7px 10px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:13.5px;outline:none;
}
.setup-row input:focus,.setup-row select:focus{border-color:var(--gold);}
.setup-checkwrap{flex:1;display:flex;align-items:center;gap:9px;}
.setup-check input[type=checkbox]{flex:none;width:16px;height:16px;accent-color:var(--gold);cursor:pointer;}
.setup-checklbl{font-size:12px;font-style:italic;color:var(--ui-text3);}

.game-panel{
  position:absolute;top:12px;right:12px;bottom:12px;width:340px;z-index:75;
  background:color-mix(in srgb, var(--ui-panel) 94%, transparent);
  backdrop-filter:blur(8px);
  border:.5px solid var(--ui-border);border-radius:11px;
  display:none;flex-direction:column;overflow:hidden;
  box-shadow:0 12px 44px rgba(0,0,0,.45);
}
.game-panel.open{display:flex;}
.gp-hdr{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
}
.gp-title{font-family:'Cinzel',serif;font-size:11px;letter-spacing:2.5px;color:var(--gold);}
.gp-round{margin-left:auto;font-family:'Cinzel',serif;font-size:8.5px;letter-spacing:1px;color:var(--ui-text3);text-transform:uppercase;}
.gp-quit{background:none;border:none;color:var(--ui-text3);cursor:pointer;font-size:13px;padding:2px 4px;}
.gp-quit:hover{color:#c05050;}
/* minimize: a big tab hanging OUTSIDE the panel's left edge, vertically
   centered — sitting ON the edge covered the panel's text */
.gp-min{
  position:absolute;right:100%;left:auto;top:50%;transform:translateY(-50%);z-index:6;
  background:var(--ui-input);border:.5px solid var(--ui-border);border-right:none;
  border-radius:9px 0 0 9px;color:var(--gold);cursor:pointer;
  font-size:17px;line-height:1;padding:26px 7px;
}
.gp-min:hover{background:var(--ui-stage);}
.game-panel{transition:transform .22s ease, opacity .22s ease;}
.game-panel.collapsed{transform:translateX(calc(100% + 24px));opacity:0;pointer-events:none;}
.gp-reveal{
  position:absolute;top:50%;right:0;transform:translateY(-50%);z-index:76;display:none;
  background:color-mix(in srgb, var(--ui-panel) 92%, transparent);backdrop-filter:blur(8px);
  border:.5px solid var(--ui-border);border-right:none;border-radius:9px 0 0 9px;
  padding:26px 8px;cursor:pointer;
  color:var(--gold);font-size:17px;line-height:1;box-shadow:0 8px 26px rgba(0,0,0,.4);
}
.gp-reveal.show{display:block;}
.gp-scores{
  display:flex;flex-wrap:wrap;gap:5px 14px;padding:9px 14px;border-bottom:.5px solid var(--ui-border2);
  font-family:'Spectral',serif;font-size:11.5px;color:var(--ui-text2);flex-shrink:0;
}
/* persistent "your play this round" reminder, under the scoreboard */
.gp-myplay{margin:0;padding:6px 14px;border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
  font-family:'Spectral',serif;font-size:12.5px;color:var(--ui-text2);background:rgba(201,185,122,.07);}
.gp-myplay b{color:var(--gold);font-style:normal;}
.gp-myplay .gp-mp-ic{margin-right:5px;opacity:.85;}
.gp-p{display:flex;align-items:center;gap:5px;}
.gp-p i{width:7px;height:7px;border-radius:50%;display:inline-block;}
.gp-p b{color:var(--gold);}
.gp-p.me{color:var(--ui-text);}
/* busted out of an elimination game — dimmed, struck, "OUT" */
.gp-p.busted{opacity:.4;}
.gp-p.busted b{color:var(--ui-text3);font-style:italic;letter-spacing:1px;}
.gp-p.busted .gp-av{filter:grayscale(1);}
/* Patron avatar: the emoji face in a domain-coloured ring — used in the
   scoreboard, the table talk, and the judge table (.jp-av, larger). */
.gp-av,.jp-av{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;
  line-height:1;flex:none;border:1.5px solid var(--acc,#c9b97a);
  background:color-mix(in srgb,var(--acc,#c9b97a) 22%,transparent);}
.gp-av{width:19px;height:19px;font-size:11px;}
.gp-talk-line .gp-av{margin-right:1px;}
.jp-av{width:22px;height:22px;font-size:13px;}
/* an uploaded photo fills the domain-coloured ring */
.gp-av .av-img,.jp-av .av-img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;}
.gp-p.final{font-size:14px;padding:3px 0;}
.gp-phase{
  padding:8px 14px;font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:1.5px;
  color:var(--gold);text-transform:uppercase;border-bottom:.5px solid var(--ui-border2);flex-shrink:0;
  min-height:31px;
}
.gp-body{flex:1;overflow-y:auto;padding:12px 14px;scrollbar-width:thin;}
.gp-note{font-size:15px;font-style:italic;color:var(--ui-text2);line-height:1.55;margin-bottom:10px;}
.gp-note.err{color:#c05050;}
/* the ₭ cost on an action button — make the price impossible to miss */
.gp-kcost{font-weight:800;font-size:1.18em;color:var(--gold);font-style:normal;letter-spacing:.2px;}
.gp-sit-left{opacity:.62;font-size:.9em;font-style:italic;}
/* the round's base card — the thing everyone connects to: make it pop */
.gp-base-hl{font-size:1.22em;font-style:normal;font-weight:800;color:var(--gold);letter-spacing:.2px;}
/* Sacred opening ceremony */
.gp-ceremony{text-align:center;padding:24px 14px;display:flex;flex-direction:column;align-items:center;gap:9px;}
.gp-cer-mark{font-size:26px;color:var(--gold);opacity:.45;transition:all .5s;}
.gp-ceremony.reveal .gp-cer-mark{opacity:1;text-shadow:0 0 22px rgba(201,185,122,.65);transform:scale(1.15);}
.gp-cer-hd{font-family:'Cinzel',serif;font-size:16px;letter-spacing:2px;color:var(--gold);}
.gp-ceremony.reveal .gp-cer-hd{font-size:19px;}
.gp-cer-tx{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:14px;color:var(--ui-text2);max-width:290px;line-height:1.5;}
/* the "offer your Sacred?" choice in the opening ceremony */
.gp-cer-choose{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px;}
.gp-hand{display:flex;flex-direction:column;gap:5px;margin-bottom:10px;}
.gp-card{
  display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:7px;
  padding:8px 11px;cursor:pointer;text-align:left;color:var(--ui-text);
  font-family:'Spectral',serif;font-size:12.5px;transition:all .13s;
}
.gp-card:hover{border-color:var(--gold);}
.gp-card.sel{border-color:var(--gold);background:var(--ui-stage);}
.gp-card-tier{font-family:'Cinzel',serif;font-size:8px;letter-spacing:1px;color:var(--ui-text3);text-transform:uppercase;flex-shrink:0;}
.gp-argrow{display:flex;flex-direction:column;gap:7px;}
.gp-picked{font-family:'Cinzel',serif;font-size:9px;letter-spacing:1px;color:var(--gold);}
.gp-arg{
  width:100%;height:78px;background:var(--ui-input);border:.5px solid var(--ui-input-bdr);border-radius:7px;
  padding:9px 11px;color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:13.5px;
  font-style:italic;outline:none;resize:none;
}
.gp-arg:focus{border-color:var(--gold);}
.gp-go{
  background:linear-gradient(135deg,#c9b97a,#a89048);border:none;border-radius:7px;
  padding:8px 18px;color:#06040c;font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:2px;
  cursor:pointer;text-transform:uppercase;align-self:flex-end;
}
.gp-go:hover{opacity:.9;}
.gp-subs{display:flex;flex-direction:column;gap:9px;}
.gp-sub{border:.5px solid var(--ui-border2);border-radius:8px;padding:8px 11px;}
.gp-sub-hd{display:flex;align-items:center;gap:6px;font-family:'Spectral',serif;font-size:12px;color:var(--ui-text2);}
.gp-sub-win{border-color:rgba(201,185,122,.55);background:color-mix(in srgb,var(--gold) 9%,transparent);}
.gp-um-who{color:var(--gold);font-weight:600;}
.gp-sub-hd i{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.gp-sub-hd span{color:var(--ui-text);}
.gp-sub-arg{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:12.5px;color:var(--ui-text2);margin-top:4px;line-height:1.5;}
/* the crowned contender — unmistakable in the verdict list */
.gp-sub.gp-sub-won{
  border-color:var(--gold);background:rgba(201,185,122,.12);
  box-shadow:0 0 0 1px var(--gold), 0 3px 16px rgba(201,185,122,.18);
}
.gp-sub.gp-sub-won .gp-sub-hd b{color:var(--gold);}
.gp-won-badge{
  margin-left:auto;flex-shrink:0;font-family:'Cinzel',serif;font-size:8.5px;letter-spacing:1.5px;
  color:#241c04;background:var(--gold);border-radius:9px;padding:2px 8px;
}
.gp-verdict{margin-top:12px;border-top:.5px solid var(--ui-border);padding-top:10px;display:flex;flex-direction:column;gap:8px;}
.gp-verdict-hd{font-family:'Cinzel',serif;font-size:10.5px;letter-spacing:2px;color:var(--gold);}
/* the winning CARD, stated plainly so "what won" is unmissable */
.gp-vwin{font-family:'Cinzel',serif;font-size:15px;letter-spacing:.5px;color:#e8d48a;font-weight:600;margin:1px 0 2px;}
.gp-verdict-tx{font-size:13.5px;color:var(--ui-text);line-height:1.58;}
.gp-final{display:flex;flex-direction:column;gap:6px;}
body.spectating .game-panel{display:none;}

/* scrollbars */
::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-thumb{background:var(--ui-border);border-radius:2px;}

/* ═══ MOBILE (≤640px) ═══════════════════════════════════════════
   The board is the point: chrome shrinks, side panels become bottom
   sheets, the tray steps aside. Desktop is untouched above 640px. */
@supports (height: 100dvh){
  @media (max-width:640px){body{height:100dvh;}}
}
@media (max-width:640px){
  /* site nav: one tight scrollable strip */
  .site-nav{gap:14px;padding:8px 10px;overflow-x:auto;scrollbar-width:none;}
  .site-nav::-webkit-scrollbar{display:none;}
  /* the horizontal-scroll strip (overflow-x forces overflow-y to auto) would
     CLIP the Learn/Watch hover menus, which hang below the bar — pin them to
     the viewport so they escape the clip (Chairman 7/11: "learn and watch
     broken"). Fixed elements aren't clipped by an overflow ancestor. */
  .sn-drop-menu{position:fixed;top:46px;left:8px;right:8px;min-width:0;}
  .sn-links{gap:12px;}
  .sn-links a{font-size:10px;letter-spacing:1.2px;}
  .nav-search-wrap input{width:110px;}

  /* tools bar: compact buttons, wrap stays */
  .top-bar{padding:6px 8px;gap:8px;}
  .tbtn{padding:5px 9px;font-size:9px;letter-spacing:1px;}
  .bar-lbl{display:none;}

  /* the left tray gives the board the whole screen */
  .tray{display:none;}

  /* game + spectate panels become bottom sheets — SHORT ones: at 46vh
     the sheet plus the lifted hand buried the entire board */
  .game-panel, .spectate-panel{
    left:8px;right:8px;top:auto;bottom:8px;width:auto;
    max-height:34vh;
  }
  .game-panel.collapsed, .spectate-panel.collapsed{
    transform:translateY(calc(100% + 20px));
  }
  .gp-reveal, .sp-reveal{
    top:auto;bottom:0;right:50%;transform:translate(50%,0);
    border-radius:9px 9px 0 0;padding:7px 26px;
  }
  /* bottom sheets: the minimize tab perches on TOP of the sheet, centered */
  .gp-min, .sp-min{
    right:50%;left:auto;top:auto;bottom:100%;transform:translateX(50%);
    border:.5px solid var(--ui-border);border-bottom:none;
    border-radius:9px 9px 0 0;padding:4px 24px;
  }

  /* hand dock: smaller cards, never taller than a third of the screen */
  .hand{max-height:34vh;--hc-scale:.315;}
  /* while the game panel sheet is open, the dock rides ABOVE it — at the
     bottom it covered the sheet's own Submit button. Keep the pair under
     ~55vh total so the board is never buried */
  body:has(.game-panel.open) .hand{bottom:calc(34vh + 14px);max-height:22vh;}
  body:has(.game-panel.open) .hand .hand-cards{height:auto;max-height:17vh;overflow-y:auto;}
  /* 17vh is SHORTER than one card — it clipped every card's top. Give the
     wide/swap grid room for a full row so the tops are readable. */
  body:has(.game-panel.open) .hand.dock-wide .hand-cards{max-height:min(38vh, 320px);}

  /* dialogs fit the screen */
  .dlg{width:min(94vw, 560px);max-height:92vh;overflow-y:auto;}
  .judge-popup{width:94vw;max-height:88vh;overflow-y:auto;}

  .board-hud{display:none;}
}

/* ── Styled confirm (replaces native confirm) ── */
.ui-confirm-ov{
  position:fixed;inset:0;z-index:4000;display:flex;align-items:center;justify-content:center;
  background:rgba(6,4,14,.6);backdrop-filter:blur(4px);padding:20px;
  opacity:0;transition:opacity .16s;
}
.ui-confirm-ov.open{opacity:1;}
.ui-confirm{
  width:min(420px,92vw);background:var(--ui-panel);border:.5px solid var(--ui-border);
  border-radius:14px;padding:24px 26px 20px;box-shadow:0 24px 70px rgba(0,0,0,.55);
  transform:translateY(6px);transition:transform .16s;
}
.ui-confirm-ov.open .ui-confirm{transform:none;}
.uc-title{font-family:'Cinzel',serif;font-size:15px;letter-spacing:1.5px;color:var(--gold);margin-bottom:9px;}
.uc-msg{font-family:'Cormorant Garamond',serif;font-size:15px;line-height:1.5;color:var(--ui-text2);margin-bottom:20px;}
.uc-row{display:flex;justify-content:flex-end;gap:10px;}
.uc-btn{
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;
  padding:9px 18px;border-radius:9px;cursor:pointer;border:.5px solid var(--ui-border);
  background:transparent;color:var(--ui-text3);transition:all .14s;
}
.uc-cancel:hover{color:var(--ui-text);border-color:var(--ui-text3);}
.uc-ok{background:var(--gold);color:#241c04;border-color:var(--gold);font-weight:600;}
.uc-ok:hover{filter:brightness(1.08);}
.uc-ok.danger{background:#a23a3a;color:#fbeaea;border-color:#a23a3a;}
.uc-ok.danger:hover{background:#b04444;}

/* ── Side deals: the Civ-style trade table ── */
.gp-dealops{display:flex;flex-direction:column;gap:6px;margin:10px 0;}
.gp-dealwith{display:flex;align-items:center;gap:9px;justify-content:flex-start;text-align:left;}
.gp-dw-k{margin-left:auto;font-family:'Cinzel',serif;color:var(--gold);font-size:11px;}
/* the side-deal launcher — a floating, collapsible panel (NOT a full-screen
   modal), so the board and scores stay visible while you shop for deals */
.deal-window{position:fixed;left:18px;bottom:18px;z-index:960;width:min(88vw,270px);
  background:color-mix(in srgb,var(--ui-panel) 96%,transparent);
  border:.5px solid rgba(201,185,122,.45);border-radius:12px;
  box-shadow:0 12px 34px rgba(0,0,0,.42);overflow:hidden;animation:clIn .2s ease-out;}
.deal-window .dw-hd{display:flex;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;
  font-family:'Cinzel',serif;font-size:12px;letter-spacing:1.2px;color:var(--gold);text-transform:uppercase;
  background:color-mix(in srgb,var(--gold) 12%,transparent);border-bottom:.5px solid var(--ui-border2);}
.deal-window.collapsed .dw-hd{border-bottom:none;}
.deal-window.collapsed .dw-body{display:none;}
.dw-tog{width:14px;text-align:center;color:var(--ui-text3);}
.dw-title{flex:1;}
.dw-done{margin-left:auto;font-family:'Cinzel',serif;font-size:10px;letter-spacing:.6px;color:var(--gold);
  background:transparent;border:.5px solid rgba(201,185,122,.5);border-radius:6px;padding:4px 9px;cursor:pointer;text-transform:uppercase;}
.dw-done:hover{background:color-mix(in srgb,var(--gold) 16%,transparent);}
.dw-body{padding:11px 12px;}
.dw-note{font-family:'Cormorant Garamond',serif;font-size:14px;color:var(--ui-text2);line-height:1.35;margin-bottom:9px;}
.dw-ops{display:flex;flex-direction:column;gap:6px;}
.dw-op{display:flex;align-items:center;gap:9px;text-align:left;padding:7px 10px;
  background:rgba(201,185,122,.09);border:.5px solid rgba(201,185,122,.32);border-radius:8px;
  color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:15px;cursor:pointer;}
.dw-op:hover{border-color:rgba(201,185,122,.6);background:color-mix(in srgb,var(--ui-stage) 70%,transparent);}
.dw-nm{flex:1;}
.dw-hu{font-style:normal;font-size:8.5px;letter-spacing:1px;text-transform:uppercase;color:var(--gold);
  border:.5px solid var(--gold-dim);border-radius:7px;padding:1px 6px;margin-left:6px;}
.dw-k{font-family:'Cinzel',serif;color:var(--gold);font-size:11px;}
/* buy-a-card search UI (inside a .deal-inner popup) */
.buy-search{width:100%;margin-top:12px;padding:9px 12px;border-radius:8px;border:.5px solid var(--ui-input-bdr);
  background:var(--ui-input);color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:15px;}
.buy-search:focus{outline:none;border-color:rgba(201,185,122,.6);}
.buy-results{display:flex;flex-direction:column;gap:4px;margin-top:8px;max-height:260px;overflow-y:auto;}
.buy-res{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;padding:7px 11px;
  background:rgba(201,185,122,.07);border:.5px solid rgba(201,185,122,.28);border-radius:7px;
  color:var(--ui-text);font-family:'Cormorant Garamond',serif;font-size:15px;cursor:pointer;}
.buy-res:hover{border-color:rgba(201,185,122,.6);background:color-mix(in srgb,var(--ui-stage) 70%,transparent);}
.buy-desc{font-size:12px;color:var(--ui-text2);font-style:italic;}
.buy-none{padding:8px 4px;font-style:italic;}
.buy-foot{margin-top:10px;}
.buy-pick{font-family:'Cormorant Garamond',serif;font-size:15px;color:var(--ui-text);margin-bottom:8px;}
.buy-pick.dim{opacity:.6;font-style:italic;}
.buy-tier{font-family:'Cinzel',serif;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--gold);}
.buy-hint{margin-top:7px;font-family:'Cormorant Garamond',serif;font-size:12.5px;font-style:italic;color:var(--ui-text2);line-height:1.35;}
.buy-foot .deal-acts{display:flex;gap:8px;flex-wrap:wrap;}
.buy-foot .deal-acts .deal-propose{flex:1;min-width:130px;}
.buy-leave{display:flex;flex-direction:column;gap:5px;max-height:240px;overflow-y:auto;}
/* watch-mode (Arena / all-AI) transport bar — pause · step · exit */
.watch-bar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:965;
  display:flex;align-items:center;gap:8px;padding:7px 10px;
  background:color-mix(in srgb,var(--ui-panel) 94%,transparent);backdrop-filter:blur(9px);
  border:.5px solid rgba(201,185,122,.45);border-radius:30px;box-shadow:0 10px 30px rgba(0,0,0,.42);}
.watch-bar .wb-btn{width:34px;height:34px;border-radius:50%;border:.5px solid var(--ui-border);
  background:var(--ui-input);color:var(--ui-text);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .13s;}
.watch-bar .wb-btn:hover{border-color:rgba(201,185,122,.6);color:var(--gold);}
.watch-bar .wb-exit:hover{border-color:rgba(192,80,64,.6);color:#c05040;}
.watch-bar .wb-lbl{font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ui-text3);padding:0 4px;}
.deal-popup{position:fixed;inset:0;z-index:970;background:rgba(4,3,12,.82);backdrop-filter:blur(9px);
  display:flex;align-items:center;justify-content:center;animation:clIn .2s ease-out;}
.deal-inner{width:min(94vw,620px);max-height:92vh;overflow-y:auto;background:color-mix(in srgb,var(--ui-panel) 94%,transparent);
  border:.5px solid rgba(201,185,122,.4);border-radius:14px;padding:18px 20px;box-shadow:0 14px 40px rgba(0,0,0,.5);}
.deal-hd{display:flex;align-items:center;gap:9px;font-family:'Cinzel',serif;font-size:14px;letter-spacing:1.5px;
  color:var(--gold);text-transform:uppercase;padding-bottom:12px;border-bottom:.5px solid var(--ui-border2);}
.deal-hd b{color:var(--ui-text);}
.deal-x{margin-left:auto;cursor:pointer;color:var(--ui-text3);font-size:16px;}
.deal-x:hover{color:var(--gold);}
.deal-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0;}
.deal-col{border:.5px solid var(--ui-border2);border-radius:10px;padding:10px;}
.deal-col-hd{font-family:'Cinzel',serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--ui-text3);margin-bottom:8px;}
.deal-krow{display:flex;align-items:center;gap:6px;font-family:'Cinzel',serif;color:var(--gold);font-size:13px;margin-bottom:9px;}
.deal-k{width:72px;font-family:'Cinzel',serif;font-size:13px;padding:4px 6px;border-radius:6px;
  border:.5px solid var(--ui-border);background:var(--ui-stage);color:var(--ui-text);}
.deal-kmax{color:var(--ui-text3);font-size:11px;}
.deal-cards{display:flex;flex-wrap:wrap;gap:5px;}
.deal-card{font-family:'Spectral',serif;font-size:11.5px;padding:4px 8px;border-radius:7px;cursor:pointer;
  border:.5px solid var(--ui-border);background:transparent;color:var(--ui-text2);transition:all .12s;}
.deal-card b{color:var(--gold);font-size:10px;}
.deal-card.on{background:rgba(201,185,122,.22);border-color:var(--gold);color:var(--ui-text);}
.deal-none{color:var(--ui-text3);font-size:11px;font-style:italic;}
.deal-meter{position:relative;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:1px;overflow:hidden;margin:4px 0 12px;
  border:.5px solid var(--ui-border);}
.deal-meter span{position:relative;z-index:2;color:var(--ui-text);text-shadow:0 1px 3px rgba(0,0,0,.6);}
.deal-meter-fill{position:absolute;inset:0;z-index:1;opacity:.5;}
.deal-meter.ok .deal-meter-fill{background:#2f7d45;}
.deal-meter.mid .deal-meter-fill{background:#b0862f;}
.deal-meter.no .deal-meter-fill{background:#9a3a3a;}
.deal-acts{display:flex;justify-content:center;}
.deal-msg{margin-top:10px;font-family:'Spectral',serif;font-size:13px;color:var(--ui-text2);text-align:center;}
.deal-counter b{color:var(--gold);}
.deal-crow{display:flex;gap:8px;justify-content:center;margin-top:10px;}

/* styled confirm (resign, etc.) */
.confirm-overlay{position:fixed;inset:0;z-index:1000;background:rgba(4,3,12,.72);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;animation:clIn .18s ease-out;}
.confirm-dlg{max-width:400px;text-align:center;}
.confirm-dlg .dlg-sub{font-size:14px;line-height:1.5;}

/* Sway-a-vote (vote-buying) modal — reuses .deal-popup shell */
.deal-note{font-family:'Spectral',serif;font-size:12.5px;color:var(--ui-text2);margin:10px 0 14px;line-height:1.4;}
.sway-sec{margin-bottom:12px;}
.sway-lbl{font-family:'Cinzel',serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--ui-text3);margin-bottom:6px;}
.sway-row{display:flex;flex-wrap:wrap;gap:6px;}
.sway-opt{display:inline-flex;align-items:center;gap:6px;font-family:'Spectral',serif;font-size:12.5px;padding:5px 10px;border-radius:8px;cursor:pointer;
  border:.5px solid var(--ui-border);background:transparent;color:var(--ui-text2);transition:all .12s;}
.sway-opt:hover{border-color:var(--gold);}
.sway-opt.on{background:rgba(201,185,122,.22);border-color:var(--gold);color:var(--ui-text);}
.sway-opt.bought{border-color:#3a8a4a;color:#7fc98f;}
.sway-hint{font-style:italic;color:var(--ui-text3);font-size:12px;}

/* ── the spoils ceremony — won cards + confetti at game end ─── */
.won-ceremony{
  position:fixed;inset:0;z-index:240;display:flex;align-items:center;justify-content:center;
  /* no backdrop-filter — a blur under 80 animating confetti re-composites
     every frame and stutters modest laptops */
  background:rgba(12,10,7,.86);animation:wcIn .35s ease;
}
@keyframes wcIn{from{opacity:0;}to{opacity:1;}}
.wc-inner{position:relative;text-align:center;max-width:min(94vw,900px);max-height:92vh;overflow:auto;padding:18px;}
.wc-hd{font-family:'Cormorant Garamond',serif;font-size:30px;letter-spacing:.14em;color:var(--gold,#c9b97a);margin-bottom:6px;text-shadow:0 0 24px rgba(201,185,122,.45);}
.wc-sub{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:17px;color:#e8dfc8;margin-bottom:14px;}
.wc-cards{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin-bottom:16px;}
.wc-cards .nx{zoom:.72;animation:wcCard .6s cubic-bezier(.2,.9,.3,1.15) both;}
.wc-cards .nx:nth-child(2){animation-delay:.12s;}
.wc-cards .nx:nth-child(3){animation-delay:.24s;}
.wc-cards .nx:nth-child(4){animation-delay:.36s;}
.wc-cards .nx:nth-child(5){animation-delay:.48s;}
.wc-cards .nx:nth-child(6){animation-delay:.6s;}
@keyframes wcCard{from{opacity:0;transform:translateY(26px) scale(.92);}to{opacity:1;transform:none;}}
.wc-confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.wc-confetti i{position:absolute;top:-14px;height:12px;border-radius:2px;opacity:.9;animation:wcFall linear both;}
@keyframes wcFall{
  from{transform:translateY(-10px) rotate(0deg);}
  to{transform:translateY(104vh) rotate(660deg);opacity:.75;}
}
.wc-close{min-width:180px;}

/* per-play judge verdicts — why each play won or fell short */
.gp-vnotes{margin-top:8px;display:flex;flex-direction:column;gap:5px;}
.gp-vnote{
  font-family:'Spectral',serif;font-size:12.5px;line-height:1.45;color:var(--ui-text2);
  padding:5px 9px;border-left:2px solid var(--ui-border);background:rgba(255,255,255,.025);border-radius:0 6px 6px 0;
}
.gp-vnote b{color:var(--ui-text);}
.jp-whynot{
  font-family:'Spectral',serif;font-style:italic;font-size:12px;line-height:1.4;
  color:var(--ui-text3);margin-top:6px;padding-top:5px;border-top:.5px dashed var(--ui-border);
}

/* ── Cross-document View Transitions (see home.css) — full-page
   crossfade only; the per-nav view-transition-name was removed (it
   ghosted the Watch dropdown). */
@view-transition { navigation: auto; }
::view-transition-old(root),::view-transition-new(root){ animation-duration:.16s; }

/* Connect + Clear are SANDBOX vestiges — the table is game-first now, so
   there are no hand-drawn edges to make and no loose canvas to wipe (a
   finished game's canvas is the saved artifact). Hidden site-wide; the HTML
   gets removed in a later table.html pass. (user 7/10: "do the connect and
   clear buttons even make sense here anymore?") */
#connectBtn, #clearBtn{ display:none; }