/* ===================== Pokémon Splendor — styles ===================== */
:root{
  --red:#e3350d; --blue:#2f6fd6; --black:#3a3d44; --pink:#f06fa0; --yellow:#f4c025; --purple:#7a4fc0;
  --bg0:#0e1230; --bg1:#171c44; --panel:#1d2350; --panel2:#252c63; --line:#3a4290;
  --ink:#eef1ff; --muted:#a9b0e0; --gold:#ffd54a; --good:#46d17a; --bad:#ff5d6c;
  --shadow:0 6px 20px rgba(0,0,0,.35);
  --radius:14px;
  /* fluid card / token sizes — scale smoothly with viewport */
  --card-w:clamp(66px, 9vw, 92px);
  --card-h:calc(var(--card-w) * 4 / 3);
  --ball:clamp(30px, 7.4vw, 36px);
  /* safe-area insets (notch / home indicator); resolve to 0 on non-notched devices */
  --sa-t:env(safe-area-inset-top,0px);
  --sa-r:env(safe-area-inset-right,0px);
  --sa-b:env(safe-area-inset-bottom,0px);
  --sa-l:env(safe-area-inset-left,0px);
  --dock-h:0px;                 /* live height of the mobile control dock (set by JS) */
  --app-h:100vh; --app-h:100svh; --app-h:100dvh;/* follow the visible mobile viewport */
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;height:100%}
body{
  font-family:"PingFang SC","Microsoft YaHei",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(1200px 600px at 15% -10%, #2a3296 0, transparent 55%),
    radial-gradient(1000px 700px at 110% 10%, #6a2f86 0, transparent 50%),
    linear-gradient(160deg,var(--bg0),var(--bg1));
  background-attachment:fixed;
  overflow-x:hidden;
  overscroll-behavior:none;           /* no pull-to-refresh / rubber-band */
  -webkit-tap-highlight-color:transparent;
}
.screen{min-height:100vh;min-height:var(--app-h)}
.hidden{display:none !important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* touch hygiene: instant taps, no accidental text-select / long-press callout on controls */
button,.seg button,.supply-row,.card,.deck-pile,.mini-card,.ball,.chip,.evo-option,.seat .pid,#undo-btn,.exp-toggle{
  touch-action:manipulation;
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
}

/* ---------- buttons ---------- */
button{font-family:inherit;cursor:pointer;border:none;border-radius:10px;font-size:14px;padding:10px 14px;min-height:40px;transition:.15s transform,.15s background,.15s box-shadow}
button:active{transform:translateY(1px)}
.primary{background:linear-gradient(180deg,#ffd54a,#f6b800);color:#3a2a00;font-weight:800;box-shadow:0 4px 0 #b88600}
.tutorial-featured{background:linear-gradient(135deg,#fff0a8,#ffd54a 55%,#f6b800);color:#3a2a00;font-weight:900;border:1px solid #ffe98b;box-shadow:0 4px 0 #a87700}
.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.small{padding:7px 11px;font-size:13px;min-height:34px}
button:disabled{opacity:.45;cursor:not-allowed}
:where(button,[role="button"],input,select):focus-visible{outline:3px solid #fff;outline-offset:3px}
@media (hover:hover) and (pointer:fine){
  .primary:hover{filter:brightness(1.05)}
  .ghost:hover{background:var(--panel2)}
}

/* ---------- setup ---------- */
#setup,#lobby{display:grid;place-items:center;padding:max(16px,var(--sa-t)) max(16px,var(--sa-r)) max(16px,var(--sa-b)) max(16px,var(--sa-l))}
.setup-card{background:linear-gradient(155deg,rgba(28,35,92,.92),rgba(18,22,61,.88));backdrop-filter:blur(10px);border:1px solid rgba(106,118,215,.55);border-radius:22px;padding:clamp(20px,5vw,34px);max-width:580px;width:100%;box-shadow:0 22px 70px rgba(3,5,20,.5),inset 0 1px rgba(255,255,255,.06)}
.brand{font-size:clamp(26px,8vw,40px);margin:0 0 6px;text-align:center;letter-spacing:1px;line-height:1.1}
.brand-splendor{color:var(--gold);text-shadow:0 2px 0 #9a6b00}
.brand-dot{margin:0 6px;color:var(--muted)}
.brand-pkmn{color:#ffcb05;-webkit-text-stroke:1.5px #2a75bb}
.tagline{color:var(--muted);text-align:center;margin:0 0 22px;line-height:1.6;font-size:clamp(13px,3.4vw,16px)}
/* "continue last game" banner on the setup screen (local autosave resume) */
.resume-banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:space-between;
  background:linear-gradient(90deg,rgba(255,213,74,.16),rgba(122,79,192,.12));
  border:1px solid var(--gold);border-radius:12px;padding:12px 14px;margin:0 0 18px}
.resume-banner .rb-text{flex:1 1 180px;color:var(--ink);font-size:14px;line-height:1.5}
.resume-banner .rb-text small{color:var(--muted);font-size:12px}
.resume-banner .rb-text .rb-when{opacity:.7}
.resume-banner .rb-btns{display:flex;gap:8px;flex:0 0 auto}
.resume-banner .rb-btns button{min-height:42px}
/* ---------- online lobby ---------- */
.setup-online{margin-top:8px}
#lobby .setup-card{text-align:center}
.lobby-code{font-size:15px;margin:6px 0 12px;color:var(--muted)}
.lobby-code b{color:var(--gold);letter-spacing:3px;font-size:22px;font-family:ui-monospace,monospace;margin:0 6px}
.lobby-code button{font-size:12px;padding:5px 10px;min-height:auto;vertical-align:middle}
.lobby-status{color:var(--muted);font-size:13px;margin:8px 0}
.lobby-identity{margin:10px 0;padding:12px;border:1px solid var(--line);border-radius:12px;background:rgba(17,22,58,.72);text-align:left}
.lobby-identity label{display:block;margin-bottom:7px;color:var(--gold);font-size:13px;font-weight:800}
.lobby-identity>div{display:flex;gap:8px;align-items:center}
.lobby-identity input{flex:1 1 auto;min-width:0;background:#11163a;border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:10px 12px;font:inherit;font-size:16px}
.lobby-identity input::placeholder{color:var(--muted);opacity:.7}
.lobby-identity small{display:block;margin-top:6px;color:var(--muted);font-size:11px;line-height:1.5}
.lobby-roster{background:#11163a;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:10px 0;min-height:46px;text-align:left}
.lobby-roster .lr-row{display:flex;align-items:center;gap:8px;padding:4px 2px;font-size:14px;color:var(--ink)}
.lr-dot{width:9px;height:9px;border-radius:50%;flex:none}
.lr-dot.on{background:var(--good);box-shadow:0 0 6px var(--good)}
.lr-dot.off{background:var(--muted);opacity:.45}
.lobby-roster .muted{color:var(--muted);font-size:13px}
.lobby-exp{justify-content:center;flex-wrap:wrap}
.lobby-hint{color:var(--muted);font-size:12px;margin-top:10px;line-height:1.6}
/* idle / disconnect → AI-takeover status strip */
.idle-bar{text-align:center;line-height:1.4;min-height:0}
.idle-bar:empty{display:none}
.idle-bar span{display:inline-block;margin:4px auto;padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:700}
.idle-wait{background:rgba(122,79,192,.18);border:1px solid var(--purple);color:#cbb6ff}
.idle-warn{background:rgba(255,213,74,.16);border:1px solid var(--gold);color:var(--gold)}
.idle-ai{background:rgba(70,209,122,.16);border:1px solid var(--good);color:var(--good)}
.setup-row{display:flex;align-items:center;gap:14px;margin:14px 0;flex-wrap:wrap}
.setup-row>label{width:72px;color:var(--muted);flex:none}
.seg{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.seg button{background:transparent;border-radius:0;padding:10px 20px;color:var(--ink);min-height:44px}
.seg button.active{background:var(--gold);color:#3a2a00;font-weight:800}
.seats{display:flex;flex-direction:column;gap:10px;margin:8px 0 20px}
.seat{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;flex-wrap:wrap}
.seat .pid{width:34px;height:34px;border-radius:50%;flex:none;background-size:cover;background-position:center;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.seat input[type=text]{flex:1 1 120px;min-width:0;background:#11163a;border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:10px;font-size:16px}
.seat select{flex:1 1 88px;min-width:0;background:#11163a;border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:10px 8px;font-size:14px;min-height:44px}
.setup-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.setup-actions .primary{padding:13px 30px;font-size:16px}
.setup-actions .ghost{padding:13px 24px}
.academy{margin-top:14px;padding:13px;border:1px solid rgba(255,213,74,.32);border-radius:15px;background:linear-gradient(120deg,rgba(255,213,74,.09),rgba(122,79,192,.11))}
.academy-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.academy-head>div{display:flex;flex-direction:column;gap:2px}.academy-head strong{color:var(--gold);font-size:14px}.academy-head div span{color:var(--muted);font-size:11px}
.academy-time{flex:none;color:#d9defc;font-size:10.5px;background:rgba(255,255,255,.07);border:1px solid var(--line);border-radius:999px;padding:4px 8px}
.setup-tutorials{margin-top:0}.setup-tutorials button{padding:11px 13px;min-height:48px}.setup-tutorials button small{display:block;font-size:9.5px;margin-top:2px;opacity:.75}
.setup-tutorials button.completed{border-color:var(--good);box-shadow:inset 0 0 0 1px rgba(70,209,122,.18)}
.setup-tutorials button.completed::after{content:"  ✓ 已完成";color:var(--good);font-size:10px;font-weight:800}
.credit{margin-top:18px;text-align:center;color:var(--muted);font-size:12px;opacity:.7;line-height:1.5}
.exp-toggle{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--muted);line-height:1.5;cursor:pointer;flex:1 1 100%}
.exp-toggle input{width:20px;height:20px;flex:none;margin-top:1px;accent-color:var(--gold)}
.exp-picker{border:0;margin:18px 0 16px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.exp-picker legend{padding:0;margin:0 0 8px;color:var(--muted);font-size:13px;font-weight:800;letter-spacing:.5px}
.exp-card{position:relative;display:flex;align-items:center;gap:10px;min-width:0;padding:12px;border:1px solid var(--line);border-radius:13px;background:rgba(17,22,58,.72);cursor:pointer;transition:.15s border-color,.15s background,.15s transform}
.exp-card:hover{background:var(--panel)}.exp-card:active{transform:translateY(1px)}
.exp-card:focus-within{outline:3px solid #fff;outline-offset:2px}.exp-card:has(input:checked){border-color:var(--gold);background:linear-gradient(110deg,rgba(255,213,74,.14),rgba(122,79,192,.12));box-shadow:inset 0 0 0 1px rgba(255,213,74,.2)}
.exp-card input{width:21px;height:21px;flex:none;margin:0;accent-color:var(--gold)}
.exp-icon{font-size:23px;line-height:1;flex:none}.exp-copy{display:flex;flex-direction:column;gap:3px;min-width:0}.exp-copy strong{font-size:14px;color:var(--ink)}.exp-copy small{font-size:10px;color:var(--gold);font-weight:800}.exp-copy>span{font-size:11.5px;line-height:1.45;color:var(--muted)}
@media(max-width:520px){.exp-picker{grid-template-columns:1fr}.exp-card{padding:11px}.setup-card{padding:20px 16px}}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;background:rgba(6,8,24,.76);display:grid;place-items:center;z-index:60;padding:max(16px,var(--sa-t)) 16px max(16px,var(--sa-b))}
.modal-box{background:var(--bg1);border:1px solid var(--line);border-radius:18px;padding:clamp(18px,4vw,28px);max-width:640px;width:100%;box-shadow:0 22px 70px rgba(0,0,0,.6);max-height:88svh;max-height:88dvh;overflow:auto}
.modal-box h2{margin:0 0 14px;color:var(--gold)}
.rules-body{line-height:1.7;color:var(--ink);font-size:clamp(14px,3.6vw,16px)}
.rules-body ul{margin:6px 0 6px 0;padding-left:20px}
.rules-body li{margin:4px 0}
.rules-body b{color:var(--gold)}
.rules-exp{margin-top:14px;border:1px solid var(--line);border-radius:12px;background:rgba(17,22,58,.6);padding:10px 12px}.rules-exp summary{cursor:pointer;color:#7cf0b2;font-weight:800}.rules-exp[open] summary{margin-bottom:8px}
.modal-box > .primary{margin-top:16px}

/* ---------- game shell ---------- */
#game{min-height:var(--app-h)}
#topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:calc(8px + var(--sa-t)) max(14px,var(--sa-r)) 8px max(14px,var(--sa-l));background:rgba(10,13,40,.88);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;backdrop-filter:blur(10px)}
.brand-mini{display:block;max-width:240px;font-weight:800;color:var(--gold);letter-spacing:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#turn-banner{font-weight:800;font-size:clamp(13px,3.6vw,16px);padding:6px 14px;border-radius:20px;background:var(--panel2);border:1px solid var(--line);text-align:center;flex:1 1 auto;min-width:0}
.topbar-left,.topbar-right{flex:0 1 auto;min-width:0}
.topbar-right{display:flex;align-items:center;gap:6px}
#sound-btn.sound-off{opacity:.62}
#score-strip{display:none}
.score-pill{display:flex;align-items:center;gap:5px;min-width:0;padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:rgba(17,22,58,.82);font-size:11px;color:var(--muted)}
.score-pill.active{border-color:var(--gold);background:rgba(255,213,74,.12);box-shadow:0 0 0 1px rgba(255,213,74,.15)}
.score-dot{width:9px;height:9px;border-radius:50%;flex:none}.score-name{max-width:78px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);font-weight:700}
.score-pill b{color:var(--gold);font-size:14px}.score-pill small{font-size:9px}.score-balls{white-space:nowrap}
#board{min-width:0}
#field{display:flex;flex-direction:column;gap:10px;container-type:inline-size;container-name:game-field}
#controls{display:flex;flex-direction:column;gap:14px}

/* desktop / large tablet: board left, controls + log right, players full-width */
@media (min-width:1000px){
  #game{display:grid;gap:14px;padding:14px;
    grid-template-columns:minmax(0,1fr) 340px;
    grid-template-areas:
      "topbar  topbar"
      "board   controls"
      "board   log"
      "players players";}
  #topbar{grid-area:topbar;margin:-14px -14px 0;border-radius:0}
  #board{grid-area:board}
  /* Keep the control column in its grid row. Making the whole column sticky lets
     it slide over the log and player rows while the page is scrolled. The
     action bar below can still stay sticky inside this scrollable column. */
  #controls{grid-area:controls;position:static;align-self:start;max-height:calc(100dvh - 76px);overflow:auto;overscroll-behavior:contain}
  #log{grid-area:log;align-self:start}
  #players{grid-area:players}
  #action-bar{position:sticky;top:0;z-index:4;box-shadow:0 10px 24px rgba(7,9,28,.35)}
  #score-strip{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none}
  #score-strip::-webkit-scrollbar{display:none}
  .topbar-left{display:none}
  #turn-banner{flex:0 1 280px}
}
@media (max-width:520px){
  .topbar-left{display:none}
  #topbar{padding-left:max(9px,var(--sa-l));padding-right:max(9px,var(--sa-r))}
  #turn-banner{padding-inline:10px}
}

/* field rows */
.tier-row{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:var(--radius);padding:8px}
.tier-label{writing-mode:vertical-rl;text-orientation:upright;font-weight:800;font-size:13px;color:var(--muted);letter-spacing:3px;width:24px;text-align:center;flex:none}
.tier-special .tier-label{color:var(--gold)}
.deck-pile{flex:none;width:var(--card-w);height:var(--card-h);border-radius:10px;border:2px dashed var(--line);display:grid;place-items:center;position:relative;background:linear-gradient(135deg,#222a63,#161b42);background-size:cover;background-position:center;cursor:default;overflow:hidden}
/* real tier card-back art from the TTS mod (darkened so the count stays legible) */
.deck-pile[data-tier="stage1"]{background-image:linear-gradient(rgba(8,10,30,.40),rgba(8,10,30,.62)),url(../assets/backs/stage1.webp)}
.deck-pile[data-tier="stage2"]{background-image:linear-gradient(rgba(8,10,30,.40),rgba(8,10,30,.62)),url(../assets/backs/stage2.webp)}
.deck-pile[data-tier="stage3"]{background-image:linear-gradient(rgba(8,10,30,.40),rgba(8,10,30,.62)),url(../assets/backs/stage3.webp)}
.deck-pile[data-tier="rare"]{background-image:linear-gradient(rgba(8,10,30,.40),rgba(8,10,30,.62)),url(../assets/backs/rare.webp)}
.deck-pile[data-tier="legend"]{background-image:linear-gradient(rgba(8,10,30,.40),rgba(8,10,30,.62)),url(../assets/backs/legend.webp)}
/* PokéMart uses a distinct supplied back for each shop level. */
.deck-pile[data-tier="pmL1"]{background-image:linear-gradient(rgba(8,10,30,.12),rgba(8,10,30,.28)),url(../assets/backs/pokemart-1.png)}
.deck-pile[data-tier="pmL2"]{background-image:linear-gradient(rgba(8,10,30,.12),rgba(8,10,30,.28)),url(../assets/backs/pokemart-2.png)}
.deck-pile[data-tier="pmL3"]{background-image:linear-gradient(rgba(8,10,30,.12),rgba(8,10,30,.28)),url(../assets/backs/pokemart-3.png)}
/* count → small corner badge so the back art reads (min-width fits 2-digit counts like 35) */
.deck-pile .count{position:absolute;top:6px;right:7px;font-weight:800;font-size:13px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.85);background:rgba(0,0,0,.5);border-radius:8px;min-width:24px;height:23px;display:flex;align-items:center;justify-content:center;padding:0 5px;z-index:2}
.deck-pile.reservable{cursor:pointer;border-style:solid}
.deck-pile .deck-tag{position:absolute;bottom:5px;left:5px;font-size:9px;color:#fff;opacity:.9;text-shadow:0 1px 2px rgba(0,0,0,.95);background:rgba(0,0,0,.4);border-radius:4px;padding:2px 5px;line-height:1;z-index:1}
.card-strip{display:flex;gap:8px;flex-wrap:wrap}

/* card */
.card{width:var(--card-w);height:var(--card-h);border-radius:9px;overflow:hidden;position:relative;flex:none;cursor:pointer;background:#0c1030;border:2px solid transparent;box-shadow:0 3px 8px rgba(0,0,0,.4);transition:.12s transform,.12s box-shadow}
.card.pm-card,.tier-pokemart .deck-pile{height:calc(var(--card-w) * 1.545)}
.card.pm-card img{object-fit:cover;object-position:center;background:#61c9dc}
.card.pm-card.pm-locked:not(.selected){filter:saturate(.72) brightness(.86)}
.card img{width:100%;height:100%;display:block;object-fit:cover}
.card.affordable{border-color:var(--good);box-shadow:0 0 0 2px rgba(70,209,122,.5),0 6px 14px rgba(0,0,0,.4)}
/* affordable, but the purchase would spend Master Balls (百搭): purple tier + a
   大师×N count badge (colour-blind-safe redundant cue, never colour alone) */
.card.affordable-wild{border-color:var(--purple);box-shadow:0 0 0 2px rgba(122,79,192,.75),0 6px 14px rgba(0,0,0,.4)}
.wild-badge{position:absolute;top:3px;left:3px;z-index:2;background:var(--purple);color:#fff;border:1px solid #15182f;border-radius:6px;padding:1px 5px;font-size:10px;font-weight:800;line-height:1.5;box-shadow:0 1px 3px rgba(0,0,0,.6);pointer-events:none;white-space:nowrap}
.card.selected{border-color:var(--gold);box-shadow:0 0 0 3px rgba(255,213,74,.6)}
.card .empty-slot{width:100%;height:100%;display:grid;place-items:center;color:var(--muted);background:repeating-linear-gradient(45deg,#141a40,#141a40 6px,#11163a 6px,#11163a 12px)}
.card-back{background:linear-gradient(135deg,#3a2a6e,#221a4a)}
.reserve-mini{position:absolute;top:3px;right:3px;background:rgba(0,0,0,.6);border-radius:6px;padding:3px 6px;font-size:10px;color:#fff;opacity:0;transition:.12s}
.reserve-mini:active{background:var(--gold);color:#000}
@media (hover:hover) and (pointer:fine){
  .card:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 10px 22px rgba(0,0,0,.5);z-index:5}
  .deck-pile.reservable:hover{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,213,74,.3)}
  .card:hover .reserve-mini{opacity:1}
  .reserve-mini:hover{background:var(--gold);color:#000}
}

/* ---------- poké-ball tokens ---------- */
/* real Poké-Ball art extracted from the TTS mod (700px RGBA → 128px web icons) */
.ball{width:var(--ball);height:var(--ball);position:relative;flex:none;
  background:center/contain no-repeat;filter:drop-shadow(0 2px 3px rgba(0,0,0,.45))}
.ball.red{background-image:url(../assets/balls/red.png)}
.ball.blue{background-image:url(../assets/balls/blue.png)}
.ball.black{background-image:url(../assets/balls/black.png)}
.ball.pink{background-image:url(../assets/balls/pink.png)}
.ball.yellow{background-image:url(../assets/balls/yellow.png)}
.ball.purple{background-image:url(../assets/balls/purple.png)}
/* Mega token has no real-world ball → keep the drawn rainbow token */
.ball.mega-token{border-radius:50%;filter:none;background:conic-gradient(from 0deg,#e3350d,#f4c025,#46d17a,#2f6fd6,#7a4fc0,#e3350d);border:2px solid #15182f;box-shadow:inset 0 -3px 6px rgba(0,0,0,.3),0 0 8px rgba(255,213,74,.5)}
.ball.mega-token::before{content:"\26A1";position:absolute;top:0;left:0;right:0;text-align:center;font-size:14px;z-index:2}
.supply-row.mega-row{margin-top:6px;border-top:1px dashed var(--line);padding-top:8px}
.tier-mega{background:linear-gradient(90deg,rgba(122,79,192,.18),rgba(244,192,37,.10))}
.tier-divine{background:linear-gradient(105deg,rgba(100,74,188,.28),rgba(37,126,198,.16),rgba(227,53,13,.12));border-color:rgba(255,213,74,.55);box-shadow:inset 0 0 24px rgba(183,155,255,.08)}
.tier-divine .tier-label{min-width:82px;color:#fff3b0;text-shadow:0 0 10px rgba(255,213,74,.55)}
.divine-rule{display:flex;flex-direction:column;gap:3px;min-width:190px;max-width:290px;font-size:12px;color:var(--muted);line-height:1.35}
.divine-rule b{color:var(--gold);font-size:13px;letter-spacing:.5px}
.divine-complete{width:var(--card-w);aspect-ratio:3/4;border:1px dashed rgba(255,213,74,.7);border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;background:rgba(7,9,30,.42);color:var(--gold)}
.divine-complete span{font-size:28px}.divine-complete b{font-size:12px}.divine-complete small{color:var(--muted);font-size:10px;padding:0 4px}
.divine-req{clear:both;margin:7px 0 8px;border:1px solid rgba(255,213,74,.35);border-radius:10px;padding:8px;background:rgba(15,18,51,.72)}
.divine-req-icons{display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap}
.divine-req-card{position:relative;width:42px;height:56px;border-radius:5px;overflow:hidden;border:2px solid var(--line);opacity:.58}
.divine-req-card img,.divine-goal{width:100%;height:100%;object-fit:cover}
.divine-req-card span{position:absolute;right:1px;bottom:1px;width:17px;height:17px;border-radius:50%;display:grid;place-items:center;background:#11163a;font-size:12px;font-weight:900}
.divine-req-card.owned{opacity:1;border-color:var(--good)}.divine-req-card.owned span{background:var(--good);color:#071a11}.divine-req-card.missing span{background:var(--bad);color:#fff}
.divine-plus,.divine-arrow{color:var(--gold);font-weight:900}.divine-arrow{font-size:22px;margin:0 3px}.divine-goal{width:42px;height:56px;border-radius:5px;border:2px solid var(--gold)}
.divine-discounts{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:8px;color:var(--ink);font-size:12px;font-weight:800}
.divine-act{background:linear-gradient(100deg,#7a4fc0,#2f6fd6,#e3350d);border-color:#fff3b0}
.evo-option.mega-evo{border-color:var(--gold);background:linear-gradient(90deg,rgba(122,79,192,.25),var(--panel2))}
.ball.sm{width:22px;height:22px}
.ball.lg{width:42px;height:42px}

/* ---------- supply ---------- */
#supply{display:flex;flex-direction:column;gap:8px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.panel-title{font-weight:800;color:var(--muted);font-size:13px;margin-bottom:8px;letter-spacing:1px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.supply-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:10px;cursor:pointer;transition:.12s;min-height:48px}
.supply-row.disabled{opacity:.4;cursor:not-allowed}
.supply-row.picked{background:rgba(255,213,74,.18);box-shadow:inset 0 0 0 1px var(--gold)}
.supply-row .name{flex:1;font-size:13px}
.supply-row .cnt{font-weight:800;font-size:18px;min-width:24px;text-align:right}
.supply-row .picked-n{color:var(--gold);font-weight:800;font-size:13px}
@media (hover:hover) and (pointer:fine){ .supply-row:not(.disabled):hover{background:var(--panel2)} }

/* ---------- action bar ---------- */
#action-bar{min-height:84px;border-color:rgba(255,213,74,.38);background:linear-gradient(145deg,rgba(42,50,112,.96),rgba(27,33,78,.96))}
body.has-card-selection #action-bar{border-color:var(--gold);box-shadow:0 0 0 1px rgba(255,213,74,.18),0 10px 26px rgba(0,0,0,.28)}
.act-hint{color:var(--muted);font-size:13px;margin-bottom:8px;line-height:1.5}
.act-buttons{display:flex;flex-wrap:wrap;gap:8px}
.act-buttons button{flex:1 1 auto;min-width:96px}
.act-buttons .primary{min-height:48px}
.tray{display:flex;gap:6px;align-items:center;margin:8px 0;min-height:38px;flex-wrap:wrap}
.tray .ball[data-discard]{width:44px;height:44px;cursor:pointer}
.tray .tray-pick{padding:0;border:2px solid var(--gold);min-height:0;flex:none;box-shadow:0 2px 7px rgba(0,0,0,.4)}
.evo-option{width:100%;text-align:left;background:var(--panel2);border:1px solid var(--line);color:var(--ink);margin-bottom:6px;display:flex;align-items:center;gap:8px;min-height:48px}
.evo-option b{color:var(--gold)}
@media (hover:hover) and (pointer:fine){ .evo-option:hover{border-color:var(--gold)} }
/* selected-card preview inside the action bar (read the card while you act) */
.sel-preview{float:right;width:calc(var(--card-w) * 1.5);height:auto;aspect-ratio:3/4;border-radius:9px;border:2px solid var(--gold);margin:0 0 6px 10px;box-shadow:0 4px 12px rgba(0,0,0,.5);cursor:zoom-in}
.sel-preview.pm-card{aspect-ratio:647/1000;object-fit:cover;object-position:center;background:#61c9dc}

/* ---------- purchase ledger (payment breakdown when a card is selected) ---------- */
.pay-ledger{clear:both;margin:6px 0 8px;background:#11163a;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.pay-ledger.unafford{opacity:.9;border-color:var(--bad)}
.ball.xs{width:16px;height:16px}
.pl-row{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:12.5px}
.pl-name{display:flex;align-items:center;gap:4px;min-width:72px;color:var(--muted);flex:none}
.pl-pips{display:flex;gap:3px;flex:1;flex-wrap:wrap;min-width:0}
.pl-calc{white-space:nowrap;color:var(--ink);flex:none}
.pl-disc{color:var(--muted)}
.pl-pay{color:var(--gold);font-size:14px;margin:0 1px}
.pl-wild{color:#b79bff;font-size:11px}
/* pips: small ball-art with a per-state symbol so the three states never rely on colour */
.pip{width:15px;height:15px}
.pip-bonus{opacity:.4;filter:grayscale(.65)}
.pip-bonus::after{content:"";position:absolute;left:-1px;right:-1px;top:50%;height:2px;margin-top:-1px;background:var(--ink);transform:rotate(-45deg);box-shadow:0 0 1px 1px rgba(0,0,0,.55)}
.pip-wild::after{content:"\2605";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:9px;color:var(--gold);text-shadow:0 1px 2px #000}
.pl-legend{font-size:10.5px;color:var(--muted);margin:7px 0 1px;line-height:1.9}
.pl-legend .lg{display:inline-block;width:12px;height:12px;border-radius:50%;position:relative;vertical-align:-2px;margin:0 3px 0 9px;background:var(--panel2);border:1px solid var(--line)}
.pl-legend .lg:first-child{margin-left:0}
.lg-bonus{opacity:.55}
.lg-bonus::after{content:"";position:absolute;left:-1px;right:-1px;top:50%;height:2px;margin-top:-1px;background:var(--ink);transform:rotate(-45deg)}
.lg-paid{background:var(--good)}
.lg-wild{background:var(--purple)}
.lg-wild::after{content:"\2605";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:8px;color:var(--gold)}
.handover{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:7px;padding-top:7px;border-top:1px dashed var(--line)}
.ho-label{font-weight:800;color:var(--ink);font-size:12px;background:var(--panel2);border-radius:6px;padding:3px 8px;flex:none}
.ho-chip{display:flex;align-items:center;gap:2px;font-weight:800;font-size:12.5px;background:#0e1230;border:1px solid var(--line);border-radius:8px;padding:2px 7px}
.ho-chip.ho-master{border-color:var(--purple);box-shadow:0 0 0 1px rgba(122,79,192,.45)}
.ho-arrow{color:var(--muted);font-size:11px}
.pl-vnote{color:var(--muted);font-size:10.5px}
.pl-free{margin-top:7px;color:var(--good);font-weight:800;font-size:12.5px}
.pl-short{margin-top:7px;color:var(--bad);font-weight:800;font-size:12.5px}

/* ---------- "your resources" strip (active player's tokens + bonus discounts) ---------- */
#my-resources{display:flex;flex-direction:column;gap:7px}
.mc-label{font-size:11px;color:var(--muted);font-weight:800;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mychips{display:flex;flex-wrap:wrap;gap:6px}
.mychip{display:grid;grid-template-columns:auto auto;grid-template-rows:1fr 1fr;align-items:center;column-gap:4px;background:#11163a;border:1px solid var(--line);border-radius:13px;padding:3px 8px 3px 4px;font-size:12px;min-height:38px}
.mychip .ball{grid-row:1/3}
.mychip .mc-tok,.mychip .mc-bon{display:flex;align-items:baseline;gap:3px;line-height:1.05;font-weight:800;min-width:30px}
.mychip .mc-tok small,.mychip .mc-bon small{font-size:8px;color:var(--muted);font-weight:700}
.mychip .mc-bon{color:var(--good);font-size:11px}
.mychip.master,.mychip.mega{grid-template-rows:1fr}.mychip.master .ball,.mychip.mega .ball{grid-row:auto}.mychip.master .mc-tok,.mychip.mega .mc-tok{font-size:13px}
.mychip.master:has(.mc-bon){grid-template-rows:1fr 1fr}.mychip.master:has(.mc-bon) .ball{grid-row:1/3}

/* ---------- guided tutorial (新手教程) ---------- */
.setup-tutorials button{flex:1 1 auto}
#tut-mask{position:fixed;z-index:78;border-radius:12px;pointer-events:none;
  box-shadow:0 0 0 3px var(--gold), 0 0 0 9999px rgba(4,6,20,.66);
  transition:left .2s ease,top .2s ease,width .2s ease,height .2s ease}
#tut-mask.hidden{display:none}
#tut-bubble{position:fixed;z-index:80;left:50%;transform:translateX(-50%);
  top:calc(var(--sa-t) + 58px);width:min(440px, calc(100vw - 20px));
  background:var(--bg1);border:1px solid var(--gold);border-radius:16px;
  padding:14px 16px;box-shadow:0 14px 44px rgba(0,0,0,.55);
  max-height:calc(100dvh - var(--sa-t) - var(--sa-b) - 18px);overflow:auto;overscroll-behavior:contain}
#tut-bubble.hidden{display:none}
#tut-step{font-size:11px;color:var(--muted);font-weight:800;letter-spacing:1.5px;margin-bottom:4px}
#tut-title{font-size:17px;font-weight:800;color:var(--gold);margin-bottom:6px;line-height:1.3}
#tut-text{font-size:14px;line-height:1.7;color:var(--ink)}
#tut-text b{color:var(--gold)}
#tut-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}
#tut-actions .primary{min-height:44px}
.tut-hint{font-size:12px;color:var(--muted);flex:1 1 auto}
.tut-hide-endturn [data-act="end-turn"]{display:none !important}
body.tutorial-choice-open #choice-modal{z-index:90}
body.tutorial-choice-open #tut-mask,body.tutorial-choice-open #tut-bubble{visibility:hidden}

/* ---------- rotate-for-landscape hint (dismissible, phones in portrait) ---------- */
#rotate-hint{margin:6px auto 0;z-index:29;align-self:center;
  background:rgba(10,13,40,.95);border:1px solid var(--gold);color:var(--ink);border-radius:22px;
  padding:8px 8px 8px 14px;font-size:13px;display:flex;align-items:center;gap:8px;box-shadow:var(--shadow);backdrop-filter:blur(6px)}
#rotate-hint .ti{color:var(--gold)}
#rotate-hint button{background:transparent;border:none;color:var(--muted);font-size:16px;line-height:1;padding:4px 8px;min-height:auto}

/* ---------- log ---------- */
#log{max-height:230px;display:flex;flex-direction:column}
#log-lines{overflow:auto;font-size:12.5px;line-height:1.55;color:var(--muted)}
#log-lines .ln{padding:2px 0;border-bottom:1px dashed rgba(255,255,255,.06)}
#log-lines .ln b{color:var(--ink)}
#log.collapsed #log-lines{display:none}
#log-toggle{font-weight:600}

/* ---------- players ---------- */
#players{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:12px;padding:0 14px 16px}
.player{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;position:relative;transition:.15s}
.player.active{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,213,74,.45),var(--shadow)}
.player.ai .pname::after{content:" 🤖"}
.player-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.pavatar{width:30px;height:30px;border-radius:50%;flex:none;background-size:cover;background-position:center}
.pname{font-weight:800;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pscore{font-size:24px;font-weight:900;color:var(--gold);line-height:1}
.pscore small{font-size:11px;color:var(--muted);font-weight:600}
/* running total of held Poké Balls, next to the score (10 = end-of-turn cap) */
.ptokens{flex:none;display:flex;align-items:baseline;gap:1px;font-size:16px;font-weight:800;color:var(--ink);background:#11163a;border:1px solid var(--line);border-radius:20px;padding:3px 9px;line-height:1}
.ptokens .pt-lbl{font-size:11px;color:var(--muted);font-weight:700;margin-right:2px;align-self:center}
.ptokens small{font-size:10px;color:var(--muted);font-weight:600}
.ptokens.full{border-color:var(--gold);color:var(--gold)}
.ptokens.full small{color:var(--gold)}
.ptokens.over{border-color:var(--bad);color:var(--bad);box-shadow:0 0 0 1px var(--bad)}
.ptokens.over small{color:var(--bad)}
.pstats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.chip{display:grid;grid-template-columns:auto auto;grid-template-rows:1fr 1fr;align-items:center;column-gap:4px;background:#11163a;border:1px solid var(--line);border-radius:13px;padding:3px 8px 3px 4px;font-size:11px;min-height:38px}
.chip .ball{grid-row:1/3}.chip .num,.chip .bonus-n{display:flex;align-items:baseline;gap:3px;line-height:1.05;font-weight:800;min-width:30px}
.chip .num small,.chip .bonus-n small{font-size:8px;color:var(--muted);font-weight:700}.chip .bonus-n{color:var(--good)}
.chip.master{display:flex;border-radius:20px;min-height:30px}.chip.master .ball{grid-row:auto}.chip.master .num{min-width:auto;font-size:13px}
.pcards{display:flex;gap:6px;flex-wrap:wrap}
.color-stack{position:relative}
.color-stack .ministack{display:flex;flex-direction:column}
.mini-card{width:42px;height:56px;border-radius:5px;overflow:hidden;border:1px solid #000;box-shadow:0 1px 3px rgba(0,0,0,.5);cursor:pointer}
.mini-card img{width:100%;height:100%;object-fit:cover}
.mini-card.pm-mini img{object-fit:cover;object-position:center;background:#61c9dc}
.mini-card.stacked{margin-top:-44px}
/* face-down reserve backs: tier-correct art for base and PokéMart cards */
.mini-card.card-back{background:linear-gradient(135deg,#3a2a6e,#221a4a) center/cover no-repeat}
.mini-card.card-back[data-tier="stage1"]{background-image:linear-gradient(rgba(8,10,30,.5),rgba(8,10,30,.65)),url(../assets/backs/stage1.webp)}
.mini-card.card-back[data-tier="stage2"]{background-image:linear-gradient(rgba(8,10,30,.5),rgba(8,10,30,.65)),url(../assets/backs/stage2.webp)}
.mini-card.card-back[data-tier="stage3"]{background-image:linear-gradient(rgba(8,10,30,.5),rgba(8,10,30,.65)),url(../assets/backs/stage3.webp)}
.mini-card.card-back[data-tier="rare"]{background-image:linear-gradient(rgba(8,10,30,.5),rgba(8,10,30,.65)),url(../assets/backs/rare.webp)}
.mini-card.card-back[data-tier="legend"]{background-image:linear-gradient(rgba(8,10,30,.5),rgba(8,10,30,.65)),url(../assets/backs/legend.webp)}
.mini-card.card-back[data-tier="pmL1"]{background-image:linear-gradient(rgba(8,10,30,.16),rgba(8,10,30,.3)),url(../assets/backs/pokemart-1.png)}
.mini-card.card-back[data-tier="pmL2"]{background-image:linear-gradient(rgba(8,10,30,.16),rgba(8,10,30,.3)),url(../assets/backs/pokemart-2.png)}
.mini-card.card-back[data-tier="pmL3"]{background-image:linear-gradient(rgba(8,10,30,.16),rgba(8,10,30,.3)),url(../assets/backs/pokemart-3.png)}
.reserve-zone{margin-top:8px;border-top:1px dashed var(--line);padding-top:6px}
.reserve-zone .rz-title{font-size:11px;color:var(--muted);margin-bottom:4px}
.buried-badge{position:absolute;top:8px;right:10px;font-size:11px;color:var(--muted)}

/* turn passing overlay (hotseat) */
#pass-overlay{position:fixed;inset:0;background:rgba(6,8,24,.96);z-index:95;display:grid;place-items:center;text-align:center;padding:24px}
#pass-overlay .po-inner{max-width:420px}
#pass-overlay h2{font-size:clamp(22px,6vw,26px);margin:0 0 6px}
#pass-overlay p{color:var(--muted)}

/* ai thinking */
.thinking{display:inline-flex;gap:4px;align-items:center;color:var(--gold);font-weight:700}
.thinking .dot{width:7px;height:7px;border-radius:50%;background:var(--gold);animation:bounce .9s infinite}
.thinking .dot:nth-child(2){animation-delay:.15s}.thinking .dot:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,80%,100%{transform:scale(.6);opacity:.5}40%{transform:scale(1);opacity:1}}

/* desktop hover zoom preview */
#zoom{position:fixed;z-index:80;pointer-events:none;filter:drop-shadow(0 10px 30px rgba(0,0,0,.6))}
#zoom img{width:260px;height:347px;object-fit:contain;background:#0c1030;border-radius:14px;border:2px solid var(--gold)}

/* tap-to-inspect overlay (touch) */
#inspect{position:fixed;inset:0;z-index:85;background:rgba(6,8,24,.9);display:flex;align-items:flex-start;justify-content:center;overflow:auto;overscroll-behavior:contain;
  padding:max(16px,var(--sa-t)) max(16px,var(--sa-r)) max(16px,var(--sa-b)) max(16px,var(--sa-l))}
#inspect-inner{display:flex;flex-direction:column;align-items:center;gap:14px;max-width:100%;margin:auto}
#inspect-img{width:auto;height:auto;max-width:min(88vw,390px);max-height:calc(100dvh - 110px);object-fit:contain;border-radius:14px;border:3px solid var(--gold);box-shadow:0 18px 50px rgba(0,0,0,.65);background:#0c1030}
#inspect-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
#inspect-actions button{padding:13px 22px;font-size:15px;min-height:48px}

/* global feedback stays visible even when the setup/lobby screen is active */
.toast{position:fixed;z-index:120;left:50%;bottom:calc(22px + var(--sa-b));transform:translateX(-50%);width:max-content;max-width:min(520px,calc(100vw - 28px));padding:11px 15px;border-radius:12px;background:#171c44;border:1px solid var(--line);box-shadow:0 12px 34px rgba(0,0,0,.55);font-size:13px;font-weight:700;line-height:1.45;text-align:center;pointer-events:none}
.toast.error{border-color:var(--bad);color:#ffd9dd}.toast.success{border-color:var(--good);color:#baf7d2}

/* win modal */
.modal-box.win{text-align:center}
#win-content h2{font-size:clamp(24px,7vw,30px)}
.win-trophy{font-size:60px}
.win-scores{display:flex;flex-direction:column;gap:6px;margin:14px 0}
.win-scores .wrow{display:flex;justify-content:space-between;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 14px}
.win-scores .wrow.winner{border-color:var(--gold);background:rgba(255,213,74,.12)}

@keyframes pop{0%{transform:scale(.7);opacity:0}60%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}
.pop{animation:pop .35s ease}

/* ============================================================
   MOBILE / NARROW: single column + fixed bottom control dock
   ============================================================ */
@media (max-width:999px){
  #game{display:flex;flex-direction:column;min-height:var(--app-h);padding-bottom:calc(var(--dock-h) + var(--sa-b) + 6px)}
  #zoom{display:none !important}
  #board{order:1;padding:8px max(6px,var(--sa-r)) 0 max(6px,var(--sa-l))}
  .divine-rule{min-width:175px;max-width:220px;font-size:11px}
  #players{order:2;padding:10px max(8px,var(--sa-r)) 12px max(8px,var(--sa-l));grid-auto-flow:row;grid-auto-columns:auto;
    grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  #log{order:3;margin:0 max(8px,var(--sa-l)) 8px max(8px,var(--sa-r));max-height:170px}

  /* the dock: supply + contextual actions, pinned in the thumb zone */
  #controls{position:fixed;left:0;right:0;bottom:0;z-index:46;order:99;gap:6px;
    padding:6px max(8px,var(--sa-l)) calc(6px + var(--sa-b)) max(8px,var(--sa-r));
    background:rgba(10,13,40,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);
    box-shadow:0 -8px 24px rgba(0,0,0,.4);max-height:56svh;max-height:56dvh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
  #controls .panel{padding:8px;border-radius:12px}

  /* supply as a compact horizontal strip of tappable ball-chips */
  #supply{order:1;flex-direction:row;flex-wrap:nowrap;gap:6px;overflow-x:auto;overflow-y:hidden;padding:6px;
    scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  #supply::-webkit-scrollbar,.tier-row::-webkit-scrollbar{height:3px}
  #supply::-webkit-scrollbar-thumb,.tier-row::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px}
  #supply .panel-title{display:none}
  .supply-row{flex:0 0 auto;flex-direction:column;gap:1px;padding:5px 8px;min-width:50px;min-height:58px;justify-content:center;text-align:center;scroll-snap-align:start}
  .supply-row .name{display:none}
  .supply-row .cnt{font-size:14px;min-width:0}
  .supply-row.mega-row{margin:0;border-top:none;border-left:1px dashed var(--line);padding-left:10px}
  #action-bar{min-height:0}
  .act-hint{margin-bottom:6px}

  /* your-resources: single compact horizontal scroll row in the dock */
  #my-resources{order:2;flex-direction:row;align-items:center;gap:8px;overflow-x:auto;overflow-y:hidden;padding:6px 8px}
  #my-resources::-webkit-scrollbar{height:3px}
  #my-resources::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px}
  .mc-label{flex:0 0 auto;font-size:10px}
  .mychips{flex-wrap:nowrap}
  .mychip{flex:0 0 auto}

  /* board rows scroll horizontally instead of wrapping */
  .tier-row{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:8px;padding:6px;
    scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  .tier-label{position:sticky;left:0;z-index:2;writing-mode:horizontal-tb;text-orientation:mixed;width:auto;letter-spacing:1px;
    padding:2px 6px;border-radius:8px;background:var(--panel);align-self:stretch;display:flex;align-items:center}
  .card-strip{flex-wrap:nowrap}
  .card,.deck-pile{scroll-snap-align:start}

  .sel-preview{width:calc(var(--card-w) * 1.7)}
  body.has-card-selection #supply,body.has-card-selection #my-resources{display:none !important}
  body.has-card-selection #action-bar .act-buttons{position:sticky;bottom:-8px;z-index:3;margin:8px -8px -8px;padding:12px 8px 8px;background:linear-gradient(transparent,rgba(29,35,80,.98) 24%)}
  body.has-card-selection .pay-ledger{max-height:132px;overflow:auto}
  .toast{top:calc(var(--sa-t) + 58px);bottom:auto}
}

/* very small phones: shrink cards a touch more, 1 player per row */
@media (max-width:380px){
  :root{--card-w:clamp(60px,17vw,72px)}
  #players{grid-template-columns:1fr}
}

/* landscape phone: keep the dock but allow wider rows */
@media (max-width:999px) and (orientation:landscape){
  #controls{max-height:64svh;max-height:64dvh}
  #players{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
  #inspect-img{max-height:calc(100dvh - 92px);max-width:74vw}
  #inspect-inner{flex-direction:row;align-items:center}
  #inspect-actions{flex-direction:column;min-width:120px}
}

/* accessibility: respect reduced-motion */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
}

/* ---------- fly animations (token / card moving to a player) ---------- */
#fly-layer{position:fixed;inset:0;pointer-events:none;z-index:90}
.fly{position:fixed;left:0;top:0;will-change:transform,opacity;transition:transform .6s cubic-bezier(.34,.7,.3,1),opacity .6s}
.fly .ball{filter:drop-shadow(0 4px 10px rgba(0,0,0,.55))}
.fly-card{width:60px;height:80px;border-radius:7px;overflow:hidden;box-shadow:0 8px 22px rgba(0,0,0,.55);border:1px solid rgba(0,0,0,.4)}
.fly-card img{width:100%;height:100%;object-fit:cover;display:block}
/* blind deck-reserve flies a tier-correct back instead of a flat gradient */
.fly-card[data-tier]{background:center/cover no-repeat}
.fly-card[data-tier="stage1"]{background-image:linear-gradient(rgba(8,10,30,.45),rgba(8,10,30,.6)),url(../assets/backs/stage1.webp)}
.fly-card[data-tier="stage2"]{background-image:linear-gradient(rgba(8,10,30,.45),rgba(8,10,30,.6)),url(../assets/backs/stage2.webp)}
.fly-card[data-tier="stage3"]{background-image:linear-gradient(rgba(8,10,30,.45),rgba(8,10,30,.6)),url(../assets/backs/stage3.webp)}
.fly-card[data-tier="rare"]{background-image:linear-gradient(rgba(8,10,30,.45),rgba(8,10,30,.6)),url(../assets/backs/rare.webp)}
.fly-card[data-tier="legend"]{background-image:linear-gradient(rgba(8,10,30,.45),rgba(8,10,30,.6)),url(../assets/backs/legend.webp)}
.fly-card[data-tier="pmL1"]{background-image:linear-gradient(rgba(8,10,30,.12),rgba(8,10,30,.28)),url(../assets/backs/pokemart-1.png)}
.fly-card[data-tier="pmL2"]{background-image:linear-gradient(rgba(8,10,30,.12),rgba(8,10,30,.28)),url(../assets/backs/pokemart-2.png)}
.fly-card[data-tier="pmL3"]{background-image:linear-gradient(rgba(8,10,30,.12),rgba(8,10,30,.28)),url(../assets/backs/pokemart-3.png)}
@keyframes recv{0%{transform:scale(1)}40%{transform:scale(1.08)}100%{transform:scale(1)}}
.player.receiving,.score-pill.receiving,#turn-banner.receiving,#my-resources.receiving{animation:recv .5s ease}

/* ---------- undo (悔棋) button ---------- */
#undo-btn{position:fixed;bottom:calc(14px + var(--sa-b));left:calc(14px + var(--sa-l));z-index:40;background:linear-gradient(180deg,#3a4290,#2a3170);color:#fff;border:1px solid var(--line);box-shadow:var(--shadow);font-weight:700;padding:11px 16px;border-radius:12px;min-height:46px}
#undo-btn .ti,#undo-btn i{margin-right:4px}
@media (hover:hover) and (pointer:fine){ #undo-btn:hover{filter:brightness(1.1)} }
/* mobile: lift the undo button above the fixed bottom dock (placed after the base rule so it wins source-order) */
@media (max-width:999px){ #undo-btn{bottom:calc(var(--dock-h) + var(--sa-b) + 10px)} }

/* ===== PokéMart expansion ===== */
.pokemart-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:18px 0 8px;padding:12px 15px;border:1px solid rgba(75,211,153,.32);border-radius:16px;background:linear-gradient(110deg,rgba(24,111,77,.42),rgba(29,65,116,.24));box-shadow:inset 0 1px rgba(255,255,255,.06)}
.pokemart-brand{display:flex;align-items:center;gap:10px}.pokemart-brand strong{display:block;color:#7cf0b2;font-size:18px;letter-spacing:.02em}.pokemart-brand span{display:block;color:var(--muted);font-size:11px;margin-top:1px}.pokemart-brand .pokemart-bag{font-size:25px;margin:0}
.pokemart-legend{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11px;white-space:nowrap}.pm-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-left:5px}.pm-dot.ready{background:#5be091;box-shadow:0 0 7px #5be091}.pm-dot.wild{background:#b884ff}.pm-dot.locked{background:#697186}
.tier-pokemart{position:relative;background:linear-gradient(90deg,rgba(46,209,122,.13),rgba(47,111,214,.08));border-color:rgba(75,211,153,.2)}
.tier-pokemart .tier-label{color:#65dfa0;display:flex;flex-direction:column;line-height:1.05}.tier-pokemart .tier-label strong{font-size:13px}.tier-pokemart .tier-label span{font-size:10px;color:var(--muted);margin-top:5px;white-space:nowrap;letter-spacing:0}
.tier-pokemart .card{transition:transform .16s ease,filter .16s ease,box-shadow .16s ease}.tier-pokemart .card.affordable{box-shadow:0 0 0 2px rgba(91,224,145,.75),0 5px 18px rgba(40,190,110,.2)}
.eff-tag{color:var(--gold);font-size:12px;font-weight:700}
.modal-box.choice{max-width:760px;border-color:rgba(244,192,37,.28)}
.choice-title{font-size:20px;font-weight:800;color:var(--gold);margin-bottom:5px}
.choice-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.choice-hint{color:var(--muted);font-size:13px}.choice-progress{flex:none;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.07);color:var(--muted);font-size:12px;font-weight:700}.choice-progress.complete{color:#75e9aa;background:rgba(55,190,118,.14)}
.choice-cards{display:flex;flex-wrap:wrap;gap:10px;max-height:60vh;overflow:auto;justify-content:center}
.choice-card{width:104px;border:2px solid transparent;border-radius:12px;cursor:pointer;padding:5px;background:rgba(255,255,255,.04);transition:border-color .12s,transform .12s,background .12s;text-align:center;touch-action:manipulation}
.choice-card img{width:100%;border-radius:7px;display:block}
.choice-card.pm-choice img{aspect-ratio:647/1000;object-fit:cover;object-position:center;background:#61c9dc}
.choice-card span{display:block;font-size:11px;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.choice-card small{display:block;font-size:9px;line-height:1.35;color:var(--muted);margin-top:2px}
.choice-card:hover{transform:translateY(-2px)}
.choice-card.sel{border-color:var(--gold);box-shadow:0 0 10px rgba(244,192,37,.5)}
.choice-card:focus-visible{outline:3px solid #fff;outline-offset:2px}
.choice-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.choice-confirm:disabled,#choice-confirm:disabled{opacity:.4;cursor:not-allowed}
@media(max-width:640px){
  .pokemart-head{align-items:flex-start}.pokemart-legend{white-space:normal;justify-content:flex-end;flex-wrap:wrap}
  .choice-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;justify-items:stretch}
  .choice-card{width:auto;min-width:0}.choice-card span{font-size:12px;color:var(--ink)}.choice-card small{font-size:10px;white-space:normal}
  .choice-meta{flex-direction:column}.choice-actions{position:sticky;bottom:-18px;background:linear-gradient(transparent,var(--bg1) 25%);padding-top:18px}.choice-actions button{min-height:46px;flex:1}
}
.pokemart-grid{display:flex;flex-direction:column;gap:10px}
@container game-field (min-width:700px){
  .pokemart-grid{--card-w:84px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .pokemart-grid .tier-pokemart{min-width:0;gap:7px;padding:7px}
  .pokemart-grid .tier-label{writing-mode:horizontal-tb;text-orientation:mixed;width:38px;letter-spacing:0;align-self:stretch;align-items:center;justify-content:center}
  .pokemart-grid .card-strip{flex-wrap:nowrap;gap:6px}
}
@container game-field (min-width:1040px){
  .pokemart-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}