/* Figma Make UIUX V2; live game styling, source archived in preview/make-v2-source. */

:root {
  color: var(--c-navy-15);
  background: var(--c-gray-91);
  font-synthesis: none;
  --navy: var(--c-navy-15);
  --navy-2: var(--c-navy-19);
  --ink: var(--c-navy-15);
  --muted: var(--c-gray-50);
  --line: var(--c-gray-91);
  --paper: var(--c-gray-96);
  --white: var(--c-white);
  --blue: var(--c-blue-41);
  --danger: var(--p-red);
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh;  }
button, input { font: inherit; }
button { cursor: pointer; color: inherit; }
button:disabled { cursor: not-allowed; opacity: .48; }
h1, h2, h3, p { margin: 0; }
button:focus-visible, input:focus-visible { outline: 3px solid color-mix(in srgb,var(--c-blue-41) 25%,transparent); outline-offset: 2px; }
.app { min-height: 100vh; }
.screen-area { padding-top: 44px; padding-bottom: 72px; min-height: 100vh; }
.review-nav { position: fixed; z-index: 100; inset: 0 0 auto; height: 44px; background: var(--p-ink); color: var(--c-white); display: flex; align-items: center; gap: 16px; padding: 0 16px; box-shadow: 0 2px 10px color-mix(in srgb,var(--c-black) 26.7%,transparent); }
.review-label { white-space: nowrap; font-size: 12px; font-weight:600; color: var(--c-slate-74); letter-spacing: .04em; }
.review-label span { color: var(--lime); border: 1px solid color-mix(in srgb,var(--c-green-91) 40%,transparent); padding: 3px 5px; margin-right: 6px; border-radius: 5px; }
.review-scroll { display: flex; overflow-x: auto; gap: 4px; scrollbar-width: none; }
.review-scroll button { height: 32px; border: 0; border-radius: 7px; background: transparent; color: var(--c-slate-68); padding: 0 10px; white-space: nowrap; font-size: 12px; }
.review-scroll button.active { background: var(--p-navy); color: var(--c-white); }
.product-nav { position: fixed; z-index: 90; bottom: 0; left: 0; right: 0;   display: flex; justify-content: center; padding-bottom: env(safe-area-inset-bottom);  }
.product-nav button { border: 0; background: transparent;  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 11px; font-weight: 700; }

.product-nav button.active:before { content: ""; position: absolute; top: 0; width: 34px; height: 3px; background: var(--blue); border-radius: 0 0 3px 3px; }
.topbar { height: 64px;  display: flex; justify-content: space-between; align-items: center; padding: 0 20px;  }
.topbar.dark { background: var(--navy); color: var(--c-white); border-color: color-mix(in srgb,var(--c-white) 9.4%,transparent); }
.topbar > div { display: flex; flex-direction: column; gap: 2px; }
.topbar b { font-size: 17px; }
.topbar span { font-size: 11px; color: var(--muted); }
.topbar.dark span { color: var(--c-slate-74); }
.topbar button { width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: transparent; border-radius: 10px; }
:is(.button,.btn) { min-height: 46px; border-radius: 12px; border: 1px solid transparent; padding: 0 18px; font-weight:600; display: inline-flex; gap: 8px; align-items: center; justify-content: center; transition: .16s ease; }
:is(.button,.btn).primary { background: var(--navy); color: var(--c-white); }
:is(.button,.btn).primary:hover { background: color-mix(in srgb,var(--p-blue) 55%,var(--p-ink)); transform: translateY(-1px); }
:is(.button,.btn).secondary { background: var(--c-white); border-color: var(--c-slate-85); }
:is(.button,.btn).ghost { background: transparent; border-color: transparent; color: var(--blue); }
:is(.button,.btn).danger { color: var(--c-white); }
.status-pill { display: inline-flex; align-items: center; width: fit-content; min-height: 24px; padding: 0 8px; border-radius: 999px; font-size: 10px; font-weight:600; background: var(--c-gray-91); color: var(--c-slate-41); letter-spacing: .02em; }

.status-pill.warn { background: var(--c-gold-96-2); color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); }
.status-pill.live { background: color-mix(in srgb,var(--p-g-r) 8%,var(--p-white)); color: var(--blue); }
.eyebrow { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 10px; font-weight:600; letter-spacing: .08em; text-transform: uppercase; }
.grade { display: inline-flex; min-width: 24px; height: 18px; align-items: center; justify-content: center; padding: 0 5px; border: 1px solid; border-radius: 4px; font-size: 9px; font-weight:700; line-height: 1; }
.grade-n { color: color-mix(in srgb,var(--p-ink) 60%,var(--p-white)); background: var(--c-gray-96); border-color: color-mix(in srgb,var(--p-ink) 32%,var(--p-white)); }
.grade-r { color: var(--c-blue-41); background: color-mix(in srgb,var(--p-g-r) 8%,var(--p-white)); border-color: color-mix(in srgb,var(--p-g-r) 60%,var(--p-white)); }
.grade-sr { color: color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink)); background: color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white)); border-color: color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)); }
.grade-ssr { color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); background: var(--c-gold-96); border-color: color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)); }
.team-mark { --team: var(--c-blue-41); width: 48px; height: 48px; flex: 0 0 auto; display: inline-grid; place-items: center; border-radius: 50%; color: var(--c-white); background: var(--team); border: 3px solid var(--c-white); box-shadow: 0 0 0 1px color-mix(in srgb, var(--team) 70%, var(--c-white)); font-size: 12px; font-weight:700; letter-spacing: -.04em; }
.team-mark.small { width: 34px; height: 34px; border-width: 2px; font-size: 9px; }

/* Match */
.match-page { background: var(--navy);  color: var(--c-white); }
.match-shell { max-width: 1180px; margin: auto; }
.scoreboard { background: var(--navy); min-height: 92px; padding: 12px 18px 18px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.team-score { display: flex; align-items: center; gap: 8px; }
.team-score div { display: flex; flex-direction: column; }
.team-score b { font-size: 13px; }
.team-score span { font-size: 10px; color: var(--c-slate-74); }
.team-score strong { font-size: 34px; margin-left: auto; font-variant-numeric: tabular-nums; }
.team-score.away { justify-content: flex-end; text-align: right; }
.team-score.away strong { order: 0; margin: 0 auto 0 0; }
.inning { text-align: center; border-left: 1px solid color-mix(in srgb,var(--c-white) 11%,transparent); border-right: 1px solid color-mix(in srgb,var(--c-white) 11%,transparent); padding: 0 14px; }
.inning b { display: block; font-size: 15px; color: var(--lime); }
.inning span { font-size: 10px; color: var(--c-slate-80); white-space: nowrap; }
.match-main { background: var(--paper); color: var(--ink); }
.match-core { min-width: 0; }
.versus-card { position: relative; background: var(--c-white); margin: 0 12px; border-radius: 14px; border: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto 1fr; min-height: 100px; overflow: hidden; box-shadow: 0 5px 18px color-mix(in srgb,var(--c-navy-15) 4.7%,transparent); }
.player-side { display: flex; align-items: center; gap: 8px; padding: 12px 8px 22px 12px; min-width: 0; }
.player-side.pitcher { text-align: right; justify-content: flex-end; padding-left: 6px; padding-right: 12px; }
.player-side > div:not(.player-art) { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.player-side b { font-size: 14px; white-space: nowrap; }
.player-side span:last-child { color: var(--muted); font-size: 10px; white-space: nowrap; }
.player-side span strong { color: var(--ink); }
.player-art { width: 54px; height: 68px; flex: 0 0 auto; border-radius: 10px; color: var(--c-gray-61); display: flex; flex-direction: column; align-items: center; justify-content: flex-end; overflow: hidden;  }
.player-art svg { margin: auto; }
.player-art span { width: 100%; background: color-mix(in srgb,var(--c-white) 62%,transparent); color: var(--c-gray-50)!important; text-align: center; padding: 2px; font-size: 7px!important; letter-spacing: .08em; }
.vs { align-self: center; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--navy); color: var(--c-white); font-size: 9px; font-weight:700; }
.stamina { position: absolute; bottom: 0; left: 0; right: 0; height: 22px; display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 7px; padding: 0 10px; background: var(--c-gray-96); border-top: 1px solid var(--c-gray-91); font-size: 9px; color: var(--muted); }
.stamina b { color: var(--ink); }
.stamina > div { height: 4px; background: var(--c-gray-91); border-radius: 4px; overflow: hidden; }
.stamina i { display: block; height: 100%; background: var(--p-green); }
.fatigue { color: var(--p-green); font-weight:600; }
.situation-row { margin: 8px 12px 0; min-height: 48px; display: flex; gap: 10px; align-items: center; }
.diamond { position: relative; width: 72px; height: 46px; }
.diamond .base { position: absolute; width: 12px; height: 12px; background: var(--c-white); border: 1px solid var(--c-slate-74); transform: rotate(45deg); }
.diamond .base.on { background: var(--lime); border-color: var(--p-green); }
.diamond .second { top: 2px; left: 30px; }.diamond .third { top: 16px; left: 15px; }.diamond .first { top: 16px; left: 45px; }
.diamond span { position: absolute; bottom: 0; left: 22px; font-size: 9px; font-weight:600; }
.outs { display: flex; align-items: center; gap: 5px; padding-left: 8px; border-left: 1px solid var(--c-gray-88); }
.outs span { font-size: 9px; font-weight:600; color: var(--muted); }
.outs i { width: 9px; height: 9px; border-radius: 50%; border: 1px solid var(--c-slate-68); background: var(--c-white); }
.outs i.on { background: var(--p-red); border-color: var(--p-red); }
.outs b { font-size: 12px; }
.log-button { margin-left: auto; border: 0; background: transparent; min-height: 44px; display: flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 700; color: var(--muted); }
.phase-strip { display: flex; align-items: center; margin: 0 16px 10px; color: var(--c-slate-68); }
.phase-strip div { display: flex; align-items: center; gap: 3px; font-size: 9px; white-space: nowrap; }
.phase-strip span { width: 18px; height: 18px; display: grid; place-items: center; border: 1px solid var(--c-slate-85); border-radius: 50%; font-size: 8px; }
.phase-strip i { height: 1px; flex: 1; background: var(--c-gray-88); margin: 0 4px; }
.phase-strip .active { color: var(--blue); }
.hand-head { display: flex; align-items: end; justify-content: space-between; padding: 0 16px 8px; }
.hand-head > div { display: flex; flex-direction: column; gap: 3px; }
.hand-head b { font-size: 14px; }
.hand-head button { border: 0; background: transparent; color: var(--blue); font-size: 10px; min-height: 32px; font-weight: 700; }
.tactic-hand { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; padding: 0 12px 8px; overflow: visible; }
.tactic-card { position: relative; min-height: 132px;   border-radius: 10px;  padding: 10px 8px; display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 5px; overflow: hidden; scroll-snap-align: start;  }
.tactic-card.power { border-top-color: color-mix(in srgb,var(--p-red) 60%,var(--p-white)); }.tactic-card.bunt { border-top-color: var(--p-green); }.tactic-card.eye { border-top-color: color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)); }
.tactic-card.selected { border: 2px solid var(--blue); border-top-width: 4px; }
.card-index { position: absolute; top: 6px; right: 6px; font-size: 8px; color: color-mix(in srgb,var(--p-slate) 60%,var(--p-white)); }
.tactic-symbol { width: 28px; height: 28px; display: grid; place-items: center; background: var(--c-gray-96); color: color-mix(in srgb,var(--p-slate) 55%,var(--p-ink)); border-radius: 7px; font-size: 12px; font-weight:700; }
.tactic-tag { font-size: 8px; font-weight:600; color: var(--muted); }
.tactic-card b { font-size: 12px; line-height: 1.15; }
.tactic-card small { font-size: 9px; line-height: 1.35; color: var(--muted); word-break: keep-all; }
.selected-check { position: absolute; bottom: 7px; right: 7px; width: 20px; height: 20px; display: grid; place-items: center; background: var(--blue); color: var(--c-white); border-radius: 50%; }
.selected-detail { margin: 0 12px 8px; min-height: 48px; border: 1px solid var(--c-slate-90); background: var(--c-blue-96); border-radius: 9px; padding: 8px 10px; display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; }
.selected-detail div { display: flex; flex-direction: column; min-width: 94px; }
.selected-detail span { font-size: 8px; color: var(--muted); }
.selected-detail b { font-size: 11px; color: var(--blue); }
.selected-detail p { font-size: 9px; color: var(--c-slate-41); line-height: 1.35; }
.prepare-panel { margin: 0 12px 10px; background: var(--c-white); border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.prepare-title { display: flex; justify-content: space-between; align-items: center; }
.prepare-title > div { display: flex; flex-direction: column; gap: 3px; }
.prepare-title b { font-size: 14px; }
.prepare-option { margin: 10px 0; padding: 9px; background: var(--c-gray-96); border-radius: 9px; display: flex; align-items: center; gap: 9px; }
.prepare-option .player-art { width: 40px; height: 46px; }
.prepare-option > div { display: flex; flex-direction: column; }
.prepare-option b { font-size: 11px; }.prepare-option span { color: var(--muted); font-size: 9px; }
.prepare-option button { margin-left: auto; min-height: 44px; border: 1px solid var(--c-slate-85); background: var(--c-white); border-radius: 8px; font-size: 10px; font-weight: 700; padding: 0 10px; }
.prepare-panel > :is(.button,.btn) { width: 100%; min-height: 44px; }
.action-dock {  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));  display: flex; gap: 12px; align-items: center; }
.selection-copy { display: flex; flex-direction: column; min-width: 100px; }
.selection-copy span { font-size: 9px; color: var(--muted); }
.selection-copy b { font-size: 12px; }
.selection-copy button { min-width: 44px; min-height: 44px; border: 0; background: transparent; padding: 0; text-align: left; color: var(--blue); font-size: 9px; }
.selection-copy:has(button){display:grid;grid-template-columns:1fr 44px;column-gap:6px;align-items:center}.selection-copy:has(button)>span{align-self:end}.selection-copy:has(button)>b{align-self:start}.selection-copy>button{grid-column:2;grid-row:1 / span 2}
@media(max-width:500px){.live-sheet .player-detail .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.player-detail .stat-grid small{word-break:keep-all}}
.dock-buttons { display: flex; margin-left: auto; gap: 7px; }
.dock-buttons :is(.button,.btn) { min-height: 44px; padding: 0 14px; }
.match-aside { display: none; }
.plate-result { margin: 0 12px 12px; background: var(--c-white); border-radius: 14px; border: 1px solid var(--line); overflow: hidden; text-align: center; box-shadow: 0 8px 24px color-mix(in srgb,var(--c-navy-15) 7.1%,transparent); }
.reveal-label { padding: 10px; background: var(--navy); color: var(--lime); font-size: 10px; font-weight: 900; letter-spacing: .1em; }
.revealed { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; padding: 12px; border-bottom: 1px solid var(--line); }
.revealed div { display: flex; flex-direction: column; }
.revealed span { font-size: 9px; color: var(--muted); }
.revealed b { font-size: 13px; }.revealed strong { font-size: 9px; }
.result-call { padding: 14px 10px 10px; }
.result-call > span { font-size: 8px; font-weight:700; color: var(--blue); letter-spacing: .14em; }
.result-call b { display: block; font-size: 25px; color: var(--blue); }
.result-call p { font-size: 11px; color: var(--muted); margin-top: 3px; }
.runner-change { margin: 0 12px; padding: 9px; background: var(--c-gray-96); display: flex; gap: 6px; justify-content: center; align-items: center; border-radius: 8px; font-size: 9px; }
.runner-change b { margin-left: 8px; }
.result-actions { display: flex; justify-content: center; gap: 8px; }

/* Shared light pages */
.light-page { min-height: calc(100vh - 116px); background: var(--paper); }
.page-wrap { max-width: 1120px; margin: 0 auto;  }
.page-wrap.narrow { max-width: 760px; }
.deck-status { background: var(--navy); color: var(--c-white); border-radius: 16px; padding: 18px 20px; display: flex; justify-content: space-between; align-items: center; }
.deck-status h2 { margin-top: 8px; font-size: 22px; }.deck-status p { color: color-mix(in srgb,var(--p-line) 80%,var(--p-ink)); font-size: 11px; margin-top: 3px; }
.slot-switch { display: flex; gap: 4px; background: var(--c-navy-11); padding: 4px; border-radius: 10px; }
.slot-switch button { border: 0; border-radius: 8px; background: transparent; color: var(--p-g-n); font-weight:600; }
.slot-switch button.active { background: var(--c-white); color: var(--navy); }

.tabs button { border: 0; background: transparent; min-height: 46px; padding: 0 16px; color: var(--muted); font-weight:600; font-size: 13px; position: relative; }
.tabs button.active { color: var(--blue); }
.tabs button.active:after { content: ""; position: absolute; height: 3px; background: var(--blue); left: 10px; right: 10px; border-radius: 3px 3px 0 0; }
.deck-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.deck-editor, .synergy-panel { background: var(--c-white); border: 1px solid var(--line); border-radius: 14px; padding: 18px; }
.section-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.section-head h3 { font-size: 17px; }.section-head.second { margin-top: 24px; }
.lineup-list { border-top: 1px solid var(--line); }
.lineup-row { min-height: 62px; display: grid; align-items: center; border-bottom: 1px solid var(--c-gray-96); }
.lineup-row.dragging { opacity: .48; background: var(--c-blue-96); outline: 2px dashed var(--blue); outline-offset: -2px; }
.lineup-row .player-art { border-radius: 7px; }.lineup-row .player-art svg { width: 23px; }
.drag { color: color-mix(in srgb,var(--p-slate) 60%,var(--p-white)); font-size: 18px; }.order { font-size: 15px; text-align: center; }
.lineup-name { display: flex; flex-direction: column; }.lineup-name b { font-size: 13px; }.lineup-name span { font-size: 9px; color: var(--muted); }
.position { font-size: 10px; background: var(--c-gray-96); padding: 5px 7px; border-radius: 5px; font-weight:600; }
.move-buttons { display: flex; }
.move-buttons button { width: 44px; height: 44px; border: 1px solid var(--c-gray-88); background: var(--c-white); }
.move-buttons button:first-child { border-radius: 6px 0 0 6px; }.move-buttons button:last-child { border-radius: 0 6px 6px 0; }
.roster-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.roster-groups > div { background: var(--c-gray-96); border-radius: 10px; padding: 12px; font-size: 11px; }
.roster-groups span { color: var(--muted); }.roster-groups b { float: right; }.roster-groups p { margin-top: 8px; color: color-mix(in srgb,var(--p-g-n) 55%,var(--p-ink)); }
.synergy-panel { position: sticky; top: 64px; }
.aside-title { display: flex; justify-content: space-between; align-items: center; }.aside-title > div { display: flex; flex-direction: column; }
.synergy-count { display: flex; align-items: center; gap: 9px; margin: 18px 0; }.synergy-count div { display: flex; flex-direction: column; }.synergy-count b { font-size: 13px; }.synergy-count span { font-size: 10px; color: var(--muted); }.synergy-count strong { margin-left: auto; font-size: 13px; }
.step-track { display: grid; grid-template-columns: repeat(3, 1fr); position: relative; margin: 8px 10px 22px; }
.step-track:before { content: ""; position: absolute; height: 3px; left: 0; right: 0; top: 5px; background: var(--c-gray-88); }
.step-track i { z-index: 1; width: 13px; height: 13px; border-radius: 50%; background: var(--c-slate-85); }.step-track i:nth-of-type(2) { justify-self: center; }.step-track i:nth-of-type(3) { justify-self: end; }
.step-track i.done { background: var(--blue); }
.step-track span { font-size: 9px; color: var(--muted); margin-top: 6px; }.step-track span:nth-of-type(2) { text-align: center; }.step-track span:nth-of-type(3) { text-align: right; }
.effect { border: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); background: var(--c-green-97); border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 4px; }
.effect > span { font-size: 9px; color: var(--p-green); font-weight:600; }.effect b { font-size: 12px; }.effect p { font-size: 13px; }.effect strong { color: var(--p-green); }.effect small { color: var(--muted); font-size: 8px; }
.text-link { border: 0; background: transparent; color: var(--blue); font-size: 10px; font-weight: 700; min-height: 40px; display: flex; align-items: center; gap: 3px; margin: 6px auto 0; }
.save-dock { position: fixed; z-index: 80; left: 0; right: 0; min-height: 68px; background: color-mix(in srgb,var(--c-white) 96.1%,transparent); border-top: 1px solid var(--line); display: flex; justify-content: center; align-items: center; gap: 28px; padding: 8px 20px; }
.save-dock > div { display: flex; gap: 8px; align-items: center; color: var(--p-green); }
.save-dock.invalid > div { color: var(--danger); }
.save-dock > div span { display: flex; flex-direction: column; }.save-dock b { color: var(--ink); font-size: 12px; }.save-dock small { color: var(--muted); font-size: 9px; }
.counter-list { border-top: 1px solid var(--line); }
.counter-row { display: grid; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--c-gray-96); }
.counter-row > div:nth-child(2) { display: flex; flex-direction: column; }.counter-row b { font-size: 12px; }.counter-row small { color: var(--muted); font-size: 9px; }
.counter { display: flex; align-items: center; border: 1px solid var(--c-gray-88); border-radius: 8px; overflow: hidden; }.counter button { width: 44px; height: 44px; border: 0; background: var(--c-gray-96); display: grid; place-items: center; }.counter b { min-width: 28px; text-align: center; }
.validation-error { background: var(--c-gold-98); border: 1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white)); color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); border-radius: 9px; padding: 10px 12px; display: flex; flex-direction: column; margin-bottom: 6px; }.validation-error b { font-size: 11px; }.validation-error span { font-size: 9px; }
.search-tools { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.search-tools label, .login-card label { display: flex; flex-direction: column; gap: 5px; font-size: 10px; font-weight: 700; color: var(--muted); }
.search-tools input, .login-card input { height: 44px; border: 1px solid var(--c-slate-85); border-radius: 9px; background: var(--c-white); padding: 0 12px; min-width: 220px; color: var(--ink); }
.chips { display: flex; gap: 5px; align-items: end; overflow-x: auto; }.chips button { height: 36px; border: 1px solid var(--c-gray-88); background: var(--c-white); border-radius: 999px; padding: 0 13px; white-space: nowrap; font-size: 10px; font-weight: 700; }.chips button.active { background: var(--navy); color: var(--c-white); border-color: var(--navy); }
.player-grid { display: grid; gap: 12px; }
.player-card { min-width: 0; padding: 0; border: 1px solid var(--c-gray-88); background: var(--c-white); border-radius: 11px; overflow: hidden; text-align: left; }
.player-card-art { background: var(--c-gray-91); position: relative; display: flex; justify-content: center;  border-top: 4px solid var(--c-gray-61); }
.player-card-art > .player-art { width: 92px; height: 134px; background: linear-gradient(145deg, var(--c-gray-96), var(--c-slate-82)); border-radius: 15px 15px 0 0; }
.player-card-art > .grade { position: absolute; left: 8px; top: 8px; }
.rarity-r .player-card-art { border-color: var(--p-blue); }.rarity-sr .player-card-art { border-color: color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink)); }.rarity-ssr .player-card-art { border-color: color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)); background: color-mix(in srgb,var(--p-gold) 16%,var(--p-white)); }
.in-deck { position: absolute; right: 7px; top: 7px; background: var(--navy); color: var(--c-white); font-size: 7px; font-weight:700; padding: 4px 6px; border-radius: 4px; letter-spacing: .08em; }
.player-card-info { padding: 9px; background: var(--c-white); color: var(--navy); }.player-card-info > span { font-size: 11px; color: var(--c-slate-36); }.player-card-info > b { color: var(--navy); font-size: 16px; display: block; margin: 4px 0 8px; }.player-card-info div { display: flex; justify-content: space-between; font-size: 11px; color: var(--c-slate-36); }.player-card-info strong { color: var(--ink); }
.analysis-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.analysis-card { border: 1px solid var(--line); border-radius: 10px; padding: 14px; min-height: 120px; display: flex; flex-direction: column; gap: 7px; }.analysis-card > span { font-size: 9px; color: var(--muted); }.analysis-card b { font-size: 13px; }.analysis-card b strong { float: right; color: var(--blue); }.analysis-card p, .analysis-card small { font-size: 9px; color: var(--muted); }.analysis-card.warning { background: var(--c-orange-98); border-color: color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white)); }
.bar, .progress { height: 6px; background: var(--c-gray-91); border-radius: 4px; overflow: hidden; }.bar i, .progress i { display: block; height: 100%; background: var(--blue); }

/* Pack and trade */
.wallet { background: var(--navy); color: var(--c-white); border-radius: 14px; padding: 16px 20px; display: flex; gap: 36px; }
.wallet div { display: flex; flex-direction: column; }.wallet span { font-size: 8px; color: var(--c-slate-68); letter-spacing: .08em; font-weight:600; }.wallet b { font-size: 18px; }.wallet small { font-size: 9px; color: var(--lime); }
.pack-layout, .trade-layout { max-width: 900px; margin: auto; }
.pack-hero { min-height: 340px; border-radius: 16px; background: linear-gradient(130deg, var(--c-navy-11), color-mix(in srgb,var(--p-blue) 55%,var(--p-ink))); color: var(--c-white); padding: 28px 8%; display: flex; align-items: center; justify-content: center; gap: 8%; overflow: hidden; }
.pack-hero > div:last-child { max-width: 360px; display: flex; align-items: flex-start; flex-direction: column; gap: 12px; }.pack-hero h2 { font-size: 28px; }.pack-hero p { font-size: 11px; line-height: 1.7; color: var(--c-slate-80); }
.pack-object { flex: 0 0 auto; width: 185px; height: 250px; background: linear-gradient(155deg, var(--c-blue-96), color-mix(in srgb,var(--p-slate) 60%,var(--p-white))); color: var(--navy); border-radius: 10px; transform: rotate(-4deg); box-shadow: 18px 18px 0 var(--p-ink), 0 22px 38px color-mix(in srgb,var(--c-black) 53.3%,transparent); padding: 24px 18px; display: flex; flex-direction: column; border: 2px solid var(--c-white); }
.pack-object span { font-size: 10px; font-weight: 900; letter-spacing: .1em; }.pack-object b { font-size: 26px; line-height: .95; margin: auto 0; }.pack-object small { font-size: 9px; font-weight: 800; }
.pack-hero .text-link { color: color-mix(in srgb,var(--p-blue) 32%,var(--p-white)); margin: 0; text-align: left; line-height: 1.4; }
.collection-summary { margin-top: 14px; background: var(--c-white); border: 1px solid var(--line); border-radius: 12px; padding: 14px 18px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; font-size: 10px; color: var(--muted); }.collection-summary div:first-child { display: flex; flex-direction: column; }.collection-summary b { color: var(--ink); font-size: 19px; }.collection-summary small { font-size: 10px; color: var(--muted); }
.pack-results { margin-top: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--c-white); padding: 18px; }.pack-results > :is(.button,.btn) { margin: 14px auto 0; display: flex; }.result-card { position: relative; }.result-card > span { position: absolute; z-index: 2; top: 8px; right: 8px; background: var(--lime); color: color-mix(in srgb,var(--p-green) 55%,var(--p-ink)); font-size: 8px; font-weight:700; padding: 4px 7px; border-radius: 4px; }
.rate-guide { display: flex; background: var(--navy); color: var(--c-white); border-radius: 10px; padding: 12px; gap: 8px; align-items: center; margin-bottom: 14px; }.rate-guide span { min-width: 62px; font-size: 10px; color: var(--c-slate-74); }.rate-guide b { display: block; color: var(--c-white); font-size: 16px; }.rate-guide small { margin-left: auto; color: var(--c-slate-74); }.rate-guide.exchange { background: var(--c-white); color: var(--ink); border: 1px solid var(--line); }.rate-guide.exchange b { color: var(--ink); }
.trade-layout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 14px; }
.trade-layout > div { background: var(--c-white); border: 1px solid var(--line); border-radius: 14px; padding: 18px; }
.trade-card { display: flex; align-items: center; gap: 16px; background: var(--c-gray-96); border-radius: 10px; padding: 14px; }.trade-card .player-art { width: 72px; height: 88px; }.trade-card h3 { margin-top: 5px; }.trade-card p, .trade-card span:last-child { font-size: 10px; color: var(--muted); }.trade-card div { display: flex; flex-direction: column; align-items: flex-start; }
.trade-confirm { display: flex; flex-direction: column; gap: 12px; }.trade-confirm > span { font-size: 10px; color: var(--muted); font-weight:600; }
.big-counter { display: grid; grid-template-columns: 48px 1fr 48px; height: 50px; border: 1px solid var(--c-gray-88); border-radius: 10px; overflow: hidden; }.big-counter button { border: 0; background: var(--c-gray-96); display: grid; place-items: center; }.big-counter b { display: grid; place-items: center; }
.expected { background: var(--c-blue-96); padding: 14px; border-radius: 9px; display: flex; flex-direction: column; }.expected span { font-size: 9px; color: var(--muted); }.expected b { color: var(--blue); font-size: 22px; }.expected small { font-size: 9px; color: var(--muted); }
.complete-state { background: var(--c-green-97); border: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); padding: 14px; border-radius: 9px; color: var(--p-green); display: grid; grid-template-columns: 24px 1fr; }.complete-state span { grid-column: 2; font-size: 9px; }
.search-tools.inline { background: var(--c-white); padding: 12px; border-radius: 10px; border: 1px solid var(--line); }
.exchange-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
.exchange-row { border: 1px solid var(--line); border-radius: 10px; background: var(--c-white); padding: 9px; display: flex; align-items: center; gap: 10px; text-align: left; }.exchange-row.selected { border: 2px solid var(--blue); }.exchange-row .player-art { width: 48px; height: 58px; }.exchange-row > div { display: flex; flex-direction: column; align-items: flex-start; }.exchange-row b { font-size: 12px; margin-top: 3px; }.exchange-row span:last-child { font-size: 9px; color: var(--muted); }.exchange-row > strong { margin-left: auto; font-size: 11px; }
.exchange-dock { background: var(--c-white); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; }.exchange-dock > div { display: flex; flex-direction: column; }.exchange-dock span, .exchange-dock small { font-size: 9px; color: var(--muted); }

/* Onboarding, login, records, guide */
.stepper { max-width: 480px; display: flex; margin: 4px auto 24px; align-items: center; }.stepper b { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--c-slate-82); background: var(--c-white); border-radius: 50%; font-size: 10px; position: relative; color: color-mix(in srgb,var(--p-line) 55%,var(--p-ink)); }.stepper b.active { background: var(--navy); border-color: var(--navy); color: var(--c-white); }.stepper b.done { background: var(--blue); border-color: var(--blue); color: var(--c-white); }.stepper b span { position: absolute; top: 33px; color: var(--muted); width: 80px; text-align: center; font-size: 9px; }.stepper i { height: 1px; flex: 1; background: var(--c-slate-85); }
.team-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 9px; }.team-grid button { position: relative; border: 1px solid var(--line); background: var(--c-white); border-radius: 11px; display: flex; align-items: center; justify-content: center; flex-direction: column; }.team-grid button.active { border: 2px solid var(--blue); box-shadow: 0 5px 16px color-mix(in srgb,var(--c-blue-41) 10.2%,transparent); }.team-grid button > b { font-size: 10px; }.team-grid button > span:last-child { position: absolute; top: 6px; right: 6px; width: 20px; height: 20px; border-radius: 50%; background: var(--blue); color: var(--c-white); display: grid; place-items: center; }.team-grid button > span svg { width: 13px; }
.starter-preview { margin-top: 14px; background: var(--navy); color: var(--c-white); border-radius: 14px; padding: 20px; display: flex; justify-content: space-between; align-items: center; }.starter-preview h2 { font-size: 20px; margin-top: 4px; }.starter-preview p { font-size: 10px; color: var(--c-slate-74); }.mini-players { display: flex; align-items: center; }.mini-players .player-art { width: 42px; height: 52px; margin-left: -7px; border: 2px solid var(--navy); }.mini-players > span { width: 42px; height: 42px; background: var(--lime); color: color-mix(in srgb,var(--p-green) 55%,var(--p-ink)); display: grid; place-items: center; border-radius: 50%; margin-left: -6px; font-weight:700; font-size: 10px; }
.important-note { background: var(--c-gold-98); border: 1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white)); border-radius: 10px; padding: 12px; display: flex; gap: 10px; margin: 12px 0; color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); }.important-note svg { flex: 0 0 auto; }.important-note span { font-size: 10px; line-height: 1.5; }.important-note b { display: block; font-size: 11px; }
.ready-deck { background: var(--navy); color: var(--c-white); border-radius: 15px; padding: 20px; display: grid; grid-template-columns: 1fr auto; }.ready-deck h2 { font-size: 22px; margin-top: 7px; }.ready-deck p { color: var(--c-slate-74); font-size: 10px; }.starter { grid-column: 1 / -1; display: flex; align-items: center; gap: 9px; margin-top: 14px; padding-top: 12px; border-top: 1px solid color-mix(in srgb,var(--c-white) 13.3%,transparent); }.starter .player-art { width: 40px; height: 46px; }.starter span { display: flex; flex-direction: column; font-size: 9px; color: var(--c-slate-68); }.starter b { color: var(--c-white); font-size: 12px; }.starter button { margin-left: auto; background: transparent; color: var(--lime); border: 0; font-size: 10px; }
.setup-section { margin-top: 18px; }.setup-section .section-head span { font-size: 10px; color: var(--muted); }
.opponent-list { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }.opponent-list button { background: var(--c-white); border: 1px solid var(--line); border-radius: 10px; padding: 10px 4px; display: flex; flex-direction: column; align-items: center; gap: 5px; min-height: 78px; }.opponent-list button.active { border: 2px solid var(--blue); }.opponent-list span { font-size: 9px; font-weight: 700; }
.difficulty { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.difficulty button { min-height: 72px; border: 1px solid var(--line); background: var(--c-white); border-radius: 10px; display: flex; flex-direction: column; text-align: left; padding: 12px; }.difficulty button.active { border: 2px solid var(--blue); background: var(--c-blue-96); }.difficulty b { font-size: 12px; }.difficulty span { font-size: 9px; color: var(--muted); margin-top: 3px; }
.rules-note { display: flex; flex-direction: column; background: var(--c-gray-91); border-radius: 9px; padding: 11px 13px; margin: 14px 0; }.rules-note b { font-size: 11px; }.rules-note span { font-size: 9px; color: var(--muted); }
.page-wrap.narrow > :is(.button,.btn) { width: 100%; }
.login-page {  background: var(--navy); display: grid; grid-template-columns: 1fr 440px; place-content: center; padding: 40px 10%; gap: 10%; color: var(--c-white); }
.login-brand { align-self: center; }.brand-diamond { width: 50px; height: 50px; display: grid; place-items: center; transform: rotate(45deg); border: 2px solid var(--lime); color: var(--lime); font-weight:700; font-size: 12px; margin: 12px; }.login-brand p { color: var(--lime); font-size: 12px; letter-spacing: .12em; font-weight: 800; margin-top: 30px; }.login-brand h1 { font-size: clamp(48px, 7vw, 86px); letter-spacing: -.07em; margin: 12px 0 25px; }.login-brand h1 em { font-style: normal; color: var(--lime); }.login-brand > span:last-child { color: var(--c-slate-74); font-size: 14px; line-height: 1.7; }
.login-card { background: var(--c-white); color: var(--ink); border-radius: 18px; padding: 30px; display: flex; flex-direction: column; gap: 13px; box-shadow: 0 24px 60px color-mix(in srgb,var(--c-black) 33.3%,transparent); }.login-card h2 { font-size: 22px; margin-bottom: 8px; }.login-card input { width: 100%; }.login-card > small { color: var(--muted); text-align: center; font-size: 9px; }
.record-summary { background: var(--navy); color: var(--c-white); border-radius: 15px; padding: 18px 24px; display: grid; gap: 10px; }.record-summary > div { border-right: 1px solid color-mix(in srgb,var(--c-white) 12.5%,transparent); display: flex; flex-direction: column; }.record-summary span { color: var(--c-slate-68); font-size: 9px; }.record-summary b { font-size: 28px; }.record-summary aside { margin-left: auto; }.record-summary aside b { display: flex; gap: 5px; margin-top: 7px; }.record-summary i { width: 24px; height: 24px; display: grid; place-items: center; background: var(--p-green); border-radius: 50%; font-size: 9px; font-style: normal; }.record-summary i.loss { background: color-mix(in srgb,var(--p-red) 80%,var(--p-ink)); }.record-summary i.draw { background: color-mix(in srgb,var(--p-navy) 60%,var(--p-white)); }
.history { background: var(--c-white); border: 1px solid var(--line); border-radius: 14px; padding: 18px; margin-top: 14px; }.history .section-head > button { border: 0; background: transparent; color: var(--blue); font-size: 10px; }.history-row { width: 100%; min-height: 68px; border: 0; border-top: 1px solid var(--c-gray-96); background: var(--c-white); display: grid; grid-template-columns: 48px 36px 1fr 70px 100px 20px; gap: 10px; align-items: center; text-align: left; }.history-row > div { display: flex; flex-direction: column; }.history-row > div b { font-size: 12px; }.history-row > div span, .history-row time { color: var(--muted); font-size: 9px; }.history-row > strong { font-size: 15px; }.match-result { color: var(--p-green); font-size: 10px; font-weight:600; }.match-result.r2 { color: var(--danger); }.match-result.r3 { color: var(--muted); }
.guide-hero { background: var(--navy); color: var(--c-white); border-radius: 16px; padding: 34px; }.guide-hero > span { color: var(--lime); font-size: 9px; font-weight:700; letter-spacing: .15em; }.guide-hero h2 { font-size: 34px; margin: 14px 0; line-height: 1.15; }.guide-hero p { color: var(--c-slate-74); font-size: 12px; }
.guide-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }.guide-grid > section, .component-gallery, .motion-guide { background: var(--c-white); border: 1px solid var(--line); border-radius: 14px; padding: 20px; }.guide-grid h3 { margin: 5px 0 14px; }
.swatches { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }.swatches i { height: 70px; border-radius: 8px; padding: 8px; display: flex; align-items: flex-end; font-size: 9px; font-style: normal; color: var(--c-white); }.swatches .navy { background: var(--navy); }.swatches .lime { background: var(--lime); color: color-mix(in srgb,var(--p-green) 55%,var(--p-ink)); }.swatches .paper { background: var(--paper); color: var(--ink); border: 1px solid var(--line); }.swatches .blue { background: var(--blue); }
.type-sample { display: flex; flex-direction: column; gap: 6px; }.type-sample b { font-size: 25px; }.type-sample span { font-size: 13px; }.type-sample small { color: var(--muted); }.badge-row { display: flex; gap: 5px; margin-top: 12px; }
.component-gallery { margin-top: 14px; }.gallery-row { display: grid; grid-template-columns: 180px 160px 1fr; gap: 18px; align-items: start; }.gallery-tactic .tactic-card { width: 150px; }.state-stack { display: flex; flex-wrap: wrap; gap: 8px; }
.extension { margin-top: 14px; background: color-mix(in srgb,var(--p-navy) 55%,var(--p-ink)); color: var(--c-white); border-radius: 14px; padding: 24px; }.extension > div:first-child p { color: var(--c-slate-68); margin-top: 4px; font-size: 11px; }.extension > div:first-child h2 { margin-top: 10px; }.extension-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 20px; }.extension article { background: color-mix(in srgb,var(--c-white) 3.9%,transparent); border: 1px solid color-mix(in srgb,var(--c-white) 10.2%,transparent); border-radius: 10px; padding: 15px; }.extension article span { color: var(--lime); font-size: 9px; }.extension article b { display: block; margin: 8px 0; font-size: 13px; }.extension article p { color: var(--c-slate-74); font-size: 10px; line-height: 1.55; }
.motion-guide { margin-top: 14px; }.motion-guide h3 { margin: 5px 0 12px; }.motion-guide > div { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }.motion-guide p { background: var(--c-gray-96); border-radius: 8px; padding: 10px; font-size: 9px; }

@media (min-width: 900px) {
  .match-main { display: grid; grid-template-columns: minmax(580px, 760px) 320px; gap: 16px; padding: 18px; }
  .match-core { background: var(--paper); }
  .versus-card { margin-top: 0; }
  .match-aside { display: block; background: var(--c-white); border: 1px solid var(--line); border-radius: 14px; padding: 18px; }
  .timeline { margin-top: 16px; border-left: 1px solid var(--c-gray-88); }.timeline div { display: flex; flex-direction: column; gap: 3px; padding: 0 0 20px 15px; position: relative; }.timeline div:before { content: ""; width: 7px; height: 7px; background: var(--blue); border-radius: 50%; position: absolute; left: -4px; top: 4px; }.timeline span, .timeline small { font-size: 9px; color: var(--muted); }.timeline b { font-size: 12px; }
  .privacy-note { margin-top: 16px; background: var(--c-gray-96); border-radius: 9px; padding: 12px; display: flex; gap: 8px; color: var(--muted); }.privacy-note div { display: flex; flex-direction: column; }.privacy-note b { font-size: 10px; color: var(--ink); }.privacy-note span { font-size: 9px; }
  .tactic-hand { overflow: visible; }.tactic-card { min-height: 132px; }
}

@media (max-width: 760px) {
  .screen-area { padding-bottom: 66px; }
  
  
  .deck-layout { display: block; }.synergy-panel { position: static; margin-top: 12px; }
  .save-dock {  justify-content: space-between; padding: 8px 12px; }.save-dock small { display: none; }
  .player-grid {  gap: 8px; }
  .player-card-art > .player-art { height: 114px; width: 84px; }
  .search-tools { flex-direction: column; }.search-tools input { width: 100%; }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .login-page { display: block; padding: 28px 18px; }.login-brand { padding: 10px 10px 28px; }.login-brand h1 { font-size: 52px; }.login-brand > span:last-child { display: none; }.login-card { padding: 22px; }
  .pack-hero { min-height: 430px; padding: 24px 18px; flex-direction: column; text-align: center; }.pack-hero > div:last-child { align-items: center; }.pack-object { width: 130px; height: 175px; padding: 16px 12px; }.pack-object b { font-size: 19px; }.pack-hero h2 { font-size: 22px; }
  .collection-summary { grid-template-columns: auto 1fr; }.collection-summary > span { grid-column: 1 / -1; }.trade-layout { grid-template-columns: 1fr; }
  .exchange-grid { grid-template-columns: 1fr; }.search-tools.inline { flex-direction: column; }
  .record-summary {  padding: 15px; }.record-summary aside { grid-column: 1 / -1; margin: 8px 0 0; padding-top: 10px; border-top: 1px solid color-mix(in srgb,var(--c-white) 12.5%,transparent); }.record-summary > div { border-right: 0; }.record-summary b { font-size: 22px; }
  .history-row { grid-template-columns: 42px 34px 1fr auto 16px; }.history-row time { display: none; }
  .guide-grid { grid-template-columns: 1fr; }.gallery-row { grid-template-columns: 1fr 1fr; }.state-stack { grid-column: 1 / -1; }.extension-grid { grid-template-columns: 1fr; }.motion-guide > div { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 420px) {
  .review-nav { padding: 0 8px; gap: 8px; }.review-label { font-size: 0; }.review-label span { font-size: 10px; margin: 0; }
  .topbar { height: 54px; padding: 0 12px; }.topbar b { font-size: 15px; }
  .scoreboard { min-height: 78px; padding: 8px 10px 12px; }.team-mark { width: 40px; height: 40px; }.team-score strong { font-size: 28px; }.team-score b { font-size: 11px; }.team-score div span { display: none; }.inning { padding: 0 7px; }.inning b { font-size: 13px; }.inning span { font-size: 8px; }
  .versus-card { margin: 0 8px; min-height: 91px; }.player-side { padding: 8px 4px 21px 8px; gap: 5px; }.player-side.pitcher { padding-right: 8px; }.player-side .player-art { width: 42px; height: 56px; }.player-side b { font-size: 12px; }.player-side span:last-child { font-size: 8px; }.vs { width: 24px; height: 24px; font-size: 7px; }
  .situation-row { margin: 4px 10px 0; min-height: 42px; }.phase-strip { margin: 0 12px 7px; }.phase-strip s, .phase-strip b { display: none; }
  .hand-head { padding: 0 12px 6px; }.hand-head b { font-size: 12px; }
  .tactic-hand { padding: 0 8px 6px; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }.tactic-card { min-width: 0; min-height: 96px; padding: 6px 4px; gap: 3px; border-radius: 8px; }.tactic-symbol { width: 23px; height: 23px; }.tactic-tag { font-size: 7px; }.tactic-card b { width: 100%; font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.card-index { font-size: 7px; top: 4px; right: 4px; }.selected-check { width: 17px; height: 17px; right: 4px; bottom: 4px; }
  .selected-detail { margin: 0 8px 6px; min-height: 40px; padding: 6px 8px; gap: 7px; }.selected-detail div { min-width: 82px; }.selected-detail p { font-size: 8px; }
  .action-dock { padding: 7px 8px; gap: 4px; }.selection-copy { min-width: 82px; }.dock-buttons { gap: 4px; }.dock-buttons :is(.button,.btn) { min-width: 44px; min-height: 44px; padding: 0 10px; font-size: 11px; }.selection-copy button { min-width: 44px; min-height: 44px; }
  .lineup-row > .grade { display: none; }.move-buttons button { width: 44px; height: 44px; }
  .deck-editor, .synergy-panel { padding: 12px; }.roster-groups, .analysis-grid { grid-template-columns: 1fr; }
  .save-dock > div span { display: none; }.save-dock { gap: 8px; }.save-dock :is(.button,.btn) { flex: 1; }
  .wallet { gap: 18px; padding: 12px 14px; }.tabs.pack-tabs button { min-width: 105px; padding: 0 8px; }
  .rate-guide { overflow-x: auto; }.rate-guide span { min-width: 46px; }.rate-guide small { display: none; }
  .starter-preview { padding: 14px; }.mini-players .player-art:nth-child(n+3) { display: none; }
  .opponent-list { grid-template-columns: repeat(5, 76px); overflow-x: auto; }.difficulty { gap: 5px; }.difficulty button { padding: 9px 7px; }.difficulty span { line-height: 1.3; }
  .guide-hero { padding: 24px 18px; }.guide-hero h2 { font-size: 28px; }.swatches { grid-template-columns: 1fr 1fr; }.gallery-row { grid-template-columns: 1fr; }.gallery-tactic, .state-stack { grid-column: auto; }
}

@media (max-height: 720px) and (max-width: 500px) {
  .match-page .topbar { display: none; }
  .scoreboard { min-height: 68px; padding-top: 5px; padding-bottom: 8px; }
  .player-side .player-art { height: 48px; }
  .versus-card { min-height: 81px; }
  .situation-row { min-height: 34px; }
  .hand-head { padding-bottom: 4px; }
  .tactic-card { min-height: 84px; }
  .tactic-symbol { width: 20px; height: 20px; font-size: 10px; }
  .selected-detail { min-height: 36px; }
  .action-dock { min-height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { scroll-behavior: auto!important; transition-duration: .01ms!important; animation-duration: .01ms!important; animation-iteration-count: 1!important; }
}

.make-deck .deck-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}.make-deck .report-body{padding:14px}.make-deck .report-verdict{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}.make-deck .report-verdict article{padding:12px;border-radius:8px;background:var(--c-green-97);border:1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white))}.make-deck .report-verdict article+article{background:var(--c-gray-96);border-color:var(--line)}.make-deck .report-verdict span{display:block;font-size:10px;color:var(--muted);margin-bottom:6px}.make-deck .report-verdict strong{font-size:13px}.make-deck .report-verdict p{font-size:10px;line-height:1.7;margin-top:7px;color:var(--c-slate-42)}.make-deck .report-metric-head,.make-deck .ratio-head{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-bottom:5px}.make-deck .report-metric-head{padding-right:51px}.make-deck .report-metrics>div{display:grid;grid-template-columns:1fr auto 45px;gap:9px;align-items:center;min-height:39px;border-bottom:1px solid var(--c-gray-96);font-size:11px}.make-deck .report-metrics strong{font:700 13px Archivo}.make-deck .report-metrics small{font:400 10px 'Noto Sans KR';color:var(--muted)}.make-deck .report-metrics em{font-style:normal;text-align:right;font-size:10px;color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.make-deck .report-metrics em.below{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.make-deck .report-note{font-size:10px;line-height:1.8;color:var(--muted);margin:12px 0 0}.make-deck .report-gaps{margin-top:13px;padding:12px;border-radius:8px;background:var(--c-orange-98)}.make-deck .report-gaps h3{font-size:12px}.make-deck .report-gaps ul{margin:7px 0 0;padding-left:17px;font-size:11px;line-height:1.8;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}.make-deck .report-lead{font-size:11px;line-height:1.7;margin-bottom:16px}.make-deck .ratio-row{display:grid;grid-template-columns:1fr 75px;gap:20px;align-items:center;padding:11px 0;border-bottom:1px solid var(--c-gray-96)}.make-deck .ratio-row strong{font-size:11px}.make-deck .ratio-row small{float:right;font-size:10px;color:var(--muted)}.make-deck .ratio-row>b{text-align:right;font:800 16px Archivo;color:var(--navy)}.make-deck .ratio-track{display:block;height:5px;border-radius:4px;overflow:hidden;background:var(--c-gray-96);margin-top:7px}.make-deck .ratio-track i{display:block;height:100%;background:var(--p-green);border-radius:4px}.make-deck .report-validation{background:var(--c-red-96);padding:10px;font-size:11px;line-height:1.6;border-radius:7px;color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink));margin-bottom:12px}
@media(max-width:759px){.make-deck .report-body{padding:12px}.make-deck .report-verdict{gap:6px}.make-deck .report-verdict article{padding:10px}.make-deck .report-verdict strong{font-size:12px}.make-deck .deck-tabs button{padding:0 4px;font-size:11px}}

.collection-progress{margin-bottom:14px;padding:18px}.collection-progress-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.collection-progress-head h2{font-size:17px;margin-top:5px}.collection-progress-head>strong{font:800 26px Archivo;color:var(--navy)}.collection-progress-head>strong small{font:400 11px 'Noto Sans KR';color:var(--muted)}.collection-meter{height:7px;margin-top:14px;background:var(--c-gray-91);border-radius:6px;overflow:hidden}.collection-meter i{display:block;height:100%;background:var(--p-green);border-radius:6px}.collection-progress .help{font-size:10px;margin:8px 0}.collection-progress summary{min-height:44px;display:flex;align-items:center;border-top:1px solid var(--line);font-size:11px;cursor:pointer}.collection-progress summary:after{content:'⌄';margin-left:auto}.club-collection{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.club-collection button{display:flex;align-items:center;gap:8px;min-height:62px;border:1px solid var(--line);background:var(--c-white);border-radius:8px;padding:8px;text-align:left}.club-collection img{width:35px;height:35px;object-fit:contain}.club-collection b,.club-collection small{display:block}.club-collection b{font-size:12px}.club-collection small{font-size:9px;color:var(--muted);margin-top:4px}.pack-banner .earn-coins{color:var(--accent);font-size:11px;padding:8px 0;min-height:44px}.club-confirm .help{line-height:1.8}
.store-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;background:var(--c-gray-91);border:1px solid var(--line);border-radius:10px;padding:4px;margin-bottom:12px}.store-tabs button{min-height:44px;border:0;border-radius:7px;background:transparent;color:var(--c-slate-42);font-size:13px;font-weight:700}.store-tabs button[aria-pressed="true"]{background:var(--c-white);color:var(--navy);box-shadow:0 2px 6px color-mix(in srgb,var(--c-navy-15) 7.1%,transparent)}
.shard-wallet{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--navy);color:var(--c-white);border-radius:12px;padding:16px 20px;margin-bottom:18px}.shard-wallet span{display:block;font-size:12px;color:var(--c-slate-82)}.shard-wallet strong{display:block;color:var(--accent);font:800 28px Archivo;margin-top:4px}.shard-wallet p{font-size:11px;line-height:1.8;color:var(--c-slate-82);text-align:right}.shard-wallet b{color:var(--c-white);font-weight:500}
.exchange-shop>.help{margin-bottom:12px}.exchange-rates{padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--c-white);margin:12px 0 16px}.exchange-rates summary{display:flex;align-items:center;min-height:48px;cursor:pointer;font-size:12px;font-weight:700}.exchange-rates summary:after{content:'⌄';margin-left:auto}.exchange-rates table{width:100%;border-collapse:collapse;text-align:right;font-size:12px}.exchange-rates th,.exchange-rates td{padding:10px 4px;border-top:1px solid var(--line)}.exchange-rates th:first-child{text-align:left}.exchange-rates .help{margin:12px 0}.trade-latest{font-size:12px;padding:10px 12px;border-radius:8px;color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink));background:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));line-height:1.6}
.recycle-list{display:grid;gap:10px}.recycle-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:18px;background:var(--c-white);border:1px solid var(--line);border-radius:12px;padding:12px}.recycle-player{display:flex;align-items:center;gap:12px;text-align:left;min-width:0;border:0;background:transparent;padding:0;color:var(--navy)}.recycle-player>img{width:58px;height:72px;object-fit:contain;background:var(--c-gray-96);border-radius:8px}.recycle-player strong{display:block;font-size:15px;margin:4px 0}.recycle-player small,.recycle-stock small{display:block;color:var(--muted);font-size:11px;line-height:1.6}.recycle-stock b{font-size:13px}.recycle-row>.btn{min-width:106px;min-height:48px;font-size:12px}.recycle-row>.btn span{display:block;font-size:10px;margin-top:3px;font-weight:500}
.trade-filters{display:grid;grid-template-columns:minmax(0,2fr) 1fr 1fr auto;gap:8px;align-items:center;margin:16px 0}.trade-search{display:flex;gap:6px}.trade-search input{min-width:0}.trade-filters input,.trade-filters select{margin:0;min-height:44px;font-size:13px}.trade-search .btn{padding:0 14px;white-space:nowrap;min-height:44px}.trade-missing{display:flex;align-items:center;gap:7px;min-height:44px;font-size:12px;white-space:nowrap}.trade-missing input{width:18px;height:18px;min-height:18px;accent-color:var(--navy)}
.redemption-grid{display:grid;gap:12px}.redemption-card{min-width:0;overflow:hidden;background:var(--c-white);border:1px solid var(--line);border-radius:12px}.redemption-card .player-card{border:0;border-radius:0;box-shadow:none}.redemption-action{padding:12px;border-top:1px solid var(--line)}.redemption-action>strong{display:block;font-size:17px;margin-bottom:10px}.redemption-action small{font-size:11px;font-weight:500;color:var(--muted)}.redemption-action .btn{width:100%;min-height:44px;font-size:12px;padding:8px}.redemption-action .btn:disabled{background:var(--c-gray-96);color:var(--c-slate-49);opacity:1;cursor:default}
.trade-player{display:flex;align-items:center;gap:18px;padding:14px;background:var(--c-gray-96);border-radius:10px;margin:16px 0}.trade-player img{width:84px;height:106px;object-fit:contain}.trade-player h3{font-size:20px;margin:5px 0}.trade-player p,.trade-player small{color:var(--muted);font-size:12px;line-height:1.8}.trade-preview{font-size:13px;padding:12px;border-radius:8px;background:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));margin:14px 0}.trade-preview:empty{display:none}.trade-receipt{text-align:center;padding:22px 4px}.trade-receipt>span{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 18px;border-radius:50%;background:var(--accent);color:var(--navy);font-size:25px}.trade-receipt h3{font-size:17px;line-height:1.7}.trade-receipt p{font-size:14px;margin:10px 0}.trade-receipt small{color:var(--muted)}
@media(max-width:759px){.shard-wallet{padding:14px}.shard-wallet strong{font-size:25px}.shard-wallet p{font-size:10px}.store-tabs button{font-size:12px}.recycle-row{grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:12px}.recycle-player{grid-row:span 2;gap:9px}.recycle-player>img{width:48px;height:64px}.recycle-player strong{font-size:14px}.recycle-player small{font-size:10px}.recycle-stock{text-align:right}.recycle-row>.btn{min-width:108px}.recycle-stock small{font-size:10px}.trade-filters{grid-template-columns:1fr 1fr}.trade-search{grid-column:1/-1}.trade-missing{grid-column:1/-1}.redemption-grid{gap:9px}.redemption-card .portrait{height:125px}.redemption-card .card-body{padding:10px}.redemption-card .card-body>strong{font-size:17px}.redemption-action{padding:10px}}
@media(max-width:740px){.collection-progress{padding:14px}.collection-progress-head h2{font-size:15px}.club-collection{grid-template-columns:repeat(2,minmax(0,1fr))}.club-button small{display:block;font-size:8px}.collection-progress .eyebrow{font-size:8px}}

/* Rarity is cosmetic; each player keeps the same season ratings. */
[data-grade="N"]{--rarity:color-mix(in srgb,var(--p-blue) 32%,var(--p-white));--rarity-rgb:169,190,210}
[data-grade="R"]{--rarity:color-mix(in srgb,var(--p-g-r) 60%,var(--p-white));--rarity-rgb:101,187,255}
[data-grade="SR"]{--rarity:color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white));--rarity-rgb:199,146,255}
[data-grade="SSR"]{--rarity:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));--rarity-rgb:255,212,117}
.grade-badge{display:inline-flex;align-items:center;justify-content:center;min-width:27px;padding:3px 6px;border:1px solid var(--rarity);border-radius:4px;font-size:9px;font-weight:700;line-height:1.2;vertical-align:middle}
.player-card[data-grade]{box-shadow:0 3px 10px color-mix(in srgb,var(--c-navy-11) 14.9%,transparent),inset 0 0 0 1px rgba(var(--rarity-rgb),.2)}
.player-card[data-grade="SSR"]{background:var(--c-white);border-color:var(--p-g-ssr);}
.card-body>.grade-badge{display:table;margin-bottom:6px}.unowned>.grade-badge{margin-bottom:8px;opacity:.8}
.grade-odds{display:grid;gap:8px;margin:8px 0 14px}.grade-odds>div{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 5px;border:1px solid var(--rarity);border-radius:8px;}.grade-odds strong{font-size:10px}.grade-odds>div>span:not(.grade-badge){font-size:15px;font-weight:600;color:var(--rarity)}.grade-odds small{color:color-mix(in srgb,var(--p-blue) 32%,var(--p-white))}
.pack-opening{background:radial-gradient(ellipse at 50% 0,rgba(var(--rarity-rgb),.16),transparent 65%),var(--c-navy-11);color:var(--c-blue-96);border-color:var(--rarity);box-shadow:0 15px 90px color-mix(in srgb,var(--p-ink) 80%,transparent),0 0 30px rgba(var(--rarity-rgb),.18);overflow-x:hidden}
.pack-opening .dialog-head{margin-bottom:12px}.pack-opening .dialog-head h2{font-size:18px}.pack-opening .dialog-head .icon-btn{background:var(--p-navy);color:var(--c-white);border-color:var(--p-slate)}
.pack-celebration{position:relative;isolation:isolate;overflow:hidden;border:1px solid rgba(var(--rarity-rgb),.3);border-radius:12px;padding:18px 10px;text-align:center;background:radial-gradient(ellipse at center,rgba(var(--rarity-rgb),.15),transparent 72%)}
.pack-celebration .eyebrow{position:relative;color:color-mix(in srgb,var(--p-slate) 60%,var(--p-white));font-size:8px}.pack-celebration h3{position:relative;font-size:24px;color:var(--rarity);}.pack-celebration h3 .grade-badge{font-size:16px;padding:4px 8px;margin-right:3px}.pack-celebration p{position:relative;color:var(--c-slate-80);font-size:11px}
.pack-rays{display:none;position:absolute;left:50%;top:50%;width:400px;height:400px;margin:-200px;z-index:-1;pointer-events:none}
[data-grade="SR"]>.pack-rays{display:block;border-radius:50%;background:radial-gradient(transparent 25%,color-mix(in srgb,var(--p-g-sr) 22%,transparent) 26%,transparent 28%,transparent 39%,color-mix(in srgb,var(--p-g-sr) 14.1%,transparent) 40%,transparent 43%);animation:rarity-ring 1.6s ease-out both}
[data-grade="SSR"]>.pack-rays{display:block;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 14.5%,transparent) 0deg 8deg,transparent 8deg 30deg);mask-image:radial-gradient(var(--c-black),transparent 68%);animation:rarity-rays 2.8s ease-out both}
.pack-opening .pack-reveal{gap:12px;margin:20px 0 10px;perspective:1000px}.pack-opening .reveal-slot{position:relative;min-width:0;animation:none;isolation:isolate}
.pack-opening .reveal-slot>.player-card{animation:rarity-normal .5s ease-out both;animation-delay:var(--delay);transform-origin:center;backface-visibility:hidden}
.pack-opening .reveal-slot[data-grade="R"]>.player-card{animation-duration:.75s}
.pack-opening .reveal-slot[data-grade="SR"]>.player-card{animation-name:rarity-epic;animation-duration:.9s}
.pack-opening .reveal-slot[data-grade="SSR"]>.player-card{animation-name:rarity-star;animation-duration:1.15s}
.reveal-burst{display:none;position:absolute;inset:25% 0 auto;text-align:center;font-size:90px;color:var(--rarity);z-index:2;pointer-events:none;text-shadow:0 0 20px var(--rarity)}
.reveal-slot[data-grade="SSR"]>.reveal-burst{display:block;animation:rarity-burst 1.2s ease-out both;animation-delay:var(--delay)}
.pack-opening .reveal-slot[data-grade="SR"]:after,.pack-opening .reveal-slot[data-grade="SSR"]:after{content:'';pointer-events:none;position:absolute;inset:0;border-radius:10px;background:linear-gradient(110deg,transparent 35%,rgba(var(--rarity-rgb),.6) 48%,transparent 60%);background-size:300% 100%;animation:rarity-shine 1.4s ease-out both;animation-delay:var(--delay)}
.pack-opening .player-card:hover{transform:none}.pack-opening .card-body>strong{display:block}.pack-reveal-actions{display:flex;justify-content:space-between;gap:10px}.pack-reveal-actions .text-btn{color:var(--c-blue-88);font-size:11px;min-height:44px}.pack-reveal-actions [hidden]{display:none}.pack-opening>.btn.primary{background:var(--rarity);color:var(--c-navy-11);border-color:var(--rarity);box-shadow:none;margin-top:5px}
.pack-opening.reveal-complete *,.pack-opening.reveal-complete *:before,.pack-opening.reveal-complete *:after{animation:none!important}.reveal-complete .reveal-burst,.reveal-complete .reveal-slot:after{display:none}
@keyframes rarity-normal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes rarity-flip{from{opacity:0;transform:rotateY(-80deg) translateY(8px);filter:brightness(1.3)}to{opacity:1;transform:none;filter:none}}
@keyframes rarity-epic{0%{opacity:0;transform:scale(.82) translateY(18px)}60%{opacity:1;transform:scale(1.04);box-shadow:0 0 28px color-mix(in srgb,var(--p-g-sr) 53.3%,transparent)}100%{opacity:1;transform:none;box-shadow:0 0 12px color-mix(in srgb,var(--p-g-sr) 26.7%,transparent)}}
@keyframes rarity-star{0%{opacity:0;transform:scale(.7) rotateY(-55deg)}55%{opacity:1;transform:scale(1.055);box-shadow:0 0 38px color-mix(in srgb,var(--p-gold) 60%,transparent)}100%{opacity:1;transform:none;box-shadow:0 0 18px color-mix(in srgb,var(--p-gold) 33.3%,transparent)}}
@keyframes rarity-burst{0%{opacity:0;transform:scale(.3) rotate(-25deg)}35%{opacity:.8}100%{opacity:0;transform:scale(1.5) rotate(40deg)}}
@keyframes rarity-shine{0%,15%{opacity:0;background-position:100% 0}30%{opacity:.65}100%{opacity:0;background-position:0 0}}
@keyframes rarity-ring{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes rarity-rays{from{transform:rotate(-25deg);opacity:0}to{transform:rotate(20deg);opacity:1}}
@media(max-width:740px){.pack-opening{padding:15px 12px}.pack-celebration{padding:12px 6px}.pack-celebration h3{font-size:20px}.pack-celebration p{font-size:10px}.pack-opening .pack-reveal{gap:6px;margin-top:15px}.pack-opening .card-body>.grade-badge{font-size:8px;padding:2px 5px}.pack-opening .card-body>strong{font-size:13px}.pack-opening .card-extra{font-size:8px}.pack-opening .portrait{height:100px}.pack-opening .dialog-head h2{font-size:16px}.reveal-burst{font-size:65px}.grade-odds{gap:5px}.grade-odds>div{padding:10px 3px}.grade-odds strong{font-size:9px}}
@media(prefers-reduced-motion:reduce){.pack-opening .reveal-burst,.pack-opening .reveal-slot:after{display:none}.pack-opening .pack-rays{animation:none;opacity:.4}.pack-opening .player-card{transform:none;opacity:1;filter:none}}
@media(min-width:741px){.pack-opening .portrait{height:130px}}


/* Live server controls use the V2 components; account and game logic stay shared. */
:root{--accent:var(--c-blue-41);--bg:var(--c-gray-96);--lime:var(--c-green-91);font-family:'Pretendard Variable','Malgun Gothic',system-ui,sans-serif}
body{padding-bottom:calc(72px + env(safe-area-inset-bottom));font-size:14px;line-height:1.5}button,select,input{font:inherit}button,a,input,select,summary{touch-action:manipulation}button{min-width:44px}button:disabled{transform:none!important}input,select{width:100%;min-height:44px;border:1px solid var(--c-slate-85);border-radius:9px;padding:9px 12px;background:var(--c-white);color:var(--ink);font-size:14px}input[type=checkbox]{width:20px;min-height:20px;accent-color:var(--blue)}label{display:flex;flex-direction:column;gap:7px;color:var(--muted);font-size:12px}a{color:var(--blue)}[hidden]{display:none!important}h1{font-size:28px;line-height:1.25}h2{font-size:21px}h3{font-size:17px}p{line-height:1.65}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid color-mix(in srgb,var(--c-blue-41) 43.9%,transparent);outline-offset:2px}
.btn{line-height:1.35}.btn:not(.primary):not(.danger):not(.ghost){background:var(--c-white);border-color:var(--c-slate-85);color:var(--navy)}.btn.block,.block{width:100%}.text-btn{border:0;background:transparent;color:var(--blue);font-size:12px;font-weight:700;min-height:44px;padding:8px 0;text-align:left}.icon-btn{width:44px;height:44px;border:0;border-radius:10px;background:var(--c-gray-96);color:var(--navy);font-size:20px}.actions{display:flex;gap:8px;margin-top:12px}.actions>*{flex:1}.help,.muted{color:var(--muted);font-size:12px;line-height:1.7}.help{margin:10px 0}.error,.invalid,.deck-validation{color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))}.error:not(:empty){padding:10px;background:var(--c-red-96);border-radius:8px}.empty{text-align:center;padding:30px 16px;color:var(--muted)}.empty .btn{display:flex;margin:16px auto 0;max-width:300px}.loading{padding:20vh 20px;text-align:center;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:10px;z-index:500;background:var(--c-white);padding:12px}.skip-link:focus{top:10px}.topbar{max-width:none}.topbar>div{max-width:1180px}.topbar .save-status{font-size:11px}.brand-tag{font-weight:700!important;color:var(--lime)!important}.page-title{margin:15px 0 22px}.page-title h1{margin:7px 0}.page-title p{color:var(--muted);font-size:13px}.eyebrow,.kicker{font-size:10px;color:var(--muted);font-weight:600;letter-spacing:.07em}.section-heading,.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}.section-heading h2{font-size:18px}.section-heading small,.section-title>span{color:var(--muted);font-size:11px}.section-heading select{max-width:160px}.product-nav{height:calc(72px + env(safe-area-inset-bottom))}.product-nav button{position:relative;min-height:64px}.product-nav svg{width:22px;height:22px}.notification-dot{position:absolute;width:5px;height:5px;background:var(--danger);border-radius:50%}.team-logo{width:48px;height:48px;object-fit:contain;flex-shrink:0}.team-logo.small{width:34px;height:34px}.player-art{object-fit:contain;object-position:center bottom;padding:0;background:var(--c-gray-96)}.grade-badge{font-size:10px;letter-spacing:0;background:var(--grade-bg,var(--c-gray-96));color:var(--grade-color,color-mix(in srgb,var(--p-ink) 60%,var(--p-white)));border-color:var(--grade-color,color-mix(in srgb,var(--p-ink) 32%,var(--p-white)))}.grade-r{--grade-bg:color-mix(in srgb,var(--p-g-r) 8%,var(--p-white));--grade-color:var(--c-blue-41)}.grade-sr{--grade-bg:color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white));--grade-color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink))}.grade-ssr{--grade-bg:var(--c-gold-96);--grade-color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}
.login-page{min-height:calc(100dvh - 64px);padding-bottom:60px}.login-card form{display:grid;gap:16px}.login-card input{min-width:0}.login-card>small{font-size:11px}.login-brand h1{line-height:.98}.setup-steps{list-style:none;display:flex;justify-content:center;gap:24px;padding:0;margin:0 0 22px;color:var(--muted);font-size:11px}.setup-steps li{display:flex;gap:8px;align-items:center}.setup-steps b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--c-slate-85);background:var(--c-white)}.setup-steps .active{color:var(--navy);font-weight:600}.setup-steps .active b{background:var(--navy);color:var(--c-white);border-color:var(--navy)}.setup-steps .complete b{background:var(--blue);color:var(--c-white)}.team-grid{margin-top:24px}.team-grid button:last-child{grid-column:auto}.starter-preview .eyebrow{color:var(--c-slate-80)}.starter-preview p{margin-top:5px}.important-note span{font-size:12px}.ready-page{max-width:760px;margin:auto}.ready-deck{margin-top:12px}.ready-deck p{font-size:12px;margin-top:8px}.ready-deck .starter button{min-height:44px}.deck-storage{margin:10px 0}.deck-storage>summary{min-height:44px;font-size:12px;cursor:pointer;display:flex;align-items:center}.saved-decks{margin:10px 0}.deck-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.deck-slot{min-width:0;border:1px solid var(--line);padding:12px;border-radius:10px;background:var(--c-white);text-align:left}.deck-slot.selected{border:2px solid var(--blue);background:var(--c-blue-96)}.deck-slot small,.deck-slot strong,.deck-slot span{display:block;overflow-wrap:anywhere}.deck-slot small,.deck-slot span{font-size:10px;color:var(--muted)}.deck-slot strong{font-size:13px;margin:5px 0}.deck-save-target{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.slot-panel{margin-top:10px}.deck-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px}.deck-toolbar>span{font-size:11px;color:var(--muted)}.slot-switch button{width:44px;height:44px}.tabs button{min-width:0;flex:1;font-size:13px}.deck-editor{min-width:0}.deck-layout>aside{min-width:0}.deck-status h2{overflow-wrap:anywhere}.assist-note{color:var(--muted);font-size:11px;margin:5px 0 12px}.lineup-row{grid-template-columns:44px 22px 40px minmax(70px,1fr) auto auto 88px;gap:6px}.lineup-row .player-art{width:40px;height:48px}.drag-handle{width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--c-gray-61);touch-action:none;cursor:grab}.lineup-name{border:0;background:transparent;padding:4px 0;min-height:44px;text-align:left}.lineup-name b{font-size:13px}.lineup-name span{font-size:10px}.lineup-row.drop-target{box-shadow:0 -3px var(--blue);background:var(--c-blue-96)}.bench-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.bench-chips button{min-height:44px;border:1px solid var(--line);background:var(--c-white);border-radius:8px;font-size:12px;padding:6px 9px}.bench-chips button.active{border-color:var(--blue);background:var(--c-blue-96);color:var(--blue)}.bench-chips small{color:var(--muted);font-size:10px}.roster-groups>div>span{font-size:10px;display:block;margin-top:6px}.save-dock{bottom:calc(72px + env(safe-area-inset-bottom))}.valid-dot,.invalid-dot{width:8px;height:8px;background:var(--p-green);border-radius:50%}.invalid-dot{background:var(--danger)}.save-dock>div>span{gap:3px}.make-deck .save-dock b{font-size:12px}.tactic-section+.tactic-section{margin-top:25px}.deck-validation:empty{display:none}.deck-validation{font-size:12px;background:var(--c-gold-98);padding:10px;border-radius:8px;margin-bottom:10px}.counter-row{grid-template-columns:28px 1fr auto;gap:8px}.counter-row small{font-size:10px}.counter input{width:32px;min-width:0;min-height:44px;border:0;border-radius:0;padding:0;text-align:center;background:transparent;font-weight:600;appearance:textfield}.counter input::-webkit-inner-spin-button{appearance:none}.search-inline{display:flex;gap:5px}.search-inline input{min-width:0;width:100%}.search-inline .btn{padding:0 12px}.chips button{min-height:44px}.owned-player{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--c-white)}.owned-player .player-card{border:0;border-radius:0;width:100%;display:block}.owned-player>.btn{border-radius:0;border:0;border-top:1px solid var(--line)}.player-photo{height:100%;max-width:100%;object-fit:contain;object-position:center bottom}.player-card-art{padding:8px 5px 0;height:160px}.player-card-art .grade{z-index:1}.card-club{position:absolute;width:28px;height:28px;object-fit:contain;right:7px;bottom:7px;background:color-mix(in srgb,var(--c-white) 80%,transparent);border-radius:5px;padding:2px}.player-card{width:100%;color:var(--ink)}.player-card-info>b{font-size:16px}.player-card-info>span{font-size:10px}.player-card-info div{font-size:11px;gap:6px}.card-extra{display:block;margin-top:8px;color:var(--muted);font-size:11px}.player-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.player-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}
.synergy-panel{padding:16px}.collapse-title{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:8px}.collapse-title::-webkit-details-marker{display:none}.collapse-title h2{font-size:17px}.collapse-title>span{font-size:10px;color:var(--muted)}.team-count{display:flex;align-items:center;gap:10px;margin:18px 0 12px}.team-monogram{width:36px;height:36px;border-radius:50%;background:var(--blue);color:var(--c-white);display:grid;place-items:center;font-weight:600}.team-count>div:nth-child(2){flex:1}.team-count small{display:block;font-size:10px;color:var(--muted)}.team-count strong{font-size:13px}.milestones{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.milestones>div{text-align:center;background:var(--c-gray-96);border-radius:8px;padding:8px 2px}.milestones span,.milestones b,.milestones small{display:block}.milestones span{color:var(--blue)}.milestones b{font-size:12px}.milestones small{font-size:9px;color:var(--muted)}.milestones .done{background:var(--c-blue-96)}.next-level{display:flex;flex-wrap:wrap;gap:6px;justify-content:space-between;margin:12px 0;font-size:10px;color:var(--muted)}.next-level i{display:block;width:100%;height:4px;border-radius:3px;background:var(--c-gray-91);overflow:hidden}.next-level em{display:block;height:100%;background:var(--blue)}.season-bonus{display:flex;gap:8px;background:var(--c-green-97);border:1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white));border-radius:10px;padding:10px}.season-bonus>span{color:var(--p-green)}.season-bonus strong,.season-bonus small{display:block;font-size:11px}.season-bonus small{font-size:10px;color:var(--muted);margin-top:3px}.bonus-result{margin:12px 0;padding:10px;background:var(--c-blue-96);border-radius:8px}.bonus-result>span{font-size:10px;color:var(--muted)}.bonus-result>div{display:flex;gap:7px;margin-top:6px;font-size:11px}.bonus-result>div strong{color:var(--blue)}.player-breakdown h3{font-size:13px;margin:15px 0 6px}.player-breakdown summary{list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:44px;font-size:12px;cursor:pointer;border-bottom:1px solid var(--line)}.player-breakdown summary small{font-size:10px;color:var(--muted);margin-left:6px}.player-breakdown summary em{font-size:9px;color:var(--muted);font-style:normal}.player-breakdown p{font-size:11px;color:var(--blue);padding:10px;background:var(--c-blue-96);border-radius:8px}.synergy-panel .rules-note{font-size:10px;color:var(--muted)}.report-ratios{margin-top:14px}.report-overview{border:0;padding:0}.report-overview .section-title{margin-top:0}.report-body{padding:0}.make-deck .report-verdict strong{font-size:14px}.make-deck .report-verdict p,.make-deck .report-note{font-size:11px}.make-deck .ratio-row strong{font-size:12px}
.in-match{background:var(--navy)}.in-match>.topbar,.in-match #app>.topbar{max-width:1180px;margin:auto}.match-page{min-height:calc(100dvh - 136px)}.match-main{padding-top:12px}.player-side{border:0;background:transparent;text-align:left;color:var(--ink)}.player-side.pitcher{flex-direction:row-reverse}.player-side .eyebrow{font-size:10px}.stamina i{width:auto}.stamina:has(.low) i{background:var(--p-red)}.fatigue.low{color:var(--p-red)}.base-button{border:0;background:transparent;min-height:44px;padding:0;color:var(--ink);flex-shrink:0}.diamond.base-button{width:72px}.diamond.base-button span{left:0;width:72px;bottom:-2px}.hand-note{font-size:10px;color:var(--muted)}.tactic-card:disabled{opacity:.42}.tactic-card b{overflow-wrap:anywhere}.phase-strip b{display:block;font-weight:600}.selected-detail p{font-size:11px}.selection-copy button{font-size:11px}.prepare-panel p{font-size:12px;color:var(--muted);margin-top:8px}.prepare-panel .btn{font-size:12px;padding:9px}.prepare-panel>.btn{margin-top:8px}.action-dock{margin-top:0}.timeline{max-height:420px;overflow:auto}.timeline b{font-size:12px;line-height:1.65;font-weight:600}.result-links{display:flex;justify-content:center;gap:25px}.result-animation{height:78px;overflow:hidden;display:flex;justify-content:center}.result-animation>.diamond{width:110px;height:90px}.result-animation svg{height:86px;width:100px}.result-animation .base-name{display:none}.ball{fill:var(--c-white);stroke:var(--c-slate-68);animation:hit-ball 1.4s ease-out both}.runner-trail{filter:drop-shadow(0 0 2px color-mix(in srgb,var(--p-slate) 55%,var(--p-ink)))}@keyframes hit-ball{from{transform:translate(0,0)}to{transform:translate(var(--ball-x),var(--ball-y))}}.result-call p{padding:0 8px}.plate-result{margin-top:8px}.record-summary{grid-template-columns:repeat(3,1fr);margin-bottom:15px}.record-list article{display:flex;align-items:center;gap:14px;min-height:80px;border-bottom:1px solid var(--line)}.record-list article:last-child{border:0}.record-list article>div{flex:1}.record-list strong{font-size:14px}.record-list small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.record-list article>b{font-size:12px;color:var(--blue)}.record-result{padding:6px 10px;border-radius:6px;background:color-mix(in srgb,var(--p-green) 16%,var(--p-white));font-size:12px;color:var(--p-green)}.record-result.loss{background:color-mix(in srgb,var(--p-red) 8%,var(--p-white));color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))}.record-result.draw{background:var(--c-gray-96);color:var(--c-slate-56)}
.pack-hero .pack-object>strong{font-size:28px;line-height:1;margin:auto 0;color:var(--navy)}.pack-hero .btn.primary{background:var(--lime);color:var(--navy)}.pack-hero>div:last-child>small{font-size:11px;color:var(--c-slate-80)}.pack-hero .eyebrow{color:var(--c-slate-80)}.pack-odds{margin:15px 0;border:1px solid var(--line);background:var(--c-white);border-radius:10px;padding:0 14px}.pack-odds summary{min-height:48px;display:flex;align-items:center;cursor:pointer;font-size:12px}.pack-odds p{font-size:11px;color:var(--muted);margin:12px 0}.grade-odds>div{background:var(--c-gray-96);color:var(--ink)}.grade-odds strong{font-size:11px}.collection-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.unowned{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:var(--c-gray-91);color:var(--c-slate-49);border:1px dashed var(--c-slate-82);border-radius:11px;min-height:210px}.unowned>img{width:44px;height:44px;object-fit:contain;opacity:.4;filter:grayscale(1)}.unowned strong{font-size:13px}.unowned>span:last-child{font-size:10px}.collection-progress{margin-top:18px}.trade-latest{margin:12px 0}.exchange-shop{max-width:100%;margin:auto}.redemption-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.redemption-card .player-card{display:block}.trade-preview{color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink))}.trade-player .grade{margin:0}.exchange-rates .grade{vertical-align:middle}
dialog{width:min(620px,calc(100% - 32px));max-height:90dvh;margin:auto;border:1px solid var(--line);border-radius:18px;background:var(--c-white);color:var(--ink);padding:22px;box-shadow:0 20px 90px color-mix(in srgb,var(--p-navy) 26.7%,transparent);overflow:auto}dialog::backdrop{background:color-mix(in srgb,color-mix(in srgb,var(--p-navy) 55%,var(--p-ink)) 65.1%,transparent);backdrop-filter:blur(3px)}.dialog-head{position:sticky;top:-22px;z-index:3;background:inherit;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 0 12px;margin-bottom:12px;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:19px}.dialog-head+.help{margin-top:4px}dialog label{margin:12px 0}dialog>.btn{margin-top:10px}dialog h3{font-size:16px;margin:16px 0 8px}.player-detail-top{display:flex;align-items:center;gap:16px}.player-detail-top>img{width:112px;height:144px;object-fit:contain;object-position:center bottom;background:var(--c-gray-96);border-radius:12px}.player-detail-top .eyebrow{font-size:11px}.stat-grid{margin:18px 0}.stat-grid>div{border:1px solid var(--line);border-radius:9px;padding:12px;text-align:center}.stat-grid small{display:block;color:var(--muted);font-size:11px}.stat-grid strong{font-size:22px}.score-table{width:100%;border-collapse:collapse;margin:16px 0;text-align:center;font-size:13px}.score-table td,.score-table th{padding:10px 4px;border-bottom:1px solid var(--line)}.score-table th{color:var(--muted);font-size:11px}.probabilities{display:grid;grid-template-columns:1fr 1fr;gap:6px}.probabilities>div{display:flex;justify-content:space-between;padding:8px;background:var(--c-gray-96);border-radius:7px;font-size:12px}.costs{display:grid;grid-template-columns:1fr 1fr;gap:7px}.costs label{display:flex;flex-direction:row;align-items:center;min-height:44px;background:var(--c-gray-96);padding:7px;border-radius:8px}.pack-reveal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.pack-opening .player-card-info{color:var(--ink)}.pack-opening .player-card-art{height:140px}.pack-opening .player-card-info>b{font-size:15px}.pack-opening .card-extra{font-size:10px}.pack-opening .dialog-head{background:var(--c-navy-15)}.pack-celebration h3{margin:10px 0}.pack-opening .btn.primary{background:var(--lime);color:var(--navy)}#toast{position:fixed;z-index:600;bottom:calc(155px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,12px);width:max-content;max-width:calc(100% - 32px);border-radius:10px;background:color-mix(in srgb,var(--c-navy-15) 94.9%,transparent);color:var(--c-white);padding:12px 18px;font-size:12px;opacity:0;pointer-events:none;transition:.2s}#toast.on{transform:translate(-50%,0);opacity:1}
@media(min-width:900px){.in-match #app>.topbar{padding:0 18px}.match-main{grid-template-columns:minmax(0,760px) minmax(250px,320px)}.match-aside{min-width:0}.topbar{padding-left:max(20px,calc((100% - 1120px)/2));padding-right:max(20px,calc((100% - 1120px)/2))}.match-core .versus-card{margin-top:0}.deck-layout{grid-template-columns:minmax(0,1fr) 300px}.deck-layout>aside{position:sticky;top:16px}}
@media(max-width:1000px){.lineup-row{grid-template-columns:44px 20px 36px minmax(70px,1fr) auto 88px}.lineup-row>.grade{display:none}.deck-layout{grid-template-columns:minmax(0,1fr) 270px}.collection-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}.product-nav{height:calc(66px + env(safe-area-inset-bottom))}.deck-layout{display:block}.page-wrap:has(.make-deck){padding-bottom:160px}.topbar{height:54px;padding:0 14px}.setup-steps{gap:15px;font-size:10px}.deck-status{padding:15px 14px}.deck-status h2{font-size:21px}.deck-status p{font-size:11px}.slot-switch{gap:0;padding:2px}.slot-switch button{width:44px}.deck-toolbar>span{max-width:53%;font-size:10px}.deck-toolbar .text-btn{font-size:11px}.deck-slots{gap:5px}.deck-slot{padding:9px}.save-dock{bottom:calc(66px + env(safe-area-inset-bottom));padding:8px 12px;gap:8px}.save-dock>div>span{display:flex}.save-dock b:not(.dock-ovr>b){font-size:11px!important}.save-dock>.btn{font-size:12px;flex:0 0 auto;padding:0 14px}.save-dock small{display:none}.lineup-row{grid-template-columns:44px 18px 32px minmax(65px,1fr) 31px 88px;gap:3px;min-height:64px}.lineup-row .player-art{width:32px;height:42px}.lineup-name b{font-size:12px}.lineup-name span{font-size:9px}.position{padding:4px;font-size:9px}.move-buttons button{width:44px;height:44px}.lineup-row>.grade{display:none}.roster-groups{grid-template-columns:1fr}.counter-row{grid-template-columns:24px minmax(0,1fr) auto;gap:6px}.counter-row small{font-size:9px}.counter-row b{font-size:12px}.counter input{width:28px}.counter button{width:44px}.tabs button{padding:0 7px;min-width:0}.tabs.pack-tabs button{min-width:0}.search-tools input{min-width:0}.player-grid.compact,.player-grid,.collection-grid,.redemption-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.player-card-art{height:140px}.player-card-info>b{font-size:15px}.player-card-info div{font-size:10px}.redemption-action>strong{font-size:16px}.synergy-panel{margin-top:12px}.deck-save-target{grid-template-columns:1fr}.ready-deck h2{font-size:21px}.opponent-list{grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible}.opponent-list button{min-width:0;min-height:72px}.opponent-list span{font-size:10px}.opponent-list .team-logo{width:30px;height:30px}.pack-hero .pack-object>strong{font-size:23px}.collection-progress{padding:14px}.record-list strong{font-size:13px}.record-list article{gap:9px}.record-list small{font-size:10px}.match-main{padding-top:10px}.tactic-card b{white-space:normal;overflow:visible;text-overflow:clip}.selected-detail p{font-size:10px}.hand-head b{font-size:13px}.scoreboard .team-logo{width:40px;height:40px}.scoreboard .team-score{gap:5px}.selected-detail{min-height:46px}.action-dock{padding:8px}.dock-buttons .btn{padding:0 10px;font-size:12px}.selection-copy{min-width:82px}.selection-copy b{font-size:12px}.selection-copy button{font-size:10px}.prepare-panel .actions{gap:6px}.prepare-panel .btn{font-size:12px}.pack-opening .player-card-info{padding:7px}.pack-opening .player-card-info>b{font-size:13px}.pack-opening .player-card-info>span{font-size:9px}.pack-opening .player-card-info div{font-size:9px;flex-direction:column;gap:2px}.pack-opening .card-extra{font-size:9px}dialog{width:100%;max-height:90dvh;margin:auto 0 0;border-radius:18px 18px 0 0;padding:18px 14px calc(18px + env(safe-area-inset-bottom))}.dialog-head{top:-18px;padding-bottom:8px}.dialog-head h2{font-size:18px}.player-detail-top{gap:12px}.player-detail-top>img{width:90px;height:124px}.login-page{min-height:calc(100dvh - 54px);padding:25px 18px 40px}.login-brand h1{font-size:48px}.login-brand p{margin-top:15px}.login-brand{padding-bottom:20px}}
@media(max-height:720px) and (max-width:500px){.in-match #app>.topbar{height:40px;}.in-match .topbar b{font-size:13px}.in-match .topbar .save-status{display:none}.in-match .topbar button{height:40px}.scoreboard{min-height:66px}.versus-card{min-height:85px}.tactic-card{min-height:84px}.hand-head b{font-size:12px}.selected-detail{min-height:42px}.action-dock{min-height:60px}.prepare-panel{padding:9px}.prepare-panel .prepare-title b{font-size:13px}.prepare-panel p{margin-top:5px;font-size:11px}.prepare-panel .actions{margin-top:8px}.prepare-panel>.btn{margin-top:6px}.player-side span:last-child{font-size:9px}.result-call{padding-top:10px}.result-call b{font-size:23px}.result-animation{height:62px}}
@media(prefers-reduced-motion:reduce){.ball,.runner-trail{display:none}}
.aux-sheet { width: min(680px, 100%); max-height: 90dvh; background: var(--paper); border-radius: 18px 18px 12px 12px; box-shadow: 0 24px 70px color-mix(in srgb,var(--c-black) 53.3%,transparent); display: flex; flex-direction: column; overflow: hidden; }
.sheet-header { min-height: 70px; flex: 0 0 auto; background: var(--navy); color: var(--c-white); padding: 12px 14px 12px 20px; display: flex; justify-content: space-between; align-items: center; }
.sheet-header > div { display: flex; flex-direction: column; gap: 2px; }.sheet-header span { color: color-mix(in srgb,var(--p-slate) 60%,var(--p-white)); font-size: 9px; letter-spacing: .07em; }.sheet-header h2 { font-size: 18px; }
.sheet-close { position: sticky; top: 0; width: 44px; height: 44px; flex: 0 0 auto; border: 1px solid color-mix(in srgb,var(--c-white) 14.9%,transparent); border-radius: 10px; background: color-mix(in srgb,var(--c-white) 4.7%,transparent); color: var(--c-white); display: grid; place-items: center; }
.sheet-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px; }
.sheet-actions { z-index: 2; justify-content: flex-end; }
.sheet-actions .btn { min-width: 110px; }.sheet-actions.three .btn { flex: 1; min-width: 0; }
.detail-identity { background: var(--c-white); border: 1px solid var(--line); border-radius: 13px; padding: 14px; display: flex; gap: 16px; align-items: center; }
.replaceable-photo { width: 150px; height: 185px; flex: 0 0 auto; background: var(--c-gray-91); border-radius: 11px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; }
.replaceable-photo .player-art { width: 100%; height: 157px; border-radius: 0; }
.replaceable-photo > span { background: var(--navy); color: var(--c-white); min-height: 28px; display: grid; place-items: center; font-size: 8px; }
.detail-identity > div:last-child { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.detail-identity h2 { font-size: 25px; }.detail-identity p, .detail-identity small { color: var(--muted); font-size: 10px; }
.detail-section {  background: var(--c-white); border: 1px solid var(--line); border-radius: 11px; padding: 14px; }
.detail-section .section-head { margin-bottom: 10px; }.detail-section .section-head span { color: var(--muted); font-size: 9px; }
.stat-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }.stat-grid div { background: var(--c-gray-96); border-radius: 8px; padding: 9px; display: flex; flex-direction: column; }.stat-grid span { color: var(--muted); font-size: 9px; }.stat-grid b { font-size: 17px; }
.synergy-breakdown { margin-top: 10px; padding: 12px 14px; background: var(--c-green-97); border: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); border-radius: 10px; display: grid; grid-template-columns: 1fr auto; gap: 3px 10px; }.synergy-breakdown span { color: var(--p-green); font-size: 9px; font-weight:600; }.synergy-breakdown b { font-size: 13px; }.synergy-breakdown strong { color: var(--p-green); }.synergy-breakdown small { grid-column: 1 / -1; color: var(--muted); font-size: 8px; }
.trait { margin-top: 8px; color: var(--c-slate-41); font-size: 10px; line-height: 1.5; }
.real-record-note { margin: 10px 0; padding: 12px; border: 1px dashed var(--c-slate-74); border-radius: 9px; display: flex; flex-direction: column; gap: 3px; }.real-record-note b { font-size: 11px; }.real-record-note span { color: var(--muted); font-size: 9px; }
.player-detail > .btn { width: 100%; }
.current-player > span, .substitution-sheet > h3, .pitcher-sheet > h3 { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; font-weight:600; }
.current-player > div, .pitcher-current { background: var(--navy); color: var(--c-white); border-radius: 11px; padding: 11px; display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.current-player .player-art, .pitcher-current .player-art { width: 50px; height: 58px; }.current-player b { font-size: 13px; }.current-player small { display: block; color: var(--c-slate-74); font-size: 9px; margin-top: 4px; }
.candidate-list { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.candidate-list button { min-height: 70px; border: 1px solid var(--line); background: var(--c-white); border-radius: 9px; padding: 8px; display: grid; grid-template-columns: 46px 1fr 22px; align-items: center; gap: 8px; text-align: left; }
.candidate-list button.selected { border: 2px solid var(--blue); background: var(--c-gray-96); }.candidate-list .player-art { width: 44px; height: 52px; }.candidate-list button > div { display: flex; flex-direction: column; align-items: flex-start; }.candidate-list b { font-size: 11px; }.candidate-list span, .candidate-list small { color: var(--muted); font-size: 8px; }.candidate-list button > svg { opacity: 0; color: var(--blue); }.candidate-list button.selected > svg { opacity: 1; }
.comparison { margin-top: 10px; padding: 12px; background: var(--c-white); border: 1px solid var(--line); border-radius: 9px; }.comparison > span { color: var(--muted); font-size: 9px; }.comparison div { display: flex; align-items: center; gap: 12px; margin: 5px 0; }.comparison div i { color: var(--blue); font-style: normal; }.comparison small { color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); font-size: 9px; }
.segmented { display: grid; grid-template-columns: 1fr 1fr; background: var(--c-gray-91); padding: 3px; border-radius: 10px; margin-bottom: 10px; }.segmented button { min-height: 44px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font-weight:600; }.segmented button.active { background: var(--c-white); color: var(--blue); box-shadow: 0 2px 7px color-mix(in srgb,var(--c-navy-15) 7.8%,transparent); }
.pitcher-current > div { display: flex; flex-direction: column; align-items: flex-start; }.pitcher-current span { color: var(--c-slate-74); font-size: 9px; }.pitcher-current b { font-size: 14px; }.pitcher-current p { color: var(--lime); font-size: 10px; margin-top: 3px; }
.candidate-list.compact { grid-template-columns: 1fr; }
.emergency-rule { background: var(--c-gold-96-2); border: 1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white)); color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); border-radius: 10px; padding: 11px; display: flex; gap: 9px; }.emergency-rule svg { flex: 0 0 auto; }.emergency-rule div { display: flex; flex-direction: column; }.emergency-rule b { font-size: 11px; }.emergency-rule span { font-size: 9px; line-height: 1.45; }
.cost-progress { margin: 12px 0 8px; display: flex; justify-content: space-between; align-items: center; }.cost-progress b { font-size: 12px; }.cost-progress span { display: flex; gap: 5px; }.cost-progress i { width: 20px; height: 6px; background: var(--c-gray-88); border-radius: 5px; }.cost-progress i.on { background: var(--blue); }
.cost-card-grid { display: grid; gap: 6px; }.cost-card-grid button { position: relative; min-height: 90px; border: 1px solid var(--line); background: var(--c-white); border-radius: 9px; padding: 9px; display: flex; flex-direction: column; justify-content: space-between; text-align: left; }.cost-card-grid button.selected { border: 2px solid var(--blue); background: var(--c-blue-96); }.cost-card-grid span { color: var(--muted); font-size: 8px; }.cost-card-grid b { font-size: 10px; }.cost-card-grid svg { position: absolute; right: 7px; top: 7px; color: var(--blue); }
.unsaved-banner { background: var(--c-gold-96-2); border: 1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white)); color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); border-radius: 9px; padding: 11px; display: flex; flex-direction: column; }.unsaved-banner span { font-size: 11px; font-weight:600; }.unsaved-banner b { font-size: 9px; margin-top: 3px; }
.rename-field { display: flex; flex-direction: column; gap: 6px; margin: 13px 0; color: var(--muted); font-size: 9px; font-weight:600; }.rename-field > div { display: flex; gap: 7px; }.rename-field input { min-width: 0; flex: 1; height: 44px; border: 1px solid var(--c-slate-85); border-radius: 9px; background: var(--c-white); padding: 0 11px; }.rename-field .btn { min-height: 44px; }
.slot-list { display: flex; flex-direction: column; gap: 7px; }.slot-list > div { min-height: 68px; background: var(--c-white); border: 1px solid var(--line); border-radius: 10px; padding: 9px; display: grid; grid-template-columns: 34px 1fr auto; gap: 9px; align-items: center; }.slot-list > div.active { border: 2px solid var(--blue); }.slot-number { width: 30px; height: 30px; border-radius: 8px; background: var(--navy); color: var(--c-white); display: grid; place-items: center; font-weight:700; }.slot-list > div > div:nth-child(2) { display: flex; flex-direction: column; }.slot-list b { font-size: 11px; }.slot-list div span { color: var(--muted); font-size: 8px; }
.slot-actions { display: flex; gap: 5px; }.slot-actions button { min-height: 44px; border: 1px solid var(--c-gray-88); border-radius: 8px; background: var(--c-white); padding: 0 10px; font-size: 9px; font-weight: 700; }
.account-card { background: var(--c-white); border: 1px solid var(--line); border-radius: 11px; padding: 12px; display: grid; grid-template-columns: 44px 1fr auto; gap: 10px; align-items: center; }.account-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--navy); color: var(--lime); display: grid; place-items: center; font-weight:700; }.account-card div { display: flex; flex-direction: column; }.account-card b { font-size: 12px; }.account-card div span { color: var(--muted); font-size: 9px; }.account-card button { min-height: 44px; border: 0; background: transparent; color: var(--blue); font-size: 9px; font-weight:600; }
.system-state { margin: 10px 0; border-radius: 10px; padding: 12px; display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: 8px; }.system-state.error { background: var(--c-red-96); border: 1px solid color-mix(in srgb,var(--p-red) 32%,var(--p-white)); color: color-mix(in srgb,var(--p-red) 80%,var(--p-ink)); }.system-state.success { background: var(--c-green-97); border: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); color: var(--p-green); }.system-state > div { display: flex; flex-direction: column; }.system-state b { font-size: 11px; }.system-state span { font-size: 9px; line-height: 1.4; }.system-state button { min-height: 44px; border: 1px solid currentColor; border-radius: 8px; background: var(--c-white); color: inherit; font-size: 9px; font-weight:600; padding: 0 10px; }
.settings-list { background: var(--c-white); border: 1px solid var(--line); border-radius: 10px; margin-bottom: 10px; }.settings-list button { width: 100%; min-height: 52px; border: 0; border-bottom: 1px solid var(--c-gray-96); background: transparent; padding: 0 12px; display: grid; grid-template-columns: 1fr auto 20px; align-items: center; text-align: left; }.settings-list button:last-child { border-bottom: 0; }.settings-list span { font-size: 11px; }.settings-list b { color: var(--muted); font-size: 9px; }.account-sheet > .btn { width: 100%; }.demo-note { display: block; margin-top: 8px; color: var(--muted); font-size: 8px; text-align: center; }
.result-switch { display: flex; justify-content: center; gap: 5px; margin-bottom: 10px; }.result-switch button { min-width: 70px; min-height: 44px; border: 1px solid var(--line); background: var(--c-white); border-radius: 999px; font-size: 10px; font-weight:600; }.result-switch button.active { background: var(--navy); color: var(--c-white); border-color: var(--navy); }
.final-call { border-radius: 13px; background: var(--navy); color: var(--c-white); padding: 18px; text-align: center; }.final-call > span { color: var(--c-slate-68); font-size: 8px; letter-spacing: .15em; }.final-call h2 { color: var(--lime); font-size: 30px; margin: 3px 0 14px; }.final-call.lose h2 { color: color-mix(in srgb,var(--p-red) 60%,var(--p-white)); }.final-call.draw h2 { color: var(--c-slate-85); }.final-call > div { display: grid; grid-template-columns: 42px 1fr auto 1fr 42px; align-items: center; gap: 8px; }.final-call > div b { display: flex; justify-content: space-between; align-items: center; font-size: 12px; }.final-call > div strong { font-size: 27px; }.final-call > div i { color: var(--p-g-n); font-style: normal; }
.inning-table { margin-top: 10px; background: var(--c-white); border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }.inning-table > div { min-height: 34px; display: grid; grid-template-columns: 1fr repeat(4, 38px); align-items: center; padding: 0 11px; border-bottom: 1px solid var(--c-gray-96); font-size: 9px; text-align: center; }.inning-table > div:first-child { background: var(--c-gray-96); color: var(--muted); }.inning-table > div:last-child { border-bottom: 0; }.inning-table > div > :first-child { text-align: left; }
.reward-box { margin-top: 10px; border-radius: 10px; background: var(--c-green-97); border: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); padding: 12px; display: grid; grid-template-columns: 1fr auto; gap: 4px; }.reward-box span { color: var(--muted); font-size: 9px; }.reward-box b { color: var(--p-green); font-size: 12px; }.reward-box strong { grid-column: 1 / -1; border-top: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); padding-top: 7px; margin-top: 4px; font-size: 13px; text-align: right; }
.key-record { margin-top: 10px; padding: 11px; background: var(--c-white); border: 1px solid var(--line); border-radius: 9px; }.key-record span { color: var(--muted); font-size: 9px; }.key-record p { font-size: 11px; margin: 4px 0; }.key-record small { color: var(--muted); font-size: 8px; }

/* Native dialog shell for the additional Make support screens. */
.live-sheet{padding:0;overflow:hidden;background:var(--paper);width:min(680px,calc(100% - 32px));max-height:90dvh}.live-sheet[open]{display:flex;flex-direction:column}.live-sheet .dialog-head{position:relative;top:0;margin:0;padding:12px 14px 12px 20px;border:0;background:var(--navy);flex-shrink:0}.live-sheet .sheet-body{padding:16px;min-height:0;overflow:auto}.live-sheet .sheet-body>.btn+.btn{margin-top:8px}.live-sheet .stat-grid{margin:8px 0;grid-template-columns:repeat(auto-fit,minmax(65px,1fr))}.live-sheet .replaceable-photo{object-fit:contain;object-position:center bottom}.live-sheet .synergy-breakdown{display:block}.live-sheet .synergy-breakdown>*{display:block;margin-top:4px}.live-sheet .synergy-breakdown small,.live-sheet .real-record-note span,.live-sheet .trait{font-size:12px}.live-sheet .detail-identity p,.live-sheet .detail-identity small{font-size:12px}.live-sheet .player-detail>.btn{margin-top:12px}.candidate-list .candidate{position:relative;display:flex;align-items:center;flex-direction:row;gap:10px;border:1px solid var(--line);border-radius:10px;background:var(--c-white);padding:10px;margin:0;min-height:75px;cursor:pointer}.candidate:has(input:checked){border:2px solid var(--blue);background:var(--c-blue-96)}.candidate input{width:20px;min-height:20px;accent-color:var(--blue)}.candidate>span{display:flex;flex-direction:column;gap:4px}.candidate b{font-size:13px}.candidate small{font-size:11px}.candidate .grade{display:inline-flex}.cost-card-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.cost-card{border:1px solid var(--line);border-radius:9px;background:var(--c-white);min-height:94px;padding:8px 5px;margin:0;cursor:pointer;gap:5px}.cost-card:has(input:checked){border:2px solid var(--blue);background:var(--c-blue-96)}.cost-card input{width:18px;min-height:18px}.cost-card b{font-size:11px}.cost-card>span{font-size:9px}.cost-card:has(input:disabled){opacity:.45}.emergency-rule{margin-top:12px}.emergency-rule span{font-size:11px}.sheet-body .wallet{margin-top:12px}.tabs{overflow-y:hidden}.deck-status{position:relative;padding-bottom:42px}.deck-status p{position:absolute;left:20px;right:20px;bottom:14px;white-space:nowrap}.deck-status>div:first-child{min-width:0;flex:1}.deck-status h2{font-size:21px}.tabs button.active:after{bottom:0}.pack-opening{max-width:720px}.pack-opening .sheet-body{background:radial-gradient(ellipse at 50% 0,rgba(var(--rarity-rgb),.16),transparent 65%),var(--c-navy-11);color:var(--c-white)}
@media(max-width:760px){.live-sheet{width:100%;margin:auto 0 0;border-radius:18px 18px 0 0}.live-sheet .sheet-body{padding:12px 12px calc(16px + env(safe-area-inset-bottom))}.live-sheet .sheet-header{min-height:66px}.detail-identity{gap:12px;padding:12px}.replaceable-photo{width:110px;height:144px}.detail-identity h2{font-size:22px}.candidate-list{grid-template-columns:1fr}.candidate-list .candidate{min-height:76px}.sheet-actions .btn{min-width:0;font-size:12px}.deck-status p{left:14px;right:14px;font-size:11px}.deck-status h2{font-size:20px}.match-page{min-height:calc(100dvh - 120px)}.pack-opening .player-card-art{height:115px}.save-dock{min-height:64px}.deck-toolbar{min-height:44px}}

html:has(dialog[open]){overflow:hidden}
@media(max-width:760px){dialog.live-sheet{max-width:100%;width:100%;}.deck-status{padding-bottom:42px}}

.gameover-sheet{margin:8px 12px 14px;padding:12px;background:var(--c-white);border:1px solid var(--line);border-radius:14px}.gameover-sheet .score-table{margin:8px 0}.gameover-sheet .score-table td,.gameover-sheet .score-table th{padding:6px 4px}.gameover-sheet .sheet-actions{position:static;background:none;padding:8px 0 0}.gameover-sheet .final-call{padding:12px}.gameover-sheet .final-call h2{font-size:25px;margin-bottom:9px}

/* Figma Make: opponent strategy notes, 2026-10-02. */
.opponent-note-button { display: none; width: calc(100% - 24px); min-height: 44px; margin: 0 12px 7px; border: 1px solid color-mix(in srgb,var(--p-slate) 32%,var(--p-white)); background: var(--c-blue-96); border-radius: 9px; padding: 0 9px; align-items: center; gap: 7px; text-align: left; }
.opponent-note-button > span { display: flex; align-items: center; gap: 5px; color: var(--blue); white-space: nowrap; }.opponent-note-button b { font-size: 10px; }.opponent-note-button small { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--c-slate-42); font-size: 9px; }.opponent-note-button > svg { flex: 0 0 auto; color: var(--muted); }
/* Opponent tactic note */
.opponent-note-panel { color: var(--ink); }
.note-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; padding: 3px; background: var(--c-gray-91); border-radius: 9px; }
.note-tabs button { min-height: 44px; border: 0; border-radius: 7px; background: transparent; color: var(--muted); font-size: 12px; font-weight:600; }
.note-tabs button.active { background: var(--c-white); color: var(--blue); box-shadow: 0 2px 7px color-mix(in srgb,var(--c-navy-15) 7.5%,transparent); }
.note-disclaimer { display: flex; gap: 8px; align-items: flex-start; margin-top: 10px; padding: 11px; background: var(--c-gray-96); border-radius: 8px; color: var(--c-slate-49); }.note-disclaimer svg { flex: 0 0 auto; width: 18px; height: 18px; }.note-disclaimer span { font-size: 11px; line-height: 1.55; }
.observed-recent, .frequency-section, .discard-section { margin-top: 9px; background: var(--c-white); border: 1px solid var(--line); border-radius: 10px; padding: 11px; }
.note-section-title { display: flex; justify-content: space-between; align-items: center; gap: 8px; }.note-section-title > div { display: flex; flex-direction: column; }.note-section-title span { color: var(--muted); font-size: 11px; font-weight:700; letter-spacing: .07em; }.note-section-title b { font-size: 14px; }.note-section-title small { color: var(--muted); font-size: 11px; }.note-section-title > strong { color: var(--blue); font-size: 14px; }
.history-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }.history-chips > span { min-height: 34px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--c-slate-85); background: var(--c-gray-96); border-radius: 999px; padding: 0 11px 0 6px; font-size: 11px; font-weight: 700; }.history-chips i { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--navy); color: var(--c-white); font-size: 11px; font-style: normal; }.history-chips span.cardless { border-style: dashed; background: var(--c-white); color: var(--c-gray-50); }
.small-sample { margin-top: 9px; color: color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)); font-size: 11px; line-height: 1.5; }
.note-empty { margin-top: 10px; min-height: 72px; border: 1px dashed color-mix(in srgb,var(--p-bg) 80%,var(--p-ink)); background: var(--c-gray-96); border-radius: 8px; display: flex; flex-direction: column; justify-content: center; padding: 12px; }.note-empty b { font-size: 12px; }.note-empty span { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.frequency-list { display: flex; flex-direction: column; gap: 11px; margin-top: 12px; }.frequency-list > div > div:first-child { display: flex; justify-content: space-between; align-items: center; }.frequency-list b { font-size: 12px; }.frequency-list span { color: var(--muted); font-size: 11px; }
.frequency-bar { height: 6px; margin-top: 4px; overflow: hidden; background: var(--c-gray-91); border-radius: 6px; }.frequency-bar i { display: block; height: 100%; background: var(--blue); border-radius: inherit; }
.frequency-empty { margin-top: 10px; padding: 13px; color: var(--muted); background: var(--c-gray-96); border-radius: 8px; font-size: 11px; }
.method-note { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--c-gray-96); color: var(--muted); font-size: 11px; line-height: 1.55; }
.discard-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }.discard-chips span { min-height: 34px; display: inline-flex; align-items: center; gap: 6px; border-radius: 7px; padding: 0 11px; background: var(--c-gray-96); font-size: 11px; }.discard-chips b { color: var(--blue); }
.discard-section > p { margin-top: 9px; color: var(--muted); font-size: 11px; line-height: 1.55; }.recycle-note { margin-top: 10px; display: flex; align-items: center; gap: 8px; color: color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink)); }.recycle-note svg { width: 18px; }.recycle-note span { font-size: 11px; line-height: 1.45; }
.desktop-note { margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }.desktop-note > .aside-title { margin-bottom: 9px; }
.note-sheet { max-width: 560px; }

.desktop-note .opponent-note-panel{max-height:510px;overflow-y:auto;overscroll-behavior:contain;padding-right:3px}.note-sheet .note-section-title{flex-wrap:wrap}.note-section-title small{white-space:normal}.opponent-note-panel .note-tabs button:focus-visible{outline-offset:-3px}
@media(max-width:899px){.opponent-note-button{display:flex}}

/* Figma Make season / enhancement expansion */
.enhancement-inline { display: inline-grid; min-width: 25px; min-height: 20px; place-items: center; border: 1px solid var(--c-slate-74); border-radius: 5px; background: var(--c-gray-96); color: var(--blue)!important; font-size: 9px!important; font-weight:700; vertical-align: middle; }
.stat-legend { align-items: center; color: var(--muted); font-size: 8px; }
.stat-legend span { display: flex; align-items: center; gap: 3px; }.stat-legend i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.collection-filters { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 8px; margin-bottom: 8px; }.collection-filters label, .pack-options label { display: flex; flex-direction: column; gap: 4px; color: var(--muted); font-size: 9px; font-weight: 800; }.collection-filters input, .collection-filters select, .pack-options select { width: 100%; height: 44px; border: 1px solid var(--c-slate-85); border-radius: 9px; background: var(--c-white); padding: 0 10px; color: var(--ink); }
.insert-card-summary { display: grid; grid-template-columns: 68px 1fr auto; gap: 12px; align-items: center; padding: 12px; background: var(--c-white); border: 1px solid var(--line); border-radius: 11px; }.insert-card-summary > .player-art { width: 66px; height: 80px; }.insert-card-summary > div { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }.insert-card-summary b { font-size: 15px; }.insert-card-summary b > span { color: var(--blue); }.insert-card-summary p { color: var(--muted); font-size: 9px; }
.entry-rule { margin-top: 9px; padding: 10px; border: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); background: var(--c-green-97); border-radius: 9px; display: flex; gap: 8px; align-items: flex-start; color: color-mix(in srgb,var(--p-green) 55%,var(--p-ink)); }.entry-rule svg { flex: 0 0 auto; }.entry-rule span { font-size: 10px; line-height: 1.5; }
.entry-list-head { margin-top: 15px; }.entry-list-head p { color: var(--muted); font-size: 9px; margin-top: 3px; }.entry-list-head > b { color: var(--blue); font-size: 12px; }
.entry-radio-list { display: flex; flex-direction: column; gap: 7px; max-height: 370px; overflow-y: auto; padding-right: 3px; }.entry-radio-list label { position: relative; min-height: 84px; border: 1px solid var(--line); background: var(--c-white); border-radius: 10px; padding: 9px; display: grid; grid-template-columns: 22px 62px 1fr; align-items: center; gap: 9px; cursor: pointer; }.entry-radio-list label.selected { border: 2px solid var(--blue); background: var(--c-gray-96); }.entry-radio-list label.conflict:not(.selected) { background: var(--c-gray-96); }.entry-radio-list input { position: absolute; opacity: 0; }.radio-mark { width: 20px; height: 20px; border: 2px solid var(--c-slate-74); border-radius: 50%; }.entry-radio-list label.selected .radio-mark { border: 6px solid var(--blue); }
.candidate-photo { width: 60px; height: 70px; border-radius: 8px; overflow: hidden; background: var(--c-gray-91); }.candidate-photo .player-art { width: 100%; height: 100%; border-radius: 0; }.candidate-photo img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.candidate-main { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }.candidate-main > b { font-size: 12px; }.candidate-main > span { color: var(--muted); font-size: 9px; }.candidate-main > small { color: var(--danger); font-size: 8px; }
.enhance-player > .player-art { width: 76px; height: 92px; }.enhance-player > div:nth-child(2) { display: flex; flex-direction: column; align-items: flex-start; }.enhance-player h2 {  font-size: 20px; }.enhance-player h2 span { color: var(--blue); }.enhance-player p {  font-size: 9px; }.enhance-stats { display: flex; flex-direction: column; gap: 5px; }
.enhance-steps {  position: relative; }.enhance-steps:before { content: ""; position: absolute; left: 7px; right: 7px; top: 16px; height: 3px; background: var(--c-gray-88); }.enhance-steps span { z-index: 1; width: 34px; height: 34px; justify-self: center; display: grid; place-items: center; border-radius: 50%; background: var(--c-gray-91); border: 3px solid var(--paper); color: var(--muted); font-size: 10px; font-weight:700; }.enhance-steps span.done { background: var(--blue); color: var(--c-white); }
.enhance-notice { background: var(--c-gold-98); border: 1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white)); border-radius: 10px; padding: 12px; color: color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)); }.enhance-notice > b { font-size: 11px; }.enhance-notice ul { margin: 7px 0 0; padding-left: 17px; }.enhance-notice li { margin: 4px 0; font-size: 9px; line-height: 1.4; }
.enhance-attempt { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 9px; }.enhance-attempt div { padding: 10px; background: var(--c-white); border: 1px solid var(--line); border-radius: 9px; display: flex; flex-direction: column; }.enhance-attempt span { color: var(--muted); font-size: 8px; }.enhance-attempt b { margin-top: 3px; font-size: 12px; }.danger-text { color: var(--danger); }
.enhance-result, .enhance-state { margin-top: 9px; padding: 11px; border-radius: 9px; }.enhance-result { display: flex; gap: 8px; }.enhance-result div { display: flex; flex-direction: column; }.enhance-result b { font-size: 11px; }.enhance-result span { font-size: 9px; }.enhance-result.success, .enhance-state.max { color: color-mix(in srgb,var(--p-green) 80%,var(--p-ink)); background: var(--c-green-97); border: 1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white)); }.enhance-result.failure, .enhance-state.shortage { color: color-mix(in srgb,var(--p-red) 80%,var(--p-ink)); background: var(--c-red-96); border: 1px solid color-mix(in srgb,var(--p-red) 32%,var(--p-white)); }.enhance-state { font-size: 10px; font-weight:600; }
.next-game-note { margin-top: 9px; display: flex; gap: 8px; padding: 10px; background: var(--c-blue-96); border-radius: 9px; color: var(--c-slate-42); }.next-game-note svg { flex: 0 0 auto; }.next-game-note span { font-size: 9px; line-height: 1.5; }
.pack-type-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; margin-bottom: 9px; }.pack-type-grid button { border: 1px solid var(--line); background: var(--c-white); border-radius: 10px; display: flex; flex-direction: column; text-align: left; }.pack-type-grid button.selected { border: 2px solid var(--blue); background: var(--c-blue-96); }.pack-type-grid span { color: var(--blue); font-size: 9px; font-weight: 900; }.pack-type-grid b { margin-top: auto; font-size: 11px; }.pack-type-grid small { margin-top: 3px; color: var(--muted); font-size: 8px; line-height: 1.3; }
.pack-options { margin-bottom: 9px; padding: 11px; background: var(--c-white); border: 1px solid var(--line); border-radius: 10px; }.pack-options label { max-width: 280px; }
.pack-probability { display: flex; flex-direction: column; gap: 3px; padding-top: 10px; border-top: 1px solid color-mix(in srgb,var(--c-white) 13.3%,transparent); color: var(--c-slate-82); }.pack-probability b { color: var(--c-white); font-size: 10px; }.pack-probability span { font-size: 9px; }.pack-probability small { color: var(--c-slate-68); font-size: 8px; line-height: 1.4; }

.rating-base{color:var(--c-slate-42)!important}.rating-good{color:var(--c-blue-41)!important}.rating-strong{color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink))!important}.rating-great{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))!important}.rating-elite{color:var(--p-red)!important}
.stat-value{font-weight:700;font-variant-numeric:tabular-nums}.stat-legend{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0;font-size:12px}
.player-card .player-card-info{background:var(--c-white);color:var(--ink)}.collection-filters .search-inline input{min-width:0}.collection-filters .search-inline .btn{flex-shrink:0;white-space:nowrap}.entry-radio-list label{margin:0;flex-shrink:0}.entry-radio-list input{width:20px;min-height:20px}
.entry-radio-list label:has(input:checked){border:2px solid var(--blue);background:var(--c-gray-96)}.entry-radio-list label:has(input:checked) .radio-mark{border:6px solid var(--blue)}.entry-radio-list label:has(input:focus-visible){outline:3px solid var(--blue);outline-offset:2px}.entry-radio-list label:has(input:disabled){opacity:.5;cursor:not-allowed}
.sheet-actions{display:flex;gap:8px;position:sticky;bottom:-16px;background:var(--paper);padding:12px 0;margin-top:12px}.sheet-actions .btn{flex:1;min-height:44px}
.enhance-notice li,.enhance-player p,.next-game-note,.enhance-attempt span,.candidate-main>span,.pack-type-grid small,.pack-probability span,.pack-probability small{font-size:12px;line-height:1.5}
.candidate-main{min-width:0}.candidate-main>b{font-size:14px}.enhance-result span,.enhance-result b,.enhance-state{font-size:13px}.pack-type-grid b{font-size:14px}.pack-type-grid span{font-size:12px}.pack-probability{margin-top:14px}.collection-filters{margin-top:20px}.collection-filters label{font-size:12px}.collection-filters .search-inline{display:flex}.owned-player>.btn{margin-top:5px}.enhance-player .player-art,.insert-card-summary .player-art{object-fit:contain}.stat-grid small{font-size:11px}
.pack-hero .rating-base,.pack-hero .rating-good,.player-side .rating-base,.player-side .rating-good{color:color-mix(in srgb,var(--p-g-r) 32%,var(--p-white))!important}.player-side .rating-strong{color:color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white))!important}.player-side .rating-great{color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))!important}
@media(max-width:700px){.pack-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-filters{grid-template-columns:1fr 1fr}.collection-filters>label:first-child{grid-column:1/-1}.entry-radio-list{max-height:42dvh}.entry-radio-list label{grid-template-columns:20px 52px minmax(0,1fr);padding:7px;gap:7px}.candidate-photo{width:50px;height:62px}.enhance-player>.player-art{width:60px;height:76px}.enhance-stats{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}.insert-card-summary{grid-template-columns:56px 1fr}.insert-card-summary>.player-art{width:54px;height:64px}}

/* Make V2 pack-art revision; generated raster assets replace the design placeholders. */
.foil-pack{display:block;width:190px;height:auto;aspect-ratio:2/3;object-fit:contain;flex:0 0 auto;border-radius:10px;box-shadow:0 18px 34px color-mix(in srgb,var(--c-black) 33.3%,transparent);background:var(--p-ink)}
.foil-pack.small{width:76px;border-radius:6px;box-shadow:0 7px 14px color-mix(in srgb,var(--c-navy-15) 20.8%,transparent)}
.pack-type-grid button{align-items:center;min-height:210px;padding:10px}
.pack-type-grid button.selected{box-shadow:0 0 0 2px color-mix(in srgb,var(--c-blue-41) 8.2%,transparent)}
.pack-choice-copy{width:100%;display:flex;flex-direction:column;align-items:flex-start;margin-top:10px}
.pack-choice-copy b{margin-top:4px;color:var(--navy)}
.pack-choice-copy small{color:var(--c-slate-36)}
.photo-source{position:absolute;left:6px;bottom:6px;padding:3px 5px;border-radius:4px;background:color-mix(in srgb,var(--c-navy-15) 94.9%,transparent);color:var(--c-white);font-size:10px;line-height:1.4}
.player-card .player-card-info>b{color:var(--navy);line-height:1.45;overflow-wrap:anywhere}
.player-card .card-extra{color:var(--c-slate-36)}
.grade-odds>div>span:not(.grade-badge),.grade-odds small{color:var(--navy)}
@media(max-width:760px){
 .pack-type-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:140px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;padding:3px 3px 10px}
 .pack-type-grid button{scroll-snap-align:start;min-height:210px}
 .foil-pack.small{width:72px}
 .pack-hero{min-height:0;padding:22px 16px;gap:18px}
 .pack-hero>.foil-pack{width:144px}
 .player-card .player-card-info>span,.player-card .player-card-info div,.pack-opening .card-extra{font-size:11px}
 .pack-opening .player-card-info>b{font-size:14px}
}

/* Make V2: match guide, gold abilities and brief, non-blocking phase reveals. */
.match-traits{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:7px 12px 0}
.trait-chip{min-width:0;min-height:44px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));border-radius:9px;padding:5px 9px;display:flex;align-items:center;gap:8px;text-align:left}
.trait-chip>span:first-child{font-size:20px;color:var(--c-orange-49)}.trait-chip>span:last-child{display:flex;flex-wrap:wrap;align-items:center;gap:3px 8px}.trait-chip b{font-size:12px}.trait-chip small{font-size:11px;font-weight:700}.trait-chip.triggered{background:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));box-shadow:0 0 0 2px color-mix(in srgb,var(--p-gold) 18.8%,transparent)}
.trait-power{margin:14px 0;padding:14px;display:flex;gap:14px;align-items:center;border:1px solid color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));border-radius:12px;background:linear-gradient(135deg,var(--c-gold-96-2),color-mix(in srgb,var(--p-gold) 60%,var(--p-white)));color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}
.trait-emblem{width:46px;height:46px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));box-shadow:inset 0 0 0 3px var(--p-gold);font-size:24px}
.trait-power h3{margin:3px 0!important;font-size:18px}.trait-power strong{font-size:20px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.trait-power p,.trait-power small{font-size:12px;line-height:1.6}.trait-power p{margin-top:4px}
.match-guide-tools{display:flex;gap:6px;margin:6px 12px}.match-guide-tools .opponent-note-button{margin:0;flex:1;min-width:0}.match-guide-tools .opponent-note-button small{display:none}.guide-open{margin-left:auto;min-height:44px;padding:6px 12px;border:1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white));border-radius:9px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));background:var(--c-orange-98);font-size:12px;font-weight:600;white-space:nowrap}
.selected-detail.decision-guide{display:block;padding:10px 12px;background:var(--c-white);min-height:80px}
.guide-copy>b{font-size:13px}.guide-copy p{font-size:11px;margin:4px 0;line-height:1.5;color:color-mix(in srgb,var(--p-g-n) 55%,var(--p-ink))}.guide-copy em{font-style:normal;font-weight:600;color:var(--c-blue-41)}.guide-copy>small{font-size:10px;color:var(--c-slate-42)}.selected-detail .guide-ranges{display:flex;flex-direction:row;flex-wrap:wrap;gap:3px 10px;font-size:11px;color:var(--c-slate-36);min-width:0}.guide-ranges b{color:var(--navy);font-size:12px}
.guide-notice{padding:12px;border:1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white));background:var(--c-green-97);color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink));border-radius:10px;font-size:13px;line-height:1.6}
.guide-choices{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}.guide-choices button{flex:1 1 95px;min-height:54px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--c-white);color:var(--navy)}.guide-choices b,.guide-choices small{display:block}.guide-choices b{font-size:13px}.guide-choices small{font-size:11px;margin-top:4px}.guide-choices .active{border-color:var(--blue);background:var(--c-blue-96);box-shadow:inset 0 0 0 1px var(--blue)}
.guide-strength{display:grid;gap:6px;padding:12px;background:var(--c-blue-96);border-radius:8px;margin:12px 0;font-size:12px}.guide-strength span:last-child{color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))}
.guide-table-wrap{overflow-x:auto}.guide-table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}.guide-table caption{text-align:left;font-weight:600;font-size:13px;padding:10px 0}.guide-table th,.guide-table td{padding:12px 6px;border-bottom:1px solid var(--line);text-align:right}.guide-table th:first-child{text-align:left}.guide-table thead{background:var(--c-blue-96)}
.guide-reference{margin:12px 0;border:1px solid var(--line);border-radius:10px;padding:0 12px}.guide-reference summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-size:13px;font-weight:600}.guide-reference article{padding:12px 0;border-top:1px solid var(--line)}.guide-reference b{font-size:14px}.guide-reference p,.guide-reference small{font-size:12px;line-height:1.7}
.rarity-boost{display:inline-block;margin-top:7px;padding:3px 5px;border:1px solid var(--c-slate-82);border-radius:5px;background:var(--c-gray-96);color:var(--navy);font-size:10px;font-weight:600}.rarity-rule{background:var(--c-blue-96);padding:10px;border-radius:8px;font-size:12px;line-height:1.65;color:var(--c-slate-36)}
.phase-strip .active span{background:var(--navy);border-color:var(--navy);color:var(--lime);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-green-91) 25.1%,transparent)}.hand-head b{color:var(--navy)}
.phase-arrive .hand-head,.phase-arrive .prepare-panel{animation:phase-enter .32s ease-out both}.phase-arrive .phase-strip .active{animation:phase-flare .7s ease-out both}
.tactic-card.selected{box-shadow:0 0 0 2px var(--blue),0 6px 14px color-mix(in srgb,var(--c-blue-41) 14.5%,transparent);transform:translateY(-3px)}
.phase-arrive .revealed>div:first-child{animation:duel-left .35s ease-out both}.phase-arrive .revealed>div:last-child{animation:duel-right .35s ease-out both}.phase-arrive .result-call{animation:result-impact .42s .28s ease-out both}.phase-arrive .result-animation{animation:phase-enter .35s .45s ease-out both}
.result-homer{border-color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));box-shadow:0 8px 28px color-mix(in srgb,var(--p-g-ssr) 18.8%,transparent)}.result-homer .reveal-label{background:var(--p-ink);color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}.result-homer .result-call>b{color:var(--p-g-ssr);font-size:36px}.result-out .result-call>b{color:color-mix(in srgb,var(--p-red) 55%,var(--p-ink))}.run-impact{display:block;color:var(--p-g-ssr);font-size:22px}.run-impact:empty{display:none}.trait-trigger{display:inline-block!important;margin:6px 3px 0;padding:5px 9px;background:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))!important;border-radius:6px;letter-spacing:0!important;font-size:12px!important}
@keyframes phase-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes phase-flare{0%{filter:brightness(1.7)}100%{filter:none}}
@keyframes duel-left{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
@keyframes duel-right{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
@keyframes result-impact{from{opacity:0;transform:scale(1.12)}to{opacity:1;transform:scale(1)}}
@media(max-width:760px){.match-traits{margin:5px 8px 0;gap:5px}.trait-chip{padding:4px 7px;gap:5px}.trait-chip b{font-size:11px}.trait-chip small{font-size:10px}.match-guide-tools{margin:5px 8px}.guide-open{padding:5px 8px;font-size:11px}.match-guide-tools .opponent-note-button{padding:5px 8px}.match-guide-tools .opponent-note-button b{font-size:11px}.selected-detail.decision-guide{padding:7px 9px;margin:0 8px 5px;min-height:76px}.guide-copy p{font-size:11px}.guide-ranges{gap:3px 8px;font-size:10px}.guide-ranges b{font-size:11px}.action-dock{position:sticky;bottom:calc(66px + env(safe-area-inset-bottom));z-index:5;box-shadow:0 -5px 12px color-mix(in srgb,var(--c-navy-15) 4.7%,transparent)}.phase-strip{margin-top:5px}.hand-head{padding-bottom:5px}.hand-head b{font-size:12px}.stat-grid small{font-size:10px;line-height:1.5}}
@media(max-height:720px) and (max-width:500px){.in-match #app>.topbar{display:none}.match-main{padding-top:5px}.match-traits{margin-top:3px}.trait-chip{min-height:44px}.hand-head>div>.eyebrow{font-size:0}.hand-head{min-height:23px}.match-guide-tools{margin-top:2px;margin-bottom:2px}.phase-strip{margin-bottom:5px}.guide-copy>small{font-size:9px}.selected-detail.decision-guide{min-height:72px}.guide-copy p{margin:2px 0}.result-homer .result-call>b{font-size:28px}}
@media(prefers-reduced-motion:reduce){.phase-arrive *,.tactic-card.selected{animation:none!important;transition:none!important;transform:none!important}}
/* Reviewed Make V2 ability and decisive-moment sheets. */
.ability-icon{display:block;width:28px;height:28px;flex:0 0 auto}.guide-open{display:flex;align-items:center;justify-content:center;gap:5px}.guide-open .ability-icon{width:22px;height:22px}
.ability-card{border:1px solid color-mix(in srgb,var(--p-g-ssr) 60%,var(--p-white));border-radius:14px;overflow:hidden;background:var(--c-white);color:var(--c-navy-15);margin:14px 0}.ability-card>header{display:flex;align-items:center;gap:12px;padding:16px;background:linear-gradient(110deg,var(--c-gold-96-2),color-mix(in srgb,var(--p-gold) 32%,var(--p-white)));color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}.ability-medallion{width:48px;height:48px;border-radius:50%;background:var(--c-navy-15);color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));display:grid;place-items:center;flex-shrink:0;border:2px solid color-mix(in srgb,var(--p-gold) 80%,var(--p-ink))}.ability-card header>div{flex:1;min-width:0}.ability-card h3{font-size:18px;margin:4px 0!important;line-height:1.4}.ability-card header small{font-size:11px}.ability-card header>strong{font-size:26px;white-space:nowrap}.ability-card header>strong small{margin-left:3px}.ability-body{padding:16px}.ability-condition{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.ability-condition>span{border:1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white));background:var(--c-orange-98);border-radius:20px;padding:8px 12px;font-size:12px;font-weight:700}.ability-body p{color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink));font-size:13px;line-height:1.7;margin:12px 0}.ability-status{display:table;margin-left:auto;font-size:11px;background:var(--c-gold-98);border-radius:20px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));padding:6px 10px}.ability-status.on{background:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));font-weight:600}
.synergy-logo{width:48px;height:48px;flex-shrink:0;background:var(--c-gray-96);border:1px solid var(--c-slate-90);border-radius:12px;display:grid;place-items:center}.synergy-logo img{width:40px;height:40px;object-fit:contain}
.presentation-settings{padding:16px;background:var(--c-white);border:1px solid var(--line);border-radius:12px;margin:16px 0}.presentation-settings h3{margin:0 0 10px}.presentation-settings label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;min-height:58px}.presentation-settings label span{display:grid;gap:5px;color:var(--navy)}.presentation-settings small{font-size:12px;color:var(--c-slate-42)}.presentation-settings input{width:22px;height:22px;accent-color:var(--c-blue-41);flex-shrink:0}
.review-moments{padding:18px;margin:18px 0;background:var(--c-white);border:1px solid var(--line);border-radius:14px;color:var(--c-navy-15)}.review-moments h3{margin:4px 0!important}.review-moment{margin-top:12px;border:1px solid var(--c-slate-90);border-radius:10px;overflow:hidden}.review-moment summary{padding:14px;display:flex;align-items:center;gap:12px;cursor:pointer;min-height:64px;list-style:none}.review-moment summary::-webkit-details-marker{display:none}.moment-rank{width:28px;height:28px;flex-shrink:0;border-radius:50%;background:var(--c-navy-15);color:var(--c-white);display:grid;place-items:center;font-weight:700;font-size:12px}.review-moment summary>span:nth-child(2){display:grid;gap:5px;min-width:0}.review-moment summary b{font-size:17px;color:var(--c-navy-15)}.review-moment small{font-size:11px;color:var(--c-slate-42)}.review-chevron{margin-left:auto}.review-moment[open] .review-chevron{transform:rotate(180deg)}.moment-body{padding:14px;border-top:1px solid var(--c-slate-90);background:var(--c-gray-96)}.moment-situations{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}.moment-situations>div{padding:12px;background:var(--c-white);border-radius:8px}.moment-situations b{display:block;margin-top:6px;font-size:13px;line-height:1.6}.moment-body h4{font-size:13px;margin:16px 0 8px}.moment-body ul{padding-left:18px;color:var(--c-slate-36);font-size:12px;line-height:1.8}.moment-trait{background:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));font-weight:700}.review-open{font-size:12px;min-height:44px;white-space:nowrap}.walkoff-banner{display:grid;gap:8px;padding:22px;text-align:center;background:linear-gradient(115deg,var(--c-navy-15),color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)));color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));border:1px solid color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));border-radius:12px;margin-bottom:12px}.walkoff-banner small{font-size:11px;letter-spacing:.12em}.walkoff-banner strong{font-size:32px}.walkoff-banner span{font-size:13px;color:var(--c-gold-96)}.phase-arrive .walkoff-banner{animation:result-impact .88s ease-out both}.double-play-banner{padding:14px;background:color-mix(in srgb,var(--p-g-r) 8%,var(--p-white));color:color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink));border-radius:10px;text-align:center;font-weight:600}.result-double{border-color:color-mix(in srgb,var(--p-blue) 60%,var(--p-white))}.result-double .reveal-label{background:var(--c-navy-19);color:color-mix(in srgb,var(--p-g-r) 16%,var(--p-white))}.result-double .result-call>b{color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink))}.phase-arrive .result-double .result-call{animation:duel-left .62s ease-out both}.phase-arrive .result-homer .result-call{animation:result-impact .72s ease-out both}.ball{animation-duration:.72s}
.reduced-motion *,.reduced-motion *::before,.reduced-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reduced-motion .tactic-card.selected{transform:none}
@media(max-width:760px){.trait-chip .ability-icon{width:24px;height:24px}.trait-chip>span:last-child{gap:1px 5px}.ability-card>header{padding:12px;gap:9px}.ability-medallion{width:40px;height:40px}.ability-card h3{font-size:15px}.ability-card header>strong{font-size:23px}.ability-body{padding:12px}.review-moments{padding:12px}.review-moment summary{padding:10px;gap:8px}.moment-body{padding:10px}.moment-situations>div{padding:8px}.record-list article{flex-wrap:wrap;padding:12px 0}.record-list article>div{min-width:165px}.record-list .review-open{margin-left:auto}.walkoff-banner strong{font-size:26px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Make V2 short season expansion, reviewed 2026-10-06. */
.product-nav button{width:min(20%,150px)}

.league-page{display:grid;gap:16px}.league-hero{display:grid;grid-template-columns:1.3fr .75fr 1fr;gap:24px;align-items:center;background:linear-gradient(115deg,var(--c-navy-15),var(--p-navy));color:var(--c-white);border-radius:18px;padding:30px;box-shadow:0 10px 28px color-mix(in srgb,var(--c-navy-15) 7.1%,transparent)}
.league-club{display:flex;align-items:center;gap:16px}.league-club>img{background:var(--c-white);border-radius:13px;padding:8px;width:76px;height:76px;object-fit:contain;flex-shrink:0}.league-hero span{color:var(--c-slate-80);font-size:11px;letter-spacing:.04em}.league-hero h2{font-size:24px;margin:10px 0}.league-hero p{color:var(--lime);font-size:13px;font-weight:700}.league-progress{padding:12px 20px;border-inline:1px solid color-mix(in srgb,var(--c-white) 9.4%,transparent);display:grid;gap:10px}.league-progress>b{font-size:40px;line-height:1.2}.league-progress small{font-size:11px;color:var(--c-slate-80)}.league-progress progress{width:100%;height:8px;appearance:none;border:0;border-radius:8px;background:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink))}.league-progress progress::-webkit-progress-bar{background:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));border-radius:8px}.league-progress progress::-webkit-progress-value{background:var(--lime);border-radius:8px}.league-next{display:grid;gap:12px}.league-next>div{display:flex;align-items:center;gap:12px}.league-next .team-logo{background:var(--c-white);padding:5px;border-radius:10px;width:48px;height:48px}.league-play{width:100%;background:var(--lime);color:var(--navy);min-height:50px}.league-paid{color:var(--lime);font-size:24px}.league-notice{padding:12px 16px;border:1px solid var(--c-slate-90);border-radius:10px;background:var(--c-blue-96);display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:12px;color:var(--c-slate-42);line-height:1.6}.league-notice>b{flex-shrink:0;background:color-mix(in srgb,var(--p-green) 16%,var(--p-white));border-radius:12px;padding:3px 9px;color:var(--p-green);font-size:11px}
.league-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.league-grid>.panel{margin:0;min-width:0}.league-grid .section-head{margin-bottom:14px}.league-grid h3{margin-top:5px}.league-grid .section-head small{font-size:11px;color:var(--c-slate-49)}.league-table,.league-stats{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}.league-table th,.league-table td,.league-stats td,.league-stats th{padding:8px 5px;text-align:center;border-bottom:1px solid var(--c-gray-96)}.league-table thead,.league-stats thead{background:var(--c-gray-96);color:var(--c-slate-49);font-size:11px}.league-table tbody th{align-items:center;gap:8px;text-align:left}.league-table .team-logo{width:30px;height:30px}.league-table .mine{background:var(--c-blue-96);color:var(--c-blue-41);font-weight:600}.league-fixtures{display:grid}.league-fixture{display:grid;grid-template-columns:22px 34px 1fr 28px 45px;gap:8px;align-items:center;width:100%;border:0;border-bottom:1px solid var(--c-gray-96);background:var(--c-white);min-height:56px;padding:7px 4px;text-align:left;font-size:12px}.league-fixture.current{background:var(--c-green-97);border-radius:8px}.league-fixture span{font-weight:700}.league-fixture small{font-size:10px;color:var(--c-slate-49)}.league-fixture span small{display:block;margin-top:3px;font-weight:400}.league-fixture>strong{text-align:right;font-variant-numeric:tabular-nums}.league-fixture .won{color:var(--p-green)}.league-fixture .lost{color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))}.league-details{padding:20px;margin:0}.league-tabs{display:flex;border-bottom:1px solid var(--line);gap:16px}.league-tabs button{background:none;border:0;border-bottom:3px solid transparent;min-height:48px;font-weight:600;font-size:13px}.league-tabs button.active{border-color:var(--blue);color:var(--blue)}.league-round-nav{display:flex;justify-content:center;align-items:center;gap:18px;margin:16px 0}.league-round-nav button{background:var(--c-gray-96)}.league-results{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.league-results article{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:7px;border:1px solid var(--line);border-radius:12px;padding:14px 8px;text-align:center;font-size:12px}.league-results article>span{display:grid;justify-items:center;gap:6px;font-size:11px}.league-results article>strong{white-space:nowrap}.league-results article>small{grid-column:1/-1;color:var(--c-gray-50);font-size:10px}.league-stat-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:18px 0}.league-stat-tools>label{display:flex;align-items:center;gap:7px;font-size:12px;min-height:44px}.league-stat-tools input{width:18px;height:18px}.league-stats th:first-child{text-align:left}.league-stats th button{display:flex;align-items:center;gap:9px;text-align:left;border:0;background:none;padding:0;min-height:50px;font-weight:700;font-size:13px}.league-stats .player-art{width:38px;height:48px;object-fit:contain}.league-stats small{display:block;color:var(--c-gray-50);font-size:10px;font-weight:400;margin-top:4px}.league-rules{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px;border-radius:12px;background:var(--c-blue-96);margin-top:16px}.league-rules>div{display:grid;gap:7px}.league-rules b{font-size:13px}.league-rules span{font-size:11px;color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink))}.league-new{display:grid;}.league-new>.eyebrow{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.league-cup{width:54px;height:54px;color:var(--p-g-ssr)}.league-new h2{font-size:25px}.league-new p{font-size:13px;line-height:1.7;color:var(--c-slate-49)}.league-new label{display:grid;gap:8px;min-width:220px;text-align:left;font-size:12px}.league-new select{min-height:44px;font:inherit;border:1px solid var(--c-slate-85);border-radius:8px;padding:8px;background:var(--c-white);color:var(--navy)}.league-new .btn{min-width:220px}.league-warning{background:var(--c-gold-96-2);border:1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white));padding:10px 16px;border-radius:8px}.league-history{padding:18px}.league-history summary{cursor:pointer;min-height:44px}.league-history p{font-size:13px;padding:9px 0}.league-page .help{margin-top:12px;line-height:1.65}
@media(max-width:900px){.league-hero{gap:16px;padding:22px;grid-template-columns:1.2fr 1fr}.league-progress{border-right:0}.league-next{grid-column:1/-1;grid-template-columns:1fr 1fr;align-items:center}.league-next>span{grid-column:1/-1}.league-results{grid-template-columns:repeat(3,minmax(0,1fr))}.league-fixture{gap:5px;grid-template-columns:20px 28px 1fr 26px 40px}}
@media(max-width:680px){.league-hero{grid-template-columns:1fr;padding:20px;gap:20px}.league-hero h2{font-size:22px}.league-club>img{width:64px;height:64px}.league-progress{border-inline:0;border-block:1px solid color-mix(in srgb,var(--c-white) 9.4%,transparent);padding:16px 0}.league-progress>b{font-size:34px}.league-next{grid-template-columns:1fr}.league-next>span{grid-column:auto}.league-grid{grid-template-columns:1fr}.league-notice{align-items:flex-start;flex-direction:column;gap:8px}.league-rules{grid-template-columns:1fr}.league-results{grid-template-columns:1fr 1fr}.league-details{padding:14px}.league-table{font-size:11px}.league-table th,.league-table td{padding:7px 3px}.league-stats{font-size:11px}.league-stats td,.league-stats th{padding:7px 3px}.league-stats th button{gap:5px;font-size:11px}.league-stats .player-art{width:28px;height:38px}.league-tabs{gap:8px}.league-tabs button{font-size:12px;padding:0 5px}.league-fixture{min-height:58px}}
.league-next .btn.league-play{background:var(--lime);color:var(--navy)}
/* Make V2 postseason and season-length expansion. */
.league-length{display:flex;justify-content:center;margin:12px 0;width:100%;max-width:500px}.league-length button{flex:1;min-height:75px;border:1px solid var(--c-slate-85);border-radius:12px;background:var(--c-white);padding:12px;color:var(--navy);display:grid;gap:6px}.league-length button.active{background:var(--c-blue-96);border:2px solid var(--blue)}.league-length b{font-size:19px}.league-length span{font-size:11px}.league-main-tabs{background:var(--c-white);border:1px solid var(--line);border-radius:12px;padding:0 14px;justify-content:space-around}.league-calendar-nav{display:flex;align-items:center;gap:9px;margin-bottom:12px;font-size:12px}.league-calendar-nav .btn{padding:0 12px}.league-calendar-nav .text-btn{margin-left:auto}.league-tie{font-size:11px;line-height:1.8}.league-tie summary{min-height:44px;cursor:pointer;padding:10px 0}.league-receipt{display:flex;gap:12px;flex-wrap:wrap;padding:14px;background:var(--c-green-97);border:1px solid color-mix(in srgb,var(--p-gold) 32%,var(--p-white));border-radius:10px;font-size:12px}.league-receipt span{display:grid;gap:5px;flex:1;min-width:130px}.league-receipt b{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.postseason-banner{display:flex;align-items:center;gap:18px;background:linear-gradient(110deg,var(--c-orange-98),var(--c-gold-96-2));border:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));border-radius:14px;padding:20px}.postseason-banner>div{flex:1}.postseason-banner span{font-size:10px;letter-spacing:.08em;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));font-weight:600}.postseason-banner h2{font-size:22px;margin:7px 0}.postseason-banner p{font-size:12px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));line-height:1.6}.postseason-bracket{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:start}.postseason-series{min-width:0;background:var(--c-white);border:1px solid var(--line);border-radius:14px;overflow:hidden}.postseason-series.current{border:2px solid color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));box-shadow:0 5px 18px color-mix(in srgb,var(--p-g-ssr) 7.1%,transparent)}.postseason-series header{padding:16px;background:var(--c-gray-96);position:relative;border-bottom:1px solid var(--line)}.postseason-series.current header{background:var(--c-gold-96-2)}.postseason-series h3{font-size:16px;margin-top:7px}.postseason-series header small{font-size:10px;color:var(--c-slate-56)}.postseason-series header>span{display:inline-block;font-size:10px;color:color-mix(in srgb,var(--p-gold) 55%,var(--p-ink));margin-top:9px;border:1px solid color-mix(in srgb,var(--p-g-ssr) 60%,var(--p-white));border-radius:999px;padding:3px 8px;background:var(--c-gold-98)}.postseason-series>.help{padding:0 12px;min-height:38px;font-size:11px}.postseason-teams{padding:8px}.postseason-teams>div{display:flex;align-items:center;gap:7px;padding:10px 5px;min-height:65px;border-bottom:1px solid var(--c-gray-96);font-size:12px}.postseason-teams>div.winner{background:var(--c-green-97);border-radius:7px}.postseason-teams span{flex:1;font-weight:700}.postseason-teams small{display:block;font-size:9px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));margin-top:4px}.postseason-teams b{font-size:18px;white-space:nowrap}.postseason-teams .team-logo{width:29px;height:29px}.postseason-games{padding:0 12px 12px;max-height:300px;overflow:auto}.postseason-games>div{display:flex;align-items:center;gap:8px;font-size:11px;border-top:1px solid var(--c-gray-96);min-height:44px}.postseason-games>div>b{margin-left:auto}.postseason-games small{font-size:9px;color:var(--c-gray-61)}.league-stat-scope{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px;font-size:12px}.league-stat-scope button{min-height:44px;border:1px solid var(--line);background:var(--c-white);border-radius:8px;padding:8px 14px}.league-stat-scope button[aria-pressed=true]{background:var(--navy);color:var(--c-white)}.league-stat-scope>b{margin-left:auto}
@media(max-width:1000px){.postseason-bracket{grid-template-columns:repeat(2,minmax(0,1fr))}.postseason-banner{flex-wrap:wrap}.postseason-banner .btn{margin-left:auto}}
@media(max-width:680px){.postseason-bracket{grid-template-columns:1fr}.postseason-banner{padding:16px;gap:12px}.postseason-banner .league-cup{width:38px;flex-shrink:0}.postseason-banner h2{font-size:19px}.postseason-banner .btn{width:100%;margin:0}.league-length b{font-size:17px}.league-calendar-nav{gap:6px}.league-calendar-nav .btn{padding:0 9px}.league-main-tabs{padding:0 6px}.league-stat-scope>b{width:100%;margin:5px 0}.postseason-games{max-height:none}}
.grade-evaluation{padding:20px;border:1px solid var(--p-line);border-radius:16px;background:linear-gradient(135deg,var(--c-blue-96),var(--c-white));color:var(--c-navy-15);margin:18px 0}
.grade-evaluation h3{margin:5px 0}.grade-evaluation p,.grade-evaluation>small,.grade-evaluation details{font-size:13px;line-height:1.65;color:var(--c-slate-42)}.grade-rank{display:flex;align-items:center;gap:18px;margin:18px 0}.grade-rank>strong{font-size:36px;white-space:nowrap;color:var(--p-blue)}.grade-rank small{font-size:14px;color:var(--c-slate-49)}.grade-rank div{display:grid;gap:6px}.grade-rank span{font-size:12px;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}.grade-metrics{display:grid;gap:13px;margin-bottom:14px}.grade-metrics>div{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:13px}.grade-metrics small{color:var(--c-slate-49);margin-left:6px}.grade-metrics i{grid-column:1/-1;height:6px;border-radius:9px;background:var(--c-slate-90);overflow:hidden}.grade-metrics em{display:block;height:100%;background:var(--p-blue);border-radius:9px}.grade-sample{display:grid;gap:5px;background:var(--c-blue-96);padding:12px;border-radius:10px;margin:16px 0;font-size:13px}.grade-sample span{font-size:12px;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}.grade-sample.limited{background:var(--c-gold-96)}.grade-evaluation summary{cursor:pointer;font-weight:700;color:var(--p-blue);padding:6px 0}@media(max-width:420px){.grade-evaluation{padding:14px}.grade-rank{gap:12px}.grade-rank>strong{font-size:29px}.grade-rank span{font-size:11px}}
.rotation-editor,.rotation-upgrade{padding:20px;border:1px solid var(--line);border-radius:16px;margin:16px 0;background:var(--c-gray-96)}.rotation-upgrade{background:var(--c-gold-96-2)}.rotation-upgrade p{font-size:13px;line-height:1.7;margin:12px 0}.rotation-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:18px 0 22px}.rotation-cards article{display:flex;flex-direction:column;gap:10px;align-items:stretch;border:1px solid var(--c-slate-90);border-radius:14px;padding:14px 10px;background:var(--c-white);min-width:0;text-align:center}.rotation-cards article.selected{border:2px solid var(--c-blue-41);background:var(--c-blue-96);padding:13px 9px}.rotation-face{display:flex;flex-direction:column;align-items:center;gap:7px;border:0;background:none;min-height:140px;color:var(--navy);padding:0}.rotation-face img{height:100px;width:100%;object-fit:contain}.rotation-cards .btn{min-height:44px;padding:8px;font-size:12px}.rotation-cards article>div{display:flex;gap:6px}.rotation-cards article>div>.btn{flex:1}.staff-condition{font-size:11px;color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink))}.rotation-cards meter{width:100%;height:10px;accent-color:var(--p-green)}.relief-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}.relief-cards button{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--line);border-radius:12px;background:var(--c-gray-96);padding:10px;color:var(--navy)}.relief-cards img{width:52px;height:66px;object-fit:contain}.relief-cards b,.relief-cards small{display:block}.relief-cards small{font-size:11px;color:var(--c-slate-49);margin-top:8px}.season-goals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}.season-goals article{display:flex;flex-direction:column;gap:14px;border:1px solid var(--line);border-radius:14px;padding:20px;background:var(--c-gray-96)}.season-goals article.claimed{background:var(--c-green-97);border-color:color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white))}.season-goals h3{font-size:16px}.season-goals .status-pill{align-self:flex-start}.season-goals strong{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));font-size:14px}.season-goals progress{width:100%;height:9px;accent-color:var(--c-blue-41)}.league-main-tabs{scrollbar-width:thin}.league-main-tabs button{flex:1;min-height:48px}.stats-scroll{width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:12px}.stats-scroll .league-stats{min-width:760px}.stats-scroll .league-stats th:first-child{position:sticky;left:0;background:var(--c-white);min-width:140px;box-shadow:3px 0 5px color-mix(in srgb,var(--c-navy-19) 6.3%,transparent)}.stats-scroll .league-stats thead th:first-child{background:var(--c-gray-96)}.scoring-help{margin:18px 0;font-size:12px;line-height:1.7;color:var(--c-slate-42)}.scoring-help summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:700}.season-record-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:12px 0 20px}.season-record-grid>div{display:grid;gap:8px;background:var(--c-blue-96);border-radius:8px;padding:12px;text-align:center}.season-record-grid small{font-size:11px;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}.season-record-grid strong{font-size:18px;font-variant-numeric:tabular-nums}
@media(max-width:680px){.rotation-editor,.rotation-upgrade{padding:14px}.rotation-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.rotation-cards article:last-child{grid-column:1/-1}.rotation-cards article:last-child .rotation-face{min-height:130px}.relief-cards{grid-template-columns:1fr}.season-goals{grid-template-columns:1fr}.season-goals article{padding:18px}.season-record-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.league-main-tabs{gap:10px}.league-main-tabs button{flex:0 0 auto;padding:0 9px}.stats-scroll .league-stats th:first-child{min-width:116px}}
.league-page>*{min-width:0}
.pack-repeat-footer{flex-shrink:0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));background:var(--c-navy-11);color:var(--c-white)}.pack-repeat-footer p{margin:0 0 10px;font-size:12px;color:var(--c-blue-88);text-align:center}.pack-repeat-footer>div{display:grid;grid-template-columns:1fr 2fr;gap:10px}.pack-repeat-footer .btn{min-height:46px;min-width:0;font-size:13px}.pack-repeat-footer .btn:disabled{background:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));color:var(--c-slate-85);border-color:var(--c-slate-36);opacity:1}.pack-repeat-footer [data-do="close-dialog"]{background:var(--p-navy);color:var(--c-white);border-color:var(--c-slate-36)}
.player-sort-tools{display:grid;grid-template-columns:1fr 1fr;}.player-sort-tools label,.field-filter label{display:grid;gap:6px;min-width:0;font-size:12px;color:var(--c-slate-42)}.player-sort-tools select,.field-filter select,.field-filter input{min-width:0;width:100%;min-height:44px;border:1px solid var(--c-slate-85);border-radius:8px;background:var(--c-white);padding:8px;font:inherit;color:var(--p-navy)}.deck-layout.field-mode{grid-template-columns:minmax(0,1fr)}.field-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,1fr);gap:20px;margin-top:16px}.field-stage,.field-library{min-width:0}.field-selection{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--c-blue-96);border-radius:10px;font-size:12px;scroll-margin-top:12px}.roster-field{position:relative;border-radius:24px;margin:12px 0;overflow:hidden;background:repeating-radial-gradient(ellipse at 50% 95%,color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)) 0 36px,color-mix(in srgb,var(--p-green) 55%,var(--p-ink)) 36px 72px);border:4px solid color-mix(in srgb,var(--p-g-lr) 16%,var(--p-white))}.roster-field:before{content:'';position:absolute;width:52%;aspect-ratio:1;transform:rotate(45deg);left:24%;top:39%;background:color-mix(in srgb,color-mix(in srgb,var(--p-g-ssr) 60%,var(--p-white)) 23.9%,transparent);border:1px solid color-mix(in srgb,var(--c-white) 37.6%,transparent)}.field-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:10px;color:var(--p-navy);min-width:0;cursor:grab;touch-action:manipulation}.roster-field>.field-slot{position:absolute;left:var(--x);top:var(--y);box-shadow:0 3px 10px color-mix(in srgb,var(--p-ink) 20%,transparent)}.field-slot>span{font-size:10px;font-weight:600;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}.field-slot img{width:100%;object-fit:contain;pointer-events:none}.field-slot b{font-size:12px}.field-slot small{font-size:8px;color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink));white-space:normal}.field-reserves{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 20px}.field-library{border:1px solid var(--line);border-radius:16px;padding:14px;background:var(--c-gray-96);align-self:start}.field-library h3 small{font-size:12px;color:var(--c-slate-49)}.field-filter{display:grid;gap:10px;margin-bottom:12px}.field-library-list{display:grid;gap:8px;max-height:650px;overflow-y:auto;overscroll-behavior:contain;padding:4px}.field-library-card{display:flex;align-items:center;gap:9px;border:1px solid var(--c-slate-85);border-radius:10px;padding:8px;color:var(--navy);text-align:left;cursor:grab;min-width:0}.field-library-card>img{pointer-events:none}.field-library-card>span:nth-child(2){flex:1;min-width:0}.field-library-card b{font-size:13px;display:block}.field-library-card small{display:block;font-size:10px;margin-top:5px}.field-library-card .grade{font-size:9px}.field-workspace .help{line-height:1.6}
@media(max-width:760px){.field-layout{grid-template-columns:minmax(0,1fr)}.field-slot b{font-size:11px}.field-slot>span{font-size:9px}.field-reserves{gap:5px}.field-mode .deck-editor{padding:12px}.field-workspace>.section-head{gap:8px}.field-workspace .section-head .text-btn{font-size:11px}.field-selection{scroll-margin-top:10px}}
.player-comparison{border:1px solid var(--c-blue-88);border-radius:14px;background:var(--c-gray-96);padding:12px;margin:12px 0}.compare-head{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--c-slate-90)}.compare-head>div{display:flex;gap:8px;align-items:center;min-width:0}.compare-head img{width:42px;height:54px;object-fit:contain}.compare-head small{display:block;color:var(--c-slate-49);font-size:10px;margin-bottom:5px}.compare-head b{font-size:13px}.compare-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}.compare-stats>div{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;font-size:11px}.compare-stats b{font-variant-numeric:tabular-nums}.compare-stats strong{min-width:26px;text-align:right}.compare-stats .up{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.compare-stats .down{color:var(--p-red)}.compare-stats .same{color:color-mix(in srgb,var(--p-line) 55%,var(--p-ink))}.player-comparison>p{font-size:10px;line-height:1.5;color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink));margin:10px 0 0}
@media(max-width:760px){.compare-head{gap:8px}.compare-head img{width:32px;height:44px}.compare-head b{font-size:12px}.compare-stats{grid-template-columns:1fr;gap:7px}.compare-stats>div{font-size:12px}.player-comparison{padding:10px}.live-sheet:has(.player-comparison) .entry-radio-list,.live-sheet:has(.player-comparison) .candidate-list{max-height:240px;overflow-y:auto}}
.field-filter .search-inline .btn{min-width:58px;white-space:nowrap;flex-shrink:0}
.comparison-scope{font-size:11px;font-weight:600;color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink));margin-bottom:10px}
.deck-impact{border:1px solid var(--c-slate-90);border-radius:14px;padding:14px;background:var(--c-white);margin:12px 0;color:var(--navy)}
.deck-impact h3{font-size:15px;margin:0 0 10px}.impact-verdict{display:grid;gap:8px}
.impact-verdict>div{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px 12px;padding:10px 12px;border-radius:8px;font-size:12px;border:1px solid transparent}
.impact-verdict .loss{background:var(--c-gold-96-2);color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));border-color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}.impact-verdict .gain{background:var(--c-green-97);color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink));border-color:color-mix(in srgb,var(--p-green) 32%,var(--p-white))}.impact-verdict .neutral{background:var(--c-blue-96);color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}
.impact-verdict strong{font-size:15px;white-space:nowrap}.impact-verdict span{font-size:11px}
.impact-position{display:grid;gap:5px;padding:12px 0;font-size:12px}.impact-position>span{color:var(--c-slate-49);font-size:11px}.impact-position small{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.impact-position p{color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));font-size:11px}
.deck-impact details{border-top:1px solid var(--c-gray-91)}.deck-impact summary{min-height:44px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700}.deck-impact summary:before{content:'+';font-size:17px}.deck-impact details[open]>summary:before{content:'−'}
.impact-groups>div{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:8px 0;border-top:1px solid var(--c-gray-96);font-size:12px}.impact-groups small{grid-column:1/-1;color:var(--c-slate-49);font-size:11px}
.impact-players{max-height:230px;overflow:auto;overscroll-behavior:contain}.impact-players>div{padding:9px 0;display:grid;gap:4px;font-size:12px;border-top:1px solid var(--c-gray-96)}.impact-players small{color:var(--p-slate);font-weight:400}.impact-players span{font-size:11px;line-height:1.6;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}
.deck-impact .up{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.deck-impact .down{color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))}.impact-unchanged,.impact-note{font-size:11px;color:var(--c-slate-49);line-height:1.6}.impact-note{margin-top:10px}
.live-sheet:has(.deck-impact) .sheet-actions{position:sticky;bottom:-18px;background:var(--c-gray-96);padding:12px 0;margin-bottom:0;z-index:2;border-top:1px solid var(--c-slate-90)}
.live-sheet:has(.deck-impact) .sheet-actions .btn{min-height:46px}
@media(max-width:760px){.deck-impact{padding:12px}.impact-verdict>div{padding:9px}.live-sheet:has(.deck-impact) .sheet-actions{bottom:-14px}}

/* Keep field geometry and grade contrast identical in editing and read-only mode. */
.field-workspace [data-grade="N"]{--field-tone:var(--c-slate-42);--field-tint:var(--c-gray-96)}
.field-workspace [data-grade="R"]{--field-tone:var(--p-blue);--field-tint:var(--c-blue-96)}
.field-workspace [data-grade="SR"]{--field-tone:var(--p-g-sr);--field-tint:var(--c-purple-94)}
.field-workspace [data-grade="SSR"]{--field-tone:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));--field-tint:var(--c-gold-96)}
.field-slot{position:relative;border:1px solid var(--field-tone);border-top:4px solid var(--field-tone);background:var(--field-tint);padding:5px;gap:3px;line-height:1.25}
.roster-field{height:530px;min-height:0;border-width:2px}
.roster-field>.field-slot{width:min(94px,25%);height:114px;min-height:0;transform:none;translate:-50% -50%}
.field-slot img{height:42px;flex-shrink:0}
.field-slot>.field-position{font-size:10px;line-height:1.2;color:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));white-space:nowrap}
.field-slot>b{font-size:12px;line-height:1.2;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.field-slot .field-card-meta{display:flex;align-items:center;justify-content:center;gap:4px;min-height:17px}
.field-slot .field-card-meta small{font-size:9px;color:var(--c-slate-36)}
.field-workspace .grade-badge{background:var(--field-tone,var(--grade-color,var(--c-slate-42)));color:var(--c-white);border-color:transparent;font-size:10px;line-height:1.1;padding:3px 5px;min-width:23px;letter-spacing:0}
.field-legend{display:flex;align-items:center;gap:6px;margin:12px 0;color:var(--c-slate-42);font-size:11px;flex-wrap:wrap}
.field-legend>span:last-child{margin-left:4px}
.field-slot .field-mismatch{position:absolute;top:25px;right:4px;width:16px;height:16px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));color:var(--c-white);font-size:11px;font-weight:700}
.field-slot:disabled,.field-library-card:disabled{opacity:1;cursor:default}
.field-slot.selected,.field-library-card.selected{outline:3px solid var(--p-navy);outline-offset:2px;background:var(--field-tint)}
.field-slot.field-drop-over{outline:4px solid var(--c-green-91);outline-offset:2px;background:color-mix(in srgb,var(--p-gold) 32%,var(--p-white))}
.field-selection{min-height:64px;line-height:1.5;padding:10px 12px;border:1px solid var(--c-blue-88)}
.field-selection b,.field-selection small{display:block}.field-selection small{color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink));font-size:11px;margin-top:4px}
.field-selection.locked{background:var(--c-gold-98);border-color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}
.field-selection.locked small{color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}
.field-help{margin:6px 0 20px;color:var(--c-slate-42);font-size:12px;border-bottom:1px solid var(--line)}
.field-help summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;font-weight:700}
.field-help summary:before{content:'+';font-size:18px}.field-help[open] summary:before{content:'−'}
.field-help p{padding:0 0 12px;line-height:1.8}
.field-stage>h3{font-size:15px}.field-stage>h3 small{font-size:12px;color:var(--c-slate-49);font-weight:500}
.field-reserves .field-slot{min-height:114px}
.field-library-card{background:var(--field-tint);min-height:90px}
.field-library-card small{color:var(--c-slate-36);line-height:1.5}.field-card-action{font-size:10px;font-weight:700;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink));flex-shrink:0}
.field-library .section-head{gap:8px;flex-wrap:wrap}.field-library .empty p{font-size:12px;margin:10px 0}
.field-filter{grid-template-columns:100px minmax(0,1fr)}
.field-library-list{scrollbar-width:thin;scrollbar-color:var(--c-slate-74) transparent}
@media(max-width:1000px){.field-layout{grid-template-columns:minmax(0,1fr)}.field-library-list{max-height:480px}}
@media(max-width:760px){.roster-field{height:520px}.roster-field>.field-slot{width:min(94px,25%);height:110px;min-height:0}.field-slot>b{font-size:11px}.field-slot>.field-position{font-size:9px}.field-slot .field-card-meta{gap:3px}.field-slot .grade-badge{font-size:9px;padding:3px 4px}.field-slot .field-card-meta small{font-size:8px}.field-library{padding:12px}.field-library-list{max-height:420px}.field-selection{font-size:11px}.field-filter{grid-template-columns:86px minmax(0,1fr)}.field-legend{gap:5px}.field-selection .text-btn{white-space:nowrap}}
.field-assist{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 18px;padding:16px;border:1px solid var(--c-slate-90);border-radius:14px;background:var(--c-blue-96)}
.field-assist .btn{min-height:46px}.field-assist small{color:var(--c-slate-42);flex:1 1 240px;font-size:12px}
.defense-recommendation{min-width:0}.defense-recommendation h3{margin:8px 0 12px}.defense-recommendation h4{margin:24px 0 12px}
.defense-score{display:flex;align-items:center;justify-content:center;gap:24px;padding:20px 12px;margin:16px 0;border:1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white));background:var(--c-green-97);border-radius:14px;color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink))}
.defense-score span{display:grid;gap:4px;text-align:center;font-size:12px}.defense-score strong{font-size:32px;line-height:1.2;font-variant-numeric:tabular-nums}.defense-score em{font-style:normal;font-weight:600;background:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));border-radius:99px;padding:8px 12px}
.defense-change{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--c-slate-90);font-size:14px}.defense-change img{width:44px;height:58px;object-fit:contain;align-self:end}.defense-change small{display:block;font-size:12px;color:var(--c-slate-49);margin-top:5px}.defense-change>div:last-child{text-align:right}.defense-change b{line-height:1.6}.defense-change .grade{vertical-align:middle}
.defense-warnings{background:var(--c-gold-98);border:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));border-radius:12px;padding:14px;margin-top:18px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));font-size:13px}.defense-warnings summary{cursor:pointer;font-weight:700}.defense-warnings p{line-height:1.7}
@media(max-width:520px){.field-assist{padding:12px;gap:8px}.field-assist .btn{flex:1 1 120px;padding:10px 8px;font-size:13px}.field-assist small{flex-basis:100%;line-height:1.6}.defense-score{gap:16px}.defense-change{gap:8px;font-size:13px}.defense-change small{font-size:11px}}
.pitch-role{display:inline-flex;align-items:center;background:color-mix(in srgb,var(--p-g-r) 8%,var(--p-white));color:var(--p-blue);border:1px solid color-mix(in srgb,var(--p-g-r) 32%,var(--p-white));border-radius:5px;padding:2px 5px;font-size:10px;font-weight:600;white-space:nowrap}.pitch-role.rp{background:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));border-color:color-mix(in srgb,var(--p-g-ssr) 60%,var(--p-white))}
.pitch-usage{display:block;margin-top:5px;color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink));font-size:11px;line-height:1.6}.pitch-usage.mismatch{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));font-weight:700}.pitch-role-rule,.pitch-role-change{padding:14px;background:var(--c-gold-98);border:1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white));border-radius:12px;margin:12px 0}.pitch-role-rule>b,.pitch-role-change>span{display:block;margin-top:8px}.pitch-role-rule p{font-size:13px;line-height:1.8}.pitch-role-change>span{font-size:12px}
.pitch-usage-editor{margin:24px 0}.pitch-assignment-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pitch-assignment-list article{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:9px;align-items:center;border:1px solid var(--c-slate-90);border-radius:12px;padding:12px;background:var(--c-white)}.pitch-assignment-list img{width:40px;height:56px;object-fit:contain}.pitch-assignment-list small{display:block;margin-top:3px;font-size:11px}.pitch-assignment-list b{font-size:13px}.pitch-assignment-list .btn{font-size:12px;min-height:44px;padding:8px}.rotation-face .pitch-usage{white-space:normal}.rotation-face .pitch-role{margin-top:6px}
@media(max-width:760px){.pitch-assignment-list{grid-template-columns:minmax(0,1fr)}.pitch-assignment-list article{padding:10px}.player-side .pitch-usage{font-size:10px}}
.lineup-photo{border:0;background:transparent;padding:0;min-height:48px;display:grid;place-items:center;border-radius:8px;cursor:pointer}
.lineup-photo{width:40px;min-width:0}.lineup-edit{min-width:0}
details.league-rules{display:block}details.league-rules summary{min-height:44px;align-content:center;cursor:pointer;font-weight:700}details.league-rules p{font-size:12px;line-height:1.7;margin-top:10px}
.lineup-name,.lineup-edit{cursor:pointer}.lineup-edit{min-height:44px;border:1px solid var(--c-slate-90)}.lineup-edit small{display:block;font-size:9px;font-weight:500}
.deck-toolbar{flex-wrap:wrap}
.field-mode-switch{display:flex;gap:8px;margin:12px 0}.field-mode-switch .btn{flex:1;min-height:44px}.field-slot.inspect,.field-library-card.inspect{cursor:pointer}.field-selection{flex-wrap:wrap}
.owned-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.owned-tools select{width:100%;min-width:0}.owned-quick-filters{display:flex;gap:8px 20px;margin:12px 0}.owned-quick-filters label{display:flex;align-items:center;gap:8px;min-height:44px;font-size:12px}.owned-quick-filters input{width:18px;min-height:18px;accent-color:var(--blue)}
.owned-enhance-state{font-size:11px;color:var(--c-slate-49);padding:8px 10px;margin:0}.owned-enhance-state.ready{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink));background:var(--c-green-97);font-weight:700}
.detail-growth-summary{padding:12px 14px;margin:12px 0;border:1px solid var(--c-slate-90);border-radius:10px;background:var(--c-blue-96);display:grid;gap:5px}.detail-growth-summary.ready{background:var(--c-green-97);border-color:color-mix(in srgb,var(--p-green) 32%,var(--p-white));color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.detail-growth-summary span,.detail-growth-summary small{font-size:12px}.detail-section{margin:16px 0}.detail-section h3{font-size:14px}.detail-section .section-head>span{font-size:10px}
.detail-disclosure{border:1px solid var(--c-slate-90);border-radius:10px;background:var(--c-white);margin:12px 0;padding:0 12px}.detail-disclosure>summary{min-height:48px;align-content:center;font-size:12px;font-weight:700;cursor:pointer}.detail-disclosure[open]{padding-bottom:12px}.detail-disclosure .real-record-note{margin:0}
.player-quick-actions{display:flex;gap:8px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));flex-shrink:0;border-top:1px solid var(--c-slate-90);background:var(--c-white)}.player-quick-actions .btn{flex:1;min-width:0;min-height:48px}.detail-back{min-height:44px;margin-bottom:8px}.player-detail-sheet .sheet-body{overscroll-behavior:contain}
@media(max-width:500px){.player-quick-actions{padding-left:12px;padding-right:12px}.player-quick-actions .btn{font-size:12px}.owned-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.owned-tools label:last-child{grid-column:1/-1}.field-mode-switch .btn{font-size:12px}}
.situation-advice{padding:10px 12px;border-radius:10px;font-size:12px;line-height:1.55;margin:10px 0;}
.keyboard-help{font-size:10px;color:var(--c-slate-49);margin:6px 0}.dock-buttons{flex-wrap:wrap}.quick-prepare{background:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink));border-color:color-mix(in srgb,var(--p-green) 60%,var(--p-white));min-height:44px}.result-explanation{padding:12px;background:var(--c-blue-96);border:1px solid var(--c-slate-90);border-radius:12px;text-align:left;margin:12px 0;font-size:12px;line-height:1.55}.result-explanation>div{display:flex;gap:12px;font-weight:600;margin:8px 0}.result-explanation small{font-size:11px;color:var(--c-slate-42)}.result-explanation p{margin:6px 0}
.target-toggle{margin:8px 0;min-height:44px;font-size:12px}.target-toggle[aria-pressed="true"]{background:var(--c-gold-96);border-color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}.material-route{margin:8px 0}.growth-progress{display:grid;gap:10px;margin:16px 0}.growth-progress progress,.target-grid progress{width:100%;height:10px;accent-color:color-mix(in srgb,var(--p-blue) 60%,var(--p-white))}.target-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.target-grid article{display:flex;flex-direction:column;gap:8px;margin:0;padding:16px;min-width:0}.target-grid p,.target-grid small{font-size:12px}.target-player{display:flex;align-items:center;gap:12px;border:0;background:transparent;text-align:left;padding:0;min-height:88px}.target-player img{width:64px;height:86px;object-fit:contain}.target-player>span{display:grid;gap:5px}.target-grid .target-toggle{margin:0}.target-grid .block{margin-top:auto}
@media(max-width:760px){.keyboard-help{display:none}.target-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.target-grid article{padding:12px}.target-player{flex-direction:column;align-items:flex-start}.quick-prepare{flex-basis:100%}.result-explanation{font-size:11px}}
@media(max-width:400px){.target-grid{grid-template-columns:1fr}}
.result-explanation summary{min-height:44px;align-content:center;cursor:pointer;font-weight:700}.target-list-link{min-height:44px;margin-left:8px}.result-actions{position:sticky;bottom:calc(76px + env(safe-area-inset-bottom));z-index:3;background:var(--paper);border-radius:10px;padding:10px}.quick-prepare:after{content:'중요한 교체·도루 단계에서 멈춤';display:block;font-size:9px;font-weight:400;margin-top:4px}
/* Collection protection and explicit batch recycling, using the V2 sheet style. */
.inventory-buttons{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.inventory-buttons .btn{flex:1;min-width:0;min-height:44px;font-size:13px}.inventory-buttons .btn[aria-pressed="true"]{background:color-mix(in srgb,var(--p-g-r) 8%,var(--p-white));border-color:var(--c-blue-41);color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink))}.owned-player>.inventory-buttons{padding:0 10px}.inventory-note{padding:14px;margin:12px 0;background:var(--c-gold-96-2);border:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));border-radius:12px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));line-height:1.6}.bulk-list{display:grid;gap:8px;margin:12px 0}.bulk-row{display:grid;grid-template-columns:48px minmax(0,1fr) 88px;gap:10px;align-items:center;padding:12px;background:var(--c-white);border:1px solid var(--c-slate-90);border-radius:12px}.bulk-row>img{width:48px;height:64px;object-fit:contain}.bulk-row small{display:block;font-size:12px;color:var(--c-slate-42);margin-top:4px}.bulk-row b{font-size:14px}.bulk-row label{font-size:11px}.bulk-row input{width:100%;min-height:44px;margin-top:4px}.bulk-row.protected{background:var(--c-gray-96)}.bulk-row.protected small:last-child{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.bulk-footer{position:sticky;bottom:-16px;background:var(--paper);border-top:1px solid var(--c-slate-90);padding:10px 0 0;z-index:2}.bulk-footer .sheet-actions{position:static;margin:0}.bulk-footer p{margin:0;font-size:13px;font-weight:700}.bulk-row>strong{font-size:14px;text-align:right}.owned-quick-filters{flex-wrap:wrap}
@media(max-width:480px){.bulk-row{grid-template-columns:38px minmax(0,1fr) 72px;gap:8px;padding:10px}.bulk-row>img{width:38px;height:54px}.bulk-footer{bottom:-12px}.inventory-buttons .btn{font-size:12px;padding:8px}.bulk-row b{font-size:13px}}
/* Attack presets live inside the tactics editor. */
.tactic-presets{margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid var(--c-slate-90)}.tactic-preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tactic-preset{padding:14px;text-align:left;border:1px solid var(--c-slate-90);border-radius:12px;background:var(--c-white);color:var(--c-navy-15);min-width:0}.tactic-preset>span{display:flex;align-items:center;justify-content:space-between;gap:6px}.tactic-preset b{font-size:16px}.tactic-preset small{font-size:11px;color:var(--c-slate-49)}.tactic-preset strong{display:block;font-size:12px;color:var(--c-blue-41);margin-top:12px}.tactic-preset p{font-size:12px;line-height:1.6;margin:8px 0}.tactic-preset em{font-style:normal;font-size:12px;font-weight:700}.tactic-preset.selected{border-color:var(--c-blue-41);background:var(--c-blue-96);box-shadow:inset 0 0 0 1px var(--c-blue-41)}.tactic-preset:disabled{opacity:.75}.preset-intro{background:var(--c-blue-96);padding:14px;border-radius:12px;color:var(--c-navy-15)}.preset-intro p{margin:8px 0;font-size:13px}.preset-intro small{color:var(--p-slate)}.preset-comparison{width:100%;border-collapse:collapse;margin:16px 0;font-size:13px}.preset-comparison th,.preset-comparison td{padding:10px 6px;border-bottom:1px solid var(--c-slate-90);text-align:center}.preset-comparison th:first-child{text-align:left}.preset-comparison tr.changed{background:var(--c-blue-96)}.preset-comparison tfoot{font-weight:700}.preset-comparison tr.changed td:last-child{font-weight:700;color:var(--c-blue-41)}
@media(max-width:480px){.tactic-preset{padding:11px}.tactic-preset-grid{gap:8px}.tactic-preset b{font-size:14px}}
.diamond-broadcast{border:1px solid var(--c-slate-90);border-radius:14px;background:var(--c-white);padding:12px;margin:12px 0;color:var(--c-navy-15)}.broadcast-caption{display:flex;justify-content:space-between;align-items:center;gap:8px}.broadcast-caption b{font-size:14px}.broadcast-caption span{font-size:11px;color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink));white-space:nowrap}.broadcast-field{display:block;width:100%;max-width:330px;height:240px;margin:auto;background:radial-gradient(ellipse,color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)),color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)));border-radius:12px;margin-top:10px}.broadcast-field text{fill:var(--c-white);font-size:7px;font-weight:bold}.broadcast-fielder{display:flex;gap:10px;align-items:center;margin-top:8px}.broadcast-fielder img{width:38px;height:48px;object-fit:contain}.broadcast-fielder b,.broadcast-fielder span{display:block;font-size:12px}.diamond-broadcast details{font-size:12px;margin-top:8px;line-height:1.6}.diamond-broadcast details small{color:var(--c-slate-49)}.run-call{background:var(--c-green-97);border-radius:8px;padding:8px;font-size:12px}.advance-panel{padding:18px;border:2px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));border-radius:14px;background:var(--c-green-97)}.advance-panel h2{font-size:20px;margin:8px 0}.advance-chance{font-size:23px;color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.advance-panel p{font-size:13px}.advance-panel small{display:block;font-size:12px;color:var(--c-slate-42)}.advance-panel .sheet-actions{background:var(--c-green-97);z-index:2}.advance-panel .btn{min-height:46px}@media(max-width:480px){.broadcast-field{height:205px}.broadcast-caption{align-items:flex-start}.broadcast-caption b{font-size:13px}.advance-panel{padding:12px}.advance-panel h2{font-size:18px}}
.broadcast-fielder{border:0;background:transparent;width:100%;text-align:left;padding:0;min-height:48px;color:inherit;cursor:pointer}
/* Opponent scouting: preference, not a prediction of hidden choices. */
.ai-style-card{--style-accent:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink));margin:16px 0;border-radius:14px;background:var(--c-gray-96);color:var(--c-navy-15);overflow:hidden}
.ai-style-power{--style-accent:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.ai-style-speed{--style-accent:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.ai-style-onbase{--style-accent:var(--p-blue)}
.ai-style-card summary{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:14px;cursor:pointer;min-height:48px;font-size:12px;list-style:none}
.ai-style-card summary::-webkit-details-marker{display:none}.ai-style-card summary b{font-size:15px;color:var(--style-accent)}
.ai-style-toggle{margin-left:auto;font-size:11px}.ai-style-toggle:after{content:' ＋'}.ai-style-card[open] .ai-style-toggle:after{content:' −'}
.ai-style-body{padding:0 14px 14px;font-size:13px;line-height:1.6}.ai-style-body p{margin:0 0 10px}.ai-style-body small{display:block;margin-top:10px;font-size:11px;color:var(--c-slate-42)}
.ai-style-hint{display:grid;gap:3px;padding:10px 12px;background:var(--c-white);border-radius:9px}.ai-style-hint b{color:var(--style-accent);font-size:11px}
.opponent-note-panel .ai-style-card{margin:0 0 12px}.ai-style-card summary:focus-visible{outline:3px solid var(--p-blue);outline-offset:-3px}
.summary-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.summary-heading h2{margin:6px 0}.summary-heading p{font-size:13px;color:var(--c-slate-42)}.summary-heading .status-pill{white-space:nowrap}
.summary-scoreline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:18px 0}.summary-scoreline>div{display:grid;gap:8px;background:var(--c-blue-96);border-radius:12px;padding:14px 10px;text-align:center}.summary-scoreline small{font-size:11px;color:var(--c-slate-42)}.summary-scoreline b{font-size:21px;color:var(--c-navy-15)}
.season-summary h3{margin-top:24px}.summary-champion{background:var(--c-gold-96);border:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));padding:14px;border-radius:12px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));font-weight:600}
.season-mvp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.season-mvp-card{border:1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white));border-top:3px solid color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));background:linear-gradient(135deg,var(--c-orange-98),var(--c-white));border-radius:14px;padding:16px;min-width:0}.season-mvp-card .eyebrow{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.season-mvp-card p{font-size:12px;margin:10px 0 0;color:var(--c-slate-41)}
.season-mvp-player{display:flex;gap:12px;align-items:center;background:transparent;border:0;padding:12px 0 0;text-align:left;width:100%;color:var(--c-navy-15)}.season-mvp-player .player-art{width:76px;height:92px;object-fit:contain;flex-shrink:0}.season-mvp-player>span{display:grid;gap:6px;min-width:0}.season-mvp-player b{font-size:20px}.season-mvp-player small{font-size:11px;color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink))}.season-mvp-player strong{font-size:13px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}
.season-record-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:14px 0}.season-record-card{display:grid;gap:8px;border:1px solid var(--c-slate-90);border-radius:12px;padding:14px;background:var(--c-gray-96)}.season-record-card>span{font-size:12px;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}.season-record-card>b{font-size:27px}.season-record-card small{font-size:11px;color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink))}.season-record-card strong{font-size:12px;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}.season-record-card.record-broken{border-color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));background:var(--c-gold-98)}.season-record-card.record-broken strong{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}
.summary-rewards{display:grid;gap:8px;background:var(--c-navy-15);color:var(--c-white);border-radius:14px;padding:18px}.summary-rewards>b{font-size:28px;color:var(--c-green-91)}.summary-rewards span{font-size:13px;line-height:1.6}.season-summary .scoring-help{margin-top:12px}
@media(max-width:600px){.season-mvp-grid{grid-template-columns:1fr}.summary-scoreline{gap:6px}.summary-scoreline b{font-size:17px}.summary-scoreline>div{padding:12px 5px}.summary-heading{flex-wrap:wrap}.season-record-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.guide-impact{margin:16px 0;border:1px solid var(--c-blue-88);border-radius:13px;background:var(--c-gray-96);padding:0 14px 12px}.guide-impact>summary{padding:15px 0;min-height:48px;cursor:pointer;color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink));font-weight:600;font-size:14px}.guide-impact:not([open]){padding-bottom:0}.guide-impact label{display:grid;gap:7px;font-size:12px;color:var(--c-slate-42)}.guide-impact select{min-height:46px;width:100%;background:var(--c-white);border:1px solid var(--c-slate-80);border-radius:9px;padding:10px;color:var(--p-navy)}.impact-matchup{display:grid;gap:7px;padding:14px 0;font-size:13px}.impact-matchup>b{font-size:14px}.impact-matchup small{font-size:11px;color:var(--c-slate-42)}.impact-table{min-width:280px}.impact-table td,.impact-table th{white-space:nowrap;padding:12px 6px}.impact-enhancement{display:grid;gap:10px;background:var(--c-white);border-radius:10px;padding:13px;font-size:12px}.impact-enhancement>b{font-size:14px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.impact-enhancement strong{color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink))}.guide-impact .help{font-size:11px;line-height:1.6}

.bullpen-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.bullpen-slots article{min-width:0;padding:10px;border:1px solid var(--line,var(--c-slate-90));border-radius:14px;background:var(--c-white);display:flex;flex-direction:column;gap:8px}.bullpen-slots .rotation-face{width:100%;min-width:0;white-space:normal}.bullpen-slots .rotation-face img{width:64px;height:80px;object-fit:contain}.bullpen-empty{min-height:170px;border:1px dashed color-mix(in srgb,var(--p-blue) 32%,var(--p-white));border-radius:14px;background:var(--c-blue-96);color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.bullpen-empty strong{font-size:28px}.bullpen-slots .pitch-usage{white-space:normal}@media(max-width:500px){.bullpen-slots{grid-template-columns:repeat(2,minmax(0,1fr))}}

.enhancement-inline.metal-silver{color:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));background:linear-gradient(120deg,var(--c-slate-85),var(--c-white),var(--c-slate-80));border:1px solid color-mix(in srgb,var(--p-slate) 60%,var(--p-white));font-weight:700}.enhancement-inline.metal-gold{color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));background:linear-gradient(120deg,var(--p-gold),color-mix(in srgb,var(--p-gold) 32%,var(--p-white)),var(--p-gold));border:1px solid var(--p-g-ssr);font-weight:700}.player-card.finish-silver{box-shadow:inset 0 0 0 3px var(--c-slate-74)}.player-card.finish-gold{box-shadow:inset 0 0 0 3px var(--p-gold)}.enhance-player{position:relative;isolation:isolate;overflow:hidden;}.enhance-player.finish-silver{background:linear-gradient(125deg,var(--c-slate-85),var(--c-white),var(--c-slate-82))}.enhance-player.finish-gold{background:linear-gradient(125deg,var(--p-gold),var(--c-gold-96),var(--p-gold))}.enhance-burst{animation:enhance-pop .75s ease-out}.enhance-burst:after{content:'';position:absolute;inset:-80%;pointer-events:none;background:linear-gradient(105deg,transparent 42%,color-mix(in srgb,var(--c-white) 85.1%,transparent) 50%,transparent 58%);animation:enhance-shine 1.3s ease-out both}.enhance-miss{animation:enhance-miss .35s ease-out}.metal-bonus{background:var(--c-blue-96);font-weight:600}.metal-bonus small{display:block;margin-top:5px;font-weight:400}.enhance-steps span{min-width:0;padding:8px 1px;font-size:12px}@keyframes enhance-pop{0%{transform:scale(.95);filter:brightness(1.3)}65%{transform:scale(1.02)}100%{transform:scale(1)}}@keyframes enhance-shine{from{transform:translateX(-65%)}to{transform:translateX(65%)}}@keyframes enhance-miss{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}@media(prefers-reduced-motion:reduce){.enhance-burst,.enhance-burst:after,.enhance-miss{animation:none}}.reduced-motion .enhance-burst,.reduced-motion .enhance-burst:after,.reduced-motion .enhance-miss{animation:none}
.bullpen-advice{padding:14px;border:1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white));border-radius:12px;background:color-mix(in srgb,var(--p-green) 8%,var(--p-white));color:color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink));margin-bottom:12px}.bullpen-advice p{margin:6px 0}.bullpen-advice small{display:block;line-height:1.65}.bullpen-recommend-badge{display:inline-block;padding:3px 7px;border-radius:5px;background:color-mix(in srgb,var(--p-green) 16%,var(--p-white));color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink));font-size:12px;font-style:normal;font-weight:600}.bullpen-energy{display:grid;gap:5px;margin-top:7px;font-size:12px;color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink))}.bullpen-energy.tired{color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.bullpen-energy meter{width:100%;height:12px}.candidate-list .candidate>span{min-width:0}.candidate-list .candidate b{overflow-wrap:anywhere}
.bullpen-dialog>.sheet-actions{position:static;margin:0;flex-shrink:0}.bullpen-dialog .candidate-list{max-height:none!important;overflow:visible!important}
/* Season challenges and owned-card recommendation use the existing V2 palette. */
.auto-deck-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0}.auto-deck-metrics>div{padding:12px;border-radius:12px;background:var(--c-blue-96);display:grid;gap:5px}.auto-deck-metrics span{font-size:12px;color:var(--c-slate-49)}.auto-deck-metrics b{font-size:17px;color:var(--c-navy-15)}.auto-deck-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.auto-deck-list>div{display:flex;align-items:center;gap:8px;min-width:0;padding:8px;border:1px solid var(--c-slate-90);border-radius:12px}.auto-deck-list img{width:42px;height:52px;object-fit:contain;flex-shrink:0}.auto-deck-list>div>span:not(.grade){flex:1;min-width:0}.auto-deck-list .grade{flex:0 0 auto}.auto-deck-list small{display:block;color:var(--c-slate-49);margin-top:4px}.title-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.title-controls label{display:grid;gap:4px;font-size:12px;color:var(--c-slate-49)}.title-controls select{min-width:130px}.title-controls .tabs{margin:0;flex:1}.title-list{display:grid;gap:8px}.title-player{display:flex;align-items:center;gap:12px;width:100%;padding:12px;text-align:left;border:1px solid var(--c-slate-90);border-radius:12px;background:var(--c-white);color:var(--c-navy-15)}.title-player.my-club{background:var(--c-blue-96);border-color:color-mix(in srgb,var(--p-g-r) 60%,var(--p-white))}.title-rank{min-width:46px;font-size:13px;color:var(--c-slate-49)}.title-player img{width:42px;height:52px;object-fit:contain}.title-player>span{flex:1;min-width:0}.title-player small{display:block;font-size:12px;color:var(--c-slate-49);margin-top:5px}.title-value{font-size:23px;font-variant-numeric:tabular-nums;color:var(--p-blue)}.season-event-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}.season-event{display:flex;flex-direction:column;gap:12px;padding:20px;background:var(--c-gray-96);border:1px solid var(--c-slate-90);border-radius:16px;min-width:0}.season-event h3,.season-event p{margin:0}.season-event p{font-size:13px;line-height:1.6;color:var(--c-slate-49);flex:1}.season-event strong{font-size:14px}.season-event.claimed{background:var(--c-green-97);border-color:color-mix(in srgb,var(--p-green) 60%,var(--p-white))}.event-reward{font-size:23px;color:var(--p-g-ssr)}.league-main-tabs{overflow-x:auto;flex-wrap:nowrap}.league-main-tabs button{white-space:nowrap;flex-shrink:0}
@media(max-width:600px){.auto-deck-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.auto-deck-list{grid-template-columns:1fr}.title-controls{align-items:stretch;flex-direction:column;gap:8px}.title-controls label{grid-template-columns:35px 1fr;align-items:center}.title-player{gap:8px;padding:10px}.title-rank{min-width:36px;font-size:11px}.title-value{font-size:21px}.season-event-grid{grid-template-columns:1fr}.season-event{gap:8px;padding:16px}}

/* LR: aurora foil, with readable ink and an explicit text badge. */

.grade-badge[data-grade="LR"]{border:1px solid color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c-white) 12.5%,transparent)}
.player-card[data-grade="LR"]{border:2px solid var(--p-g-n);background:var(--c-white);}
.rarity-lr .player-card-art{background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-lr) 16%,var(--p-white)),color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white)) 55%,color-mix(in srgb,var(--p-blue) 16%,var(--p-white)));border-color:var(--p-g-n)}
.lr-card-skill{display:block;color:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink))!important;font-weight:800;padding-top:6px}
.lr-power{border-radius:12px;padding:18px;margin:16px 0;background:linear-gradient(120deg,color-mix(in srgb,var(--p-green) 16%,var(--p-white)),var(--c-purple-94));color:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));line-height:1.65}
.lr-power .eyebrow{color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink))}.lr-power h3{font-size:20px;margin:6px 0}.lr-power p{font-size:13px}.lr-power strong,.lr-power small{display:block}.lr-power small{margin-top:5px;color:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink));font-size:12px}

.grade-odds{grid-template-columns:repeat(5,minmax(0,1fr))}.grade-odds small{text-align:center;overflow-wrap:anywhere}
[data-grade="LR"]>.pack-rays{display:block;border-radius:50%;background:repeating-conic-gradient(color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 33.3%,transparent) 0deg 12deg,color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 20.8%,transparent) 12deg 25deg,transparent 25deg 40deg);mask-image:radial-gradient(var(--c-black),transparent 68%);animation:lr-orbit 3s ease-out both}
.pack-opening .reveal-slot[data-grade="LR"]>.player-card{animation-name:lr-reveal;}
.reveal-slot[data-grade="LR"]>.reveal-burst{display:block;animation:rarity-burst 1.5s ease-out both;animation-delay:var(--delay)}
.pack-opening .reveal-slot[data-grade="LR"]:after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:10px;background:linear-gradient(110deg,transparent 35%,color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 32%,var(--p-white)) 62.7%,transparent) 48%,color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 50.2%,transparent) 52%,transparent 65%);background-size:300% 100%;animation:rarity-shine 1.7s ease-out both;animation-delay:var(--delay)}
@keyframes lr-orbit{from{transform:rotate(-80deg) scale(.5);opacity:0}to{transform:rotate(35deg) scale(1.25);opacity:1}}
@keyframes lr-reveal{0%{opacity:0;transform:scale(.65) rotateY(-75deg)}55%{opacity:1;transform:scale(1.035);box-shadow:0 0 42px color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 62.7%,transparent),0 0 22px color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 43.9%,transparent)}100%{opacity:1;transform:none;box-shadow:0 0 18px color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 25.1%,transparent)}}
@media(max-width:600px){.grade-odds{grid-template-columns:repeat(3,minmax(0,1fr))}.lr-power{padding:14px}.lr-card-skill{font-size:10px}}
@media(prefers-reduced-motion:reduce){.pack-opening .reveal-slot[data-grade="LR"]>.player-card{animation:none;opacity:1;transform:none}.pack-opening [data-grade="LR"]>.pack-rays{animation:none;opacity:.35}.pack-opening .reveal-slot[data-grade="LR"]:after,.reveal-slot[data-grade="LR"]>.reveal-burst{display:none}}

/* A skipped reveal must not leave its bright burst over the card text. */
.pack-opening.reveal-complete .reveal-slot>.reveal-burst,.pack-opening.reveal-complete .reveal-slot:after{display:none}

/* Original animal emblems: recognizable at selection and scoreboards. */
.team-logo,.card-club,.club-collection img{object-fit:contain}
.team-grid button{min-height:144px;padding:12px 6px;gap:9px}
.team-grid .team-logo{width:76px;height:76px;object-fit:contain}
.team-grid button>b{font-size:13px}
.starter-preview{gap:14px}
.starter-mascot{width:76px;height:76px;object-fit:contain;flex-shrink:0}
.starter-preview>div:first-of-type{flex:1;min-width:0}
@media(max-width:600px){.team-grid{gap:8px}.team-grid button{min-height:125px}.team-grid .team-logo{width:68px;height:68px}.starter-mascot{width:58px;height:58px}.starter-preview{flex-wrap:wrap}.starter-preview .mini-players{margin-left:auto}.starter-preview h2{font-size:18px}}

.auto-deck-controls{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center}.auto-deck-controls label{font-weight:700}.auto-deck-controls select{min-width:0;width:100%}.auto-deck-summary{padding:14px;border-radius:12px;background:var(--c-blue-96);color:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));line-height:1.6}.auto-deck-summary b{color:var(--p-blue)}@media(max-width:480px){.auto-deck-controls{grid-template-columns:minmax(0,1fr) auto}.auto-deck-controls label{grid-column:1/-1}}

.compare-delta{display:block;font-size:12px;font-weight:700;margin-top:4px}.compare-delta.up,.compare-section .up{color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink))}.compare-delta.down,.compare-section .down{color:var(--p-red)}.compare-delta.same{color:var(--c-slate-49)}.compare-section{padding:16px;border:1px solid var(--c-slate-90);border-radius:14px;margin:16px 0;background:var(--c-white)}.compare-section h3{margin:0 0 12px}.compare-set-list>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--c-gray-91)}.compare-set-list small,.lineup-compare small{display:block;color:var(--c-slate-49);font-size:12px;margin-top:4px}.lineup-compare>div{display:grid;grid-template-columns:36px 1fr 20px 1fr;gap:8px;padding:12px 0;border-bottom:1px solid var(--c-gray-91)}.lineup-compare i{align-self:center;font-style:normal}.season-compare-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.season-compare-controls>label{flex:1;min-width:160px}.check-line{display:flex;align-items:center;gap:10px;line-height:1.5}.check-line input{width:20px;min-width:20px;height:20px}.season-compare-list{display:grid;gap:12px;margin:16px 0}.season-compare-card{padding:14px;background:var(--c-white);border:1px solid var(--c-slate-90);border-radius:14px}.season-compare-card.current{border:2px solid var(--p-blue);background:var(--c-blue-96)}.season-compare-card .section-head{gap:8px;flex-wrap:wrap;margin-bottom:12px}.season-compare-card .section-head>span{font-size:12px}.season-stat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.season-stat-grid>div{display:grid;gap:5px;text-align:center;padding:8px 2px;background:var(--c-gray-96);border-radius:8px}.season-stat-grid small{color:var(--c-slate-49)}.season-stat-grid .compare-delta{font-size:11px}.backup-comparison{display:grid;grid-template-columns:1fr 1fr;gap:12px}.backup-comparison>section{padding:14px;background:var(--c-blue-96);border-radius:14px;min-width:0}.backup-summary{display:grid;gap:9px;overflow-wrap:anywhere;font-size:14px}.compare-section input[type=file]{width:100%;min-width:0;font-size:13px}.live-sheet .sheet-actions{background:var(--c-white);padding:14px;border-top:1px solid var(--c-slate-90)}.compare-section p{line-height:1.65}@media(max-width:480px){.backup-comparison{grid-template-columns:1fr}.compare-section{padding:12px}.season-stat-grid{gap:3px}.season-compare-card{padding:10px}.compare-set-list>div{font-size:13px}.lineup-compare>div{font-size:13px;grid-template-columns:28px 1fr 12px 1fr}}
.matchup-panel{margin:16px 0}.matchup-panel>summary h3{margin:4px 0}.matchup-body{padding-top:16px}.matchup-starters{display:grid;grid-template-columns:1fr 1fr;gap:14px}.matchup-starter{background:var(--c-blue-96);border:1px solid var(--c-slate-90);border-radius:14px;padding:14px;min-width:0}.matchup-starter>small{display:block;color:var(--c-slate-42);font-size:12px;line-height:1.6}.matchup-starter button{display:flex;gap:12px;align-items:center;width:100%;text-align:left;margin:8px 0;padding:0;background:none;border:0;color:inherit}.matchup-starter button img{width:64px;height:76px;object-fit:contain;flex-shrink:0}.matchup-starter button span{min-width:0}.matchup-starter button b,.matchup-starter button small{display:block;margin-bottom:5px}.matchup-starter>div{font-size:14px;line-height:1.7}.matchup-table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14px;table-layout:fixed}.matchup-table caption{caption-side:bottom;text-align:left;color:var(--c-slate-49);font-size:12px;padding:10px 0;line-height:1.6}.matchup-table th,.matchup-table td{padding:10px 5px;text-align:center;border-bottom:1px solid var(--c-gray-91)}.matchup-table thead{color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink));background:var(--c-gray-96)}.matchup-table .compare-delta{margin:0}.matchup-bullpen{background:color-mix(in srgb,var(--p-green) 8%,var(--p-white));padding:14px;border-radius:14px}.matchup-bullpen.caution{background:var(--c-gold-96-2)}.matchup-bullpen p{font-size:13px;line-height:1.6}.matchup-relief{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.matchup-relief button{display:grid;gap:6px;background:var(--c-white);border:1px solid var(--c-gray-91);border-radius:10px;padding:10px 4px;color:var(--p-navy);font-size:13px}.matchup-relief span{font-size:12px;color:var(--c-slate-49)}@media(max-width:480px){.matchup-starters{gap:8px}.matchup-starter{padding:9px}.matchup-starter button{gap:5px;flex-wrap:wrap}.matchup-starter button img{width:48px;height:60px}.matchup-starter button b{font-size:14px}.matchup-starter button small{font-size:11px}.matchup-table{font-size:12px}.matchup-table th,.matchup-table td{padding:9px 2px}.matchup-relief{grid-template-columns:repeat(2,minmax(0,1fr))}.matchup-bullpen .section-head{flex-wrap:wrap;gap:6px}}

/* Give deck-wide actions their own breathing room below the deck summary. */
.make-deck .deck-toolbar{display:grid;}
.make-deck .deck-toolbar>.btn{min-height:48px;padding:10px 18px;border-radius:12px;font-size:14px;white-space:nowrap}
.make-deck .deck-toolbar>span{max-width:none;min-width:0;font-size:12px;line-height:1.65;text-align:left}
.make-deck .deck-toolbar>.text-btn{min-height:44px;padding:8px 0 8px 12px;font-size:12px;white-space:nowrap;justify-self:end}
@media(max-width:640px){
 
 .make-deck .deck-toolbar>.btn{grid-column:1;grid-row:1;padding:10px 14px;font-size:13px}
 .make-deck .deck-toolbar>.text-btn{grid-column:2;grid-row:1;font-size:11px}
 .make-deck .deck-toolbar>span{grid-column:1/-1;grid-row:2;font-size:11px}
}

.deck-identity{display:grid;gap:14px 24px;padding:18px;margin:10px 0;background:var(--c-white);border:1px solid var(--line);border-radius:14px}
.deck-identity>div{display:flex;align-items:center;gap:8px}.deck-identity small{width:100%;color:var(--muted)}.deck-identity label{display:grid;gap:8px;font-size:12px}.deck-identity select{min-width:0;width:100%}.deck-identity p{grid-column:1/-1;margin:0;color:var(--muted);font-size:12px;line-height:1.6}
.pack-opening .reveal-slot>.player-card{animation-duration:.45s}.pack-opening .reveal-slot[data-grade="LR"]>.player-card{animation-duration:.65s}.pack-opening .reveal-slot>.reveal-burst{animation-duration:.55s}.pack-opening .reveal-slot:after{animation-duration:.65s}
@media(max-width:640px){.deck-identity{padding:14px;gap:14px}.deck-identity p{font-size:11px}}

.starter-edition{display:block;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));background:var(--c-gold-96);border-radius:5px;padding:4px 6px;margin:7px 0;font-weight:700;font-size:11px}.league-manage{display:flex;justify-content:flex-end;margin:12px 0}

/* Keep pack reveals on compositor-friendly transform/opacity tracks. */
.pack-opening::backdrop{backdrop-filter:none}
.pack-opening .reveal-slot>.player-card{animation-name:pack-slide;filter:none}
.pack-opening .reveal-slot[data-grade="R"]>.player-card{animation-name:pack-turn}
.pack-opening .reveal-slot[data-grade="SR"]>.player-card,.pack-opening .reveal-slot[data-grade="SSR"]>.player-card,.pack-opening .reveal-slot[data-grade="LR"]>.player-card{animation-name:pack-rise}
.pack-opening .reveal-slot:after{background-size:100% 100%;animation-name:pack-glint}
.pack-opening .pack-rays{animation-duration:.65s}
@keyframes pack-slide{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes pack-turn{from{opacity:0;transform:rotateY(-65deg)}to{opacity:1;transform:none}}
@keyframes pack-rise{0%{opacity:0;transform:scale(.88) translateY(10px)}65%{opacity:1;transform:scale(1.025)}100%{opacity:1;transform:none}}
@keyframes pack-glint{0%{opacity:0;transform:translateX(-35%)}35%{opacity:.6}100%{opacity:0;transform:translateX(35%)}}
@media(prefers-reduced-motion:reduce){.pack-opening .reveal-slot>.player-card,.pack-opening .reveal-slot:after{animation:none!important}}

.deck-identity{grid-template-columns:1fr}.deck-identity>div{flex-wrap:wrap}

/* Deck editor: one slot selector, tools separated from the roster. */
.make-deck .deck-toolbar{grid-template-columns:1fr auto;padding:0;}
.make-deck .deck-toolbar>.btn{justify-self:start}
.make-deck>.tabs{margin:0 0 24px;gap:8px}
.make-deck .slot-panel{margin:0 0 24px;padding:20px}
.make-deck .slot-panel .saved-decks{margin:0 0 20px}
.make-deck .deck-save-target{gap:16px}
.make-deck .assist-note{margin:8px 0 20px;line-height:1.6}
.make-deck .pitch-role-tools{margin:24px 0;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--c-white)}
.make-deck .pitch-role-tools>summary{cursor:pointer;font-weight:700;min-height:32px}
.make-deck .pitch-role-tools[open]>summary{margin-bottom:16px}
.make-deck .roster-groups{margin-top:24px;gap:20px}
@media(max-width:640px){.make-deck>.tabs{gap:2px;margin-bottom:20px}.make-deck .slot-panel{padding:16px}.make-deck .deck-toolbar>.text-btn{font-size:12px;padding:8px}}

.owned-tools,.field-filter{gap:12px}.owned-tools>label,.field-filter>label{min-width:0}.owned-tools select,.field-filter select{max-width:100%}

.roster-mode-tabs{display:flex;gap:12px;margin-bottom:10px}.roster-mode-tabs>.btn{flex:1}.friendly-starter{padding:18px;background:var(--c-blue-96);border:1px solid var(--c-blue-88);border-radius:14px;margin:16px 0 28px}.friendly-starter .bench-chips{margin:14px 0}.friendly-starter>div>b{float:right}.friendly-starter>div>span{display:block;font-size:12px;margin-top:12px}
.make-deck .rotation-cards article{display:grid;align-items:center;text-align:left}.make-deck .rotation-cards article:last-child{grid-column:auto}.make-deck .rotation-cards .rotation-face,.make-deck .rotation-cards article:last-child .rotation-face{min-height:0;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;gap:8px}.make-deck .rotation-face .pitch-usage{width:100%;font-size:11px}.make-deck .rotation-cards .text-btn{font-size:12px;min-height:44px}.make-deck .rotation-editor>.section-head{flex-wrap:wrap;gap:8px}
@media(max-width:420px){.make-deck .rotation-face b{font-size:13px}}

.make-deck .deck-layout.editor-only{grid-template-columns:minmax(0,1fr)}

.enhance-ready-badge{display:inline-block;color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink));background:color-mix(in srgb,var(--p-green) 16%,var(--p-white));padding:4px 8px;border-radius:6px;font-weight:700}.enhance-bulk-tools{display:flex;gap:12px;margin:20px 0}.enhance-list{display:grid;gap:12px}.enhance-list article{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px}.enhance-list input{width:20px;height:20px}.enhance-row-player{display:flex;align-items:center;flex:1;min-width:0;gap:12px;text-align:left;border:0;background:none;color:var(--navy)}.enhance-row-player img{width:44px;height:60px;object-fit:contain}.enhance-row-player small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.make-deck>.tabs{overflow-x:auto;flex-wrap:nowrap}.make-deck>.tabs>button{white-space:nowrap;flex-shrink:0}

/* Compact rotation rows; retain 44px touch targets. */

.make-deck .rotation-editor h3{font-size:15px}
.make-deck .rotation-editor .section-head>span{font-size:11px}
.make-deck .rotation-cards{margin:12px 0}
.make-deck .rotation-cards article{grid-template-columns:32px minmax(0,1fr) 44px 88px;padding:8px;gap:6px;border-radius:10px}
.make-deck .rotation-cards article>div{grid-column:auto;gap:2px}
.make-deck .rotation-cards article>div>.btn{padding:0;min-width:42px;min-height:44px}
.make-deck .rotation-cards .rotation-face{gap:5px;display:grid;}
.make-deck .rotation-face img{width:32px;height:40px;grid-row:1/3}
.make-deck .rotation-face b{font-size:13px}
.make-deck .rotation-face .pitch-role{grid-column:2/4;justify-self:start;font-size:9px;padding:2px 4px}
.make-deck .rotation-face .pitch-usage{grid-column:2/4;font-size:10px}
.make-deck .rotation-cards .text-btn{padding:0;font-size:11px}
.make-deck .rotation-cards .eyebrow{font-size:10px;letter-spacing:0}
.make-deck .rotation-cards .grade-badge{font-size:9px;padding:2px 4px}
@media(max-width:420px){.make-deck .rotation-cards article{gap:3px;padding:6px}.make-deck .rotation-face img{width:26px;height:36px}.make-deck .rotation-face b{font-size:12px}}

.make-deck .rotation-cards article:last-child .rotation-face{display:grid;min-height:0}

.bulk-enhance-dialog{max-width:860px}.bulk-enhance-dialog .sheet-body{background:var(--c-gray-96)}.bulk-hero{background:linear-gradient(120deg,var(--c-navy-15),color-mix(in srgb,var(--p-blue) 80%,var(--p-ink)));color:var(--c-white);border-radius:14px;padding:20px;margin-bottom:18px}.bulk-hero.metal-silver{background:linear-gradient(120deg,var(--p-navy),color-mix(in srgb,var(--p-slate) 80%,var(--p-ink)))}.bulk-hero.metal-gold{background:linear-gradient(120deg,color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)),color-mix(in srgb,var(--p-gold) 55%,var(--p-ink)))}.bulk-hero>span{font-size:10px;letter-spacing:2px;color:color-mix(in srgb,var(--p-blue) 32%,var(--p-white))}.bulk-hero h3{font-size:24px;margin:8px 0}.bulk-hero p{font-size:12px;color:var(--c-slate-90);margin:0}.bulk-settings{display:grid;grid-template-columns:1fr 1fr;gap:14px}.bulk-settings label{font-size:12px;display:grid;gap:8px}.bulk-settings select{width:100%;min-width:0}.bulk-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}.bulk-summary>div{background:var(--c-white);padding:12px;border:1px solid var(--line);border-radius:10px}.bulk-summary small,.bulk-summary b{display:block}.bulk-summary small{font-size:10px;color:var(--muted);margin-bottom:7px}.bulk-summary b{font-size:20px}.bulk-rule{font-size:12px;line-height:1.7;color:color-mix(in srgb,var(--p-g-n) 80%,var(--p-ink));margin-bottom:18px}.bulk-player-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}.bulk-player{display:flex;align-items:center;gap:12px;padding:14px;background:var(--c-white);border:1px solid var(--line);border-radius:14px;min-width:0}.bulk-portrait{width:64px;flex-shrink:0;text-align:center;border-radius:10px;background:var(--c-blue-96);padding:6px}.bulk-portrait img{width:52px;height:66px;object-fit:contain;display:block;margin:auto}.bulk-player-body{min-width:0;flex:1}.bulk-player-body>b{font-size:15px}.bulk-player-body>small{display:block;font-size:11px;color:var(--muted);margin-top:6px}.bulk-level{display:flex;gap:10px;align-items:center;margin:10px 0;font-size:13px}.bulk-level>strong{color:var(--c-blue-41)}.bulk-cost{display:inline-block;font-size:11px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));background:var(--c-gold-96-2);border-radius:6px;padding:5px 7px;margin:4px 0}.bulk-cost.achieved{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink));background:color-mix(in srgb,var(--p-green) 16%,var(--p-white))}.bulk-confirm-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-top:1px solid var(--line);background:var(--c-white)}.bulk-confirm-footer small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.bulk-confirm-footer b{font-size:13px}.bulk-confirm-footer .btn{white-space:nowrap}@media(max-width:640px){.bulk-player-list{grid-template-columns:1fr}.bulk-player{padding:12px}.bulk-confirm-footer{padding:12px;flex-wrap:wrap}.bulk-confirm-footer>.btn{flex:1}.bulk-hero{padding:16px}.bulk-settings{gap:10px}}

/* Library filters: search owns a full row after club and position. */
.field-library .field-filter{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px;align-items:start}
.field-library .field-filter>label{min-width:0;display:grid;gap:8px}
.field-library .field-filter>label:last-child{grid-column:1/-1}
.field-library .field-filter select{width:100%;min-width:0}
.field-library .search-inline{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;width:100%}
.field-library .search-inline input{min-width:0;width:100%}
.field-library .search-inline .btn{min-width:64px;white-space:nowrap}
.field-library>label{display:inline-flex;align-items:center;gap:8px;margin:8px 16px 12px 0;font-size:12px;min-height:36px}
.field-library>label>input[type="checkbox"]{width:18px;height:18px;margin:0;flex:none}
.field-library>label{flex-direction:row}

/* Consistent owned enhancement levels in roster and field surfaces. */
.make-deck .enhancement-inline{white-space:nowrap;padding:1px 4px;line-height:16px;flex:none}
.make-deck .rotation-face b{display:flex;align-items:center;flex-wrap:wrap;gap:3px}
.make-deck .rotation-face b .enhancement-inline{font-size:9px!important;line-height:13px;min-height:17px;padding:0 3px}

/* Deck workspace rhythm and readable, non-overlapping card metadata. */
.make-deck .btn,.make-deck select,.make-deck input:not([type=checkbox]){min-height:44px;border-radius:10px;font-size:13px}
.make-deck .btn{padding:10px 14px;line-height:1.35}
.make-deck .section-head{gap:10px;margin-bottom:12px}
.make-deck .deck-toolbar{gap:12px;align-items:center}
.make-deck .deck-editor{min-width:0}
.make-deck .field-slot{display:grid;grid-template-columns:minmax(0,1fr);align-content:center;justify-items:center;gap:2px;padding:4px}
.make-deck .field-slot>.field-position,.make-deck .field-slot>img,.make-deck .field-slot>b{grid-column:1/-1}
.make-deck .field-slot>img{height:32px;width:100%;object-fit:contain}
.make-deck .field-slot .field-card-meta small{font-size:8px}
.make-deck .field-slot .grade-badge{padding:2px 3px;font-size:9px}
.make-deck .field-assist{display:flex;flex-wrap:wrap;gap:8px;padding:10px;margin:10px 0}
.make-deck .field-assist>small{flex-basis:100%;font-size:11px}
.make-deck .field-selection{padding:9px 10px;min-height:44px}
.make-deck .field-selection small{font-size:11px}
.make-deck .field-mode-switch{gap:8px;margin:10px 0}
.make-deck .field-mode-switch>.btn{flex:1}
.make-deck .bullpen-slots{gap:8px}
.make-deck .bullpen-slots article{padding:8px;gap:6px}
.make-deck .bullpen-slots .rotation-face{min-height:0;gap:5px}
.make-deck .bullpen-slots .rotation-face img{width:36px;height:44px}
.make-deck .help,.make-deck .assist-note{font-size:12px;line-height:1.55}
@media(max-width:760px){
 .make-deck .deck-status h2{font-size:20px;}.make-deck .deck-status p{font-size:11px;margin:6px 0 0}
 .make-deck>.tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;margin-bottom:12px;overflow:visible}.make-deck>.tabs>button{padding:10px 0;min-width:0;min-height:44px;font-size:11px}
 .make-deck .section-head h3{font-size:15px}.make-deck .section-head .eyebrow{font-size:9px}
 .make-deck .roster-mode-tabs{gap:8px}.make-deck .assist-note{margin:6px 0 12px}
 .make-deck .bench-chips{gap:6px}.make-deck .bench-chips button{min-height:44px;padding:7px 9px;font-size:12px}
 .make-deck .roster-groups{margin-top:12px;gap:12px}.make-deck .pitch-role-tools{margin:12px 0;padding:10px}
 .make-deck .field-layout{margin-top:10px;gap:12px}
 .make-deck .roster-field>.field-slot{width:min(94px,27%)}.make-deck .field-reserves{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 .make-deck .field-slot>b{font-size:11px}.make-deck .field-slot>.field-position{font-size:8px}.make-deck .field-legend{margin:8px 0;font-size:10px}
 .make-deck .field-assist>.btn{flex:1;padding:8px 5px;font-size:11px}.make-deck .field-selection small{display:none}
 .make-deck .owned-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.make-deck .enhance-bulk-tools{gap:8px;margin:12px 0}.make-deck .enhance-bulk-tools .btn{flex:1;padding:8px;font-size:12px}
 .make-deck .save-dock{padding:8px 12px}.make-deck .save-dock .btn{min-height:44px;padding:9px 16px}.make-deck .save-dock b{font-size:12px}
}
@media(max-width:760px){
 .make-deck .deck-status{align-items:flex-start;gap:8px}.make-deck .deck-status>div:first-child{min-width:0;flex:1}.make-deck .deck-status p{position:static;white-space:normal;line-height:1.5}.make-deck .slot-switch{position:static;flex:none;align-self:center}.make-deck .slot-switch button{width:36px;height:44px}
 .make-deck .owned-tools>label:last-child{grid-column:auto}
 .make-deck .enhance-workshop .owned-tools{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 54px;align-items:end}.make-deck .enhance-workshop .owned-tools .btn{padding:8px 4px}
 .make-deck .friendly-starter .bench-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.make-deck .friendly-starter .bench-chips button{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:3px;padding:6px;font-size:11px}.make-deck .friendly-starter .pitch-role{font-size:9px;padding:2px 3px}
}

/* One centered metadata row for every field and reserve card. */
.make-deck .field-slot>.field-card-meta{grid-column:1;grid-row:4;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:3px;width:100%;height:20px}
.make-deck .field-slot .field-card-meta small{white-space:nowrap;line-height:18px}
.make-deck .field-slot .field-card-meta .enhancement-inline{position:static;min-width:22px;min-height:18px;padding:0 2px;line-height:16px;font-size:9px!important;box-shadow:none}
.make-deck .field-slot .field-card-meta .grade-badge{min-width:0;font-size:9px;padding:2px 3px}

/* Compact batting order: fixed single-row placement at every breakpoint. */
.make-deck .lineup-row{grid-template-columns:24px 20px 36px minmax(70px,1fr) 40px 34px 88px;grid-template-rows:52px;gap:5px;padding:4px 0;min-height:60px;align-items:center}
.make-deck .lineup-row>.drag-handle{grid-area:1/1/2/2;width:100%;height:44px}
.make-deck .lineup-row>.order{grid-area:1/2/2/3;font-size:14px;text-align:center}
.make-deck .lineup-row>.lineup-photo{grid-area:1/3/2/4;width:100%;min-height:44px}
.make-deck .lineup-row .player-art{width:30px;height:40px;object-fit:contain}
.make-deck .lineup-row>.lineup-name{grid-area:1/4/2/5;min-width:0;min-height:44px;padding:3px 0;overflow-wrap:normal}
.make-deck .lineup-row>.lineup-name b{font-size:12px;display:flex;flex-wrap:wrap;align-items:center;gap:3px}
.make-deck .lineup-row>.lineup-name>span{font-size:9px;display:block;margin-top:3px}
.make-deck .lineup-row>.lineup-edit{grid-area:1/5/2/6;width:100%;min-height:44px;padding:4px;font-size:10px;justify-self:center}
.make-deck .lineup-row>.lineup-edit small{display:none}
.make-deck .lineup-row>.grade-badge{grid-area:1/6/2/7;display:inline-flex;justify-self:center;font-size:9px;padding:3px 4px}
.make-deck .lineup-row>.move-buttons{grid-area:1/7/2/8;display:flex;width:100%}
.make-deck .lineup-row .move-buttons button{width:50%;height:44px;padding:0}
@media(max-width:600px){.make-deck .lineup-row{grid-template-columns:16px 16px 28px minmax(56px,1fr) 30px 28px 64px;gap:3px;grid-template-rows:50px;min-height:56px;padding:3px 0}.make-deck .lineup-row .player-art{width:28px;height:36px}.make-deck .lineup-row .enhancement-inline{min-width:20px;padding:0 2px}.make-deck .lineup-row>.lineup-name b{font-size:11px;gap:2px}}
.make-deck .lineup-row .move-buttons button{min-width:0;flex:1}.make-deck .lineup-row>.move-buttons{min-width:0}.make-deck .lineup-row>.drag-handle{min-width:0}

/* Shared compact controls for roster improvement tools. */
.auto-fixed,.unavailable-players{border:1px solid var(--line);border-radius:12px;padding:12px;margin:12px 0;background:var(--c-gray-96)}
.auto-fixed summary,.unavailable-players summary{min-height:32px;cursor:pointer;font-size:13px;font-weight:700}
.auto-fixed-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:320px;overflow-y:auto}
.auto-fixed-list label{display:flex;flex-direction:row;align-items:center;gap:6px;border:1px solid var(--line);background:var(--c-white);border-radius:8px;padding:6px;min-width:0;font-size:12px}
.auto-fixed-list input,.auto-season-option input,.enhance-roster input{width:18px;height:18px;min-height:18px;margin:0;flex:none}
.auto-fixed-list img{width:28px;height:36px;object-fit:contain}.auto-fixed-list small{display:block;font-size:10px;margin-top:3px}.auto-fixed-list span{min-width:0}
.auto-season-option{display:flex;flex-direction:row;align-items:center;gap:8px;min-height:44px;font-size:13px}
.enhance-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}.enhance-filters label{display:grid;gap:6px;font-size:12px;min-width:0}.enhance-filters select{width:100%;min-width:0}.enhance-filters .enhance-roster{grid-column:1/-1;display:flex;flex-direction:row;align-items:center;gap:8px;min-height:32px}
.compare-energy{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.compare-energy>div{display:grid;gap:6px;padding:10px;border-radius:9px;background:var(--c-blue-96)}.compare-energy small{font-size:11px}.compare-energy meter{width:100%}
.unavailable-players>div{display:flex;justify-content:space-between;gap:8px;padding:8px 0;font-size:12px}.unavailable-players span{color:var(--c-slate-49)}
@media(max-width:600px){.auto-fixed-list{grid-template-columns:repeat(2,minmax(0,1fr))}.enhance-filters{gap:7px}.enhance-filters select{font-size:11px;padding:6px}.unavailable-players>div{flex-wrap:wrap}}

/* Result progression remains visible independently of result-panel scroll. */
@media(max-width:899px){
 .match-shell[data-phase="result"]{padding-bottom:64px}
 .match-shell[data-phase="result"] .result-actions{position:fixed;left:0;right:0;bottom:calc(72px + env(safe-area-inset-bottom));z-index:25;margin:0;border-radius:0;border-top:1px solid var(--c-slate-90);background:var(--c-white);padding:8px 12px;box-shadow:0 -3px 12px color-mix(in srgb,var(--c-navy-15) 6.3%,transparent)}
 .match-shell[data-phase="result"] .result-actions .btn{min-height:44px;padding:10px 16px;font-size:13px}
 .match-shell[data-phase="result"] .result-actions .primary{flex:1;max-width:420px}
 .match-shell[data-phase="result"] .plate-result{padding-bottom:0;margin-bottom:0}
 .match-shell[data-phase="result"] .broadcast-field{height:160px;max-width:240px;margin-top:6px}
 .match-shell[data-phase="result"] .diamond-broadcast{padding:10px;margin:8px 0}
 .match-shell[data-phase="result"] .broadcast-fielder{min-height:36px;margin-top:5px}
 .match-shell[data-phase="result"] .broadcast-fielder img{width:28px;height:36px}
 .match-shell[data-phase="result"] .result-explanation{margin:8px 0 0;padding:10px}
 .match-shell[data-phase="result"] .result-call{padding:8px}.match-shell[data-phase="result"] .revealed{padding:8px}
}
@media(max-width:760px){.match-shell[data-phase="result"] .result-actions{bottom:calc(66px + env(safe-area-inset-bottom))}}

/* Keep match decisions reachable on narrow screens without reserving a sticky gap. */
@media(max-width:899px){
 .match-shell:is([data-phase="exchange"],[data-phase="tactic"]){padding-bottom:132px}
 .match-shell:is([data-phase="exchange"],[data-phase="tactic"]) .action-dock{position:fixed;left:0;right:0;bottom:calc(72px + env(safe-area-inset-bottom));z-index:25;display:grid;gap:5px;padding:8px 12px;background:var(--c-white);border-top:1px solid var(--c-slate-90);box-shadow:0 -3px 12px color-mix(in srgb,var(--c-navy-15) 6.3%,transparent)}
 .match-shell .action-dock .selection-copy{display:flex;flex-direction:row;align-items:center;gap:8px;min-width:0;min-height:24px}
 .match-shell .action-dock .selection-copy>span,.match-shell .action-dock .selection-copy>b{align-self:center}
 .match-shell .selection-copy b{flex:1;font-size:12px}.match-shell .selection-copy button{min-height:28px;padding:3px 8px}
 .match-shell .dock-buttons{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:6px}
 .match-shell .dock-buttons .btn{min-height:44px;min-width:0;padding:8px;font-size:12px}
 .match-shell .dock-buttons .quick-prepare{grid-column:1/-1;min-height:32px;padding:5px;font-size:11px}.match-shell .quick-prepare:after{display:none}
 .match-shell[data-phase="advance"]{padding-bottom:70px}
 .match-shell[data-phase="advance"] .advance-panel .sheet-actions{position:fixed;left:0;right:0;bottom:calc(72px + env(safe-area-inset-bottom));z-index:25;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0;padding:8px 12px;border-top:1px solid var(--c-slate-90);background:var(--c-white)}
 .match-shell[data-phase="advance"] .broadcast-field{height:160px;max-width:240px}
}
@media(max-width:760px){
 .match-shell:is([data-phase="exchange"],[data-phase="tactic"]) .action-dock,.match-shell[data-phase="advance"] .advance-panel .sheet-actions{bottom:calc(66px + env(safe-area-inset-bottom))}
}

.prepare-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.prepare-actions .btn{min-height:44px;flex:1}
@media(max-width:899px){
 .match-shell:is([data-phase="pitcher"],[data-phase="pinch"],[data-phase="steal"]){padding-bottom:116px}
 .prepare-actions{position:fixed;left:0;right:0;bottom:calc(72px + env(safe-area-inset-bottom));z-index:25;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:0;padding:8px 12px;background:var(--c-white);border-top:1px solid var(--c-slate-90);box-shadow:0 -3px 12px color-mix(in srgb,var(--c-navy-15) 6.3%,transparent)}
 .prepare-panel .prepare-actions .btn{min-height:44px;margin:0;padding:8px;font-size:12px;min-width:0}
 .prepare-actions .primary{grid-column:1/-1}
 .prepare-actions:has(>:nth-child(4)){grid-template-columns:repeat(3,minmax(0,1fr))}
 .match-shell .prepare-panel{margin-top:8px;animation:none;transform:none}.prepare-panel p{line-height:1.5}
}
@media(max-width:760px){.prepare-actions{bottom:calc(66px + env(safe-area-inset-bottom))}}

.prepare-hand{margin:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--c-white)}.prepare-hand summary{min-height:44px;padding:10px 12px;cursor:pointer;font-size:12px}.prepare-hand summary b{float:right;font-size:11px}.prepare-hand .ready{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.prepare-hand .missing{color:color-mix(in srgb,var(--p-ink) 60%,var(--p-white))}.prepare-hand>p{font-size:11px;color:var(--muted);padding:0 12px 10px}.prepare-hand .tactic-hand{padding-top:8px}

.overall-badge{display:inline-flex;align-items:baseline;gap:5px;width:max-content;padding:3px 9px;border-radius:7px;background:var(--p-navy);color:var(--c-white);font-size:21px;font-weight:600;line-height:1.2;margin:0 0 5px}.overall-badge small{font-size:10px;color:color-mix(in srgb,var(--p-g-r) 16%,var(--p-white));letter-spacing:.04em}
.player-card-info > .overall-badge{display:flex;color:var(--c-white)}.player-card-info > .overall-badge small{color:color-mix(in srgb,var(--p-g-r) 16%,var(--p-white))}.player-card-info > .overall-badge + span{display:block}

.field-library-card .library-overall{display:flex;color:var(--c-white);font-size:16px;margin-top:5px;margin-bottom:0;padding:3px 7px}.field-library-card .library-overall small{color:color-mix(in srgb,var(--p-g-r) 16%,var(--p-white));font-size:9px}

.compact-ovr{display:inline-flex;align-items:baseline;gap:3px;white-space:nowrap;background:var(--p-navy);color:color-mix(in srgb,var(--p-g-r) 16%,var(--p-white));border-radius:4px;padding:2px 4px;font-size:8px;line-height:12px;vertical-align:middle}
.compact-ovr strong{color:var(--c-white);font-size:11px;line-height:12px}
.make-deck .field-slot>.field-portrait{grid-column:1;grid-row:2;align-items:center;justify-content:center;gap:3px;min-width:0;}
.make-deck .field-portrait>img{margin:0}
.make-deck .field-portrait .compact-ovr{flex-direction:column;gap:0;padding:2px 3px;font-size:7px;line-height:9px}
.make-deck .field-portrait .compact-ovr strong{font-size:12px}
.make-deck .rotation-face>.compact-ovr{justify-self:center}

.clutch-open{min-height:30px;border:1px solid var(--p-g-ssr);background:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));border-radius:8px;font-weight:600;padding:5px 10px}.clutch-options{display:flex;gap:8px}.clutch-options>*{flex:1}.clutch-preview,.clutch-receipt{display:grid;gap:6px;border:1px solid color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));background:var(--c-gold-98);color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));border-radius:10px;padding:12px;margin:10px 0}.clutch-receipt.failure{background:var(--c-red-96);border-color:color-mix(in srgb,var(--p-g-ur) 32%,var(--p-white));color:color-mix(in srgb,var(--p-red) 55%,var(--p-ink))}@media(max-width:899px){.match-shell[data-phase="tactic"]{padding-bottom:146px}}

.detail-rating-heading{margin-bottom:12px}.detail-rating-heading>div{display:flex;align-items:center;justify-content:flex-start;gap:8px;}.detail-rating-heading h3{margin:0;font-size:15px}.detail-rating-heading .overall-badge{margin:0;padding:4px 7px;font-size:17px;flex:none}.detail-rating-heading>small{display:block;margin-top:6px;color:var(--muted);font-size:11px}

.clutch-studio{display:grid;gap:14px}.clutch-hero{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px;border-radius:14px;color:var(--c-white);background:radial-gradient(ellipse at top right,color-mix(in srgb,var(--p-slate) 80%,var(--p-ink)),transparent 70%),var(--c-navy-15)}.clutch-hero small{font-size:10px;letter-spacing:2px;color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}.clutch-hero h3{margin:8px 0;font-size:19px}.clutch-hero p{margin:0;font-size:12px;color:var(--c-blue-88)}.clutch-charges{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;width:64px;flex:none}.clutch-charges i{width:13px;height:20px;transform:skew(-15deg);background:var(--c-slate-41)}.clutch-charges i.charged{background:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));box-shadow:0 0 10px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 31.4%,transparent)}.clutch-charges span{width:100%;text-align:center;font-size:11px;margin-top:3px}.clutch-mode-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}.clutch-mode-cards button{position:relative;display:grid;justify-items:start;gap:5px;padding:14px;text-align:left;border:1px solid var(--c-slate-85);border-radius:12px;background:var(--c-white);color:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink));min-width:0}.clutch-mode-cards button.selected{border:2px solid var(--p-g-ssr);padding:13px;background:var(--c-gold-98);box-shadow:0 2px 8px color-mix(in srgb,color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)) 9.4%,transparent)}.clutch-mode-cards svg{width:32px;height:32px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));margin-bottom:3px}.clutch-mode-cards b{font-size:16px}.clutch-mode-cards small{font-size:10px;color:var(--c-slate-49)}.clutch-check{position:absolute;right:12px;top:12px;font-size:13px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.clutch-predict-label{font-size:12px;font-weight:700;display:grid;gap:6px}.clutch-odds-strip{display:flex;align-items:center;gap:8px;font-size:11px}.clutch-odds-strip>i{height:6px;flex:1;background:color-mix(in srgb,var(--p-g-ur) 32%,var(--p-white));border-radius:5px;overflow:hidden}.clutch-odds-strip em{display:block;width:35%;height:100%;background:color-mix(in srgb,var(--p-g-lr) 80%,var(--p-ink))}.clutch-outcomes{display:grid;grid-template-columns:1fr 1fr;gap:10px}.clutch-outcomes>div{display:grid;gap:6px;padding:12px;background:color-mix(in srgb,var(--p-green) 8%,var(--p-white));border:1px solid color-mix(in srgb,var(--p-green) 32%,var(--p-white));border-radius:10px;color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink))}.clutch-outcomes>div+div{background:var(--c-red-96);color:color-mix(in srgb,var(--p-red) 55%,var(--p-ink));border-color:color-mix(in srgb,var(--p-red) 16%,var(--p-white))}.clutch-outcomes small{font-size:11px;font-weight:700}.clutch-outcomes strong{font-size:22px;letter-spacing:-.6px;white-space:nowrap}.clutch-outcomes span{font-size:10px}.clutch-caption,.clutch-commit-note{font-size:11px;color:var(--c-slate-49);margin:0}.clutch-rules{border-top:1px solid var(--c-slate-90);padding-top:10px;font-size:11px;color:var(--c-slate-49)}.clutch-rules summary{cursor:pointer;padding:4px 0}.clutch-rules p{line-height:1.65}.clutch-footer{position:sticky;bottom:0;background:var(--c-white);padding:12px 0 0;margin-top:12px}.clutch-footer .primary{background:var(--p-navy)}.clutch-cinematic{position:fixed;inset:0;z-index:1000;pointer-events:none;display:grid;place-items:center;background:color-mix(in srgb,var(--c-navy-11) 60%,transparent);animation:clutch-screen .85s both}.clutch-burst{position:relative;display:grid;justify-items:center;gap:9px;padding:30px 45px;border-block:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));color:var(--c-white);box-shadow:0 0 70px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 33.3%,transparent);animation:clutch-hit .85s both;overflow:hidden}.clutch-burst>svg{width:48px;height:48px;color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}.clutch-burst>small{letter-spacing:4px;color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));font-size:11px}.clutch-burst>strong{font-size:30px}.clutch-burst>span:last-child{font-size:13px;color:var(--c-slate-90)}.clutch-orbit{position:absolute;width:280px;height:280px;border:1px solid color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 33.3%,transparent);border-radius:50%;animation:clutch-ring .85s ease-out both}.clutch-cinematic.still,.clutch-cinematic.still *{animation:none!important}.clutch-cinematic.still .clutch-orbit{display:none}@keyframes clutch-screen{0%{opacity:0}15%,75%{opacity:1}100%{opacity:0}}@keyframes clutch-hit{0%{transform:translateX(-35px) scale(.94)}25%,70%{transform:translateX(0) scale(1)}100%{transform:translateX(20px) scale(1.02)}}@keyframes clutch-ring{from{transform:scale(.3);opacity:1}to{transform:scale(1.5);opacity:0}}@media(max-width:400px){.clutch-hero{padding:14px}.clutch-hero h3{font-size:17px}.clutch-mode-cards button{padding:11px}.clutch-mode-cards button.selected{padding:10px}.clutch-outcomes strong{font-size:19px}.clutch-burst{padding:25px}.clutch-burst>strong{font-size:26px}}

.pack-ten-button{display:flex;justify-content:space-between;gap:12px;width:100%;margin:8px 0;border-color:color-mix(in srgb,var(--p-blue) 32%,var(--p-white));background:var(--c-blue-96);color:var(--p-navy)}.batch-pack-summary{text-align:center}.batch-pack-summary>div{display:flex;justify-content:space-between;gap:12px;padding:15px;background:var(--c-blue-96);border-radius:10px;margin:14px 0}.batch-pack-summary>small{font-size:11px;color:var(--muted)}

/* Keep rotation name and metadata together after adding OVR. */
.make-deck .rotation-cards .rotation-face{grid-template-columns:32px minmax(0,1fr) auto;align-items:center;text-align:left}
.make-deck .rotation-cards .rotation-face img{grid-row:auto}
.rotation-identity{display:grid;gap:5px;min-width:0}
.rotation-meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.make-deck .rotation-face .rotation-meta .pitch-role{margin:0;grid-column:auto}
.rotation-meta .grade-badge{width:auto;justify-self:start}
.make-deck .rotation-cards .rotation-face>.compact-ovr{align-self:center}
@media(max-width:420px){.make-deck .rotation-cards article{grid-template-columns:26px minmax(0,1fr) 32px 64px}.make-deck .rotation-cards article>div>.btn{min-width:31px}.make-deck .rotation-cards .rotation-face{grid-template-columns:26px minmax(0,1fr);gap:4px}.make-deck .rotation-cards .rotation-face>.compact-ovr{grid-column:2;justify-self:start}.rotation-meta{gap:3px}}

/* Pack results keep a shared card height even when optional badges differ. */
.pack-opening .pack-reveal{grid-auto-rows:1fr}
.pack-opening .reveal-slot{display:flex;align-items:stretch}
.pack-opening .reveal-slot>.player-card{display:flex;flex-direction:column;width:100%;height:100%}
.pack-opening .player-card-art{flex-shrink:0}
.pack-opening .player-card-info{flex:1;display:grid;grid-template-rows:auto auto auto minmax(24px,auto) auto auto 1fr;align-content:start;align-items:start;text-align:left}
.pack-opening .player-card-info>.overall-badge{grid-row:1;justify-self:start}
.pack-opening .player-card-info>span{grid-row:2}
.pack-opening .player-card-info>b{grid-row:3}
.pack-opening .player-card-info>.enhance-ready-badge,.pack-opening .player-card-info>.starter-edition{grid-row:4;justify-self:start}
.pack-opening .player-card-info>.rarity-boost{grid-row:5;justify-self:start}
.pack-opening .player-card-info>.lr-card-skill{grid-row:6}
.pack-opening .player-card-info>.card-extra{grid-row:7;align-self:end}

.rating-supreme{color:color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink))!important}.enhance-steps{flex-wrap:wrap}

.synergy-detail h3{font-size:15px;margin:0 0 12px}.synergy-sources{display:grid;gap:0}.synergy-source{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--p-green) 16%,var(--p-white))}.synergy-source>div{display:grid;gap:3px;min-width:0}.synergy-source b{font-size:13px}.synergy-source small{font-size:11px;color:var(--c-slate-49)}.synergy-source>strong{font-size:12px;text-align:right;color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink));max-width:48%}.synergy-source.inactive>strong{color:color-mix(in srgb,var(--p-line) 55%,var(--p-ink));font-weight:500}.synergy-totals{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:14px 0}.synergy-totals>div{display:grid;gap:6px;padding:9px 4px;border:1px solid color-mix(in srgb,var(--p-green) 16%,var(--p-white));border-radius:8px;background:var(--c-white);text-align:center}.synergy-totals span{font-size:11px;color:var(--c-slate-49)}.synergy-totals b{display:flex;gap:4px;justify-content:center;align-items:center;font-size:14px}.synergy-totals i{font-style:normal;font-size:10px;color:var(--c-gray-61)}.synergy-detail>small{display:block;line-height:1.65}@media(max-width:420px){.synergy-totals{grid-template-columns:repeat(3,minmax(0,1fr))}.synergy-source{gap:8px}.synergy-source>strong{font-size:11px}}
.player-detail .synergy-detail{display:block}.player-detail .synergy-detail .synergy-totals{display:grid}.player-detail .synergy-detail .synergy-source{display:flex}.player-detail .synergy-detail .synergy-source>div{display:grid}

.redeem-quantities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}.redeem-quantities .btn{min-height:44px;padding:8px}.trade-preview{line-height:1.7}

/* Mail and item storage share existing sheet controls. */
.header-tools{display:flex;gap:6px;flex-shrink:0}.header-tools button{position:relative;min-width:36px;width:36px;height:36px;padding:4px}.mail-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--p-gold)}.topbar>div:first-child{min-width:0}.storage-switch{display:flex;gap:8px;margin-bottom:16px}.storage-switch>*{flex:1;min-width:0}.mail-card{padding:16px;border:1px solid var(--c-slate-90);border-radius:16px;background:var(--c-white);margin-bottom:16px}.mail-card h3{margin:8px 0}.mail-card p{line-height:1.6}.mail-card.claimed{background:var(--c-gray-96)}.starter-loot{display:flex;gap:14px;align-items:center;margin:16px 0}.starter-loot img{width:64px;height:96px;object-fit:contain}.starter-loot div{display:grid;gap:6px;min-width:0}.starter-loot small{color:var(--c-slate-49)}.inventory-wallet{display:flex;justify-content:space-between;gap:12px;padding:14px;background:var(--c-blue-96);border-radius:12px;margin-bottom:16px}.inventory-wallet span{display:grid;gap:4px}.inventory-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.inventory-item{display:flex;gap:10px;align-items:center;padding:12px;background:var(--c-white);border:1px solid var(--c-slate-90);border-radius:14px;min-width:0}.inventory-item>.foil-pack{width:54px;height:81px;object-fit:contain;flex-shrink:0}.inventory-item>div{display:grid;gap:5px;min-width:0}.inventory-item small{color:var(--c-slate-49)}.inventory-item .btn{min-height:38px;padding:8px}.inventory-item strong{font-size:20px}.starter-item{background:linear-gradient(125deg,var(--c-gold-96-2),var(--c-blue-96))}
@media(max-width:600px){.inventory-grid{grid-template-columns:1fr}.header-tools{gap:4px}.topbar .save-status{font-size:10px}.mail-card{padding:14px}}
.topbar>.header-tools{display:flex;flex-direction:row;align-items:center;gap:4px}.topbar>.header-tools button{width:36px;height:36px;min-width:36px}.topbar>div:first-child{flex:1;overflow:hidden}.topbar>div:first-child>b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.topbar .header-icon{width:22px;height:22px;display:block;flex:none}.topbar>.header-tools button{display:inline-flex;align-items:center;justify-content:center;padding:7px;line-height:1}

/* Challenges: compact cards, touch targets and six primary destinations. */
.product-nav{grid-template-columns:repeat(6,minmax(0,1fr))}.product-nav button{min-width:0;padding-left:2px;padding-right:2px}
.goal-banner{display:flex;gap:16px;align-items:center;justify-content:space-between;background:color-mix(in srgb,var(--p-g-r) 8%,var(--p-white));border:1px solid var(--c-blue-88);border-radius:18px;padding:20px;margin-bottom:20px}.goal-banner h2{font-size:20px;margin:8px 0}.goal-banner span{font-size:12px}.goal-tabs{display:grid;gap:8px;margin:16px 0}.goal-tabs .btn{padding:12px 4px;min-width:0}.goal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.goal-card{padding:20px;border-radius:16px;min-width:0}.goal-card.earned{background:var(--c-green-97);border-color:color-mix(in srgb,var(--p-green) 32%,var(--p-white))}.goal-card h3{font-size:17px;margin:16px 0}.goal-card>strong{display:block;font-size:13px;line-height:1.7;margin-top:16px;color:var(--c-blue-41-2)}.goal-progress{display:grid;gap:10px}.goal-progress small{color:var(--p-g-n)}.goal-progress progress{width:100%;height:8px;accent-color:var(--c-blue-41-2)}.mail-card strong{overflow-wrap:anywhere}
@media(max-width:600px){.product-nav button{font-size:10px}.goal-banner{padding:16px;flex-wrap:wrap}.goal-banner h2{font-size:18px}.goal-grid{grid-template-columns:1fr}.goal-card{padding:16px}.goal-card h3{margin:10px 0}.goal-tabs{gap:5px}}

.match-rewards{margin:18px 0;padding:18px;border:1px solid var(--c-blue-88);border-radius:18px;background:linear-gradient(130deg,var(--c-blue-96),var(--c-white))}.match-rewards h3{margin:5px 0;font-size:18px}.match-rewards .section-head{gap:8px;flex-wrap:wrap}.reward-totals{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.reward-totals>div{display:grid;gap:6px;padding:14px;background:var(--c-white);border:1px solid var(--c-slate-90);border-radius:12px}.reward-totals strong{font-size:23px;color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink))}.reward-totals small{font-size:12px;color:var(--c-slate-49)}.match-rewards summary{padding:12px 0;font-size:14px;cursor:pointer}.reward-receipt-list article{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--c-slate-90);font-size:13px}.reward-receipt-list article>div{display:grid;gap:5px}.reward-receipt-list small{color:var(--p-slate);font-size:11px}.reward-receipt-list strong{max-width:48%;text-align:right;line-height:1.6;color:color-mix(in srgb,var(--p-blue) 80%,var(--p-ink))}.match-rewards .sheet-actions{margin-top:12px}.match-rewards .help{font-size:11px}@media(max-width:420px){.match-rewards{padding:14px}.reward-totals strong{font-size:20px}.match-rewards .btn{font-size:12px;padding:12px 6px}}

.goal-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}.challenge-intro{padding:18px;background:var(--c-blue-96);border:1px solid var(--c-blue-88);border-radius:16px;margin:16px 0}.challenge-intro h3{display:flex;justify-content:space-between;gap:12px;margin:0}.challenge-intro h3 span{color:var(--c-blue-41-2);font-size:14px}.challenge-intro p{font-size:12px;color:var(--c-slate-49)}.achievement-tracks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.achievement-tracks details{margin-top:14px;font-size:12px}.achievement-tracks summary{min-height:40px;align-content:center;cursor:pointer}.achievement-step{display:grid;gap:4px;padding:10px 0;border-top:1px solid var(--c-slate-90)}.achievement-step small{color:var(--p-slate)}.guide-steps{display:grid;gap:12px}.guide-step{display:flex;gap:14px;padding:18px;background:var(--c-white);border:1px solid var(--c-slate-90);border-radius:16px}.guide-step.earned{background:var(--c-green-97)}.guide-number{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border-radius:50%;background:var(--p-navy);color:var(--c-white);font-weight:600}.guide-step.earned .guide-number{background:var(--p-green)}.guide-step>div{min-width:0;flex:1}.guide-step h3{margin:3px 0;font-size:16px}.guide-step p{font-size:12px;color:var(--c-slate-49)}.guide-step strong{display:block;font-size:13px;color:var(--c-blue-41-2)}.guide-step small{display:block;margin-top:10px;color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.guide-step .btn{margin-top:12px;min-height:40px;font-size:12px}@media(max-width:600px){.goal-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.achievement-tracks{grid-template-columns:1fr}.guide-step{padding:14px;gap:10px}}

/* League career tiers: promote / stay / demote cards reuse the season-length chip style. */
.tier-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:12px 0}.tier-picker button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:12px;border:1px solid color-mix(in srgb,var(--p-slate) 32%,var(--p-white));border-radius:14px;background:var(--c-white);color:inherit;min-width:0}.tier-picker button.active{border-color:var(--c-blue-41-2);background:var(--c-blue-96);box-shadow:inset 0 0 0 1px var(--c-blue-41-2)}.tier-picker small{font-size:11px;color:var(--c-blue-41-2);font-weight:700}.tier-picker b{font-size:17px}.tier-picker span{font-size:11px;line-height:1.45;color:var(--c-slate-42);overflow-wrap:anywhere}.tier-facts{display:block;font-size:11px;opacity:.8;margin-top:2px;overflow-wrap:anywhere}

/* Unclaimed rewards nudge on the pack screen. */
.mail-nudge{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));border-radius:14px;background:var(--c-gold-98);font-size:13px;line-height:1.5}.mail-nudge .btn{flex:none;white-space:nowrap}@media(max-width:600px){.mail-nudge{flex-direction:column;align-items:stretch}}

/* Manager career timeline (display only). */
.tier-career .career-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.tier-career .career-stats div{background:var(--c-blue-96);border-radius:12px;padding:10px;text-align:center}.tier-career .career-stats b{display:block;font-size:20px}.tier-career .career-stats span{font-size:12px;color:var(--c-slate-42)}.career-log{list-style:none;margin:0;padding:0;display:grid;gap:6px}.career-log li{display:grid;grid-template-columns:28px 1fr;column-gap:8px;align-items:center;padding:8px 10px;border:1px solid var(--c-slate-90);border-radius:12px}.career-log li.champ{border-color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));background:var(--c-gold-98)}.career-mark{grid-row:span 2;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--c-blue-96);color:var(--c-blue-41-2);font-weight:700}.career-log small{color:var(--c-slate-42);font-size:12px;overflow-wrap:anywhere}

/* Diamond Duel icon set (public/icons.js): one stroke family replaces emoji and pictographic symbols. */
.gi{width:1.15em;height:1.15em;display:inline-block;vertical-align:-.2em;flex:none;overflow:visible}.tactic-symbol .gi{width:17px;height:17px;vertical-align:0}.career-mark .gi{width:16px;height:16px}.gi-star-fill,.gi-heart-fill{color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink))}.selected-check .gi,.clutch-check .gi{width:14px;height:14px}.sheet-close .gi{width:18px;height:18px}

/* Collection album and quick season. */
.album-totals{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.album-totals div{background:var(--c-blue-96);border-radius:12px;padding:10px;text-align:center}.album-totals b{display:block;font-size:20px}.album-totals span{font-size:12px;color:var(--c-slate-42)}.album-years{margin:12px 0;flex-wrap:wrap}.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}.album-card{border:1px solid var(--c-slate-90);border-radius:16px;padding:14px;background:var(--c-white);display:grid;gap:8px}.album-card.complete{border-color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));background:linear-gradient(140deg,var(--c-orange-98),var(--c-white))}.album-card-head{display:flex;align-items:center;gap:10px}.album-card-head>div{flex:1;min-width:0}.album-card-head b{display:block}.album-card-head small{color:var(--c-slate-42);font-size:12px}.album-badge{color:var(--p-g-ssr)}.album-badge .gi{width:22px;height:22px}.album-card progress{width:100%;height:8px}.album-steps{display:grid;gap:4px}.album-step{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--c-slate-56)}.album-step.ready{color:var(--c-blue-41-2);font-weight:700}.album-step.claimed{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}
.quick-season .quick-season-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.quick-season .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}.sim-progress{display:grid;gap:8px;margin-bottom:12px}.sim-progress progress{width:100%;height:10px}.sim-list{list-style:none;padding:0;margin:10px 0;display:grid;gap:6px}.sim-list li{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--c-slate-90);border-radius:12px}.sim-result{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;background:var(--c-gray-96)}.sim-result.win{background:color-mix(in srgb,var(--p-green) 16%,var(--p-white));color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.sim-result.loss{background:color-mix(in srgb,var(--p-red) 16%,var(--p-white));color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))}
@media(max-width:600px){.quick-season .quick-season-actions{grid-template-columns:1fr}.album-grid{grid-template-columns:1fr}}
.sim-summary .career-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0 10px}.sim-summary .career-stats div{background:var(--c-blue-96);border-radius:12px;padding:10px;text-align:center}.sim-summary .career-stats b{display:block;font-size:20px}.sim-summary .career-stats span{font-size:12px;color:var(--c-slate-42)}.sim-list small{font-weight:700;color:var(--c-navy-19)}

/* Quick-season broadcast. */
.sim-cast{display:grid;gap:10px}.sim-cast-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.sim-cast-head small{color:var(--c-slate-42)}.sim-board{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:14px}.sim-board th,.sim-board td{padding:6px 4px;text-align:center;border-bottom:1px solid var(--c-blue-96)}.sim-board tbody th{text-align:left;white-space:nowrap;display:flex;align-items:center;gap:6px}.sim-board td.scored{color:var(--c-blue-41-2);font-weight:600}.sim-board .sim-total{font-weight:600;font-size:16px}.sim-feed{list-style:none;margin:0;padding:0;display:grid;gap:4px;min-height:150px;align-content:start}.sim-feed li{font-size:13px;padding:6px 8px;border-radius:10px;background:var(--c-gray-96);animation:sim-in .25s ease-out}.sim-feed li small{display:inline-block;min-width:44px;color:var(--c-slate-56);font-weight:700}.sim-feed li.run{background:var(--c-blue-96)}.sim-feed li.hr{background:var(--c-gold-96-2);font-weight:700}.sim-final{display:flex;align-items:center;gap:10px;min-height:32px}.sim-controls{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}.sim-controls .btn{display:inline-flex;align-items:center;gap:6px}.sim-next{border:1px solid var(--c-blue-88);background:var(--c-blue-96);border-radius:14px;padding:14px;margin:10px 0}.sim-next h3{display:flex;align-items:center;gap:6px;margin:0 0 6px}.quick-season-actions.two{grid-template-columns:1fr 1fr}
@keyframes sim-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.sim-feed li{animation:none}}
@media(max-width:600px){.quick-season-actions.two{grid-template-columns:1fr}}

/* Quick season: intro, status and richer broadcast. */
.sim-intro{display:grid;gap:12px}.sim-target{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--c-blue-96);color:var(--c-navy-19)}.sim-target>.gi{width:26px;height:26px;color:var(--c-blue-41-2)}.sim-target b{display:block;font-size:16px}.sim-target span{font-size:12px;color:var(--c-slate-42)}.sim-howto{list-style:none;margin:0;padding:0;display:grid;gap:8px}.sim-howto li{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start}.sim-howto li>.gi{width:22px;height:22px;margin-top:2px;color:var(--c-blue-41-2)}.sim-howto b{display:block;font-size:14px}.sim-howto span{font-size:12.5px;color:var(--c-slate-42);line-height:1.5}.sim-intro-speed{display:grid;gap:6px;padding:10px 12px;border:1px solid var(--c-slate-90);border-radius:12px}.sim-intro-speed small{color:var(--c-slate-56);font-size:12px}
.sim-status{display:grid;gap:6px;margin-bottom:10px}.sim-status b{display:block}.sim-status small{color:var(--c-slate-42);font-size:12px}.sim-status progress{width:100%;height:8px}.sim-matchup{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:12px;color:var(--c-slate-42);background:var(--c-gray-96);border-radius:10px;padding:6px 10px}.sim-matchup b{color:var(--c-navy-19)}.sim-board tr.mine th{color:var(--c-blue-41-2)}.sim-now{font-size:13px;font-weight:700;color:var(--c-blue-41-2)}.sim-final-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.sim-final-line small{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink));font-weight:700}.sim-moments{margin-top:8px;padding:10px 12px;border-radius:12px;background:var(--c-gold-98)}.sim-moments>span{font-size:11px;font-weight:600;color:var(--c-orange-49);letter-spacing:.04em}.sim-moments p{margin:4px 0;font-size:13px}.sim-moments small{color:var(--c-slate-56)}.sim-reward{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;padding:10px 12px;border-radius:12px;background:var(--c-blue-96)}.sim-summary h4{margin:12px 0 4px}
/* Postseason hub. */
.ps-hub{display:grid;gap:12px;margin-bottom:16px}.ps-hero{border-radius:22px;padding:20px;background:linear-gradient(140deg,var(--p-navy),color-mix(in srgb,var(--p-blue) 55%,var(--p-ink)));color:var(--c-white)}.ps-hero .eyebrow{color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}.ps-hero h2{margin:8px 0 6px;font-size:22px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ps-hero p{margin:0;color:var(--c-blue-88);font-size:14px;line-height:1.55}.ps-hub.champ .ps-hero{background:linear-gradient(140deg,color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)),var(--p-g-ssr))}.ps-hub.out .ps-hero{background:linear-gradient(140deg,color-mix(in srgb,var(--p-slate) 55%,var(--p-ink)),color-mix(in srgb,var(--p-g-n) 55%,var(--p-ink)))}.ps-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.ps-badges span{font-size:12px;padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--c-white) 14%,transparent)}
.ps-choice{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ps-option{display:grid;gap:4px;justify-items:start;text-align:left;padding:14px;border-radius:16px;border:1px solid var(--c-blue-88);background:var(--c-white);color:var(--c-navy-19);min-width:0}.ps-option .gi{width:24px;height:24px;color:var(--c-blue-41-2)}.ps-option b{font-size:16px}.ps-option span{font-size:12.5px;color:var(--c-slate-42);line-height:1.45}.ps-option.primary{background:var(--c-navy-19);color:var(--c-white);border-color:var(--c-navy-19)}.ps-option.primary .gi{color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}.ps-option.primary span{color:var(--c-blue-88)}
.ps-ladder{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;counter-reset:none}.ps-stage{position:relative;border:1px solid var(--c-slate-90);border-radius:16px;padding:12px;background:var(--c-white);display:grid;gap:6px;align-content:start}.ps-stage.live{border-color:var(--c-blue-41-2);box-shadow:0 0 0 2px var(--c-blue-88)}.ps-stage.mine{background:var(--c-gray-96)}.ps-stage.wait{opacity:.85}.ps-stage-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.ps-stage-head span{font-size:10px;font-weight:600;color:var(--c-slate-56);letter-spacing:.06em}.ps-stage-head b{font-size:15px;margin-right:auto}.ps-chip{font-style:normal;font-size:11px;padding:2px 8px;border-radius:999px;background:var(--c-gray-96);color:var(--c-slate-42)}.ps-chip.live{background:var(--c-blue-41-2);color:var(--c-white)}.ps-chip.done{background:color-mix(in srgb,var(--p-green) 16%,var(--p-white));color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.ps-chip.start{background:var(--c-gold-96);color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.ps-team{display:grid;grid-template-columns:30px 22px 1fr auto;align-items:center;gap:6px;padding:6px 8px;border-radius:10px;background:var(--c-gray-96)}.ps-team.tbd{grid-template-columns:30px 1fr auto;color:var(--c-slate-56)}.ps-team.me{outline:2px solid var(--c-blue-41-2);background:var(--c-blue-96)}.ps-team.win b{color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink))}.ps-team.out{opacity:.5}.ps-team strong{font-size:18px;font-variant-numeric:tabular-nums}.ps-seed{font-size:11px;color:var(--c-slate-56);font-weight:700}.ps-rule{font-size:11.5px;color:var(--c-slate-56);line-height:1.45}.ps-games{display:flex;flex-wrap:wrap;gap:4px}.ps-games span{font-size:11px;padding:2px 6px;border-radius:6px;background:var(--c-gray-96)}
.ps-rules{border:1px solid var(--c-slate-90);border-radius:16px;padding:12px 14px;background:var(--c-white)}.ps-rules summary{cursor:pointer;font-weight:700;display:flex;align-items:center;gap:6px}.ps-rules h4{margin:12px 0 4px;font-size:14px}.ps-rules p{margin:0;font-size:13px;color:var(--c-slate-36);line-height:1.6}
@media(max-width:900px){.ps-ladder{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.ps-ladder{grid-template-columns:1fr}.ps-choice{grid-template-columns:1fr}.ps-hero{padding:16px}.ps-hero h2{font-size:19px}}
.ps-team .team-logo{width:22px;height:22px;object-fit:contain;margin:0}.sim-board .team-logo{width:20px;height:20px;object-fit:contain}
.sim-intro .quick-season-actions,.ps-hub .quick-season-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.sim-intro .quick-season-actions .btn,.ps-hub .quick-season-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}

/* Match juice: duel cards, impact bursts, score pop. Disabled by reduced motion. */
.duel-card{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 6px;border-radius:12px;border:1px solid var(--line);background:var(--c-gray-96);transition:box-shadow .3s,border-color .3s}.duel-face{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--c-gray-96);color:color-mix(in srgb,var(--p-slate) 55%,var(--p-ink))}.duel-face .gi{width:22px;height:22px}.duel-card.attack .duel-face{background:var(--c-blue-96);color:var(--c-blue-41-2)}.duel-card.defense .duel-face{background:var(--c-purple-94);color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink))}.duel-card.won{border-color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));box-shadow:0 0 0 2px color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),0 6px 18px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 25.1%,transparent);background:var(--c-orange-98)}.duel-card.won>span:nth-child(2){color:var(--c-orange-49);font-weight:600}
.phase-arrive .duel-face{animation:duel-flip .5s ease-out both}.phase-arrive .duel-card.defense .duel-face{animation-delay:.12s}.phase-arrive .duel-card.won{animation:duel-win .9s .45s ease-out both}
@keyframes duel-flip{0%{transform:perspective(300px) rotateY(90deg);opacity:0}100%{transform:none;opacity:1}}
@keyframes duel-win{0%{box-shadow:0 0 0 0 #f6dc8a00}40%{box-shadow:0 0 0 6px color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),0 8px 24px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 37.6%,transparent)}100%{box-shadow:0 0 0 2px color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),0 6px 18px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 25.1%,transparent)}}
.scoreboard .team-score{position:relative}.score-pop{display:inline-block;animation:score-pop .6s ease-out}.score-float{position:absolute;top:-6px;right:10px;font-weight:700;color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));font-size:16px;animation:score-float 1.2s ease-out forwards;pointer-events:none}.scoreboard .team-score.away .score-float{right:auto;left:10px}
@keyframes score-pop{0%{transform:scale(1)}35%{transform:scale(1.5);color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}100%{transform:scale(1)}}
@keyframes score-float{0%{transform:translateY(8px);opacity:0}20%{opacity:1}100%{transform:translateY(-22px);opacity:0}}
html.reduced-motion .score-pop,html.reduced-motion .duel-face,html.reduced-motion .duel-card.won{animation:none!important}
@media(prefers-reduced-motion:reduce){.score-pop,.duel-face,.duel-card.won{animation:none!important}}
.land-ring{fill:none;stroke:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));stroke-width:1.6;opacity:0;transform-box:fill-box;transform-origin:center;animation:land-ring .9s ease-out both}@keyframes land-ring{0%{opacity:1;transform:scale(.6)}100%{opacity:0;transform:scale(3.2)}}

/* ---- Card grade design: frames, foils and badges (cosmetic only; ratings unchanged) ---- */
@property --holo{syntax:'<angle>';initial-value:0deg;inherits:false}
.player-card[data-grade]{--frame:linear-gradient(var(--rarity),var(--rarity));border:2px solid transparent;background:linear-gradient(var(--c-white),var(--c-white)) padding-box,var(--frame) border-box;transition:transform .18s ease,box-shadow .18s ease}
.player-card[data-grade] .player-card-art{border-top:0;overflow:hidden}
.player-card[data-grade="N"]{--frame:linear-gradient(135deg,var(--c-slate-74),var(--c-gray-91),var(--c-slate-74));box-shadow:0 3px 10px color-mix(in srgb,var(--c-navy-11) 12.2%,transparent)}
.player-card[data-grade="N"] .player-card-art{background:linear-gradient(165deg,var(--c-gray-96),var(--c-slate-90))}
.player-card[data-grade="R"]{--frame:linear-gradient(135deg,var(--p-blue),color-mix(in srgb,var(--p-g-r) 32%,var(--p-white)),var(--p-blue));box-shadow:0 4px 12px color-mix(in srgb,var(--p-blue) 18%,transparent)}
.player-card[data-grade="R"] .player-card-art{background:radial-gradient(circle at 50% 20%,var(--c-blue-96),transparent 60%),linear-gradient(165deg,color-mix(in srgb,var(--p-g-r) 16%,var(--p-white)),color-mix(in srgb,var(--p-blue) 32%,var(--p-white)))}
.player-card[data-grade="SR"]{--frame:linear-gradient(135deg,var(--c-purple-38),color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)),color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink)),color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white)),var(--c-purple-38));box-shadow:0 5px 16px color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink)) 25.1%,transparent),0 0 0 1px color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 33.3%,transparent)}
.player-card[data-grade="SR"] .player-card-art{background:radial-gradient(circle at 50% 18%,color-mix(in srgb,var(--p-g-sr) 8%,var(--p-white)),transparent 58%),repeating-linear-gradient(135deg,#ffffff00 0 10px,color-mix(in srgb,var(--c-white) 18%,transparent) 10px 12px),linear-gradient(165deg,color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white)),color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)))}
.player-card[data-grade="SSR"]{--frame:linear-gradient(135deg,color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)),color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),var(--p-g-ssr),var(--c-gold-96),var(--c-orange-49));box-shadow:0 6px 20px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 33.3%,transparent),0 0 0 1px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 50.2%,transparent)}
.player-card[data-grade="SSR"] .player-card-art{background:radial-gradient(circle at 50% 28%,var(--c-gold-98) 0,#fff3cc00 55%),repeating-conic-gradient(from 0deg at 50% 30%,color-mix(in srgb,var(--p-gold) 20%,transparent) 0deg 9deg,#ffffff00 9deg 22deg),linear-gradient(165deg,color-mix(in srgb,var(--p-gold) 32%,var(--p-white)),color-mix(in srgb,var(--p-gold) 60%,var(--p-white)))}
.player-card[data-grade="LR"]{animation:holo-spin 6s linear infinite}
.player-card[data-grade="LR"] .player-card-art{background:radial-gradient(circle at 50% 26%,color-mix(in srgb,var(--c-white) 81.6%,transparent),#ffffff00 55%),linear-gradient(135deg,color-mix(in srgb,var(--p-g-lr) 32%,var(--p-white)),color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)) 40%,color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white)) 70%,color-mix(in srgb,var(--p-gold) 32%,var(--p-white)))}
/* Moving light: SSR sheen sweep, LR holographic shimmer. */
.player-card[data-grade="SSR"] .player-card-art::after,.player-card[data-grade="LR"] .player-card-art::after{content:'';position:absolute;inset:-20% -60%;pointer-events:none;background:linear-gradient(110deg,#fff0 42%,color-mix(in srgb,var(--c-gold-98) 75.3%,transparent) 50%,#fff0 58%);transform:translateX(-60%);animation:card-sheen 5.5s ease-in-out infinite}
.player-card[data-grade="LR"] .player-card-art::after{background:linear-gradient(110deg,#fff0 36%,color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 32%,var(--p-white)) 62.7%,transparent) 45%,color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)) 62.7%,transparent) 52%,color-mix(in srgb,color-mix(in srgb,var(--p-red) 32%,var(--p-white)) 56.5%,transparent) 58%,#fff0 66%);mix-blend-mode:screen;animation-duration:4.2s}
.player-card[data-grade] .player-card-art>.player-photo,.player-card[data-grade] .player-card-art>.player-art{position:relative;z-index:1}
.player-card[data-grade] .player-card-art>.grade,.player-card[data-grade] .player-card-art>.card-club{z-index:2}
@keyframes card-sheen{0%,62%{transform:translateX(-60%)}100%{transform:translateX(60%)}}
@keyframes holo-spin{to{--holo:360deg}}
/* Enhancement finishes add an inner rim. */
.player-card.finish-silver .player-card-info{box-shadow:inset 0 2px 0 var(--c-slate-85)}.player-card.finish-gold .player-card-info{box-shadow:inset 0 2px 0 color-mix(in srgb,var(--p-gold) 80%,var(--p-ink))}
.player-card.finish-gold[data-grade]{box-shadow:0 6px 20px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 33.3%,transparent),0 0 0 1px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 56.5%,transparent)}
@media(hover:hover){.player-card[data-grade]:hover{transform:translateY(-2px)}.player-card[data-grade="SSR"]:hover,.player-card[data-grade="LR"]:hover{transform:translateY(-3px) scale(1.01)}}
/* Grade badges: always text, filled per grade. */
.grade-badge[data-grade="N"]{background:linear-gradient(135deg,color-mix(in srgb,var(--p-line) 55%,var(--p-ink)),var(--c-slate-74));color:var(--c-white);border-color:var(--c-gray-50)}
.grade-badge[data-grade="R"]{background:linear-gradient(135deg,var(--p-blue),color-mix(in srgb,var(--p-g-r) 60%,var(--p-white)));color:var(--c-white);border-color:var(--c-blue-41)}
.grade-badge[data-grade="SR"]{background:linear-gradient(135deg,var(--c-purple-38),var(--p-g-sr));color:var(--c-white);border-color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink))}
.grade-badge[data-grade="SSR"]{background:linear-gradient(135deg,var(--c-orange-49),var(--p-gold) 55%,var(--p-g-ssr));color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));border-color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));text-shadow:0 1px 0 color-mix(in srgb,var(--c-white) 40%,transparent)}
.grade-badge[data-grade="LR"]{background:linear-gradient(120deg,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)),color-mix(in srgb,var(--p-g-r) 60%,var(--p-white)),color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)),color-mix(in srgb,var(--p-red) 60%,var(--p-white)));color:var(--c-navy-15);border-color:var(--p-slate);text-shadow:0 1px 0 color-mix(in srgb,var(--c-white) 53.3%,transparent)}
html.reduced-motion .player-card[data-grade="LR"],html.reduced-motion .player-card .player-card-art::after{animation:none!important}
@media(prefers-reduced-motion:reduce){.player-card[data-grade="LR"],.player-card .player-card-art::after{animation:none!important}.player-card[data-grade]{transition:none}}


/* ===== Broadcast motion system: result graphics and ceremonies =====
   Grammar: slanted full-width band, one accent rule, heavy italic type, staged reveal
   (beam -> band -> tag -> title -> details), ease-out with a small overshoot, wipe exit. */
.bc-impact,.cel{--ink:var(--c-navy-11);--accent:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));--accent2:color-mix(in srgb,var(--p-blue) 32%,var(--p-white));--ease:cubic-bezier(.16,1,.3,1);--pop:cubic-bezier(.34,1.56,.64,1);--k:1}
.bc-impact.fast,.cel.fast{--k:.55}
.bc-impact{position:fixed;left:0;right:0;top:36%;z-index:60;pointer-events:none;display:grid}
.bc-impact.gold,.cel.tone-gold{--accent:var(--p-gold);--accent2:color-mix(in srgb,var(--p-gold) 32%,var(--p-white))}.bc-impact.bad,.cel.tone-red{--accent:var(--p-red);--accent2:color-mix(in srgb,var(--p-red) 32%,var(--p-white))}.cel.tone-purple{--accent:color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white));--accent2:color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white))}.cel.tone-silver{--accent:var(--c-slate-85);--accent2:var(--c-white)}.cel.tone-holo{--accent:color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white));--accent2:color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white))}
.bc-bar{position:relative;justify-self:stretch;margin:0 -4vw;padding:14px 8vw 12px;background:linear-gradient(90deg,var(--c-navy-11),var(--p-navy) 60%,var(--c-navy-11));transform:skewY(-4deg);box-shadow:0 18px 40px color-mix(in srgb,var(--c-black) 46.7%,transparent);clip-path:inset(0 100% 0 0);animation:bc-wipe calc(1.5s*var(--k)) var(--ease) forwards;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;overflow:hidden}
.bc-bar::before{content:'';position:absolute;left:0;right:0;top:0;height:3px;background:var(--accent)}.bc-bar::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent2),transparent);opacity:.6}
.bc-streak{position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,color-mix(in srgb,var(--c-white) 14.9%,transparent) 45%,transparent 55%);transform:translateX(-100%);animation:bc-streak calc(.9s*var(--k)) calc(.18s*var(--k)) ease-out forwards}
.bc-icon{grid-row:span 2;color:var(--accent);transform:skewY(4deg)}.bc-icon .gi{width:44px;height:44px}.bc-impact.small .bc-icon .gi{width:30px;height:30px}
.bc-bar strong{display:block;transform:skewY(4deg) skewX(-10deg);font-size:clamp(34px,9vw,64px);line-height:.95;font-weight:700;letter-spacing:-.01em;color:var(--c-white);font-style:normal;white-space:nowrap}
.bc-impact.mid strong{font-size:clamp(28px,7.4vw,50px)}.bc-impact.small strong{font-size:clamp(22px,6vw,38px)}
.bc-bar strong i,.cel-title i{display:inline-block;font-style:normal;opacity:0;transform:translateY(55%) scale(1.15);filter:blur(6px);animation:bc-letter calc(.42s*var(--k)) var(--pop) forwards;animation-delay:calc((.16s + var(--i)*.035s)*var(--k))}
.bc-bar small{transform:skewY(4deg);font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--accent2);opacity:0;animation:bc-fade calc(.3s*var(--k)) calc(.45s*var(--k)) ease-out forwards}
@keyframes bc-wipe{0%{clip-path:inset(0 100% 0 0)}18%{clip-path:inset(0 0 0 0)}82%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
@keyframes bc-streak{to{transform:translateX(100%)}}
@keyframes bc-letter{to{opacity:1;transform:none;filter:none}}
@keyframes bc-fade{to{opacity:1}}
/* Ceremony */
.cel{position:fixed;inset:0;z-index:70;display:grid;place-items:center;cursor:pointer;background:radial-gradient(ellipse at 50% 50%,color-mix(in srgb,var(--c-navy-6) 50.2%,transparent),color-mix(in srgb,var(--p-ink) 90.2%,transparent) 70%);animation:bc-fade calc(.18s*var(--k)) ease-out both;overflow:hidden}
.cel.out{animation:cel-out .28s ease-in forwards}.cel.out .cel-band{animation:cel-close .28s ease-in forwards}
.cel-beam{position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:linear-gradient(90deg,transparent,var(--accent) 20%,var(--c-white) 50%,var(--accent) 80%,transparent);box-shadow:0 0 18px var(--accent),0 0 44px var(--accent);transform:scaleX(0);animation:cel-beam calc(.5s*var(--k)) var(--ease) forwards}
.cel-band{position:relative;width:100%;min-height:min(260px,46vh);display:grid;align-items:center;padding:28px max(24px,8vw);background:linear-gradient(100deg,var(--c-navy-11) 0%,var(--p-navy) 55%,var(--c-navy-11) 100%);border-top:3px solid var(--accent);border-bottom:1px solid color-mix(in srgb,var(--c-white) 12.2%,transparent);box-shadow:0 30px 80px color-mix(in srgb,var(--c-black) 66.7%,transparent);clip-path:inset(50% 0 50% 0);animation:cel-open calc(.5s*var(--k)) calc(.2s*var(--k)) var(--ease) forwards;overflow:hidden}
.cel-stripes{position:absolute;inset:0;opacity:.07;background:repeating-linear-gradient(115deg,var(--accent) 0 1px,transparent 1px 14px);animation:cel-stripes 9s linear infinite;mask-image:linear-gradient(90deg,transparent,var(--c-black) 35%,var(--c-black) 65%,transparent)}
.cel-mark{position:absolute;right:max(16px,5vw);top:50%;translate:0 -50%;color:var(--accent);opacity:0;animation:cel-mark calc(.7s*var(--k)) calc(.45s*var(--k)) var(--ease) forwards}.cel-mark .gi{width:min(190px,34vw);height:min(190px,34vw);stroke-width:1.2}
.cel-content{position:relative;display:grid;gap:8px;justify-items:start;max-width:680px}
.cel-tag{display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 10px;background:var(--accent);color:var(--ink);font-size:12px;font-weight:900;letter-spacing:.14em;transform:skewX(-12deg);opacity:0;translate:-24px 0;animation:cel-tag calc(.35s*var(--k)) calc(.5s*var(--k)) var(--ease) forwards}
.cel-title{display:flex;align-items:baseline;gap:6px;font-size:clamp(34px,8.6vw,72px);line-height:1;font-weight:900;color:var(--c-white);letter-spacing:-.02em;transform:skewX(-8deg);text-shadow:0 4px 0 color-mix(in srgb,var(--c-black) 33.3%,transparent)}
.cel-title i{animation-delay:calc((.62s + var(--i)*.04s)*var(--k))}
.cel-count{font-variant-numeric:tabular-nums;opacity:0;animation:bc-letter calc(.4s*var(--k)) calc(.5s*var(--k)) var(--pop) forwards;transform:translateY(40%) scale(1.2);filter:blur(6px)}.cel-unit{font-size:.45em;color:var(--accent)}
.cel-label{font-size:14px;font-weight:800;letter-spacing:.08em;color:var(--accent2)}
.cel-sub{font-size:15px;line-height:1.5;color:var(--c-blue-88);max-width:52ch;opacity:0;animation:cel-up calc(.4s*var(--k)) calc(.95s*var(--k)) var(--ease) forwards}
.cel-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.cel-chips span{padding:6px 12px;border:1px solid var(--accent);color:var(--c-white);background:color-mix(in srgb,var(--c-white) 5.9%,transparent);font-size:12.5px;font-weight:800;transform:skewX(-10deg);opacity:0;animation:cel-up calc(.35s*var(--k)) var(--ease) forwards;animation-delay:calc((1.05s + var(--i)*.07s)*var(--k))}
.cel-hint{position:absolute;bottom:max(28px,8vh);left:0;right:0;text-align:center;color:color-mix(in srgb,var(--c-white) 50.2%,transparent);font-size:11px;letter-spacing:.32em;font-weight:700;opacity:0;animation:cel-hint 2s calc(1.2s*var(--k)) ease-in-out infinite}
.cel-spark{position:absolute;left:50%;top:50%;width:var(--w);height:26px;margin:-13px 0 0 calc(var(--w)/-2);border-radius:2px;background:linear-gradient(var(--accent2),var(--accent));opacity:0;transform:rotate(var(--a)) translateY(0);animation:cel-spark calc(1s*var(--k)) calc((.5s + var(--dl))*var(--k)) var(--ease) forwards}
.cel.crack .cel-band{background:linear-gradient(100deg,var(--p-ink),var(--p-ink) 55%,var(--p-ink))}.cel-crack{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.cel-crack path{fill:none;stroke:color-mix(in srgb,var(--p-red) 32%,var(--p-white));stroke-width:1.6;stroke-dasharray:600;stroke-dashoffset:600;filter:drop-shadow(0 0 6px var(--p-red));animation:cel-crack calc(.5s*var(--k)) calc(.55s*var(--k)) ease-out forwards}
.cel.crack .cel-title{animation:cel-jolt .32s calc(.75s*var(--k)) ease-in-out}
.fly-coin{position:fixed;left:0;top:0;z-index:80;width:18px;height:18px;margin:-9px 0 0 -9px;pointer-events:none;}
.header-tools button.bump{animation:bump .5s cubic-bezier(.34,1.56,.64,1)}@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.32)}100%{transform:scale(1)}}
@keyframes cel-beam{0%{transform:scaleX(0);opacity:1}60%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes cel-open{to{clip-path:inset(0 0 0 0)}}@keyframes cel-close{to{clip-path:inset(50% 0 50% 0)}}@keyframes cel-out{to{opacity:0}}
@keyframes cel-stripes{to{background-position:260px 0}}
@keyframes cel-mark{0%{opacity:0;scale:1.25}100%{opacity:.16;scale:1}}
@keyframes cel-tag{to{opacity:1;translate:0 0}}
@keyframes cel-up{0%{opacity:0;translate:0 10px}100%{opacity:1;translate:0 0}}
@keyframes cel-hint{0%,100%{opacity:.25}50%{opacity:.8}}
@keyframes cel-spark{0%{opacity:1;transform:rotate(var(--a)) translateY(0) scaleY(.4)}70%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--r)*-1)) scaleY(1)}}
@keyframes cel-crack{to{stroke-dashoffset:0}}@keyframes cel-jolt{0%,100%{translate:0}25%{translate:-5px 0}55%{translate:4px 0}80%{translate:-2px 0}}
/* Reduced motion: final frame, no movement. */
.bc-impact.still .bc-bar,.cel.still .cel-band{clip-path:none;animation:none}.bc-impact.still *,.cel.still *{animation:none!important;opacity:1!important;transform:none!important;filter:none!important;translate:none!important}.bc-impact.still .bc-bar{transform:skewY(-4deg)!important}.cel.still .cel-mark{opacity:.16!important}.cel.still .cel-beam,.cel.still .cel-hint{display:none}
@media(prefers-reduced-motion:reduce){.bc-impact *,.cel *{animation-duration:.01s!important;animation-delay:0s!important}.fly-coin{display:none}}
/* top sheen */
.cel-band::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,color-mix(in srgb,var(--c-white) 7.8%,transparent),transparent 40%,#0000 70%,color-mix(in srgb,var(--c-black) 25.1%,transparent))}
@media(max-width:600px){.cel-band{padding:24px 22px;min-height:min(240px,44vh)}.cel-mark{right:-6vw}.cel-mark .gi{width:44vw;height:44vw}.bc-bar{padding:12px 6vw 10px}}
.sb-situ,.sb-menu,.duel-bars,.season-track{display:none}
/* small-type pass: nothing below 11px */
html.ui-v3 .status-pill{font-size:11px}
html.ui-v3 .eyebrow{font-size:11px}
html.ui-v3 .grade{font-size:11px}
html.ui-v3 .team-mark.small{font-size:11px}
html.ui-v3 .team-score span{font-size:11px}
html.ui-v3 .inning span{font-size:11px}
html.ui-v3 .player-side span:last-child{font-size:11px}
html.ui-v3 .player-art span{font-size:11px}
html.ui-v3 .vs{font-size:11px}
html.ui-v3 .stamina{font-size:11px}
html.ui-v3 .diamond span{font-size:11px}
html.ui-v3 .outs span{font-size:11px}
html.ui-v3 .phase-strip div{font-size:11px}
html.ui-v3 .phase-strip span{font-size:11px}
html.ui-v3 .hand-head button{font-size:11px}
html.ui-v3 .card-index{font-size:11px}
html.ui-v3 .tactic-tag{font-size:11px}
html.ui-v3 .tactic-card small{font-size:11px}
html.ui-v3 .selected-detail span{font-size:11px}
html.ui-v3 .selected-detail p{font-size:11px}
html.ui-v3 .prepare-option span{font-size:11px}
html.ui-v3 .prepare-option button{font-size:11px}
html.ui-v3 .selection-copy span{font-size:11px}
html.ui-v3 .selection-copy button{font-size:11px}
html.ui-v3 .reveal-label{font-size:11px}
html.ui-v3 .revealed span{font-size:11px}
html.ui-v3 .revealed strong{font-size:11px}
html.ui-v3 .result-call > span{font-size:11px}
html.ui-v3 .runner-change{font-size:11px}
html.ui-v3 .lineup-name span{font-size:11px}
html.ui-v3 .position{font-size:11px}
html.ui-v3 .synergy-count span{font-size:11px}
html.ui-v3 .step-track span{font-size:11px}
html.ui-v3 .effect > span{font-size:11px}
html.ui-v3 .effect small{font-size:11px}
html.ui-v3 .text-link{font-size:11px}
html.ui-v3 .save-dock small{font-size:11px}
html.ui-v3 .counter-row small{font-size:11px}
html.ui-v3 .validation-error span{font-size:11px}
html.ui-v3 .search-tools label,html.ui-v3 .login-card label{font-size:11px}
html.ui-v3 .chips button{font-size:11px}
html.ui-v3 .in-deck{font-size:11px}
html.ui-v3 .analysis-card > span{font-size:11px}
html.ui-v3 .analysis-card p,html.ui-v3 .analysis-card small{font-size:11px}
html.ui-v3 .wallet span{font-size:11px}
html.ui-v3 .wallet small{font-size:11px}
html.ui-v3 .pack-object span{font-size:11px}
html.ui-v3 .pack-object small{font-size:11px}
html.ui-v3 .collection-summary{font-size:11px}
html.ui-v3 .collection-summary small{font-size:11px}
html.ui-v3 .result-card > span{font-size:11px}
html.ui-v3 .rate-guide span{font-size:11px}
html.ui-v3 .trade-card p,html.ui-v3 .trade-card span:last-child{font-size:11px}
html.ui-v3 .trade-confirm > span{font-size:11px}
html.ui-v3 .expected span{font-size:11px}
html.ui-v3 .expected small{font-size:11px}
html.ui-v3 .complete-state span{font-size:11px}
html.ui-v3 .exchange-row span:last-child{font-size:11px}
html.ui-v3 .exchange-dock span,html.ui-v3 .exchange-dock small{font-size:11px}
html.ui-v3 .stepper b{font-size:11px}
html.ui-v3 .stepper b span{font-size:11px}
html.ui-v3 .team-grid button > b{font-size:11px}
html.ui-v3 .starter-preview p{font-size:11px}
html.ui-v3 .mini-players > span{font-size:11px}
html.ui-v3 .important-note span{font-size:11px}
html.ui-v3 .ready-deck p{font-size:11px}
html.ui-v3 .starter span{font-size:11px}
html.ui-v3 .starter button{font-size:11px}
html.ui-v3 .setup-section .section-head span{font-size:11px}
html.ui-v3 .opponent-list span{font-size:11px}
html.ui-v3 .difficulty span{font-size:11px}
html.ui-v3 .rules-note span{font-size:11px}
html.ui-v3 .login-card > small{font-size:11px}
html.ui-v3 .record-summary span{font-size:11px}
html.ui-v3 .record-summary i{font-size:11px}
html.ui-v3 .history .section-head > button{font-size:11px}
html.ui-v3 .history-row > div span,html.ui-v3 .history-row time{font-size:11px}
html.ui-v3 .match-result{font-size:11px}
html.ui-v3 .guide-hero > span{font-size:11px}
html.ui-v3 .swatches i{font-size:11px}
html.ui-v3 .extension article span{font-size:11px}
html.ui-v3 .extension article p{font-size:11px}
html.ui-v3 .motion-guide p{font-size:11px}
@media (min-width: 900px){html.ui-v3 .timeline span,html.ui-v3 .timeline small{font-size:11px}
html.ui-v3 .privacy-note b{font-size:11px}
html.ui-v3 .privacy-note span{font-size:11px}}
@media (max-width: 420px){html.ui-v3 .review-label span{font-size:11px}
html.ui-v3 .inning span{font-size:11px}
html.ui-v3 .player-side span:last-child{font-size:11px}
html.ui-v3 .vs{font-size:11px}
html.ui-v3 .tactic-tag{font-size:11px}
html.ui-v3 .tactic-card b{font-size:11px}
html.ui-v3 .card-index{font-size:11px}
html.ui-v3 .selected-detail p{font-size:11px}}
@media (max-height: 720px) and (max-width: 500px){html.ui-v3 .tactic-symbol{font-size:11px}}
html.ui-v3 .make-deck .report-verdict span{font-size:11px}
html.ui-v3 .make-deck .report-verdict p{font-size:11px}
html.ui-v3 .make-deck .report-metric-head,html.ui-v3 .make-deck .ratio-head{font-size:11px}
html.ui-v3 .make-deck .report-metrics em{font-size:11px}
html.ui-v3 .make-deck .report-note{font-size:11px}
html.ui-v3 .make-deck .ratio-row small{font-size:11px}
html.ui-v3 .collection-progress .help{font-size:11px}
html.ui-v3 .club-collection small{font-size:11px}
html.ui-v3 .recycle-row>.btn span{font-size:11px}
@media(max-width:759px){html.ui-v3 .shard-wallet p{font-size:11px}
html.ui-v3 .recycle-player small{font-size:11px}
html.ui-v3 .recycle-stock small{font-size:11px}}
@media(max-width:740px){html.ui-v3 .club-button small{font-size:11px}
html.ui-v3 .collection-progress .eyebrow{font-size:11px}}
html.ui-v3 .grade-badge{font-size:11px}
html.ui-v3 .grade-odds strong{font-size:11px}
html.ui-v3 .pack-celebration .eyebrow{font-size:11px}
@media(max-width:740px){html.ui-v3 .pack-celebration p{font-size:11px}
html.ui-v3 .pack-opening .card-body>.grade-badge{font-size:11px}
html.ui-v3 .pack-opening .card-extra{font-size:11px}
html.ui-v3 .grade-odds strong{font-size:11px}}
html.ui-v3 .eyebrow,html.ui-v3 .kicker{font-size:11px}
html.ui-v3 .grade-badge{font-size:11px}
html.ui-v3 .deck-slot small,html.ui-v3 .deck-slot span{font-size:11px}
html.ui-v3 .lineup-name span{font-size:11px}
html.ui-v3 .bench-chips small{font-size:11px}
html.ui-v3 .roster-groups>div>span{font-size:11px}
html.ui-v3 .counter-row small{font-size:11px}
html.ui-v3 .player-card-info>span{font-size:11px}
html.ui-v3 .collapse-title>span{font-size:11px}
html.ui-v3 .team-count small{font-size:11px}
html.ui-v3 .milestones small{font-size:11px}
html.ui-v3 .next-level{font-size:11px}
html.ui-v3 .season-bonus small{font-size:11px}
html.ui-v3 .bonus-result>span{font-size:11px}
html.ui-v3 .player-breakdown summary small{font-size:11px}
html.ui-v3 .player-breakdown summary em{font-size:11px}
html.ui-v3 .synergy-panel .rules-note{font-size:11px}
html.ui-v3 .player-side .eyebrow{font-size:11px}
html.ui-v3 .hand-note{font-size:11px}
html.ui-v3 .unowned>span:last-child{font-size:11px}
html.ui-v3 .pack-opening .card-extra{font-size:11px}
@media(max-width:760px){html.ui-v3 .setup-steps{font-size:11px}
html.ui-v3 .deck-toolbar>span{font-size:11px}
html.ui-v3 .lineup-name span{font-size:11px}
html.ui-v3 .position{font-size:11px}
html.ui-v3 .counter-row small{font-size:11px}
html.ui-v3 .player-card-info div{font-size:11px}
html.ui-v3 .opponent-list span{font-size:11px}
html.ui-v3 .record-list small{font-size:11px}
html.ui-v3 .selected-detail p{font-size:11px}
html.ui-v3 .selection-copy button{font-size:11px}
html.ui-v3 .pack-opening .player-card-info>span{font-size:11px}
html.ui-v3 .pack-opening .player-card-info div{font-size:11px}
html.ui-v3 .pack-opening .card-extra{font-size:11px}}
@media(max-height:720px) and (max-width:500px){html.ui-v3 .player-side span:last-child{font-size:11px}}
html.ui-v3 .sheet-header span{font-size:11px}
html.ui-v3 .replaceable-photo > span{font-size:11px}
html.ui-v3 .detail-identity p,html.ui-v3 .detail-identity small{font-size:11px}
html.ui-v3 .detail-section .section-head span{font-size:11px}
html.ui-v3 .stat-grid span{font-size:11px}
html.ui-v3 .synergy-breakdown span{font-size:11px}
html.ui-v3 .synergy-breakdown small{font-size:11px}
html.ui-v3 .trait{font-size:11px}
html.ui-v3 .real-record-note span{font-size:11px}
html.ui-v3 .current-player > span,html.ui-v3 .substitution-sheet > h3,html.ui-v3 .pitcher-sheet > h3{font-size:11px}
html.ui-v3 .current-player small{font-size:11px}
html.ui-v3 .candidate-list span,html.ui-v3 .candidate-list small{font-size:11px}
html.ui-v3 .comparison > span{font-size:11px}
html.ui-v3 .comparison small{font-size:11px}
html.ui-v3 .pitcher-current span{font-size:11px}
html.ui-v3 .pitcher-current p{font-size:11px}
html.ui-v3 .emergency-rule span{font-size:11px}
html.ui-v3 .cost-card-grid span{font-size:11px}
html.ui-v3 .cost-card-grid b{font-size:11px}
html.ui-v3 .unsaved-banner b{font-size:11px}
html.ui-v3 .rename-field{font-size:11px}
html.ui-v3 .slot-list div span{font-size:11px}
html.ui-v3 .slot-actions button{font-size:11px}
html.ui-v3 .account-card div span{font-size:11px}
html.ui-v3 .account-card button{font-size:11px}
html.ui-v3 .system-state span{font-size:11px}
html.ui-v3 .system-state button{font-size:11px}
html.ui-v3 .settings-list b{font-size:11px}
html.ui-v3 .demo-note{font-size:11px}
html.ui-v3 .result-switch button{font-size:11px}
html.ui-v3 .final-call > span{font-size:11px}
html.ui-v3 .inning-table > div{font-size:11px}
html.ui-v3 .reward-box span{font-size:11px}
html.ui-v3 .key-record span{font-size:11px}
html.ui-v3 .key-record small{font-size:11px}
html.ui-v3 .cost-card>span{font-size:11px}
html.ui-v3 .opponent-note-button b{font-size:11px}
html.ui-v3 .opponent-note-button small{font-size:11px}
html.ui-v3 .enhancement-inline{font-size:11px}
html.ui-v3 .stat-legend{font-size:11px}
html.ui-v3 .collection-filters label,html.ui-v3 .pack-options label{font-size:11px}
html.ui-v3 .insert-card-summary p{font-size:11px}
html.ui-v3 .entry-rule span{font-size:11px}
html.ui-v3 .entry-list-head p{font-size:11px}
html.ui-v3 .candidate-main > span{font-size:11px}
html.ui-v3 .candidate-main > small{font-size:11px}
html.ui-v3 .enhance-player p{font-size:11px}
html.ui-v3 .enhance-steps span{font-size:11px}
html.ui-v3 .enhance-notice li{font-size:11px}
html.ui-v3 .enhance-attempt span{font-size:11px}
html.ui-v3 .enhance-result span{font-size:11px}
html.ui-v3 .enhance-state{font-size:11px}
html.ui-v3 .next-game-note span{font-size:11px}
html.ui-v3 .pack-type-grid span{font-size:11px}
html.ui-v3 .pack-type-grid small{font-size:11px}
html.ui-v3 .pack-probability b{font-size:11px}
html.ui-v3 .pack-probability span{font-size:11px}
html.ui-v3 .pack-probability small{font-size:11px}
html.ui-v3 .photo-source{font-size:11px}
html.ui-v3 .guide-copy>small{font-size:11px}
html.ui-v3 .rarity-boost{font-size:11px}
@media(max-width:760px){html.ui-v3 .trait-chip small{font-size:11px}
html.ui-v3 .guide-ranges{font-size:11px}
html.ui-v3 .stat-grid small{font-size:11px}}
@media(max-height:720px) and (max-width:500px){html.ui-v3 .guide-copy>small{font-size:11px}}
html.ui-v3 .league-fixture small{font-size:11px}
html.ui-v3 .league-results article>small{font-size:11px}
html.ui-v3 .league-stats small{font-size:11px}
html.ui-v3 .postseason-banner span{font-size:11px}
html.ui-v3 .postseason-series header small{font-size:11px}
html.ui-v3 .postseason-series header>span{font-size:11px}
html.ui-v3 .postseason-teams small{font-size:11px}
html.ui-v3 .postseason-games small{font-size:11px}
html.ui-v3 .field-slot>span{font-size:11px}
html.ui-v3 .field-slot small{font-size:11px}
html.ui-v3 .field-library-card small{font-size:11px}
html.ui-v3 .field-library-card .grade{font-size:11px}
@media(max-width:760px){html.ui-v3 .field-slot>span{font-size:11px}}
html.ui-v3 .compare-head small{font-size:11px}
html.ui-v3 .player-comparison>p{font-size:11px}
html.ui-v3 .field-slot>.field-position{font-size:11px}
html.ui-v3 .field-slot .field-card-meta small{font-size:11px}
html.ui-v3 .field-workspace .grade-badge{font-size:11px}
html.ui-v3 .field-card-action{font-size:11px}
@media(max-width:760px){html.ui-v3 .field-slot>.field-position{font-size:11px}
html.ui-v3 .field-slot .grade-badge{font-size:11px}
html.ui-v3 .field-slot .field-card-meta small{font-size:11px}}
html.ui-v3 .pitch-role{font-size:11px}
@media(max-width:760px){html.ui-v3 .player-side .pitch-usage{font-size:11px}}
html.ui-v3 .lineup-edit small{font-size:11px}
html.ui-v3 .detail-section .section-head>span{font-size:11px}
html.ui-v3 .keyboard-help{font-size:11px}
html.ui-v3 .quick-prepare:after{font-size:11px}
html.ui-v3 .broadcast-field text{font-size:11px}
@media(max-width:600px){html.ui-v3 .lr-card-skill{font-size:11px}}
html.ui-v3 .make-deck .rotation-face .pitch-role{font-size:11px}
html.ui-v3 .make-deck .rotation-face .pitch-usage{font-size:11px}
html.ui-v3 .make-deck .rotation-cards .eyebrow{font-size:11px}
html.ui-v3 .make-deck .rotation-cards .grade-badge{font-size:11px}
html.ui-v3 .bulk-hero>span{font-size:11px}
html.ui-v3 .bulk-summary small{font-size:11px}
html.ui-v3 .bulk-confirm-footer small{font-size:11px}
html.ui-v3 .make-deck .rotation-face b .enhancement-inline{font-size:11px}
html.ui-v3 .make-deck .field-slot .field-card-meta small{font-size:11px}
html.ui-v3 .make-deck .field-slot .grade-badge{font-size:11px}
@media(max-width:760px){html.ui-v3 .make-deck .section-head .eyebrow{font-size:11px}
html.ui-v3 .make-deck .field-slot>.field-position{font-size:11px}
html.ui-v3 .make-deck .field-legend{font-size:11px}}
@media(max-width:760px){html.ui-v3 .make-deck .friendly-starter .pitch-role{font-size:11px}}
html.ui-v3 .make-deck .field-slot .field-card-meta .enhancement-inline{font-size:11px}
html.ui-v3 .make-deck .field-slot .field-card-meta .grade-badge{font-size:11px}
html.ui-v3 .make-deck .lineup-row>.lineup-name>span{font-size:11px}
html.ui-v3 .make-deck .lineup-row>.lineup-edit{font-size:11px}
html.ui-v3 .make-deck .lineup-row>.grade-badge{font-size:11px}
html.ui-v3 .auto-fixed-list small{font-size:11px}
html.ui-v3 .overall-badge small{font-size:11px}
html.ui-v3 .field-library-card .library-overall small{font-size:11px}
html.ui-v3 .compact-ovr{font-size:11px}
html.ui-v3 .make-deck .field-portrait .compact-ovr{font-size:11px}
html.ui-v3 .clutch-hero small{font-size:11px}
html.ui-v3 .clutch-mode-cards small{font-size:11px}
html.ui-v3 .clutch-outcomes span{font-size:11px}
html.ui-v3 .synergy-totals i{font-size:11px}
@media(max-width:600px){html.ui-v3 .topbar .save-status{font-size:11px}}
@media(max-width:600px){html.ui-v3 .product-nav button{font-size:11px}}
html.ui-v3 .ps-stage-head span{font-size:11px}
/* Pretendard (SIL OFL), self-hosted: the CSP allows fonts from this server only */
@font-face{font-family:'Pretendard Variable';src:url(/fonts/pretendard.woff2) format('woff2');font-weight:45 920;font-display:swap}
/* UI colour system (2026-10-27): 16-colour palette; every colour is a palette colour or a palette colour mixed with white / ink */
:root{--p-white:#ffffff;--p-gold:#ffc94a;--p-green:#3c9a5f;--p-red:#c32f3e;--p-g-n:#7a879a;--p-g-r:#2c5fbf;--p-g-sr:#5e3fc4;--p-g-ssr:#a8740f;--p-g-ur:#9c1028;--p-g-lr:#16936c}
/* colour tokens (tools css-tokenize): the most used colour families; effect-only colours stay literal */
:root{--c-white:color-mix(in srgb,var(--p-white) 8%,var(--p-white));--c-gray-96:var(--p-bg);--c-navy-15:var(--p-navy);--c-slate-90:var(--p-line);--c-black:var(--p-ink);--c-blue-96:color-mix(in srgb,var(--p-blue) 8%,var(--p-white));--c-gold-84:var(--p-gold);--c-slate-42:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink));--c-slate-49:var(--p-slate);--c-gray-50:color-mix(in srgb,var(--p-navy) 60%,var(--p-white));--c-blue-41:var(--p-blue);--c-purple-38:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink));--c-slate-41:color-mix(in srgb,var(--p-slate) 80%,var(--p-ink));--c-gold-98:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));--c-green-97:color-mix(in srgb,var(--p-gold) 8%,var(--p-white));--c-purple-94:color-mix(in srgb,var(--p-g-sr) 8%,var(--p-white));--c-gray-91:color-mix(in srgb,var(--p-slate) 16%,var(--p-white));--c-slate-74:color-mix(in srgb,var(--p-line) 80%,var(--p-ink));--c-navy-11:color-mix(in srgb,var(--p-navy) 55%,var(--p-ink));--c-slate-82:color-mix(in srgb,var(--p-slate) 32%,var(--p-white));--c-blue-41-2:var(--p-blue);--c-gold-96:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));--c-gray-88:color-mix(in srgb,var(--p-navy) 16%,var(--p-white));--c-orange-98:color-mix(in srgb,var(--p-gold) 8%,var(--p-white));--c-gold-96-2:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));--c-blue-88:color-mix(in srgb,var(--p-g-r) 16%,var(--p-white));--c-slate-36:color-mix(in srgb,var(--p-g-n) 55%,var(--p-ink));--c-slate-68:color-mix(in srgb,var(--p-slate) 60%,var(--p-white));--c-slate-85:color-mix(in srgb,var(--p-slate) 32%,var(--p-white));--c-slate-56:var(--p-g-n);--c-navy-6:var(--p-ink);--c-red-57:var(--p-red);--c-gray-61:color-mix(in srgb,var(--p-bg) 55%,var(--p-ink));--c-red-96:color-mix(in srgb,var(--p-red) 8%,var(--p-white));--c-slate-80:color-mix(in srgb,var(--p-blue) 32%,var(--p-white));--c-green-91:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));--c-orange-49:var(--p-g-ssr);--c-red-61:var(--p-red);--c-red-64:var(--p-red);--c-navy-19:var(--p-navy)}

/* =====================================================================
   MATCH SCREEN v5 (html.ui-v3, opt-in) — same light palette as the rest of
   the game, rounded cards, one type scale (11 · 12 · 13 · 14 · 16 · 20 · 28).
   Symmetric batter/pitcher card, comparison bars, even five-card hand.
   ===================================================================== */
html.ui-v3 .match-shell{--m-ink:var(--c-navy-15);--m-muted:var(--c-gray-50);--m-line:var(--c-gray-91);--m-soft:var(--c-gray-96);--m-blue:var(--p-blue);--m-red:var(--p-red);font-size:14px;line-height:1.45;color:var(--m-ink)}
html.ui-v3 .match-shell :is(b,strong){letter-spacing:-.01em}
/* scoreboard: teams, inning pill, bases and outs in one bar */
html.ui-v3 .scoreboard{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px 14px;margin:0;background:var(--c-navy-15);color:var(--c-white);border-radius:0 0 20px 20px;min-height:0}
html.ui-v3 .scoreboard .team-score{display:flex;align-items:center;gap:8px;min-width:0}
html.ui-v3 .scoreboard .team-score.away{flex-direction:row;justify-content:flex-end}
html.ui-v3 .scoreboard .team-score img{width:30px;height:30px;object-fit:contain;flex:none}
html.ui-v3 .scoreboard .team-score div{min-width:0;display:grid}
html.ui-v3 .scoreboard .team-score div b{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--c-white)}
html.ui-v3 .scoreboard .team-score div span{font-size:11px;color:color-mix(in srgb,var(--p-slate) 60%,var(--p-white))}
html.ui-v3 .scoreboard .team-score strong{font-size:28px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;color:var(--c-white);margin-left:auto}
html.ui-v3 .scoreboard .team-score.away strong{margin:0 auto 0 0}
html.ui-v3 .scoreboard .inning{display:grid;justify-items:center;gap:1px;padding:6px 12px;background:var(--c-green-91);color:var(--c-navy-15);border-radius:14px;min-width:64px}
html.ui-v3 .scoreboard .inning b{font-size:14px;font-weight:800;color:var(--c-navy-15);white-space:nowrap}
html.ui-v3 .scoreboard .inning span{font-size:11px;font-weight:700;color:color-mix(in srgb,var(--p-green) 80%,var(--p-ink));white-space:nowrap}
html.ui-v3 .scoreboard .sb-situ{display:grid;justify-items:center;gap:6px;padding-left:10px;border-left:1px solid color-mix(in srgb,var(--c-white) 13.3%,transparent)}
html.ui-v3 .sb-bases{position:relative;display:block;width:30px;height:20px}
html.ui-v3 .sb-bases i{position:absolute;width:9px;height:9px;border:1.5px solid var(--p-g-n);border-radius:2px;transform:rotate(45deg)}
html.ui-v3 .sb-bases i:nth-child(1){left:10px;top:0}html.ui-v3 .sb-bases i:nth-child(2){left:19px;top:9px}html.ui-v3 .sb-bases i:nth-child(3){left:1px;top:9px}
html.ui-v3 .sb-bases i.on{background:var(--c-green-91);border-color:var(--c-green-91)}
html.ui-v3 .sb-outs{display:flex;gap:4px}html.ui-v3 .sb-outs i{width:7px;height:7px;border-radius:50%;border:1.5px solid var(--p-g-n);box-sizing:border-box}html.ui-v3 .sb-outs i.on{background:var(--p-red);border-color:var(--p-red)}
/* batter vs pitcher */
html.ui-v3 .versus-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"bat vs pit" "bars bars bars" "duel duel duel" "stam stam stam";align-items:start;gap:0 6px;margin:12px 12px 0;padding:16px 14px 0;background:var(--c-white);border:1px solid var(--m-line);border-radius:20px;box-shadow:0 6px 18px color-mix(in srgb,var(--c-navy-15) 5.9%,transparent);height:auto;overflow:hidden}
html.ui-v3 .versus-card .player-side{position:static;grid-area:bat;display:flex;flex-direction:column;align-items:center;gap:8px;width:auto;height:auto;min-width:0;padding:0;background:none;border:0;text-align:center;color:inherit}
html.ui-v3 .versus-card .player-side.pitcher{grid-area:pit;text-align:center}
html.ui-v3 .versus-card .player-art{position:static;width:80px;height:auto;max-height:104px;object-fit:contain;border-radius:14px;background:var(--m-soft);-webkit-mask-image:none;mask-image:none}
html.ui-v3 .versus-card .player-side>div{position:static;display:grid;justify-items:center;gap:3px;min-width:0;max-width:100%}
html.ui-v3 .versus-card .player-side .eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:0;color:var(--m-muted);text-transform:none}
html.ui-v3 .versus-card .player-side b{font-size:20px;font-weight:600;line-height:1.2;color:var(--m-ink);word-break:keep-all;text-shadow:none}
html.ui-v3 .versus-card .player-side span:not(.eyebrow):not(.grade){font-size:12px;font-weight:500;line-height:1.4;color:var(--m-muted);word-break:keep-all}
html.ui-v3 .versus-card .pitch-usage{font-size:11px;color:var(--m-muted)}html.ui-v3 .versus-card .pitch-usage.mismatch{color:var(--m-red);font-weight:700}
html.ui-v3 .versus-card .vs{position:static;grid-area:vs;align-self:start;margin:26px 0 0;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--m-ink);color:var(--c-white);font-size:11px;font-weight:600;transform:none;translate:none;padding:0;box-shadow:none}
html.ui-v3 .duel-bars{position:static;grid-area:bars;display:grid;gap:8px;width:auto;margin:14px 0 0;padding:12px;background:var(--m-soft);border:0;border-radius:14px;translate:none;box-shadow:none}
html.ui-v3 .duel-bars>div{display:grid;grid-template-columns:30px minmax(0,1fr) 72px minmax(0,1fr) 42px;align-items:center;gap:8px}
html.ui-v3 .duel-bars b{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--m-ink)}html.ui-v3 .duel-bars>div>b:last-child{text-align:right}
html.ui-v3 .duel-bars small{text-align:center;font-size:11px;font-weight:700;color:var(--m-muted);white-space:nowrap}
html.ui-v3 .duel-bars span{display:flex;height:6px;border-radius:3px;background:var(--c-gray-91);overflow:hidden}html.ui-v3 .duel-a{justify-content:flex-end}
html.ui-v3 .duel-a i{display:block;height:6px;border-radius:3px;background:var(--m-blue)}html.ui-v3 .duel-b i{display:block;height:6px;border-radius:3px;background:var(--m-red)}
html.ui-v3 .versus-card .stamina{position:static;grid-area:stam;height:auto;display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:8px;margin:12px -14px 0;padding:10px 14px;background:var(--c-white);border:0;border-top:1px solid var(--m-line);font-size:12px;color:var(--m-muted)}
html.ui-v3 .versus-card .stamina b{color:var(--m-ink);font-weight:600}
html.ui-v3 .versus-card .stamina .fatigue{font-weight:600;color:var(--p-green)}html.ui-v3 .versus-card .stamina .fatigue.low{color:var(--m-red)}
html.ui-v3 .versus-card .stamina div{height:6px;border-radius:3px;background:var(--c-gray-91);overflow:hidden}html.ui-v3 .versus-card .stamina i{display:block;height:6px;border-radius:3px;background:var(--p-green)}
/* traits, situation, guide */
html.ui-v3 .match-traits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 12px 0}
html.ui-v3 .trait-chip{display:flex;align-items:center;gap:8px;min-width:0;padding:10px 12px;background:var(--c-white);border:1px solid var(--m-line);border-radius:14px;font-size:13px;color:var(--m-ink)}
html.ui-v3 .trait-chip b{font-size:13px;font-weight:600}html.ui-v3 .trait-chip small{font-size:12px;color:var(--p-green);font-weight:700}
html.ui-v3 .situation-row{display:flex;justify-content:flex-end;align-items:center;margin:8px 12px 0;padding:0;background:none;border:0;min-height:0}
html.ui-v3 .situation-row .diamond,html.ui-v3 .situation-row .outs{display:none}
html.ui-v3 .situation-row .log-button{font-size:13px;font-weight:700;min-height:36px}
html.ui-v3 .situation-advice{margin:4px 12px 0;padding:12px 14px;background:var(--c-blue-96);border:0;border-radius:14px;font-size:13px;line-height:1.5;color:var(--c-navy-19)}
html.ui-v3 .situation-advice::before{content:'상황 조언';display:block;margin-bottom:2px;font-size:11px;font-weight:600;color:var(--c-blue-41)}
html.ui-v3 .match-guide-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:8px 12px 0}
html.ui-v3 .opponent-note-button,html.ui-v3 .guide-open{min-height:44px;border-radius:14px;font-size:13px;font-weight:700}
/* hand: five even cards */
html.ui-v3 .hand-head{margin:14px 14px 0}html.ui-v3 .hand-head .eyebrow{font-size:11px;letter-spacing:0;color:var(--m-muted)}html.ui-v3 .hand-head b{font-size:16px;font-weight:600;color:var(--m-ink)}
html.ui-v3 .hand-note{font-size:12px;color:var(--m-muted)}
html.ui-v3 .tactic-hand{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:none;gap:6px;margin:0;padding:10px 12px 4px;overflow:visible;min-height:0}
html.ui-v3 .tactic-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;width:auto;height:auto;min-height:112px;margin:0;padding:8px 4px 10px;background:var(--c-white);border:1.5px solid var(--m-line);border-radius:14px;color:var(--m-ink);text-align:center;box-shadow:none;rotate:none;translate:none;transition:translate .16s ease,border-color .16s,box-shadow .16s}
html.ui-v3 .tactic-card .card-index{position:static;align-self:flex-start;padding:0 4px;font-size:11px;font-weight:700;color:color-mix(in srgb,var(--p-slate) 60%,var(--p-white))}
html.ui-v3 .tactic-card .tactic-symbol{width:38px;height:38px;margin:0;display:grid;place-items:center;border-radius:50%;background:var(--c-blue-96);color:var(--c-blue-41)}
html.ui-v3 .tactic-card .tactic-symbol .gi{width:20px;height:20px}
html.ui-v3 .tactic-card.power .tactic-symbol{background:var(--c-red-96);color:var(--p-red)}html.ui-v3 .tactic-card.bunt .tactic-symbol{background:color-mix(in srgb,var(--p-green) 16%,var(--p-white));color:var(--p-green)}html.ui-v3 .tactic-card.eye .tactic-symbol{background:var(--c-purple-94);color:var(--c-purple-38)}
html.ui-v3 .tactic-card .tactic-tag{padding:0;font-size:11px;font-weight:600;color:var(--m-muted);white-space:nowrap}
html.ui-v3 .tactic-card b{padding:0 2px;font-size:13px;font-weight:600;line-height:1.25;word-break:keep-all;color:var(--m-ink)}
html.ui-v3 .tactic-card:not(:disabled):hover{border-color:color-mix(in srgb,var(--p-blue) 32%,var(--p-white));translate:0 -2px}
html.ui-v3 .tactic-card.selected{border:2px solid var(--m-ink);padding:7.5px 3.5px 9.5px;background:var(--c-green-97);translate:0 -6px;box-shadow:0 8px 16px color-mix(in srgb,var(--c-navy-15) 12.2%,transparent)}
html.ui-v3 .tactic-card .selected-check{position:absolute;top:5px;right:5px;width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:var(--m-ink);color:var(--c-white)}
html.ui-v3 .tactic-card .selected-check .gi{width:10px;height:10px}
html.ui-v3 .tactic-card:disabled{opacity:.45}
html.ui-v3 .decision-guide,html.ui-v3 .selected-detail{margin:10px 12px 0;border-radius:14px;font-size:13px}
/* action dock: rounded, one primary */
html.ui-v3 .match-shell .action-dock .btn{min-height:50px;border-radius:14px;font-size:15px;font-weight:600}
html.ui-v3 .match-shell .action-dock .btn.quick-prepare{min-height:40px;font-size:13px;font-weight:700}
html.ui-v3 .match-shell .action-dock .selection-copy span{font-size:12px;color:var(--m-muted)}html.ui-v3 .match-shell .action-dock .selection-copy b{font-size:16px;font-weight:600;color:var(--m-ink)}
/* result */
html.ui-v3 .plate-result{margin:12px 12px 0;border-radius:20px;overflow:hidden}
html.ui-v3 .plate-result .result-call b{font-size:28px;font-weight:600;line-height:1.2;word-break:keep-all}
html.ui-v3 .plate-result .result-call>span{font-size:11px;letter-spacing:.04em}html.ui-v3 .plate-result .result-call p{font-size:13px}
html.ui-v3 .plate-result .duel-card b{font-weight:600;word-break:keep-all}
html.ui-v3 .result-actions .btn{min-height:50px;border-radius:14px;font-size:15px;font-weight:600}
@media(min-width:900px){html.ui-v3 .versus-card .player-art{width:96px;max-height:124px}html.ui-v3 .versus-card .player-side b{font-size:24px}html.ui-v3 .tactic-card{min-height:128px}html.ui-v3 .tactic-card b{font-size:14px}}
@media(max-width:380px){html.ui-v3 .versus-card .player-art{width:68px}html.ui-v3 .versus-card .player-side b{font-size:18px}html.ui-v3 .tactic-card b{font-size:12px}html.ui-v3 .duel-bars>div{grid-template-columns:28px minmax(0,1fr) 68px minmax(0,1fr) 40px;gap:6px}}
html.ui-v3 .versus-card .stamina:has(.low) i{background:var(--m-red)}
html.ui-v3 .duel-bars b{white-space:nowrap}
html.ui-v3 .match-guide-tools>:only-child{grid-column:1/-1}
html.ui-v3 .versus-card .player-side .eyebrow .grade{color:var(--c-white);font-size:11px;text-shadow:0 1px 1px color-mix(in srgb,var(--c-black) 33.3%,transparent)}
/* league hub: per-game track, playoff cut line, own row */
html.ui-v3 .league-progress progress{display:none}
html.ui-v3 .season-track{display:grid;grid-template-columns:repeat(auto-fit,minmax(3px,1fr));gap:2px;margin:10px 0 6px}
html.ui-v3 .season-track i{display:block;height:10px;border-radius:3px;background:color-mix(in srgb,var(--c-white) 14.9%,transparent)}
html.ui-v3 .season-track i.w{background:var(--c-green-91)}html.ui-v3 .season-track i.l{background:var(--p-red)}html.ui-v3 .season-track i.d{background:color-mix(in srgb,var(--p-slate) 60%,var(--p-white))}
html.ui-v3 .league-table tr.mine>*{background:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));font-weight:600}
/* notice panel with actions (e.g. league game in progress) */
.notice-panel{display:grid;gap:6px;padding:20px}
.notice-panel h3{margin:0;font-size:16px;font-weight:600}
.notice-panel p{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}
.notice-panel .panel-actions{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:8px;margin-top:10px}
.notice-panel .panel-actions .btn{min-height:48px;border-radius:14px;font-size:14px;font-weight:600}
@media(min-width:700px){.notice-panel .panel-actions{display:flex}.notice-panel .panel-actions .btn{min-width:160px}}
.notice-panel .status-pill{justify-self:start;margin-bottom:2px}
.topbar .save-status:empty{display:none}
/* situation next to the hand: runners, outs and score stay in view while choosing a card */
.hand-situ{display:none}
html.ui-v3 .hand-head{display:flex;align-items:center;justify-content:space-between;gap:10px}html.ui-v3 .hand-head>div:first-child{min-width:0;flex:1}html.ui-v3 .hand-head .hand-note:empty{display:none}html.ui-v3 .hand-situ{flex:none}
html.ui-v3 .hand-situ{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--c-white);border:1px solid var(--m-line);border-radius:14px;margin-left:auto}
html.ui-v3 .hand-situ .sb-bases i{border-color:var(--c-slate-68)}html.ui-v3 .hand-situ .sb-bases i.on{background:var(--m-ink);border-color:var(--m-ink)}
html.ui-v3 .hand-situ .sb-outs i{border-color:var(--c-slate-68)}html.ui-v3 .hand-situ .sb-outs i.on{background:var(--m-red);border-color:var(--m-red)}
html.ui-v3 .hand-situ>div{display:grid;gap:1px}
html.ui-v3 .hand-situ b{font-size:13px;font-weight:600;color:var(--m-ink);white-space:nowrap}
html.ui-v3 .hand-situ small{font-size:11px;font-weight:600;color:var(--m-muted);white-space:nowrap}
html.ui-v3 .hand-head .hand-situ{display:flex;flex-direction:row;align-items:center;grid-template-columns:none}
/* momentum gauge (clutch charge) and read receipt */
.clutch-open.momentum{position:relative;background:linear-gradient(90deg,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) var(--m,0%),var(--c-gray-96) var(--m,0%));border:1px solid var(--c-gray-88);color:var(--c-navy-15);font-weight:600;opacity:1}
.clutch-open.momentum:disabled{opacity:1;cursor:default}
.clutch-open.momentum.full{background:var(--p-gold);border-color:var(--p-gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--p-gold) 33.3%,transparent)}
.momentum-receipt{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;margin:10px 12px 0;padding:12px 14px;background:var(--c-gray-96);border:1px solid var(--c-gray-91);border-left:4px solid var(--c-slate-68);border-radius:12px;font-size:13px;color:var(--c-navy-15)}
.momentum-receipt.won{background:color-mix(in srgb,var(--p-gold) 16%,var(--p-white));border-color:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));border-left-color:var(--p-green)}.momentum-receipt.lost{background:var(--c-red-96);border-color:color-mix(in srgb,var(--p-red) 32%,var(--p-white));border-left-color:var(--p-red)}
.momentum-receipt b{font-size:14px;font-weight:600}.momentum-receipt span{font-weight:600;font-variant-numeric:tabular-nums}.momentum-receipt small{grid-column:1/-1;font-size:12px;color:var(--c-gray-50)}
/* ---------- one-screen match on phones: everything needed to pick a card fits without scrolling ---------- */
.tools-log{display:none}
@media(max-width:700px){
 html.ui-v3 body.in-match:not(.nav-open) .product-nav{display:none}
 html.ui-v3 .scoreboard .sb-menu{display:grid;place-items:center;width:36px;height:36px;margin-left:2px;border:0;border-radius:10px;background:color-mix(in srgb,var(--c-white) 7.8%,transparent);color:var(--c-white)}
 html.ui-v3 .scoreboard{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto auto;gap:8px;padding:8px 10px;border-radius:0 0 16px 16px}
 html.ui-v3 .scoreboard .team-score img{width:24px;height:24px}html.ui-v3 .scoreboard .team-score strong{font-size:24px}
 html.ui-v3 .scoreboard .team-score div span{display:none}
 html.ui-v3 .scoreboard .inning{padding:4px 10px;min-width:58px;border-radius:12px}
 html.ui-v3 .scoreboard .sb-situ{padding-left:8px;gap:4px}
 html.ui-v3 .match-main{display:block;padding:0}
 /* compact face-off: photo and name side by side */
 html.ui-v3 .versus-card{margin:8px 10px 0;padding:10px 10px 0;border-radius:16px;gap:0 4px}
 html.ui-v3 .versus-card .player-side{flex-direction:row;align-items:center;gap:8px;text-align:left}
 html.ui-v3 .versus-card .player-side.pitcher{flex-direction:row-reverse;text-align:right}
 html.ui-v3 .versus-card .player-art{width:46px;max-height:60px;border-radius:10px;flex:none}
 html.ui-v3 .versus-card .player-side>div{justify-items:start;gap:1px}html.ui-v3 .versus-card .player-side.pitcher>div{justify-items:end}
 html.ui-v3 .versus-card .player-side b{font-size:16px}
 html.ui-v3 .versus-card .player-side span:not(.eyebrow):not(.grade){font-size:11px;white-space:nowrap}
 html.ui-v3 .versus-card .pitch-usage:not(.mismatch){display:none}
 html.ui-v3 .versus-card .vs{margin:14px 0 0;width:26px;height:26px;font-size:10px}
 html.ui-v3 .duel-bars{margin:8px 0 0;padding:7px 10px;gap:4px;border-radius:10px}
 html.ui-v3 .duel-bars b{font-size:13px}html.ui-v3 .duel-bars span,html.ui-v3 .duel-bars span i{height:5px}
 html.ui-v3 .versus-card .stamina{margin:8px -10px 0;padding:6px 12px;font-size:11px}
 html.ui-v3 .match-traits{margin:6px 10px 0;gap:6px}
 html.ui-v3 .trait-chip{padding:6px 10px;border-radius:10px;gap:6px;overflow:hidden}
 html.ui-v3 .trait-chip b,html.ui-v3 .trait-chip small{font-size:12px;overflow:hidden;text-overflow:ellipsis}
 html.ui-v3 .trait-chip .gi,html.ui-v3 .trait-chip svg{width:16px;height:16px;flex:none}
 html.ui-v3 .situation-row{display:none}
 html.ui-v3 .situation-advice{margin:6px 10px 0;padding:7px 12px;border-radius:10px;font-size:12px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 html.ui-v3 .situation-advice::before{display:inline;margin:0 6px 0 0}
 html.ui-v3 .match-guide-tools{display:flex;gap:6px;margin:6px 10px 0}
 html.ui-v3 .match-guide-tools>*{min-width:0;min-height:34px;border-radius:10px;font-size:12px;white-space:nowrap;text-overflow:ellipsis;justify-content:center}
 html.ui-v3 .tools-log{display:inline-flex;align-items:center;background:var(--c-white);border:1px solid var(--m-line);color:var(--m-ink);font-weight:700}html.ui-v3 .keyboard-help{display:none}
 html.ui-v3 .hand-situ{border-radius:10px;}
 html.ui-v3 .tactic-hand{padding:6px 10px 2px;gap:5px}
 html.ui-v3 .tactic-card{padding:6px 3px 8px;gap:3px;border-radius:12px}
 html.ui-v3 .tactic-card.selected{padding:5.5px 2.5px 7.5px;translate:0 -4px}
 html.ui-v3 .tactic-card .tactic-symbol{width:32px;height:32px}html.ui-v3 .tactic-card .tactic-symbol .gi{width:18px;height:18px}
 html.ui-v3 .tactic-card .card-index{display:none}
 html.ui-v3 .decision-guide,html.ui-v3 .selected-detail,html.ui-v3 .selected-detail.decision-guide{margin:6px 10px 0;padding:7px 10px;min-height:0;border-radius:10px;font-size:12px}
 html.ui-v3 .selected-detail p{font-size:11px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 /* dock pinned to the bottom edge while the nav is hidden */
 html.ui-v3 body.in-match:not(.nav-open) .match-shell .action-dock,html.ui-v3 body.in-match:not(.nav-open) .match-shell[data-phase="result"] .result-actions,html.ui-v3 body.in-match:not(.nav-open) .match-shell[data-phase="advance"] .advance-panel .sheet-actions{bottom:0;padding-bottom:calc(8px + env(safe-area-inset-bottom))}
 html.ui-v3 .match-shell .action-dock{display:grid;gap:6px 8px;padding:8px 10px}
 html.ui-v3 .match-shell .action-dock .clutch-open{grid-area:gauge;min-height:36px;padding:0 10px;border-radius:10px;font-size:12px;white-space:nowrap}
 html.ui-v3 .match-shell .action-dock .selection-copy{grid-area:copy}
 html.ui-v3 .match-shell .action-dock:not(:has(.clutch-open)) .selection-copy{grid-column:1/-1}
 html.ui-v3 .match-shell .action-dock .dock-buttons{grid-area:btns}
 html.ui-v3 .match-shell .action-dock .btn{min-height:46px;border-radius:12px}
 html.ui-v3 .match-shell .action-dock .btn.quick-prepare{min-height:32px;font-size:12px}
}
@media(max-width:700px) and (max-height:720px){
 html.ui-v3 .situation-advice,html.ui-v3 .phase-strip,html.ui-v3 .match-traits{display:none}
 html.ui-v3 .versus-card .player-art{width:40px;max-height:52px}
 html.ui-v3 .tactic-card{min-height:88px}
 html.ui-v3 .selected-detail p{-webkit-line-clamp:1}
}
@media(max-width:700px){
 html.ui-v3 .in-match #app>.topbar{height:40px}html.ui-v3 .in-match .topbar b{font-size:14px}
 html.ui-v3 .phase-strip{margin:6px 12px 0}
 html.ui-v3 .tactic-card{min-height:90px}
 html.ui-v3 .hand-head{margin:6px 12px 0}
 html.ui-v3 .match-shell:is([data-phase="exchange"],[data-phase="tactic"],[data-phase="pitcher"],[data-phase="pinch"],[data-phase="steal"]){padding-bottom:112px}
 html.ui-v3 .match-shell[data-phase="exchange"]{padding-bottom:148px}
}

@media(max-width:380px){html.ui-v3 .scoreboard{gap:6px;padding:8px}html.ui-v3 .scoreboard .team-score{gap:5px}html.ui-v3 .scoreboard .team-score img{width:20px;height:20px}html.ui-v3 .scoreboard .inning{min-width:52px;padding:4px 7px}html.ui-v3 .scoreboard .sb-situ{padding-left:6px}html.ui-v3 .scoreboard .sb-menu{width:32px;height:32px}html.ui-v3 .scoreboard .team-score strong{font-size:22px}}
html.ui-v3 .match-shell{background:var(--c-gray-96);min-height:calc(100dvh - 40px)}
/* fixes: no clipped labels in the tool row, smaller situation chip, left-aligned read receipt, no dark gap under the page */
html.ui-v3 body.in-match,html.ui-v3 body.in-match #app,html.ui-v3 .match-page{background:var(--c-gray-96)}
html.ui-v3 .momentum-receipt{text-align:left;justify-items:start;padding:10px 12px}html.ui-v3 .momentum-receipt b{font-size:13px}html.ui-v3 .momentum-receipt span{font-size:13px;justify-self:end}
@media(max-width:700px){
 html.ui-v3 .match-guide-tools>*{flex:0 1 auto;padding:0 10px;overflow:hidden}
 html.ui-v3 .match-guide-tools>.opponent-note-button{flex:1 1 0;display:flex;justify-content:flex-start;text-align:left}
 html.ui-v3 .opponent-note-button>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 html.ui-v3 .opponent-note-button b{font-size:12px;font-weight:700}
 html.ui-v3 .opponent-note-button small,html.ui-v3 .opponent-note-button>span[aria-hidden]{display:none}
 html.ui-v3 .match-guide-tools>.guide-open{gap:4px}html.ui-v3 .guide-open .ability-icon{width:15px;height:15px;flex:none}
 html.ui-v3 .hand-head>div:first-child .eyebrow{font-size:0;display:block;margin-bottom:4px}html.ui-v3 .hand-head .eyebrow>.rec-toggle:first-child{margin-left:0}
 html.ui-v3 .hand-head b{font-size:13px;line-height:1.3;word-break:keep-all}
 html.ui-v3 .hand-situ{padding:5px 9px;gap:7px}
 html.ui-v3 .hand-situ b{font-size:12px}html.ui-v3 .hand-situ small{font-size:11px}
 html.ui-v3 .hand-situ .sb-outs{display:none}
 html.ui-v3 .hand-situ .sb-bases{width:24px;height:16px;scale:.85}
}
/* result call-out in the light style: one rounded card, whole word at once (no slanted band, no per-letter blur) */
html.ui-v3 .bc-impact{top:30%;justify-items:center;padding:0 16px}
html.ui-v3 .bc-impact .bc-bar{justify-self:center;display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 14px;min-width:min(300px,84vw);max-width:92vw;margin:0;padding:16px 22px;background:var(--c-white);border-radius:18px;box-shadow:0 18px 40px color-mix(in srgb,var(--c-navy-15) 20%,transparent);transform:none;clip-path:none;animation:call-in calc(1.5s*var(--k,1)) ease-out forwards}
html.ui-v3 .bc-impact.bad{--call:var(--p-red)}html.ui-v3 .bc-impact.good{--call:var(--p-green)}html.ui-v3 .bc-impact.gold{--call:var(--p-gold)}
html.ui-v3 .bc-impact .bc-bar::before,html.ui-v3 .bc-impact .bc-bar::after,html.ui-v3 .bc-impact .bc-streak{display:none}
html.ui-v3 .bc-impact .bc-icon{grid-row:span 2;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:color-mix(in srgb,var(--call) 16%,var(--c-white));color:var(--call);transform:none}
html.ui-v3 .bc-impact .bc-icon .gi{width:28px;height:28px}
html.ui-v3 .bc-impact .bc-bar strong{display:block;transform:none;font-size:30px;line-height:1.15;font-weight:700;letter-spacing:-.02em;color:var(--c-navy-15);white-space:nowrap}
html.ui-v3 .bc-impact.big .bc-bar strong{font-size:36px}
html.ui-v3 .bc-impact .bc-bar small{transform:none;opacity:1;animation:none;font-size:13px;font-weight:700;letter-spacing:0;color:var(--c-gray-50);white-space:nowrap}
html.ui-v3 .bc-impact.still .bc-bar{transform:none!important;animation:none;opacity:1}
@keyframes call-in{0%{opacity:0;scale:.86}10%{opacity:1;scale:1.03}16%{scale:1}84%{opacity:1;scale:1}100%{opacity:0;scale:.98}}
/* reward / ceremony overlay in the light style: dimmed page, one rounded card, no slanted band */
html.ui-v3 .cel{--call:var(--p-blue);background:color-mix(in srgb,var(--c-navy-15) 54.9%,transparent);padding:20px;animation:cel-dim .18s ease-out both}
html.ui-v3 .cel.tone-gold{--call:var(--p-gold)}html.ui-v3 .cel.tone-red{--call:var(--p-red)}html.ui-v3 .cel.tone-purple{--call:var(--p-g-sr)}html.ui-v3 .cel.tone-silver{--call:var(--c-slate-56)}html.ui-v3 .cel.tone-holo{--call:var(--p-g-lr)}
html.ui-v3 .cel-beam,html.ui-v3 .cel-stripes,html.ui-v3 .cel-crack,html.ui-v3 .cel-band::after{display:none}
html.ui-v3 .cel-band,html.ui-v3 .cel.crack .cel-band{width:min(360px,100%);min-height:0;display:grid;justify-items:center;gap:12px;padding:26px 22px 22px;background:var(--c-white);border:0;border-top:6px solid var(--call);border-radius:22px;box-shadow:0 24px 60px color-mix(in srgb,var(--c-navy-6) 40%,transparent);clip-path:none;transform:none;animation:cel-card calc(.4s*var(--k,1)) cubic-bezier(.34,1.4,.64,1) both}
html.ui-v3 .cel.out{animation:cel-out .2s ease-in forwards}html.ui-v3 .cel.out .cel-band{animation:none}
html.ui-v3 .cel-mark{position:static;translate:none;display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:color-mix(in srgb,var(--call) 15%,var(--c-white));color:var(--call);opacity:1;animation:none}
html.ui-v3 .cel-mark .gi{width:38px;height:38px;stroke-width:1.8}
html.ui-v3 .cel-content{justify-items:center;text-align:center;gap:6px;max-width:100%}
html.ui-v3 .cel-tag{padding:4px 12px;border-radius:999px;background:color-mix(in srgb,var(--call) 15%,var(--c-white));color:var(--call);font-size:12px;font-weight:800;letter-spacing:0;transform:none;translate:none;opacity:1;animation:none}
html.ui-v3 .cel-title{justify-content:center;flex-wrap:wrap;gap:4px;font-size:28px;line-height:1.2;font-weight:900;letter-spacing:-.02em;color:var(--c-navy-15);transform:none;text-shadow:none;animation:none;word-break:keep-all}
html.ui-v3 .cel-title i{opacity:1;transform:none;filter:none;animation:none}
html.ui-v3 .cel-count{opacity:1;transform:none;filter:none;animation:none;font-size:40px}
html.ui-v3 .cel-unit{font-size:18px;color:var(--call)}
html.ui-v3 .cel-label{font-size:14px;font-weight:800;letter-spacing:0;color:var(--c-navy-15)}
html.ui-v3 .cel-sub{font-size:13px;line-height:1.5;color:var(--c-gray-50);opacity:1;animation:none}
html.ui-v3 .cel-chips{justify-content:center;gap:6px;margin-top:4px}
html.ui-v3 .cel-chips span{padding:6px 12px;border:1px solid var(--c-gray-91);border-radius:999px;background:var(--c-gray-96);color:var(--c-navy-15);font-size:12px;font-weight:700;transform:none;opacity:1;animation:none}
html.ui-v3 .cel-hint{bottom:max(24px,6vh);font-size:0;letter-spacing:0;color:var(--c-white);opacity:1;animation:none}
html.ui-v3 .cel-hint::after{content:'화면을 누르면 닫혀요';font-size:12px;font-weight:700;opacity:.85}
html.ui-v3 .cel-spark{background:var(--call);border-radius:3px}
html.ui-v3 .clutch-charges span{transform:none}
@keyframes cel-dim{from{opacity:0}to{opacity:1}}
@keyframes cel-card{from{opacity:0;scale:.9;translate:0 12px}to{opacity:1;scale:1;translate:0 0}}
/* situational trait line in the match chips and its detail card */
.trait-chip .trait-situ{display:block;font-size:11px;font-weight:700;color:var(--c-gray-61)}
.trait-chip .trait-situ.on{color:var(--p-g-ssr)}
.trait-chip .trait-situ.on::before{content:'발동 · '}
.situation-card{margin-top:10px}
html.ui-v3 .trait-chip span{display:grid;gap:1px;min-width:0}
@media(max-width:700px){html.ui-v3 .phase-strip{display:none}html.ui-v3 .trait-chip{align-items:flex-start}}
/* signature skill button and receipt */
.skill-open{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px;border:1px solid color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white));border-radius:10px;background:var(--c-purple-94);color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink));font-weight:600;font-size:12px;white-space:nowrap}
.skill-open .gi{width:16px;height:16px;flex:none}
.skill-open span{display:grid;text-align:left;line-height:1.2}.skill-open small{font-size:11px;font-weight:600;color:var(--p-g-r)}
.skill-open.on{background:var(--c-purple-38);border-color:var(--c-purple-38);color:var(--c-white)}.skill-open.on small{color:color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white))}
.skill-receipt{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;align-items:center;margin:10px 12px 0;padding:10px 12px;background:var(--c-purple-94);border-radius:12px;color:var(--c-navy-15);font-size:13px;text-align:left}
.skill-receipt .gi{width:18px;height:18px;color:var(--c-purple-38);grid-row:span 2}.skill-receipt b{font-weight:600}.skill-receipt span{font-size:12px;color:var(--c-gray-50)}
.skill-card{margin-top:10px}
@media(max-width:700px){
 html.ui-v3 .match-shell .action-dock{grid-template-columns:auto auto minmax(0,1fr);grid-template-areas:"gauge skill copy" "btns btns btns"}
 html.ui-v3 .match-shell .action-dock .skill-open{grid-area:skill}
 html.ui-v3 .match-shell .action-dock:has(.skill-open) .selection-copy span{display:none}
 html.ui-v3 .match-shell .action-dock:not(:has(.clutch-open)):not(:has(.skill-open)) .selection-copy{grid-column:1/-1}
}
@media(max-width:700px){
 html.ui-v3 .match-shell .action-dock .skill-open small{display:none}
 html.ui-v3 .match-shell .action-dock .selection-copy b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
 html.ui-v3 .trait-chip{white-space:normal}html.ui-v3 .trait-chip .trait-situ{white-space:normal;overflow:visible}
}
/* result: runner diamond is no longer cut off; trait notices wrap instead of running off both edges */
html.ui-v3 .result-animation{height:auto;overflow:visible;padding:8px 0 4px;display:grid;justify-items:center}
html.ui-v3 .plate-result .result-call{flex-wrap:wrap;justify-content:center;}
html.ui-v3 .plate-result .result-call>:is(span,b,p,strong):not(.trait-trigger){flex:1 0 100%}
html.ui-v3 .plate-result .result-call .trait-trigger{flex:0 1 auto;max-width:100%;white-space:normal;text-align:center;border-radius:10px}
/* special tactic cards: shop, deck builder block, hand marker */
.special-shop{}
.special-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;margin:12px 0}
.special-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;background:var(--c-white);border:1px solid var(--c-gray-91);border-left:4px solid var(--c-purple-38);border-radius:14px}
.special-card.defense{border-left-color:var(--p-blue)}.special-card.missing{opacity:.55}
.special-card .tactic-symbol{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--c-purple-94);color:var(--c-purple-38)}.special-card.defense .tactic-symbol{background:var(--c-blue-96);color:var(--c-blue-41)}
.special-card small{font-size:11px;color:var(--c-gray-50);font-weight:700}.special-card b{font-size:15px;font-weight:600;color:var(--c-navy-15)}
.special-card p{margin:2px 0 0;display:grid;gap:1px;font-size:12px;line-height:1.4}.special-card .plus{color:var(--p-green);font-weight:700}.special-card .minus{color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))}
.special-card strong{font-size:20px;font-weight:600;color:var(--c-navy-15)}.special-card strong small{font-size:12px}
.special-builder{margin-top:12px;padding-top:12px;border-top:1px dashed var(--c-gray-88)}
/* special tactics: cards in the deck, then filter chips */
.special-picked{display:flex;flex-wrap:wrap;gap:6px;padding:10px;margin-bottom:10px;border-radius:14px;background:#121933;min-height:44px;align-items:center}
.special-picked small{color:#c9cede;font-size:12px}
.sp-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 8px 3px 3px;border-radius:999px;border:1px solid #2c3658;background:#1c2546;color:#f4efe6;font:inherit;font-size:12px;font-weight:600;cursor:pointer;transition:transform .12s ease-out,background-color .15s ease}
.sp-chip:active{transform:scale(.97)}.sp-chip:focus-visible{outline:2px solid #d9b25a;outline-offset:2px}
.sp-chip .art{width:22px;height:22px;border-radius:999px}
.sp-chip i{font-style:normal;font-size:10px;font-weight:700;padding:1px 5px;border-radius:999px;background:#5b3fc4;color:#fff}
.sp-chip.g-ssr i{background:#b8892c}.sp-chip.g-r i{background:#2f5fc4}
.sp-chip em{font-style:normal;color:#d9b25a}.sp-chip .gi-close{width:11px;height:11px;opacity:.6}
.sp-chip:disabled{cursor:default}
.sp-filter{display:flex;gap:6px;overflow-x:auto;margin-bottom:8px;scrollbar-width:none}
.sp-filter button{flex:none;padding:5px 11px;border-radius:999px;border:1px solid #d9dde6;background:#fff;color:#1b2033;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.sp-filter button small{color:#8a90a0;font-weight:700}
.sp-filter button.active{background:#121933;border-color:#121933;color:#f4efe6}.sp-filter button.active small{color:#d9b25a}
.sp-filter button:focus-visible{outline:2px solid #121933;outline-offset:2px}
html .counter-row.special{padding-left:12px;padding-right:6px;border-radius:12px}
html .counter-row.special.in{background:#fbf6ea;box-shadow:inset 3px 0 0 #d9b25a}
/* attack / defense tabs for the tactic deck; special tactics sit first in each tab */
.tactic-kind-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px;margin-bottom:12px;border-radius:14px;background:#e6e8ee}
.tactic-kind-tabs button{display:grid;gap:1px;justify-items:center;padding:8px 6px;border:0;border-radius:11px;background:transparent;color:#1b2033;font:inherit;cursor:pointer;transition:background-color .15s ease}
.tactic-kind-tabs button b{font-size:14px;font-weight:700}
.tactic-kind-tabs button small{font-size:11px;font-weight:700;color:#6b7182}
.tactic-kind-tabs button small .invalid{color:#c32f3e}
.tactic-kind-tabs button.active{background:#121933;color:#f4efe6;box-shadow:0 2px 6px rgba(18,25,51,.18)}
.tactic-kind-tabs button.active small{color:#d9b25a}
.tactic-kind-tabs button:focus-visible{outline:2px solid #121933;outline-offset:2px}
.slot-bar{display:flex;align-items:center;gap:8px;margin:2px 0 12px}
.slot-cells{flex:1;display:grid;grid-template-columns:repeat(20,minmax(0,1fr));gap:2px}
.slot-cells i{height:10px;border-radius:3px;background:#fff;box-shadow:inset 0 0 0 1.5px #9aa0ad}.slot-cells i.base,.slot-cells i.sp{box-shadow:none}
.slot-cells i.base{background:#121933}.slot-cells i.sp{background:#d9b25a}
.slot-cells.over{grid-template-columns:repeat(auto-fill,minmax(8px,1fr))}.slot-cells.over i:nth-child(n+21){background:#c32f3e}
.slot-bar small{flex:none;font-size:12px;font-weight:600;color:#1b2033;font-variant-numeric:tabular-nums}
.base-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:0 0 4px}.base-head b{font-size:14px;font-weight:600}.base-head small{font-size:11px;color:#6b7182;font-weight:600}
html .tactic-section .base-tactics .deck-counter{display:inline-flex;align-items:center;gap:2px;border-radius:999px;background:#eef0f5;padding:2px}
html .tactic-section .base-tactics .deck-counter>button{width:30px;height:30px;border-radius:999px;color:#1b2033;font-weight:700;background:#fff;border:1px solid #d9dde6}
html .tactic-section .base-tactics .deck-counter>button:disabled{color:#b6bbc6;background:#f4f5f8}
html .tactic-section .base-tactics .deck-counter>input{width:34px;height:30px;padding:0;border:0;background:transparent;text-align:center;font-weight:700;font-size:15px;color:#1b2033;-moz-appearance:textfield}
html .tactic-section .base-tactics .deck-counter>input::-webkit-inner-spin-button{display:none}
html .tactic-section .base-tactics .counter-row{padding-left:6px;padding-right:6px}
.base-tactics .counter-row.zero .tactic-symbol{opacity:.45}.base-tactics .counter-row.zero b{color:#6b7182}
.tactic-part-tabs{display:flex;gap:0;margin:0 0 12px;border-bottom:1px solid #d9dde6}
.tactic-part-tabs button{flex:1;padding:9px 6px 8px;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;background:transparent;color:#6b7182;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.tactic-part-tabs button small{font-size:11px;font-weight:700;color:#8a90a0}
.tactic-part-tabs button.active{color:#121933;border-bottom-color:#121933}.tactic-part-tabs button.active small{color:#b8892c}
.tactic-part-tabs button:focus-visible{outline:2px solid #121933;outline-offset:-2px}
.tactic-section[data-part="base"]>.special-builder,.tactic-section[data-part="special"]>.base-head,.tactic-section[data-part="special"]>.base-tactics{display:none}
html .tactic-section[data-part="special"]>.special-builder{border-bottom:0;padding-bottom:0}
html .tactic-section>.special-builder{margin:0 0 14px;padding:0 0 14px;border-top:0;border-bottom:1px dashed var(--c-gray-88)}
.special-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.special-head b{font-size:14px;font-weight:600}
.counter-row.special .tactic-symbol{background:var(--c-purple-94);color:var(--c-purple-38)}
.special-count{min-width:44px;text-align:center;font-size:15px;font-weight:600}.special-count small{font-size:11px;color:var(--c-gray-50)}
.tactic-card.special{border-color:color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white));background:linear-gradient(180deg,color-mix(in srgb,var(--p-g-sr) 8%,var(--p-white)),var(--c-white))}
.tactic-card.special .tactic-symbol,html.ui-v3 .tactic-card.special .tactic-symbol{background:var(--c-purple-94);color:var(--c-purple-38)}
.tactic-card.special::after{position:absolute;top:4px;left:4px;padding:1px 5px;border-radius:6px;background:var(--c-purple-38);color:var(--c-white);font-size:10px;font-weight:600;line-height:1.4}
/* special cards: grade on the hand marker, tactics pack tile and hero */
.tactic-card.special::after{content:'특수 ' attr(data-sg)}
.tactic-card.special[data-sg="SSR"]::after{background:var(--p-g-ssr)}.tactic-card.special[data-sg="SR"]::after{background:var(--c-purple-38)}.tactic-card.special[data-sg="R"]::after{background:var(--p-blue)}
.special-card b .grade,.counter-row.special b .grade{vertical-align:middle;margin-left:4px}
.pack-type-grid button.tactics .foil-pack,.tactics-hero .foil-pack{object-fit:cover}
.special-shop{margin-top:14px}
/* tactics pack reveal: one card face inside the shared pack-opening stage */
.tactic-reveal{display:grid;justify-content:center}
.tactic-face{display:grid;justify-items:center;gap:6px;padding:14px 14px 16px;border-radius:16px;background:linear-gradient(170deg,var(--c-white),var(--c-purple-94));border:2px solid color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white));color:var(--c-navy-15);text-align:center;box-shadow:0 12px 26px color-mix(in srgb,var(--c-navy-15) 20%,transparent)}
.tactic-face.defense{background:linear-gradient(170deg,var(--c-white),var(--c-blue-96));border-color:color-mix(in srgb,var(--p-g-r) 32%,var(--p-white))}
.tactic-face[data-grade="SSR"]{border-color:var(--p-gold);box-shadow:0 0 0 2px color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),0 14px 30px color-mix(in srgb,var(--p-g-ssr) 33.3%,transparent)}
.tactic-face[data-grade="SR"]{border-color:var(--p-g-sr)}
.tactic-face-top{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;font-size:11px;font-weight:600;color:var(--c-gray-50)}
.tactic-face .tactic-symbol{width:72px;height:72px;display:grid;place-items:center;border-radius:50%;background:var(--c-purple-94);color:var(--c-purple-38);margin:6px 0 2px}
.tactic-face.defense .tactic-symbol{background:color-mix(in srgb,var(--p-g-r) 8%,var(--p-white));color:var(--c-blue-41)}
.tactic-face .tactic-symbol .gi{width:38px;height:38px}
.tactic-face b{font-size:20px;font-weight:700;letter-spacing:-.02em}
.tactic-face small{font-size:12px;font-weight:700;color:var(--c-gray-50)}
.tactic-face p{margin:4px 0 0;display:grid;gap:2px;font-size:12px;line-height:1.4}
.tactic-face .plus{color:var(--p-green);font-weight:600}.tactic-face .minus{color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink));font-weight:600}
.tactic-face em{margin-top:6px;padding:3px 10px;border-radius:999px;background:var(--c-navy-15);color:var(--c-white);font-size:11px;font-weight:600;font-style:normal}.tactic-reveal .reveal-slot{flex:none}
/* team colours: deck panel and scoreboard tag */
.team-colors{margin:12px 0;padding:0}
.team-colors>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;cursor:pointer;list-style:none}
.team-colors>summary::-webkit-details-marker{display:none}
.team-colors>summary span:first-child{display:grid;gap:1px}.team-colors>summary b{font-size:15px;font-weight:600}.team-colors>summary small{font-size:12px;color:var(--c-gray-50)}
.team-colors>.help{margin:0 16px 10px}
.color-list{display:grid;gap:6px;padding:0 12px 14px}
.color-row{display:grid;gap:2px 10px;align-items:center;padding:10px 12px;border:1px solid var(--c-gray-91);border-left:4px solid var(--c-slate-85);border-radius:12px;background:var(--c-white)}
.color-row b{display:block;font-size:14px;font-weight:600}.color-row small{font-size:11px;color:var(--c-gray-50)}
.color-row strong{grid-row:1;grid-column:2;font-size:16px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.color-row .color-effect{grid-column:1;font-size:12px;font-weight:700;color:var(--c-slate-36)}
.color-row em{font-size:11px;font-weight:600;font-style:normal;color:var(--c-gray-61);}
.color-row.on{border-left-color:var(--p-green);background:var(--c-green-97)}.color-row.on em{color:var(--p-green)}
.color-row.met{border-left-color:var(--p-gold)}.color-row.met em{color:var(--c-orange-49)}
.scoreboard .team-score span.team-color{display:block!important;font-size:11px;font-weight:800;color:var(--c-green-91);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.special-card .special-tier{display:block;color:var(--c-purple-38)}
/* today's game card on the friendly screen */
.daily-card{margin:0 0 14px;border-top:4px solid var(--p-gold)}
.daily-card.played{border-top-color:var(--c-slate-68)}
.daily-match{display:flex;align-items:center;gap:12px;margin:4px 0 10px}
.daily-match img{width:48px;height:48px;object-fit:contain}
.daily-match b{display:block;font-size:17px;font-weight:600}.daily-match small{font-size:12px;color:var(--c-gray-50)}
.daily-rule{display:grid;gap:1px;padding:10px 12px;border-radius:12px;background:var(--c-gold-98);border:1px solid color-mix(in srgb,var(--p-gold) 32%,var(--p-white))}
.daily-rule b{font-size:14px;font-weight:600;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.daily-rule span{font-size:13px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}
.daily-rewards{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin:10px 0}
.daily-rewards span{font-size:13px;color:var(--c-slate-36)}.daily-rewards b{font-size:16px;font-weight:600;color:var(--c-navy-15)}
.daily-rewards small{flex-basis:100%;font-size:11px;color:var(--c-gray-50)}
.daily-result{margin:10px 0 0;font-size:13px;color:var(--c-slate-36)}
/* special cards listed per grade: the grade colours the card, not the side */
.special-shop[data-grade]{}
.special-shop[data-grade] .section-head h3{display:flex;align-items:center;gap:8px}
.special-card[data-grade="SSR"]{border-left-color:var(--p-gold);background:linear-gradient(90deg,var(--c-orange-98),var(--c-white))}
.special-card[data-grade="SR"]{border-left-color:var(--p-g-sr)}
.special-card[data-grade="R"]{border-left-color:var(--p-blue)}
.special-card[data-grade="SSR"] .tactic-symbol{background:var(--c-gold-96);color:var(--c-orange-49)}
.special-card[data-grade="SR"] .tactic-symbol{background:var(--c-purple-94);color:var(--c-purple-38)}
.special-card[data-grade="R"] .tactic-symbol{background:var(--c-blue-96);color:var(--c-blue-41)}
.special-card b{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.special-tabs{margin-top:14px}.special-tabs button small{font-size:11px;color:var(--c-gray-50);font-weight:700}.special-shop[data-grade]{margin-top:8px}

/* tactics pack: three cards flip in one after another, higher grades glow */
.pack-reveal.tactic-reveal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;justify-content:stretch}
.tactic-reveal .reveal-slot{perspective:700px}
.tactic-reveal .tactic-face{height:100%;padding:10px 6px 12px;gap:4px}
.tactic-reveal .tactic-face .tactic-symbol{width:52px;height:52px;margin:4px 0 0}.tactic-reveal .tactic-face .tactic-symbol .gi{width:28px;height:28px}
.tactic-reveal .tactic-face b{font-size:15px;word-break:keep-all}.tactic-reveal .tactic-face p{font-size:11px}.tactic-reveal .tactic-face small{font-size:11px}
.pack-opening .reveal-slot>.tactic-face{animation:tactic-flip .7s cubic-bezier(.2,.9,.3,1.15) both;animation-delay:var(--delay);transform-origin:center;backface-visibility:hidden}
.pack-opening .reveal-slot[data-grade="SR"]>.tactic-face{animation-name:tactic-flip,tactic-glow-sr;animation-duration:.7s,1.2s;animation-delay:var(--delay),calc(var(--delay) + .6s);animation-fill-mode:both,none}
.pack-opening .reveal-slot[data-grade="SSR"]>.tactic-face{animation-name:tactic-flip,tactic-glow-ssr;animation-duration:.85s,1.6s;animation-delay:var(--delay),calc(var(--delay) + .7s);animation-fill-mode:both,none}
@keyframes tactic-flip{0%{opacity:0;transform:rotateY(100deg) scale(.82)}55%{opacity:1}100%{opacity:1;transform:rotateY(0) scale(1)}}
@keyframes tactic-glow-sr{0%,100%{box-shadow:0 12px 26px color-mix(in srgb,var(--c-navy-15) 20%,transparent)}40%{box-shadow:0 0 0 3px color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)),0 0 34px color-mix(in srgb,var(--p-g-sr) 80%,transparent)}}
@keyframes tactic-glow-ssr{0%,100%{box-shadow:0 0 0 2px #ffe08a,0 14px 30px #c98a0055}40%{box-shadow:0 0 0 4px var(--p-gold),0 0 46px var(--p-gold)}}
.pack-opening.reveal-complete .tactic-face,html.reduced-motion .pack-opening .tactic-face{animation:none!important;opacity:1;transform:none}
@media(max-width:420px){.tactic-reveal .tactic-face .minus{display:none}}
/* team colour rows: level tag and pick button */
.color-row{grid-template-columns:minmax(0,1fr) auto}
.color-row .color-level{font-style:normal;font-size:11px;font-weight:600;padding:1px 6px;border-radius:6px;background:var(--c-navy-15);color:var(--c-white);margin-left:4px}
.color-row .color-effect small{font-weight:600;color:var(--c-gray-50)}
.color-row .btn{grid-column:1/-1;min-height:40px;border-radius:10px;font-size:13px;font-weight:600;margin-top:6px}
.color-row em{grid-column:1/-1;text-align:left}
.team-colors>.text-btn{margin:0 16px 12px}

/* tactics ten-pack: scrolling reveal grid and the second open button */
.tactics-hero .pack-ten{margin-top:8px}
.pack-reveal.tactic-reveal.many{max-height:none}

/* tactic card enhancement: level tag, material count and the enhance button */
.special-level{font-style:normal;font-size:11px;font-weight:700;padding:1px 6px;border-radius:6px;background:var(--c-navy-15);color:var(--c-white)}
.special-enhance{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;flex-wrap:wrap}
.special-mat{font-style:normal;font-size:11px;font-weight:600;color:var(--c-gray-50)}
.special-enhance .btn{min-height:34px;padding:0 12px;border-radius:9px;font-size:12px;font-weight:600}
.special-card>div>.special-mat{display:block;margin-top:6px;color:var(--c-orange-49)}

/* illustrated art in icon slots (special tactics, signature skills, team colours, today's rule) */
img.gi.art{border-radius:50%;overflow:clip;object-fit:cover;background:var(--c-gray-96);vertical-align:middle}
.tactic-symbol:has(>.art),.ability-medallion:has(>.art){background:none!important;padding:0!important;overflow:hidden}
.tactic-symbol>img.gi.art,.ability-medallion>img.gi.art{width:100%!important;height:100%!important}
.special-card .tactic-symbol:has(>.art){width:52px;height:52px}
.counter-row:has(.tactic-symbol>.art){grid-template-columns:44px minmax(0,1fr) auto}
.counter-row .tactic-symbol:has(>.art){display:block;width:44px;height:44px;border-radius:50%}
.trait-chip img.gi.art{width:30px;height:30px;flex:none}
.skill-open img.gi.art{width:28px;height:28px}
.skill-receipt img.gi.art{width:34px;height:34px}
.color-row img.color-art{width:34px;height:34px;margin-right:8px}
.daily-rule:has(.daily-art){grid-template-columns:48px minmax(0,1fr);column-gap:10px;align-items:center}
.daily-rule img.daily-art{grid-row:span 2;width:48px;height:48px}

/* result scenes, clutch art, tier emblems, achievement medals, guide art, login banner */
.result-call img.result-art{display:block;width:84px;height:84px;margin:0 auto 6px}
@media(max-height:720px){.result-call img.result-art{width:56px;height:56px;margin-bottom:2px}}
.clutch-receipt:has(.receipt-art),.skill-receipt:has(.receipt-art){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:center}
.clutch-receipt img.receipt-art{grid-row:span 3;width:44px;height:44px}
.clutch-burst img.clutch-art{width:112px;height:112px;position:relative}
.clutch-open img.gi.art{width:20px;height:20px}
img.gi.art.tier-art{display:block;width:44px;height:44px;margin:0 auto 4px}
.career-best img.gi.art.tier-art{display:inline-block;width:20px;height:20px;margin:0 6px 0 0}
.goal-card.has-art{position:relative;padding-right:76px}
.goal-card img.goal-art{position:absolute;top:14px;right:14px;width:54px;height:54px}
.guide-step img.guide-art{width:48px;height:48px;flex:none}
.login-brand img.login-art{display:block;width:100%;max-width:560px;aspect-ratio:16/9;object-fit:cover;border-radius:18px;margin:18px auto 0;box-shadow:0 14px 32px color-mix(in srgb,var(--c-navy-15) 14.9%,transparent)}
@media(max-width:760px){.login-brand img.login-art{margin-top:12px;aspect-ratio:2/1}}

/* tactic workshop filters; name row of a special tactic keeps grade and level badges on one tidy line */
.tactic-filters{display:grid;gap:6px;margin:8px 0 10px}.tactic-filters .tabs{margin:0}
.counter-row.special b,.special-card b{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.counter-row.special b .grade,.special-card b .grade{margin-left:0}
.special-level{line-height:1.5;flex:none}

/* auto play sheet */
.auto-play-sheet{display:grid;gap:10px;padding:4px 2px 8px}.auto-play-sheet p{margin:0 0 4px;font-size:13px;line-height:1.5;color:var(--c-slate-41)}
.auto-play-sheet .text-btn{justify-self:center}

/* every grade badge uses white text: SSR and LR get deeper backgrounds so it stays readable */
.grade-badge[data-grade="SSR"],html.ui-v3 .grade-badge[data-grade="SSR"]{background:linear-gradient(135deg,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)),var(--p-g-ssr));color:var(--c-white);border-color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink));text-shadow:0 1px 0 color-mix(in srgb,var(--c-black) 33.3%,transparent)}


/* player picker: club, season and name filters */
.player-sort-tools{gap:8px 10px;margin:8px 0}.player-sort-tools .picker-query{grid-column:auto}.player-sort-tools .picker-query input{width:100%;min-height:44px;padding:0 12px;border:1px solid var(--c-slate-85);border-radius:10px;font-size:14px}

/* UR grade: red, between SSR gold and LR holo */
.grade-badge[data-grade="UR"],.grade.grade-ur{background:linear-gradient(135deg,var(--p-red),var(--p-red));color:var(--c-white);border:1px solid var(--p-g-ur);text-shadow:0 1px 0 color-mix(in srgb,var(--c-black) 20%,transparent)}
.player-card[data-grade="UR"]{border:2px solid var(--p-red);background:var(--c-white);}
.player-card[data-grade="UR"]:hover{box-shadow:0 0 0 2px color-mix(in srgb,var(--p-red) 60%,var(--p-white)),0 12px 30px color-mix(in srgb,var(--p-red) 40%,transparent)}
.field-workspace [data-grade="UR"]{--field-tone:var(--p-red);--field-tint:color-mix(in srgb,var(--p-red) 16%,var(--p-white))}
.pack-opening .reveal-slot[data-grade="UR"]>.player-card{box-shadow:0 0 0 3px color-mix(in srgb,var(--p-red) 60%,var(--p-white)),0 0 46px color-mix(in srgb,var(--p-red) 80%,transparent)}
.ur-power{background:linear-gradient(90deg,var(--c-red-96),var(--c-white))}.ur-power .eyebrow{color:var(--p-red)}

/* UR card: red foil frame, ray background and a moving sheen, like SSR gold and LR holo */
.player-card[data-grade="UR"]{--frame:linear-gradient(135deg,var(--p-g-ur),color-mix(in srgb,var(--p-red) 60%,var(--p-white)),var(--p-red),color-mix(in srgb,var(--p-red) 16%,var(--p-white)),var(--p-g-ur));box-shadow:0 6px 22px color-mix(in srgb,var(--p-red) 33.3%,transparent),0 0 0 1px color-mix(in srgb,color-mix(in srgb,var(--p-red) 32%,var(--p-white)) 50.2%,transparent)}
.player-card[data-grade="UR"] .player-card-art{background:radial-gradient(circle at 50% 28%,var(--c-red-96) 0,#ffe1dd00 55%),repeating-conic-gradient(from 0deg at 50% 30%,color-mix(in srgb,var(--p-red) 20%,transparent) 0deg 9deg,#ffffff00 9deg 22deg),linear-gradient(165deg,color-mix(in srgb,var(--p-red) 16%,var(--p-white)),color-mix(in srgb,var(--p-red) 60%,var(--p-white)))}
.player-card[data-grade="UR"] .player-card-art::after{content:'';position:absolute;inset:-20% -60%;pointer-events:none;background:linear-gradient(110deg,#fff0 40%,color-mix(in srgb,color-mix(in srgb,var(--p-red) 32%,var(--p-white)) 69%,transparent) 47%,color-mix(in srgb,var(--c-white) 78.4%,transparent) 51%,color-mix(in srgb,color-mix(in srgb,var(--p-red) 32%,var(--p-white)) 56.5%,transparent) 56%,#fff0 64%);transform:translateX(-60%);animation:card-sheen 4.8s ease-in-out infinite}
.player-card[data-grade="UR"]:hover{transform:translateY(-3px) scale(1.01)}

/* UR pack opening: red rays behind the headline, a burst and a red shine across the card, like SSR and LR */
[data-grade="UR"]{--rarity:var(--p-red);--rarity-rgb:255,106,92}
[data-grade="UR"]>.pack-rays{display:block;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--p-red) 25.1%,transparent) 0deg 8deg,color-mix(in srgb,color-mix(in srgb,var(--p-red) 32%,var(--p-white)) 13.3%,transparent) 8deg 14deg,transparent 14deg 28deg);mask-image:radial-gradient(var(--c-black),transparent 68%);animation:rarity-rays 2.8s ease-out both}
.pack-opening .reveal-slot[data-grade="UR"]>.player-card{animation-name:rarity-star;animation-duration:1.3s}
.reveal-slot[data-grade="UR"]>.reveal-burst{display:block;animation:rarity-burst 1.35s ease-out both;animation-delay:var(--delay)}
.pack-opening .reveal-slot[data-grade="UR"]:after{content:'';pointer-events:none;position:absolute;inset:0;border-radius:10px;background:linear-gradient(110deg,transparent 35%,color-mix(in srgb,var(--p-red) 70%,transparent) 47%,color-mix(in srgb,var(--c-white) 65.9%,transparent) 51%,transparent 63%);background-size:300% 100%;animation:rarity-shine 1.55s ease-out both;animation-delay:var(--delay)}
html.reduced-motion .pack-opening .reveal-slot[data-grade="UR"]>.player-card,.pack-opening.reveal-complete .reveal-slot[data-grade="UR"]>.player-card{animation:none;opacity:1;transform:none}
html.reduced-motion .pack-opening [data-grade="UR"]>.pack-rays{animation:none;opacity:.35}
html.reduced-motion .pack-opening .reveal-slot[data-grade="UR"]:after,html.reduced-motion .reveal-slot[data-grade="UR"]>.reveal-burst{display:none}

/* UR reignite: uses left on the skill button */
.skill-open .skill-left{font-style:normal;font-size:10px;font-weight:700;padding:0 5px;border-radius:6px;background:var(--p-red);color:var(--c-white);margin-left:2px}

/* tactics pack reveal: every card fills its grid cell, so all cards are the same width and height */
.pack-opening .pack-reveal.tactic-reveal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;justify-content:stretch;justify-items:stretch}
.tactic-reveal .reveal-slot{width:auto;min-width:0}
.tactic-reveal .reveal-slot>.tactic-face{flex:1 1 0;min-width:0;width:100%;box-sizing:border-box;align-content:start}
.tactic-reveal .tactic-face b,.tactic-reveal .tactic-face small,.tactic-reveal .tactic-face p span{word-break:keep-all;overflow-wrap:anywhere}
.tactic-reveal .tactic-face em{margin-top:auto;align-self:end}

/* polish after the on-screen check: one clutch type fills the row, rounded clutch burst, tool buttons that keep their labels */
.clutch-mode-cards:has(>button:only-child){grid-template-columns:1fr}
.clutch-burst{border-radius:22px;border:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));background:linear-gradient(120deg,color-mix(in srgb,var(--c-navy-15) 96.9%,transparent),color-mix(in srgb,color-mix(in srgb,var(--p-slate) 55%,var(--p-ink)) 96.9%,transparent))}
@media(max-width:500px){
 html.ui-v3 .match-guide-tools{gap:5px}
 html.ui-v3 .match-guide-tools>*{font-size:11px;padding:0 5px}
 html.ui-v3 .match-guide-tools>.opponent-note-button{flex:1.5 1 0}
 html.ui-v3 .match-guide-tools>.tools-log{flex:.85 1 0}
 html.ui-v3 .match-guide-tools>.guide-open{flex:1.35 1 0}
}

/* game over panel: the win / draw / loss picture above the result */
.final-call img.gi.art.final-art{display:block;width:88px;height:88px;margin:0 auto 8px;box-shadow:0 0 0 3px color-mix(in srgb,var(--c-white) 13.3%,transparent)}
@media(max-height:720px){.final-call img.gi.art.final-art{width:60px;height:60px;margin-bottom:4px}}

/* special tactic builder head: the 20-card rule sits on its own line */
.special-head b small{display:block;margin-top:2px;font-weight:600;font-size:11px;color:var(--c-gray-50)}

/* deck size: ordinary + special together make 20 */
.deck-split{margin:2px 0 8px;font-size:12px;font-weight:700;color:var(--c-slate-41)}
.deck-special-note{font-size:inherit;opacity:.85}

/* attack preset: owned special cards that come with it */
.preset-special{margin:8px 0 0;padding:8px 10px;border-radius:10px;background:var(--c-purple-94);border:1px solid color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white));font-size:12px;line-height:1.5;color:var(--c-navy-15)}
.preset-special.none{background:var(--c-gray-96);border-color:var(--c-gray-91);color:var(--c-slate-41)}
.preset-special small{color:var(--c-gray-50)}

/* guide numbers while the signature skill is switched on */
.guide-ranges .skill-on b{color:var(--c-purple-38)}
.guide-ranges s{font-size:10px;color:var(--c-gray-61)}
.guide-ranges .skill-on-note{padding:0 6px;border-radius:8px;background:var(--c-purple-38);color:var(--c-white);font-weight:600;font-size:10px;line-height:16px}

/* rating colours above 100, one step per ten */
.rating-mythic{color:color-mix(in srgb,var(--p-red) 80%,var(--p-ink))!important}.rating-apex{color:var(--p-red)!important}
.rating-zenith{color:var(--p-gold)!important;-webkit-text-fill-color:currentColor;background:none;text-shadow:0 1px 0 color-mix(in srgb,color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)) 45%,transparent)}
.stat-legend .rating-zenith{-webkit-text-fill-color:currentColor;background:none}
.player-side .rating-supreme,.pack-hero .rating-supreme{color:color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white))!important}.player-side .rating-mythic,.pack-hero .rating-mythic{color:color-mix(in srgb,var(--p-red) 60%,var(--p-white))!important}.player-side .rating-apex,.pack-hero .rating-apex{color:color-mix(in srgb,var(--p-g-ssr) 60%,var(--p-white))!important}
.player-side .rating-zenith,.pack-hero .rating-zenith{color:var(--p-gold)!important;text-shadow:none}
/* club facilities, awakening and album bonus */
.growth-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.growth-card{display:flex;flex-direction:column;padding:12px;border:1px solid var(--c-gray-91);border-radius:12px;background:var(--c-white);min-width:0}
.growth-card.top{border-color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));background:var(--c-orange-98)}.growth-card.album{background:var(--c-purple-94);border-color:color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white))}
.growth-card>div:first-child{display:flex;flex-direction:column;gap:2px}.growth-card small{color:var(--c-gray-50);font-size:11px}
.growth-card strong{font-size:13px;color:var(--c-navy-15)}.growth-card strong em{font-style:normal;color:color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink));margin-left:4px}
.growth-bar{height:6px;border-radius:3px;background:var(--c-gray-91);overflow:hidden}.growth-bar i{display:block;height:100%;background:var(--c-blue-41)}
.growth-card .btn{width:100%;font-size:12px}.growth-done{font-size:11px;font-weight:700;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.growth-card.album .growth-done{color:var(--c-slate-41);font-weight:400}.growth-short{color:var(--p-red)!important}

/* growth screens, second pass: hero strip, art thumbnails, step pips, awakening mark */
.growth-hero{display:flex;align-items:center;gap:12px;padding:12px;margin-bottom:12px;border-radius:14px;background:linear-gradient(120deg,var(--c-navy-15),color-mix(in srgb,var(--p-blue) 55%,var(--p-ink)));color:var(--c-white);flex-wrap:wrap}
.growth-hero.awaken{background:linear-gradient(120deg,color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink)),var(--c-purple-38))}
.growth-hero>div:nth-child(2){flex:1 1 180px;min-width:0}.growth-hero h3{margin:0;color:var(--c-white);font-size:18px}.growth-hero .eyebrow{color:var(--c-gold-84)}.growth-hero p{margin:4px 0 0;font-size:12px;color:var(--c-slate-90);line-height:1.5}
img.gi.art.growth-hero-art{width:64px;height:64px;border-radius:14px;flex:none}
.growth-totals{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.growth-totals span{padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--c-white) 14%,transparent);font-size:11px}.growth-totals b{color:var(--c-gold-84)}
.growth-wallet{display:flex;gap:8px;flex:none}.growth-wallet span{display:flex;flex-direction:column;padding:6px 10px;border-radius:10px;background:color-mix(in srgb,var(--c-white) 12%,transparent);font-size:10px;color:var(--c-slate-90)}.growth-wallet b{font-size:15px;color:var(--c-white)}
.growth-card{gap:8px;box-shadow:0 1px 2px color-mix(in srgb,var(--c-navy-15) 6%,transparent)}
.growth-head{display:flex!important;flex-direction:row!important;align-items:center;gap:10px!important;min-width:0}.growth-head>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.growth-head b{display:flex;align-items:center;gap:4px;min-width:0}
img.gi.art.growth-art{width:44px;height:44px;border-radius:10px;flex:none}.growth-photo{width:44px;height:44px;border-radius:10px;object-fit:cover;object-position:top;flex:none;background:var(--c-gray-91)}
.growth-value{font-size:20px!important;font-weight:700;color:color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink))!important;flex:none}.growth-card.awaken .growth-value{color:var(--c-purple-38)!important}.growth-card.top .growth-value{color:var(--c-orange-49)!important}
.growth-pips{display:flex;gap:3px}.growth-pips i{flex:1;height:7px;border-radius:2px;background:var(--c-gray-91)}.growth-pips i.on{background:linear-gradient(90deg,var(--p-slate),var(--c-blue-41))}
.growth-card.top .growth-pips i.on{background:linear-gradient(90deg,var(--p-gold),var(--p-gold))}
.growth-pips.gems{gap:8px;justify-content:center;padding:4px 0}.growth-pips.gems i{flex:none;width:12px;height:12px;border-radius:2px;transform:rotate(45deg);background:var(--c-gray-91)}.growth-pips.gems i.on{background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)),var(--c-purple-38));box-shadow:0 0 6px color-mix(in srgb,var(--c-purple-38) 55%,transparent)}
.growth-foot{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--c-slate-41)}.growth-next{color:var(--c-blue-41);font-weight:700}
.growth-card.awaken[data-grade="LR"],.growth-card.awaken[data-grade="UR"],.growth-card.awaken[data-grade="SSR"]{border-color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}
.awaken-inline{display:inline-flex;align-items:center;gap:3px;margin-left:3px;padding:0 4px;min-height:17px;border-radius:5px;font-size:9px;font-weight:600;line-height:13px;white-space:nowrap;flex:none;vertical-align:middle}
.awaken-inline i{width:6px;height:6px;transform:rotate(45deg);border-radius:1px}
h2 .awaken-inline{font-size:11px;min-height:20px;padding:0 6px}

/* field cards are narrow: the awakening mark sits in the card corner instead of the meta row */
/* field cards: the awakening badge replaces the +10 pill, same size */
.field-slot .awaken-inline{margin-left:0;font-size:9px!important;line-height:13px;min-height:17px;padding:0 4px;background:linear-gradient(135deg,var(--c-purple-38),color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink)));box-shadow:0 0 5px color-mix(in srgb,var(--c-purple-38) 50%,transparent)}

/* awakening inside the enhancement sheet and list, facility bulk button, album bonus */
.awaken-panel{display:flex;flex-direction:column;gap:8px;margin:10px 0;border:1px solid color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white));background:linear-gradient(135deg,var(--c-purple-94),var(--c-white))}
.awaken-panel.top{border-color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));background:var(--c-orange-98)}.awaken-panel .growth-value{color:var(--c-purple-38)!important}
.awaken-btn{background:linear-gradient(135deg,var(--c-purple-38),color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink)))!important;color:var(--c-white)!important;border-color:var(--c-purple-38)!important}.awaken-btn:disabled{opacity:.5}
.awaken-shortcut{display:flex;align-items:center;gap:10px;width:100%;margin:0 0 10px;padding:8px 12px;border:1px solid color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white));border-radius:12px;background:var(--c-purple-94);text-align:left;cursor:pointer}
.awaken-shortcut span{display:flex;flex-direction:column}.awaken-shortcut b{color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink))}.awaken-shortcut small{color:var(--c-gray-50);font-size:11px}
.growth-actions{display:flex;gap:6px}.growth-actions .btn{flex:1}.growth-actions .btn:not(.primary){flex:0 0 auto;width:auto}
.growth-album-note{display:flex;align-items:center;gap:10px;margin:10px 0 0;padding:8px 12px;border-radius:12px;background:var(--c-purple-94);font-size:12px;color:var(--c-slate-41)}.growth-album-note b{color:var(--c-navy-15)}
.album-bonus{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px;border-radius:12px;border:1px solid color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white));background:var(--c-purple-94)}
.album-bonus>div{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0}.album-bonus small,.album-bonus span{font-size:11px;color:var(--c-slate-41)}

/* enhancement list: 강화 / 각성 switch and bulk awakening */
.enhance-mode{margin:0 0 10px}.enhance-mode button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
img.gi.art.mode-art{width:20px;height:20px;border-radius:5px}
.enhance-mode button[data-enhance-mode="awaken"].active{color:var(--c-purple-38);border-color:var(--c-purple-38)}
.awaken-target{display:flex;align-items:center;gap:6px;font-size:12px}.awaken-target select{min-width:120px}
.enhance-bulk-tools{flex-wrap:wrap}.enhance-bulk-tools .awaken-btn{flex:1 1 100%!important;order:9}.enhance-bulk-tools .awaken-note{order:10}.enhance-bulk-tools .awaken-target{flex:1 1 auto}.awaken-note{flex:1 1 100%;font-size:11px}
.ovr-growth{margin-left:6px;padding:1px 7px;border-radius:999px;background:var(--c-purple-94);color:var(--c-purple-38);font-size:11px;font-weight:600;white-space:nowrap}
.ovr-deck{margin-left:6px;padding:1px 7px;border-radius:999px;background:color-mix(in srgb,var(--p-g-lr) 8%,var(--p-white));color:color-mix(in srgb,var(--p-green) 55%,var(--p-ink));font-size:11px;font-weight:600;white-space:nowrap}.detail-rating-heading>div{flex-wrap:wrap;row-gap:4px}

/* standings: one straight cut line across the row (cells share borders) */
.league-table{border-collapse:collapse}.league-table th,.league-table td{vertical-align:middle}
html.ui-v3 .league-table tbody tr:nth-child(5)>*{border-bottom:2px solid var(--p-gold)}
/* big result banner: illustrated art instead of the old line icon */
.bc-icon img.gi.art.bc-art{width:44px;height:44px;border-radius:12px;box-shadow:0 2px 8px color-mix(in srgb,var(--c-black) 35%,transparent)}
/* the club cell stays a real table cell so its bottom border lines up with the row */
.league-table tbody th{display:table-cell;min-height:0;height:49px;white-space:nowrap}.league-table tbody th .team-logo{vertical-align:middle;margin-right:8px}
.enhance-list article:has(.awaken-btn:disabled){opacity:.55}

/* league pictures: career marks, titles, postseason stages, mail */
img.gi.art.career-art{width:30px;height:30px;border-radius:8px}
img.gi.art.inline-art{width:18px;height:18px;border-radius:5px;vertical-align:-4px}
img.gi.art.postseason-art{width:72px;height:72px;border-radius:16px;flex:none;box-shadow:0 4px 14px color-mix(in srgb,var(--c-black) 25%,transparent)}
img.gi.art.series-art{float:left;width:36px;height:36px;border-radius:9px;margin:0 8px 0 0}
img.gi.art.mail-art{width:44px;height:44px;border-radius:10px;flex:none;margin-right:10px}
.starter-loot:has(.mail-art){display:flex;align-items:center}
/* awakening effect */
.awaken-fx{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--c-purple-38) 80%,transparent),color-mix(in srgb,var(--p-ink) 95%,transparent) 70%);color:var(--c-white);cursor:pointer;animation:awfx-in .25s ease-out}
.awaken-fx-card{position:relative;width:132px;height:176px;border-radius:16px;overflow:hidden;border:3px solid color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white));background:color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink));box-shadow:0 0 0 0 color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 70%,transparent);animation:awfx-card .6s cubic-bezier(.2,1.4,.4,1) both,awfx-glow 1.4s ease-in-out .5s 2}
.awaken-fx-card img{width:100%;height:100%;object-fit:cover;object-position:top}
.awaken-fx-card .grade-badge{position:absolute;left:6px;top:6px}
.awaken-fx-ring{position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent 0 72%,color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)) 35%,transparent) 80%,transparent 88%);animation:awfx-spin 1.6s linear infinite;mix-blend-mode:screen}
.awaken-fx-gems{display:flex;gap:12px}
.awaken-fx-gems i{width:16px;height:16px;transform:rotate(45deg);border-radius:3px;background:color-mix(in srgb,var(--c-white) 18%,transparent)}
.awaken-fx-gems i.on{background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)),var(--p-g-sr))}
.awaken-fx-gems i.new{background:color-mix(in srgb,var(--c-white) 18%,transparent);animation:awfx-gem .45s ease-out var(--d) both}
.awaken-fx strong{font-size:24px;font-weight:900;letter-spacing:.02em;animation:awfx-text .5s ease-out .3s both}
.awaken-fx small{font-size:13px;color:color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white));animation:awfx-text .5s ease-out .45s both}
.awaken-fx.max .awaken-fx-card{border-color:var(--p-gold);animation:awfx-card .6s cubic-bezier(.2,1.4,.4,1) both,awfx-gold 1.2s ease-in-out .5s 2}
.awaken-fx.max strong{color:var(--p-gold)}
.awaken-fx.still,.awaken-fx.still *{animation:none!important}.awaken-fx.still .awaken-fx-gems i.new{background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)),var(--p-g-sr))}
@keyframes awfx-in{from{opacity:0}to{opacity:1}}
@keyframes awfx-card{from{transform:scale(.6) translateY(20px);opacity:0}to{transform:none;opacity:1}}
@keyframes awfx-glow{50%{box-shadow:0 0 34px 10px rgba(180,140,255,.75)}}
@keyframes awfx-gold{50%{box-shadow:0 0 44px 14px rgba(255,200,60,.8)}}
@keyframes awfx-spin{to{transform:rotate(360deg)}}
@keyframes awfx-gem{0%{transform:rotate(45deg) scale(.4);background:var(--c-white);box-shadow:0 0 0 rgba(200,160,255,0)}60%{transform:rotate(45deg) scale(1.5);background:var(--c-white);box-shadow:0 0 18px 6px color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 90%,transparent)}100%{transform:rotate(45deg) scale(1);background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white)),var(--p-g-sr));box-shadow:0 0 8px color-mix(in srgb,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 60%,transparent)}}
@keyframes awfx-text{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.panel.empty img.postseason-art{display:block;margin:0 auto 10px}

/* celebrations with a picture, facility pip fill */
.cel-mark img.gi.art.cel-art{width:100%;height:100%;border-radius:inherit;object-fit:cover}
.growth-pips i.fresh{transform-origin:left center;animation:pip-fill .7s ease-out both}
@keyframes pip-fill{0%{transform:scaleX(0);box-shadow:0 0 0 rgba(31,143,160,0)}70%{transform:scaleX(1);box-shadow:0 0 10px 2px color-mix(in srgb,var(--p-slate) 70%,transparent)}100%{box-shadow:none}}
@media (prefers-reduced-motion:reduce){.growth-pips i.fresh{animation:none}}

/* card pack sub-pages: picture header; empty lists: a quiet picture */
.store-hero{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:10px 12px;border-radius:14px;background:linear-gradient(120deg,color-mix(in srgb,var(--p-g-lr) 8%,var(--p-white)),var(--c-purple-94));border:1px solid color-mix(in srgb,var(--p-slate) 16%,var(--p-white))}
.store-hero h3{margin:0;font-size:16px;color:var(--c-navy-15)}.store-hero p{margin:2px 0 0;font-size:12px;color:var(--c-slate-41);line-height:1.5}
img.gi.art.store-art{width:56px;height:56px;border-radius:12px;flex:none}
.empty:not(:has(img))::before{content:'';display:block;width:56px;height:56px;margin:0 auto 8px;border-radius:12px;background:url(/assets/art-em-empty.jpg) center/cover}
@media (max-width:480px){.enhance-bulk-tools .awaken-target{flex:1 1 100%;order:8}.enhance-bulk-tools .awaken-target select{flex:1}}
.skill-receipt.ai{border-color:color-mix(in srgb,var(--p-red) 32%,var(--p-white));background:var(--c-red-96)}.skill-receipt.ai b{color:var(--p-red)}

/* AI signature skill heads-up */
.ai-skill-warn{display:flex;align-items:center;gap:10px;margin:8px 0;padding:8px 12px;border-radius:12px;border:1px solid var(--c-gray-91);background:var(--c-gray-96);color:var(--c-slate-41)}
.ai-skill-warn img.gi.art,.ai-skill-warn .gi{width:34px;height:34px;flex:none;border-radius:8px;filter:grayscale(.6);opacity:.8}
.ai-skill-warn span{display:flex;flex-direction:column;min-width:0}.ai-skill-warn b{font-size:12px;color:var(--c-slate-41)}.ai-skill-warn small{font-size:11px;line-height:1.4}
.ai-skill-warn .ai-skill-text{color:var(--c-gray-61)}
.ai-skill-warn.hot{border-color:color-mix(in srgb,var(--p-red) 32%,var(--p-white));background:var(--c-red-96);color:color-mix(in srgb,var(--p-red) 55%,var(--p-ink))}.ai-skill-warn.hot b{color:var(--p-red)}.ai-skill-warn.hot img.gi.art,.ai-skill-warn.hot .gi{filter:none;opacity:1;box-shadow:0 0 0 2px color-mix(in srgb,var(--p-red) 32%,var(--p-white))}
.growth-rules h4{display:flex;align-items:center;gap:8px;margin:12px 0 4px;font-size:14px;color:var(--c-navy-15)}img.gi.art.rules-art{width:28px;height:28px;border-radius:7px}
.report-growth{margin-top:12px}.report-growth h3{font-size:14px;margin:0 0 6px}.report-growth-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}.report-growth-grid>div{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:10px;background:var(--c-purple-94);border:1px solid color-mix(in srgb,var(--p-g-sr) 16%,var(--p-white))}.report-growth-grid span{font-size:11px;color:var(--c-gray-50)}.report-growth-grid b{font-size:14px;color:var(--c-navy-15)}.report-growth-grid small{font-size:11px;color:var(--c-slate-41)}

/* album: fill a set with shards */
.album-fill-one{width:100%;margin-top:6px;font-size:12px;padding:6px 8px}
.album-fill-all{margin-top:10px}
.album-fill ul{margin:8px 0;padding-left:18px;max-height:46vh;overflow:auto;font-size:13px;line-height:1.6}.album-fill small{color:var(--c-slate-41)}

/* album fill, second pass */
.album-fill-callout{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px;border-radius:14px;background:linear-gradient(120deg,var(--c-navy-15),color-mix(in srgb,var(--p-blue) 55%,var(--p-ink)));color:var(--c-white);flex-wrap:wrap}
.album-fill-callout>div{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:3px}.album-fill-callout b{font-size:14px}.album-fill-callout small{font-size:12px;color:var(--c-slate-90);line-height:1.5}.album-fill-callout em{font-style:normal;color:var(--p-gold);font-weight:600}
.album-fill-callout .btn{flex:none;background:var(--c-gold-84)!important;color:var(--c-navy-15)!important;border-color:var(--c-gold-84)!important;font-weight:600}
img.gi.art.fill-art{width:52px;height:52px;border-radius:12px;flex:none}
.album-fill-empty{margin:10px 0 0;padding:8px 12px;border-radius:10px;background:var(--c-gray-96);font-size:12px;color:var(--c-slate-41)}
.album-sort{margin:12px 0 6px}
.album-missing{display:flex;gap:4px;margin:8px 0 2px;flex-wrap:wrap;align-items:center}
.missing-face{width:30px;height:30px;border-radius:8px;overflow:hidden;border:2px solid var(--c-slate-68);background:var(--c-gray-91);filter:grayscale(.55);opacity:.85}
.missing-face img{width:100%;height:100%;object-fit:cover;object-position:top}
.missing-face[data-grade="R"]{border-color:var(--p-blue)}.missing-face[data-grade="SR"]{border-color:var(--p-g-sr)}.missing-face[data-grade="SSR"]{border-color:var(--p-gold)}.missing-face[data-grade="UR"]{border-color:var(--p-red)}.missing-face[data-grade="LR"]{border-color:var(--p-g-sr)}
.missing-more{font-size:11px;font-weight:600;color:var(--c-slate-41)}
.album-fill-one{display:flex!important;justify-content:space-between;align-items:center;gap:8px;background:var(--c-purple-94)!important;border-color:color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white))!important;color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink))!important}
.album-fill-one b{font-size:12px}.album-fill-one.short{opacity:.55}
.fill-list{display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow:auto;margin:10px 0}
.fill-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:var(--c-gray-96)}.fill-row>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.fill-row span{font-size:12px;color:var(--c-slate-41);line-height:1.7}.fill-row span .grade-badge{font-size:9px;padding:0 4px}.fill-row strong{font-size:13px;color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink));white-space:nowrap}
.target-awaken{border-color:color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white))!important;background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-sr) 8%,var(--p-white)),var(--c-white))!important}.target-awaken .growth-pips{margin:6px 0}.target-actions{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 4px}.target-actions .btn{flex:1 1 140px}

/* big reveals: shared */
.legend-fx,.rare-fx,.fuse-fx{position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--c-white);cursor:pointer;overflow:hidden;animation:fx-in .4s ease-out}
.legend-fx.out,.rare-fx.out,.fuse-fx.out{animation:fx-out .32s ease-in forwards}
.fx-skip{position:absolute;top:max(14px,env(safe-area-inset-top));right:14px;z-index:5;padding:6px 14px;border-radius:999px;border:1px solid color-mix(in srgb,var(--c-white) 35%,transparent);background:color-mix(in srgb,var(--c-black) 35%,transparent);color:var(--c-white);font-size:12px;font-weight:800;cursor:pointer}
.ready .fx-skip{display:none}
.fx-tap{position:absolute;bottom:28px;font-size:12px;color:var(--c-slate-82);opacity:0;transition:opacity .4s}.ready .fx-tap{opacity:1}
.skip *,.still *{animation-delay:0s!important;animation-duration:.01s!important;animation-iteration-count:1!important}
@keyframes fx-in{from{opacity:0}to{opacity:1}}@keyframes fx-out{to{opacity:0}}
@keyframes fx-fade{to{opacity:1}}@keyframes fx-spin{to{transform:rotate(360deg)}}
/* LR legend reveal (about 6.6s) */
.legend-fx{background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)) 0%,var(--p-ink) 72%)}
.lg-dots i{position:absolute;left:var(--x);bottom:-10px;width:3px;height:3px;border-radius:50%;background:var(--p-gold);box-shadow:0 0 6px var(--p-gold);animation:lg-rise 3.4s var(--d) linear infinite;opacity:.8}
@keyframes lg-rise{to{transform:translateY(-110vh);opacity:0}}
.lg-heart{position:absolute;width:40vmin;height:40vmin;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c-gold-84) 55%,transparent),transparent 65%);opacity:0;animation:lg-beat 1.2s ease-out 2 both}
@keyframes lg-beat{0%{opacity:0;transform:scale(.6)}30%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.4)}}
.lg-crack{position:absolute;top:0;bottom:0;left:50%;width:4px;margin-left:-2px;background:var(--c-white);box-shadow:0 0 30px 12px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 90%,transparent);transform:scaleY(0);animation:lg-crack .7s 2.2s cubic-bezier(.7,0,.3,1) both}
@keyframes lg-crack{0%{transform:scaleY(0);opacity:1}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1) scaleX(60);opacity:0}}
.legend-pillars{position:absolute;inset:0;display:flex;justify-content:space-around;pointer-events:none}
.legend-pillars i{width:8vw;height:140%;margin-top:-20%;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--p-gold) 30%,transparent),transparent);filter:blur(6px);transform:skewX(-8deg) scaleY(0);transform-origin:top;animation:lg-pillar 1.1s cubic-bezier(.2,.8,.2,1) forwards}
.legend-pillars i:nth-child(1){animation-delay:2.7s}.legend-pillars i:nth-child(2){animation-delay:2.8s}.legend-pillars i:nth-child(3){animation-delay:2.9s;width:12vw}.legend-pillars i:nth-child(4){animation-delay:3s}.legend-pillars i:nth-child(5){animation-delay:3.1s}
@keyframes lg-pillar{to{transform:skewX(-8deg) scaleY(1)}}
.legend-burst{position:absolute;width:140vmax;height:140vmax;background:conic-gradient(from 0deg,transparent 0 8%,color-mix(in srgb,var(--c-gold-84) 20%,transparent) 10%,transparent 12% 33%,color-mix(in srgb,var(--c-gold-84) 15%,transparent) 35%,transparent 37% 58%,color-mix(in srgb,var(--c-gold-84) 20%,transparent) 60%,transparent 62% 83%,color-mix(in srgb,var(--c-gold-84) 15%,transparent) 85%,transparent 87%);opacity:0;animation:fx-spin 16s linear infinite,fx-fade 1s 2.9s forwards}
.legend-card{position:relative;width:min(46vw,210px);aspect-ratio:190/244;border-radius:16px;overflow:hidden;border:3px solid var(--p-gold);box-shadow:0 0 0 4px color-mix(in srgb,var(--p-gold) 25%,transparent),0 0 70px 16px color-mix(in srgb,var(--p-gold) 50%,transparent);transform:translateY(-70vh) rotateY(720deg) scale(.6);opacity:0;animation:lg-card 1.5s 3.2s cubic-bezier(.15,.9,.25,1.15) forwards}
@keyframes lg-card{0%{opacity:1}100%{transform:none;opacity:1}}
.legend-card img{width:100%;height:100%;object-fit:cover;object-position:top}
.legend-shine{position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,color-mix(in srgb,var(--c-white) 70%,transparent) 48%,transparent 62%);transform:translateX(-120%);animation:lg-shine 1.4s 4.6s ease-in-out 2}
@keyframes lg-shine{to{transform:translateX(120%)}}
.legend-word{display:flex;gap:6px;font-size:clamp(28px,8vw,50px);font-weight:900;letter-spacing:.08em;z-index:1}
.legend-word b{background:linear-gradient(180deg,color-mix(in srgb,var(--p-gold) 32%,var(--p-white)),var(--c-gold-84) 55%,var(--p-g-ssr));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;opacity:0;transform:translateY(-30px) scale(1.6);animation:lg-letter .45s calc(4.6s + var(--i)*.1s) cubic-bezier(.2,1.4,.4,1) forwards;filter:drop-shadow(0 2px 8px color-mix(in srgb,var(--p-gold) 60%,transparent))}
@keyframes lg-letter{to{opacity:1;transform:none}}
.legend-name{font-size:28px;font-weight:900;z-index:1;opacity:0;animation:fx-fade .6s 5.5s forwards}
.legend-club{color:var(--p-gold);font-weight:800;z-index:1;opacity:0;animation:fx-fade .6s 5.7s forwards}
.legend-line{max-width:min(90vw,520px);text-align:center;font-size:12px;line-height:1.6;color:color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white));margin:0;z-index:1;opacity:0;animation:fx-fade .6s 6s forwards}
/* SSR / UR pulls */
.rare-fx{background:radial-gradient(circle at 50% 45%,var(--rare-deep),var(--p-ink) 75%);--rare:var(--c-gold-84);--rare-deep:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}
.rare-ur{--rare:var(--c-red-61);--rare-deep:color-mix(in srgb,var(--p-g-ur) 55%,var(--p-ink))}
.rare-flash{position:absolute;inset:0;background:var(--rare);opacity:0;animation:rare-flash .9s .15s ease-out both}
@keyframes rare-flash{0%{opacity:0}15%{opacity:.85}100%{opacity:0}}
.rare-rays{position:absolute;width:150vmax;height:150vmax;background:repeating-conic-gradient(from 0deg,transparent 0 6deg,color-mix(in srgb,var(--rare) 22%,transparent) 6deg 9deg);opacity:0;animation:fx-spin 22s linear infinite,fx-fade .8s .5s forwards}
.rare-word{display:flex;gap:4px;font-size:clamp(22px,6vw,40px);font-weight:700;letter-spacing:.06em;z-index:1;color:var(--rare);text-shadow:0 0 18px var(--rare)}
.rare-word b{opacity:0;transform:scale(2);animation:lg-letter .35s calc(.7s + var(--i)*.05s) ease-out forwards}
.rare-cards{display:flex;gap:12px;z-index:1;flex-wrap:wrap;justify-content:center;padding:0 12px}
.rare-card{position:relative;width:min(28vw,150px);display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;border-radius:14px;background:color-mix(in srgb,var(--c-black) 45%,transparent);border:2px solid var(--rare);box-shadow:0 0 30px color-mix(in srgb,var(--rare) 55%,transparent);transform:rotateY(180deg) scale(.6);opacity:0;animation:rare-card .7s calc(1.5s + var(--i)*.35s) cubic-bezier(.2,1.3,.3,1) forwards}
@keyframes rare-card{0%{opacity:1}100%{transform:none;opacity:1}}
.rare-card img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:10px;background:color-mix(in srgb,var(--p-navy) 55%,var(--p-ink))}
.rare-card .grade-badge{position:absolute;top:12px;left:12px}.rare-card b{font-size:14px}.rare-card small{font-size:11px;color:var(--c-slate-82)}
.rare-more{z-index:1;font-size:12px;color:var(--c-slate-82);margin:0}
/* legend fusion */
.fuse-fx{background:radial-gradient(circle at 50% 45%,var(--p-ink),var(--p-ink) 75%)}
.fz-ring{position:absolute;width:62vmin;height:62vmin;border-radius:50%;border:2px dashed color-mix(in srgb,color-mix(in srgb,var(--p-red) 60%,var(--p-white)) 45%,transparent);animation:fx-spin 6s linear infinite;opacity:.7}
.fz-orbit{position:absolute;width:0;height:0;animation:fz-orbit 2.6s cubic-bezier(.5,0,.5,1) forwards}
@keyframes fz-orbit{from{transform:rotate(0)}to{transform:rotate(540deg)}}
.fz-card{position:absolute;width:min(22vw,96px);aspect-ratio:3/4;margin:calc(min(22vw,96px)*-.66) 0 0 calc(min(22vw,96px)*-.5);border-radius:10px;overflow:hidden;border:2px solid var(--c-red-61);box-shadow:0 0 20px color-mix(in srgb,var(--c-red-61) 70%,transparent);transform:rotate(calc(var(--i)*120deg)) translateY(-26vmin) rotate(calc(var(--i)*-120deg));animation:fz-in 2.6s ease-in forwards}
@keyframes fz-in{70%{transform:rotate(calc(var(--i)*120deg)) translateY(-22vmin) rotate(calc(var(--i)*-120deg));opacity:1}100%{transform:rotate(calc(var(--i)*120deg)) translateY(0) rotate(calc(var(--i)*-120deg)) scale(.3);opacity:0}}
.fz-card img{width:100%;height:100%;object-fit:cover;object-position:top}
.fz-core{position:absolute;width:30vmin;height:30vmin;border-radius:50%;background:radial-gradient(circle,var(--c-white),color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 60%,transparent) 30%,transparent 70%);transform:scale(0);animation:fz-core 2.6s ease-in forwards}
@keyframes fz-core{60%{transform:scale(.3)}100%{transform:scale(1.2)}}
.fz-flash{position:absolute;inset:0;background:var(--c-white);opacity:0;animation:fz-flash .5s 2.55s ease-out both}
@keyframes fz-flash{0%{opacity:0}20%{opacity:1}100%{opacity:0}}
.fuse-fx.lose .fz-flash{background:var(--c-red-57)}
.fz-fail{display:flex;flex-direction:column;align-items:center;gap:6px;z-index:2;opacity:0;animation:fx-fade .5s 2.9s forwards}
.fz-broken{position:relative;width:min(36vw,150px);aspect-ratio:3/4;border-radius:12px;overflow:hidden;border:2px solid var(--c-gray-61);filter:grayscale(.6);animation:fz-shake .5s 2.9s ease-in-out}
.fz-broken img{width:100%;height:100%;object-fit:cover;object-position:top}
.fz-broken i{position:absolute;left:0;right:0;top:40%;height:2px;background:var(--c-white);transform:rotate(-24deg);box-shadow:0 0 6px var(--c-white)}.fz-broken i+i{top:58%;transform:rotate(18deg)}
@keyframes fz-shake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.fz-fail strong{font-size:26px;font-weight:700;color:var(--c-red-64)}.fz-fail small{color:color-mix(in srgb,var(--p-red) 32%,var(--p-white));font-weight:700}.fz-fail p{margin:0;font-size:12px;color:var(--c-slate-74)}
.legend-career{margin:8px 0;padding:8px 10px;border-radius:10px;background:var(--c-gold-98);border:1px solid color-mix(in srgb,var(--p-gold) 60%,var(--p-white));display:flex;flex-direction:column;gap:3px;font-size:12px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink))}
/* legend fusion */
.fuse-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.fuse-card{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:14px;background:var(--c-white);border:1px solid var(--c-gray-91)}
.fuse-card header{display:flex;align-items:center;gap:8px}.fuse-card header b{flex:1}.fuse-card header span{font-size:12px;color:var(--c-slate-41)}
.fuse-legends{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.fuse-face{display:flex;flex-direction:column;align-items:center;gap:3px;padding:0;border:0;background:none;cursor:pointer}
.fuse-face img{width:100%;aspect-ratio:190/244;object-fit:cover;object-position:top;border-radius:8px;border:2px solid var(--c-slate-85);filter:grayscale(.85);opacity:.7}
.fuse-face.owned img{filter:none;opacity:1;border-color:var(--c-gold-84);box-shadow:0 0 8px color-mix(in srgb,var(--p-gold) 50%,transparent)}.fuse-face small{font-size:10px;color:var(--c-slate-41);white-space:nowrap}
.fuse-btn{width:100%}

/* reveal overlays as top-layer dialogs (above open sheets) */
dialog.fx-dialog{position:fixed;inset:0;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;outline:none}
dialog.fx-dialog::backdrop{background:transparent}
.reveal-pref{display:flex;align-items:center;gap:6px;margin:10px 0 0;flex-wrap:wrap;font-size:12px}
.reveal-pref span{color:var(--c-slate-41);font-weight:700;margin-right:2px}
.reveal-pref button{padding:4px 10px;border-radius:999px;border:1px solid var(--c-slate-85);background:var(--c-white);color:var(--c-navy-15);font-size:12px;font-weight:700;cursor:pointer}
.reveal-pref button.active{background:var(--c-navy-15);border-color:var(--c-navy-15);color:var(--c-white)}
.pack-hero .reveal-pref span{color:color-mix(in srgb,var(--p-slate) 32%,var(--p-white))}.pack-hero .reveal-pref button{background:color-mix(in srgb,var(--c-white) 10%,transparent);border-color:color-mix(in srgb,var(--c-white) 30%,transparent);color:var(--c-white)}.pack-hero .reveal-pref button.active{background:var(--c-gold-84);border-color:var(--c-gold-84);color:var(--c-navy-15)}

/* UR reveal (about 5.4s) */
.ur-fx{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--c-white);cursor:pointer;overflow:hidden;background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--p-g-ur) 55%,var(--p-ink)) 0%,var(--c-black) 72%)}
.ur-embers i{position:absolute;left:var(--x);bottom:-10px;width:var(--s);height:var(--s);border-radius:50%;background:var(--p-red);box-shadow:0 0 8px var(--c-red-57);animation:ur-rise 3s var(--d) linear infinite;opacity:.85}
@keyframes ur-rise{to{transform:translateY(-110vh);opacity:0}}
.ur-bolt{position:absolute;left:-10%;right:-10%;height:3px;background:linear-gradient(90deg,transparent,var(--c-white) 40%,var(--c-red-61) 60%,transparent);box-shadow:0 0 18px 4px color-mix(in srgb,var(--p-red) 80%,transparent);opacity:0}
.ur-bolt.a{top:30%;transform:rotate(-14deg);animation:ur-bolt .45s .8s ease-out both}.ur-bolt.b{top:62%;transform:rotate(11deg);animation:ur-bolt .45s 1.15s ease-out both}
@keyframes ur-bolt{0%{opacity:0;clip-path:inset(0 100% 0 0)}40%{opacity:1;clip-path:inset(0 0 0 0)}100%{opacity:0}}
.ur-aura{position:absolute;width:70vmin;height:70vmin;border-radius:50%;background:conic-gradient(rgba(255,60,60,0),color-mix(in srgb,var(--c-red-57) 55%,transparent),rgba(255,160,60,0) 40%,color-mix(in srgb,var(--c-red-57) 50%,transparent) 70%,rgba(255,60,60,0));filter:blur(14px);opacity:0;animation:ur-spin 4s linear infinite,ur-show .6s 3s forwards}
@keyframes ur-spin{to{rotate:360deg}}@keyframes ur-show{to{opacity:1}}
.ur-stage{position:relative;width:min(44vw,190px);aspect-ratio:3/4;perspective:900px;z-index:1}
.ur-back,.ur-front{position:absolute;inset:0;border-radius:14px;overflow:hidden;backface-visibility:hidden}
.ur-back{display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 40%,var(--p-g-ur),color-mix(in srgb,var(--p-g-ur) 55%,var(--p-ink)) 75%);border:3px solid var(--c-red-61);box-shadow:0 0 30px color-mix(in srgb,var(--c-red-57) 60%,transparent);transform:translateY(-70vh);animation:ur-drop .8s 1.4s cubic-bezier(.2,1.2,.4,1) forwards,ur-pulse .45s 2.2s ease-in-out 2,ur-flipout .5s 3s ease-in forwards}
.ur-back span{font-size:48px;font-weight:900;color:color-mix(in srgb,var(--p-red) 32%,var(--p-white));text-shadow:0 0 18px var(--c-red-57);letter-spacing:.05em}
.ur-back i{position:absolute;left:10%;right:10%;height:2px;background:var(--c-white);box-shadow:0 0 8px color-mix(in srgb,var(--p-red) 60%,var(--p-white));opacity:0;animation:ur-show .15s forwards}
.ur-back .c1{top:35%;transform:rotate(-28deg);animation-delay:2.6s}.ur-back .c2{top:55%;transform:rotate(18deg);animation-delay:2.72s}.ur-back .c3{top:45%;transform:rotate(64deg);animation-delay:2.84s}
@keyframes ur-drop{from{transform:translateY(-70vh)}to{transform:none}}@keyframes ur-pulse{50%{box-shadow:0 0 60px 18px color-mix(in srgb,var(--c-red-57) 90%,transparent);scale:1.04}}
@keyframes ur-flipout{from{transform:none}to{transform:rotateY(90deg) scale(1.1);opacity:0}}
.ur-front{border:3px solid var(--c-red-61);box-shadow:0 0 0 4px color-mix(in srgb,var(--c-red-61) 25%,transparent),0 0 60px 14px color-mix(in srgb,var(--c-red-57) 55%,transparent);transform:rotateY(-90deg);opacity:0;animation:ur-flipin .6s 3.4s cubic-bezier(.2,1.3,.3,1) forwards;background:var(--p-ink)}
.ur-front img{width:100%;height:100%;object-fit:cover;object-position:top}.ur-front .grade-badge{position:absolute;top:8px;left:8px}
@keyframes ur-flipin{to{transform:none;opacity:1}}
.ur-blast{position:absolute;width:20vmin;height:20vmin;border-radius:50%;background:radial-gradient(circle,var(--c-white),color-mix(in srgb,var(--c-red-61) 80%,transparent) 35%,transparent 70%);transform:scale(0);opacity:0;animation:ur-blast .7s 3.05s ease-out forwards}
@keyframes ur-blast{0%{transform:scale(0);opacity:1}100%{transform:scale(9);opacity:0}}
.ur-word{display:flex;gap:6px;font-size:clamp(30px,9vw,54px);font-weight:900;letter-spacing:.1em;z-index:1}
.ur-word b{color:var(--c-red-64);text-shadow:0 0 20px var(--p-red),0 0 2px var(--c-white);opacity:0;transform:scale(2.6);animation:ur-slam .3s calc(3.9s + var(--i)*.09s) cubic-bezier(.3,1.5,.5,1) forwards}
@keyframes ur-slam{to{opacity:1;transform:none}}
.ur-name{font-size:26px;font-weight:900;z-index:1;opacity:0;animation:ur-show .5s 4.5s forwards}
.ur-meta{color:color-mix(in srgb,var(--p-red) 32%,var(--p-white));font-weight:700;z-index:1;opacity:0;animation:ur-show .5s 4.7s forwards}
.ur-rest{display:flex;gap:8px;z-index:1;flex-wrap:wrap;justify-content:center;align-items:center}
.ur-mini{width:min(17vw,70px);display:flex;flex-direction:column;align-items:center;gap:2px;opacity:0;transform:translateY(16px);animation:ur-up .4s calc(5s + var(--i)*.25s) ease-out forwards}
@keyframes ur-up{to{opacity:1;transform:none}}
.ur-mini img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:8px;border:2px solid var(--c-red-61)}.ur-mini b{font-size:10px}.ur-rest span{font-size:12px;color:color-mix(in srgb,var(--p-red) 32%,var(--p-white))}
.ur-fx.skip .ur-bolt,.ur-fx.skip .ur-blast,.ur-fx.skip .ur-back{display:none}

/* fusion: pick the 3 UR copies */
.fuse-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:8px;max-height:46vh;overflow:auto;padding:2px}
.fuse-pick{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px;border-radius:12px;border:2px solid var(--c-gray-91);background:var(--c-gray-96);cursor:pointer;font:inherit;color:inherit;min-width:0}
.fuse-pick img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:8px;opacity:.55;transition:opacity .15s}
.fuse-pick b{font-size:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fuse-pick small{font-size:10px;color:var(--c-slate-41)}
.fuse-pick.selected{border-color:var(--p-red);background:var(--c-red-96)}.fuse-pick.selected img{opacity:1}
.fuse-pick.selected::before{content:'';position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:var(--p-red);box-shadow:0 0 0 2px var(--c-white)}
.fuse-pick.selected::after{content:'';position:absolute;top:12px;right:15px;width:5px;height:9px;border:solid var(--c-white);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}

.fuse-bulk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding:10px;border-radius:12px;background:var(--c-orange-98);border:1px solid color-mix(in srgb,var(--p-g-ssr) 32%,var(--p-white))}
.fuse-bulk>div{flex-basis:100%;display:flex;flex-direction:column;gap:2px}.fuse-bulk small{font-size:11px;color:var(--c-slate-41)}
.fuse-bulk select{flex:1;min-height:40px;padding:0 10px;border-radius:10px;border:1px solid var(--c-gray-88);background:var(--c-white);font:inherit}

/* 141+: rainbow text (swatch in the legend) */
.rating-prism,.player-side .rating-prism,.pack-hero .rating-prism{display:inline-block;background:linear-gradient(90deg,var(--c-red-57),var(--p-gold),var(--p-gold),var(--p-green),var(--p-g-r),var(--p-g-sr),var(--p-g-sr));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--p-g-sr)!important;text-shadow:none}
.stat-legend .rating-prism{-webkit-text-fill-color:currentColor;background:none;color:inherit!important}
.stat-legend .rating-prism i{background:conic-gradient(var(--c-red-57),var(--p-gold),var(--p-gold),var(--p-green),var(--p-g-r),var(--p-g-sr),var(--p-g-sr),var(--c-red-57))}
.stat-grid .rating-prism,.player-detail .rating-prism{align-self:center}

/* fusion page v2: progress, mode tabs, club cards, free / target panels, history */
.fuse-top{display:flex;flex-direction:column;gap:12px;margin-bottom:12px;padding:16px;border-radius:18px;background:linear-gradient(135deg,var(--c-navy-15),color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink)) 60%,color-mix(in srgb,var(--p-g-ur) 55%,var(--p-ink)));color:var(--c-white)}
.fuse-head{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}.fuse-head>div:first-child{flex:1;min-width:200px}
.fuse-head h3{margin:2px 0 4px;font-size:22px;color:var(--c-white)}.fuse-head p{margin:0;font-size:13px;color:var(--p-line);line-height:1.5}.fuse-top .eyebrow{color:var(--c-gold-84)}
.fuse-meter{display:flex;flex-direction:column;gap:4px;min-width:160px;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--c-white) 8%,transparent);border:1px solid color-mix(in srgb,var(--c-white) 14%,transparent)}
.fuse-meter b{font-size:28px;color:var(--c-gold-84);line-height:1}.fuse-meter b span{font-size:14px;color:var(--p-line)}.fuse-meter small{font-size:11px;color:var(--c-slate-80)}
.fuse-meter i{display:block;height:6px;border-radius:999px;background:color-mix(in srgb,var(--c-white) 15%,transparent);overflow:hidden}.fuse-meter em{display:block;height:100%;background:linear-gradient(90deg,var(--c-gold-84),var(--p-red))}
.fuse-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.fuse-mode{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 8px;border-radius:14px;border:1px solid color-mix(in srgb,var(--c-white) 18%,transparent);background:color-mix(in srgb,var(--c-white) 6%,transparent);color:var(--c-white);cursor:pointer;text-align:center;font:inherit;min-width:0}
.fuse-mode .fuse-mode-art{width:56px;height:56px;border-radius:12px}.fuse-mode span{display:flex;flex-direction:column;gap:2px}.fuse-mode b{font-size:14px}.fuse-mode small{font-size:10.5px;color:var(--c-slate-80);line-height:1.4}
.fuse-mode em{font-style:normal;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--c-white) 12%,transparent)}
.fuse-mode.active{background:var(--c-white);color:var(--c-navy-15);border-color:var(--c-gold-84);box-shadow:0 0 0 2px var(--c-gold-84)}.fuse-mode.active small{color:var(--c-slate-41)}.fuse-mode.active em{background:var(--c-gold-84);color:var(--c-navy-15)}
@media (max-width:480px){.fuse-mode small{display:none}.fuse-mode .fuse-mode-art{width:44px;height:44px}}
.fuse-card.complete{border-color:var(--c-gold-84);box-shadow:0 0 0 1px var(--c-gold-84) inset}
.fuse-have{font-size:12px;font-weight:600;color:var(--c-orange-49);background:var(--c-gold-96);padding:2px 8px;border-radius:999px}
.fuse-foot{display:flex;align-items:center;gap:8px}.fuse-foot>span{flex:1;font-size:12px;color:var(--c-slate-41)}.fuse-foot b{color:var(--c-navy-15)}.fuse-foot .fuse-btn{width:auto;flex:0 0 auto}
.fuse-face{position:relative}.fuse-face.picked img{border-color:var(--p-red);box-shadow:0 0 0 3px color-mix(in srgb,var(--p-red) 35%,transparent);filter:none;opacity:1}
.fuse-tr{position:absolute;top:2px;left:0;right:0;display:flex;justify-content:center}.fuse-tr .tr-stars .gi{width:9px;height:9px}
.fuse-panel{display:flex;gap:14px;align-items:center;padding:14px;border-radius:16px;background:var(--c-white);border:1px solid var(--c-gray-91);margin-bottom:10px;flex-wrap:wrap}
.fuse-panel>div{flex:1;min-width:0}.fuse-panel h4{margin:0 0 4px;font-size:17px}.fuse-panel p{margin:0 0 10px;font-size:13px;color:var(--c-slate-41);line-height:1.5}
.fuse-panel-art{width:96px;height:96px;border-radius:16px}.fuse-target-photo{width:96px;aspect-ratio:190/244;object-fit:cover;object-position:top;border-radius:12px;border:3px solid var(--c-gold-84);box-shadow:0 0 14px color-mix(in srgb,var(--p-gold) 45%,transparent)}
.fuse-panel-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.fuse-panel-row span{flex:1 1 100%;font-size:12px;color:var(--c-slate-41)}.fuse-panel-row .btn{flex:1 1 auto}
.fuse-mosaic{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;padding:12px;border-radius:16px;background:var(--c-white);border:1px solid var(--c-gray-91)}
.fuse-target-list{display:flex;flex-direction:column;gap:8px}
.fuse-target-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:var(--c-white);border:1px solid var(--c-gray-91)}.fuse-target-row .fuse-legends{flex:1}
.fuse-log{margin-top:12px;padding:14px;border-radius:16px;background:var(--c-white);border:1px solid var(--c-gray-91)}.fuse-log h4{margin:0 0 8px}
.fuse-log ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.fuse-log li{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;padding:8px 10px;border-radius:10px;background:var(--c-gray-96);border-left:4px solid color-mix(in srgb,var(--p-line) 80%,var(--p-ink))}
.fuse-log li.win{background:var(--c-gold-98);border-left-color:var(--c-gold-84)}.fuse-log li b{font-size:13px}.fuse-log li small{grid-column:1/-1;font-size:11px;color:var(--c-slate-49)}
.fuse-log-mode{font-size:11px;font-weight:600;color:color-mix(in srgb,var(--p-g-sr) 80%,var(--p-ink));background:var(--c-purple-94);padding:1px 8px;border-radius:999px;align-self:center}
/* fusion sheet: goal + 3 slots */
.fuse-goal{display:flex;align-items:center;gap:10px;margin-bottom:10px}.fuse-goal-art{width:52px;height:52px;border-radius:12px}.fuse-goal div{display:flex;flex-direction:column;gap:2px}.fuse-goal small{font-size:12px;color:var(--c-slate-41)}
.fuse-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px;padding:10px;border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink)),color-mix(in srgb,var(--p-g-ur) 55%,var(--p-ink)))}
.fuse-slot{aspect-ratio:3/4;max-height:150px;border-radius:10px;border:2px dashed color-mix(in srgb,var(--c-white) 35%,transparent);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:color-mix(in srgb,var(--c-white) 60%,transparent);overflow:hidden;position:relative;justify-self:center;width:100%}
.fuse-slot span{font-size:22px;font-weight:700}.fuse-slot.filled{border:2px solid var(--c-red-61);box-shadow:0 0 12px color-mix(in srgb,var(--c-red-61) 50%,transparent)}
.fuse-slot img{width:100%;height:100%;object-fit:cover;object-position:top}.fuse-slot small{position:absolute;left:0;right:0;bottom:0;padding:3px;background:color-mix(in srgb,var(--c-black) 60%,transparent);color:var(--c-white);font-size:11px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* transcendence */
.transcend-inline{display:inline-flex;align-items:center;gap:1px;padding:0 6px;border-radius:999px;background:linear-gradient(135deg,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),var(--p-gold));color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));font-size:11px;font-weight:700;line-height:18px;box-shadow:0 0 0 1px var(--p-g-ssr) inset}
.transcend-inline .gi{width:11px;height:11px}
.tr-stars{display:inline-flex;gap:2px}.tr-stars .gi-star-fill,.transcend-inline .gi-star-fill,.transcend-open .gi-star-fill{color:inherit}.tr-stars i{display:inline-flex;color:var(--c-slate-82)}.tr-stars i.on{color:var(--p-gold);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--p-gold) 70%,transparent))}.tr-stars .gi{width:16px;height:16px}
.transcend-open .gi{width:14px;height:14px;vertical-align:-2px}
.transcend-sheet .tr-hero{position:relative;display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--p-g-r) 55%,var(--p-ink)),color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)));color:var(--c-white);overflow:hidden}
.transcend-sheet .tr-art{position:absolute;right:-12px;top:-12px;width:120px;height:120px;opacity:.35;border-radius:20px}
.transcend-sheet .tr-photo{width:84px;aspect-ratio:190/244;object-fit:cover;object-position:top;border-radius:10px;border:3px solid var(--c-gold-84);box-shadow:0 0 16px color-mix(in srgb,var(--c-gold-84) 55%,transparent);position:relative}
.transcend-sheet .tr-hero h3{margin:2px 0 6px;font-size:20px;color:var(--c-white)}.transcend-sheet .tr-hero .eyebrow{color:var(--c-gold-84)}.transcend-sheet .tr-hero>div{position:relative}
.tr-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:12px 0}
.tr-step{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:10px;background:var(--c-gray-96);text-align:center}.tr-step b{font-size:12px}.tr-step small{font-size:10px;color:var(--c-slate-49);line-height:1.3}
.tr-step.done{background:var(--c-gold-96);box-shadow:0 0 0 1px var(--c-gold-84) inset}.tr-step.done b{color:var(--c-orange-49)}.tr-step.next{background:var(--c-white);box-shadow:0 0 0 2px var(--p-gold) inset}
.tr-now{margin:0 0 6px;font-size:14px}.tr-now b{color:var(--c-orange-49)}.tr-mat{margin:6px 0 0;font-size:13px}.tr-mat b{color:var(--c-navy-15)}
.transcend-sheet.tr-up .tr-photo{animation:tr-up .9s ease-out}
@keyframes tr-up{0%{transform:scale(.9)}50%{transform:scale(1.08);box-shadow:0 0 40px color-mix(in srgb,var(--c-gold-84) 90%,transparent)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.transcend-sheet.tr-up *{animation:none!important}}

/* mailbox: claim all / clear received */
.mail-tools{display:flex;gap:8px;margin-bottom:10px}.mail-tools .btn{flex:1}
.mail-done{display:flex;align-items:center;justify-content:space-between;gap:8px}.mail-done .text-btn{color:var(--p-red);font-weight:700}

.mail-group{margin:14px 0 8px;font-size:14px;display:flex;align-items:center;gap:6px}.mail-group b{font-size:11px;padding:1px 8px;border-radius:999px;background:var(--c-gray-91);color:var(--c-navy-15)}
.mail-rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border:1px solid var(--c-gray-91);border-radius:12px;overflow:hidden;background:var(--c-white)}
.mail-rows li{display:flex;align-items:center;gap:10px;padding:9px 12px;border-top:1px solid var(--c-gray-96)}.mail-rows li:first-child{border-top:0}
.mail-rows li>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.mail-rows li b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mail-rows li small{font-size:11px;color:var(--c-slate-49)}.mail-rows .text-btn{color:var(--p-red);font-weight:700;flex:none}

/* scorebook: kind filter + summary */
.record-filter{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px}
.record-filter button{display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 4px;border-radius:12px;border:1px solid var(--c-gray-88);background:var(--c-white);font:inherit;font-weight:600;font-size:13px;color:var(--c-navy-15);cursor:pointer}
.record-filter button small{font-size:11px;font-weight:700;color:var(--c-slate-49)}.record-filter button.active{background:var(--c-navy-15);border-color:var(--c-navy-15);color:var(--c-white)}.record-filter button.active small{color:color-mix(in srgb,var(--p-slate) 32%,var(--p-white))}
.record-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 14px}
.record-stats>div{display:flex;flex-direction:column;gap:3px;padding:10px;border-radius:12px;background:var(--c-gray-96);min-width:0}
.record-stats small{font-size:11px;color:var(--c-slate-49);font-weight:700}.record-stats b{font-size:20px;line-height:1.1;color:var(--c-navy-15)}.record-stats b i{font-style:normal;font-size:13px}.record-stats span{font-size:11px;color:var(--c-slate-41)}
.record-stats .form{display:flex;flex-wrap:wrap;gap:2px}.record-stats .form i{font-style:normal;font-size:10px;width:18px;height:18px;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;color:var(--c-white);background:var(--c-gray-61)}
.record-stats .form i.win{background:var(--p-g-lr)}.record-stats .form i.loss{background:var(--p-red)}
@media (max-width:640px){.record-stats{grid-template-columns:repeat(2,1fr)}}
.record-list b.no-reward{color:var(--c-gray-61);font-size:12px;font-weight:700}

/* transcendence reveal (about 3.8s) */
.tr-fx{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--c-white);cursor:pointer;overflow:hidden;background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)) 0%,var(--p-ink) 70%)}
.trx-pillars{position:absolute;inset:0;display:flex;justify-content:center;gap:18vw;pointer-events:none}
.trx-pillars i{width:9vw;max-width:60px;height:100%;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--p-gold) 55%,transparent),transparent);filter:blur(6px);transform:scaleY(0);transform-origin:bottom;animation:trx-pillar .9s calc(var(--n,0)*.12s) ease-out forwards}
.trx-pillars i:nth-child(2){--n:1}.trx-pillars i:nth-child(3){--n:2}
@keyframes trx-pillar{to{transform:scaleY(1)}}
.trx-ring{position:absolute;width:62vmin;height:62vmin;border-radius:50%;border:2px solid color-mix(in srgb,var(--p-gold) 60%,transparent);box-shadow:0 0 40px color-mix(in srgb,var(--c-gold-84) 50%,transparent),inset 0 0 40px color-mix(in srgb,var(--c-gold-84) 35%,transparent);opacity:0;transform:scale(.6);animation:trx-ring 1.2s .5s ease-out forwards}
@keyframes trx-ring{to{opacity:1;transform:none}}
.trx-card{position:relative;z-index:1;width:min(38vw,170px);aspect-ratio:190/244;border-radius:14px;overflow:hidden;border:3px solid var(--c-gold-84);box-shadow:0 0 50px 10px color-mix(in srgb,var(--c-gold-84) 60%,transparent);opacity:0;transform:translateY(40vh) scale(.8);animation:trx-rise 1s .35s cubic-bezier(.2,1.1,.3,1) forwards}
.trx-card img{width:100%;height:100%;object-fit:cover;object-position:top}
@keyframes trx-rise{to{opacity:1;transform:none}}
.trx-stars{display:flex;gap:8px;z-index:1}
.trx-stars i{display:inline-flex;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));opacity:0;transform:scale(.4);animation:trx-star .3s calc(1.4s + var(--i)*.14s) ease-out forwards}
.trx-stars i .gi{width:30px;height:30px;color:inherit}
.trx-stars i.old{color:var(--c-gold-84)}
.trx-stars i.new{color:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));filter:drop-shadow(0 0 10px var(--c-gold-84));animation:trx-new .7s 2.3s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes trx-star{to{opacity:1;transform:none}}
@keyframes trx-new{0%{opacity:0;transform:scale(3) rotate(-30deg)}60%{opacity:1;transform:scale(.9)}100%{opacity:1;transform:none;color:var(--c-gold-84)}}
.trx-word{z-index:1;font-size:clamp(24px,7vw,40px);font-weight:700;letter-spacing:.14em;color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));text-shadow:0 0 18px color-mix(in srgb,var(--c-gold-84) 90%,transparent);opacity:0;animation:trx-in .5s 2.8s ease-out forwards}
.trx-word b{color:var(--c-white)}
.trx-name{z-index:1;font-size:22px;opacity:0;animation:trx-in .5s 3s ease-out forwards}
.trx-gain{z-index:1;color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));font-weight:600;opacity:0;animation:trx-in .5s 3.2s ease-out forwards}
@keyframes trx-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.fuse-ticket{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;margin-bottom:10px;border-radius:12px;background:linear-gradient(135deg,color-mix(in srgb,var(--p-gold) 16%,var(--p-white)),color-mix(in srgb,var(--p-gold) 60%,var(--p-white)));border:1px solid var(--p-gold)}
.fuse-ticket b{font-size:14px;color:color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink))}.fuse-ticket small{flex:1 1 100%;font-size:11px;color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));order:2}.fuse-ticket .btn{margin-left:auto}
.btn.gold{background:var(--c-gold-84);border-color:var(--p-gold);color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));font-weight:600}
.legend-ticket-item{background:linear-gradient(135deg,var(--c-orange-98),var(--c-gold-96));border-color:var(--p-gold)}

.mail-kind{display:inline-block;font-style:normal;font-size:10px;font-weight:600;padding:1px 7px;margin-right:6px;border-radius:999px;background:var(--c-gray-91);color:var(--c-navy-15);white-space:nowrap;flex:none}

/* Player card v2 (playerCard in app.js). Sizes are in container units (cqw) so the badges scale with the card in
   every grid; grade colours are metallic (--m1 dark, --m2 light) on a light backdrop (--bg1/--bg2) that the photo is
   multiplied onto. */
.player-card.pc{position:relative;display:block;width:100%;aspect-ratio:5/7;padding:0;margin:0;overflow:hidden;border:0;border-radius:10px;container-type:inline-size;text-align:left;color:var(--c-white);cursor:pointer;
  --m1:var(--c-slate-56);--m2:var(--c-gray-96);--bg1:var(--c-gray-96);--bg2:var(--c-slate-82);
  background:linear-gradient(165deg,var(--bg1) 0%,var(--bg2) 100%);box-shadow:0 3px 10px color-mix(in srgb,var(--c-navy-11) 22%,transparent);transition:transform .15s ease,box-shadow .15s ease}
.player-card.pc::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(118deg,color-mix(in srgb,var(--c-white) 22%,transparent) 0 5px,transparent 5px 13px),radial-gradient(circle at 70% 18%,color-mix(in srgb,var(--c-white) 55%,transparent),transparent 55%)}
.player-card.pc::after{content:"";position:absolute;inset:0;z-index:5;border-radius:inherit;padding:2.5px;pointer-events:none;background:linear-gradient(140deg,var(--m1) 0%,var(--m2) 38%,var(--m1) 62%,var(--m2) 100%);-webkit-mask:linear-gradient(var(--c-black) 0 0) content-box,linear-gradient(var(--c-black) 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.player-card.pc:hover{transform:translateY(-2px);box-shadow:0 8px 18px color-mix(in srgb,var(--c-navy-11) 28%,transparent)}
.player-card.pc:focus-visible{outline:3px solid var(--c-gold-84);outline-offset:2px}
.player-card.pc[data-grade="R"]{--m1:var(--p-g-r);--m2:color-mix(in srgb,var(--p-g-r) 32%,var(--p-white));--bg1:var(--c-blue-96);--bg2:color-mix(in srgb,var(--p-g-r) 32%,var(--p-white))}
.player-card.pc[data-grade="SR"]{--m1:var(--p-g-sr);--m2:color-mix(in srgb,var(--p-g-sr) 32%,var(--p-white));--bg1:var(--c-purple-94);--bg2:color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white))}
.player-card.pc[data-grade="SSR"]{--m1:var(--p-g-ssr);--m2:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));--bg1:var(--c-gold-96-2);--bg2:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}
.player-card.pc[data-grade="UR"]{--m1:var(--p-g-ur);--m2:color-mix(in srgb,var(--p-red) 32%,var(--p-white));--bg1:color-mix(in srgb,var(--p-red) 8%,var(--p-white));--bg2:color-mix(in srgb,var(--p-red) 60%,var(--p-white))}

.player-card.pc[data-grade="LR"]::after{padding:3px;}
.player-card.pc.finish-gold{box-shadow:0 0 0 1px var(--p-gold),0 0 12px color-mix(in srgb,var(--c-gold-84) 55%,transparent),0 3px 10px color-mix(in srgb,var(--c-navy-11) 22%,transparent)}
.player-card.pc .pc-photo{position:absolute;left:0;top:3%;width:100%;height:82%;object-fit:cover;object-position:50% 14%;mix-blend-mode:multiply;z-index:1;border:0;border-radius:0;background:none;margin:0;max-width:none}
.player-card.pc .pc-ovr{position:absolute;left:5cqw;top:5cqw;z-index:3;display:flex;flex-direction:column;align-items:center;line-height:1}
.player-card.pc .pc-ovr b{font-size:20cqw;font-weight:900;letter-spacing:-.04em;color:var(--c-white);-webkit-text-stroke:1.1cqw var(--c-navy-11);paint-order:stroke fill;text-shadow:0 1cqw 2cqw color-mix(in srgb,var(--c-black) 35%,transparent)}
.player-card.pc .pc-ovr i{margin-top:1.2cqw;padding:.8cqw 2.6cqw;border-radius:2cqw;background:color-mix(in srgb,var(--c-navy-11) 88%,transparent);color:var(--c-white);font-size:7.5cqw;font-weight:800;font-style:normal;letter-spacing:.02em}
.player-card.pc .pc-top{position:absolute;right:4cqw;top:4cqw;z-index:3;display:flex;flex-direction:column;align-items:center;gap:1.6cqw}
.player-card.pc .pc-club{width:19cqw;height:19cqw;object-fit:contain;filter:drop-shadow(0 .6cqw 1cqw color-mix(in srgb,var(--c-black) 35%,transparent))}
.player-card.pc .pc-grade{padding:.6cqw 2.4cqw;border-radius:1.8cqw;font-size:7cqw;font-weight:900;letter-spacing:.04em;color:var(--c-white);background:linear-gradient(140deg,var(--m1),var(--m2) 50%,var(--m1));text-shadow:0 .4cqw .8cqw color-mix(in srgb,var(--c-black) 50%,transparent);box-shadow:0 .5cqw 1.5cqw color-mix(in srgb,var(--c-black) 30%,transparent)}
.player-card.pc[data-grade="N"] .pc-grade,.player-card.pc[data-grade="SSR"] .pc-grade{color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));text-shadow:0 .3cqw 0 color-mix(in srgb,var(--c-white) 45%,transparent)}
.player-card.pc[data-grade="LR"] .pc-grade{text-shadow:none}
.player-card.pc .pc-side{position:absolute;left:4.5cqw;top:44cqw;z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:1.6cqw;font-size:7cqw}
.player-card.pc .pc-side>span{font-size:7cqw;line-height:1.2;margin:0;box-shadow:0 .5cqw 1.5cqw color-mix(in srgb,var(--c-black) 30%,transparent)}
.player-card.pc .pc-side>i{display:grid;place-items:center;width:11cqw;height:11cqw;border-radius:50%;font-style:normal;box-shadow:0 .5cqw 1.5cqw color-mix(in srgb,var(--c-black) 30%,transparent)}
.player-card.pc .pc-side .gi{width:7cqw;height:7cqw}
.player-card.pc .pc-lock{background:var(--c-navy-11);color:var(--p-gold)}
.player-card.pc .pc-up{background:var(--p-green);color:var(--c-white)}
.player-card.pc .pc-name{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;flex-direction:column;align-items:center;gap:.4cqw;padding:10cqw 4cqw 4cqw;background:linear-gradient(to top,var(--c-navy-6) 0%,color-mix(in srgb,var(--c-navy-6) 92%,transparent) 50%,rgba(11,20,38,0) 100%);text-align:center}
.player-card.pc .pc-name b{max-width:100%;font-size:10.5cqw;font-weight:900;line-height:1.15;letter-spacing:-.02em;color:var(--c-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
.player-card.pc .pc-name small{max-width:100%;font-size:6.6cqw;line-height:1.2;color:var(--c-slate-82);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-card.pc .pc-name .card-extra{color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));font-size:6.6cqw}
.player-card.pc .pc-name .pc-legend{font-weight:900;letter-spacing:.18em;background:linear-gradient(90deg,color-mix(in srgb,var(--p-red) 60%,var(--p-white)),var(--p-gold),color-mix(in srgb,var(--p-green) 60%,var(--p-white)),color-mix(in srgb,var(--p-g-r) 32%,var(--p-white)),color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)));-webkit-background-clip:text;background-clip:text;color:transparent}
.player-grid,.player-grid.compact,.collection-grid,.redemption-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
@media (max-width:560px){.collection-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.player-grid,.player-grid.compact,.redemption-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}   /* grids with action buttons under each card stay at 2 until the inventory rework */

/* 보유 카드 v2 (ownedCards): toolbar, toggle chips, dense grid, compact actions */
.owned-v2 .owned-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 8px}
.owned-v2 .seg{display:inline-flex;padding:3px;border-radius:10px;background:var(--c-gray-91)}
.owned-v2 .seg button{border:0;background:transparent;padding:6px 13px;border-radius:8px;font-size:13px;font-weight:600;color:var(--c-slate-42);cursor:pointer}
.owned-v2 .seg button.active{background:var(--c-navy-15);color:var(--c-white);box-shadow:0 2px 6px color-mix(in srgb,var(--c-navy-15) 25%,transparent)}
.owned-v2 .owned-count{font-size:12px;color:var(--c-slate-42);white-space:nowrap}.owned-v2 .owned-count b{font-size:15px;color:var(--c-navy-15)}
.owned-v2 .tool-row{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.owned-v2 .tool-row::-webkit-scrollbar{display:none}
.owned-v2 .tool-icon{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:10px;border:1px solid var(--c-slate-85);background:var(--c-white);color:var(--c-navy-15);cursor:pointer}
.owned-v2 .tool-icon.on{background:var(--c-navy-15);border-color:var(--c-navy-15);color:var(--c-white)}
.owned-v2 .tool-icon .gi{width:18px;height:18px}
.owned-v2 .tool-select{flex:none;height:36px;max-width:150px;padding:0 28px 0 12px;border-radius:10px;border:1px solid var(--c-slate-85);background-color:var(--c-white);background-image:linear-gradient(45deg,transparent 50%,var(--c-navy-15) 50%),linear-gradient(135deg,var(--c-navy-15) 50%,transparent 50%);background-position:calc(100% - 16px) 52%,calc(100% - 11px) 52%;background-size:5px 5px;background-repeat:no-repeat;   /* CSS chevron: the online CSP blocks data: images */-webkit-appearance:none;appearance:none;font-size:13px;font-weight:700;color:var(--c-navy-15);cursor:pointer}
.owned-v2 .tool-select.on{border-color:var(--c-navy-15);background-color:var(--c-blue-96);box-shadow:inset 0 0 0 1px var(--c-navy-15)}
.owned-v2 .tool-search{display:flex;align-items:center;gap:6px;margin-top:8px;padding:0 4px 0 11px;height:40px;border-radius:10px;border:1px solid var(--c-navy-15);background:var(--c-white)}
.owned-v2 .tool-search>.gi{width:17px;height:17px;color:var(--c-slate-42);flex:none}
.owned-v2 .tool-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:14px;padding:0;height:100%}
.owned-v2 .tool-search .btn{height:32px;min-height:0;padding:0 12px;font-size:13px}
.owned-v2 .toggle-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:8px 0 12px}
.toggle-chip{position:relative;display:inline-flex;cursor:pointer}
.toggle-chip input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.toggle-chip span{padding:5px 11px;border-radius:999px;border:1px solid var(--c-slate-85);background:var(--c-white);font-size:12px;font-weight:700;color:var(--c-slate-42);transition:background .15s,color .15s}
.toggle-chip input:checked+span{background:var(--c-navy-15);border-color:var(--c-navy-15);color:var(--c-white)}
.toggle-chip input:focus-visible+span{outline:2px solid var(--c-gold-84);outline-offset:2px}
.owned-v2 .toggle-row .text-btn{font-size:12px;padding:4px 6px}
.owned-v2 .player-grid.compact{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:12px 10px}
.owned-v2 .owned-player{position:relative;display:flex;flex-direction:column;gap:6px;padding:0;border:0;background:none;box-shadow:none;min-width:0}
.owned-v2 .owned-fav{position:absolute;right:5px;top:41%;z-index:6;display:grid;place-items:center;width:30px;height:30px;min-width:0;min-height:0;padding:0;border-radius:50%;border:0;background:color-mix(in srgb,var(--c-navy-11) 72%,transparent);color:var(--c-white);cursor:pointer;box-shadow:0 1px 4px color-mix(in srgb,var(--c-black) 30%,transparent)}
.owned-v2 .owned-fav.on{background:var(--p-red);color:var(--c-white)}
.owned-v2 .owned-fav .gi{width:14px;height:14px}
.owned-v2 .owned-actions{display:flex;gap:5px}
.owned-v2 .owned-actions .btn{min-height:0;height:32px;padding:0 8px;border-radius:9px;font-size:12px;font-weight:600;white-space:nowrap}
.owned-v2 .owned-actions .btn:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.owned-v2 .owned-actions .icon-only{flex:none;width:34px;padding:0;display:grid;place-items:center}
.owned-v2 .owned-actions .icon-only .gi{width:16px;height:16px}
@media (max-width:560px){.owned-v2 .player-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 6px}.owned-v2 .owned-actions .btn{height:30px;font-size:11px;padding:0 5px}.owned-v2 .owned-actions .icon-only{width:28px}.owned-v2 .owned-fav{width:28px;height:28px}}

/* Pack result v2 (showPack): best card large in front of turning rays, the rest small, loot line, footer actions */
.pack-result .pr-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;padding:6px 0 14px;overflow:hidden;isolation:isolate}
.pack-result .pr-rays{position:absolute;left:50%;top:150px;width:900px;height:900px;margin:-450px 0 0 -450px;z-index:-1;pointer-events:none;background:repeating-conic-gradient(from 0deg,rgba(var(--rarity-rgb),.55) 0deg 4deg,transparent 4deg 16deg);-webkit-mask:radial-gradient(circle,var(--c-black) 0%,color-mix(in srgb,var(--c-black) 50%,transparent) 18%,transparent 42%);mask:radial-gradient(circle,var(--c-black) 0%,color-mix(in srgb,var(--c-black) 50%,transparent) 18%,transparent 42%);animation:pr-turn 40s linear infinite}
@keyframes pr-turn{to{transform:rotate(360deg)}}
.pack-result .pr-stage>.eyebrow{color:color-mix(in srgb,var(--p-line) 80%,var(--p-ink));letter-spacing:.14em}
.pack-result .pr-title{margin:0;display:flex;align-items:center;gap:8px;font-size:20px;font-weight:900;color:var(--c-white);text-shadow:0 2px 10px rgba(var(--rarity-rgb),.6)}
.pack-result .pr-hero{width:min(54vw,230px);margin:4px 0 6px;filter:drop-shadow(0 10px 26px color-mix(in srgb,var(--c-black) 55%,transparent)) drop-shadow(0 0 22px rgba(var(--rarity-rgb),.45));animation:pr-hero .55s cubic-bezier(.2,1.4,.4,1) both}
@keyframes pr-hero{from{transform:scale(.7);opacity:0}}
.pack-result .pr-rest{display:flex;justify-content:center;gap:10px;width:100%}
.pack-result .pr-rest .pr-slot{width:min(27vw,118px);animation:pr-slot .4s calc(.25s + var(--i)*.06s) ease-out both}
.pack-result .pr-rest.many{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:8px}
.pack-result .pr-rest.many .pr-slot{width:auto}
@keyframes pr-slot{from{transform:translateY(14px);opacity:0}}
.pack-result .pr-loot{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:6px}
.pack-result .pr-loot span{padding:5px 12px;border-radius:999px;background:color-mix(in srgb,var(--c-white) 8%,transparent);border:1px solid color-mix(in srgb,var(--c-white) 14%,transparent);font-size:12px;color:var(--c-slate-90)}
.pack-result .pr-loot b{color:var(--c-white);font-size:14px}
.pack-result .pr-loot .new{background:color-mix(in srgb,var(--c-gold-84) 16%,transparent);border-color:color-mix(in srgb,var(--c-gold-84) 50%,transparent);color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white))}
.pack-result .pr-loot .shard{background:color-mix(in srgb,color-mix(in srgb,var(--p-g-r) 60%,var(--p-white)) 14%,transparent);border-color:color-mix(in srgb,color-mix(in srgb,var(--p-g-r) 60%,var(--p-white)) 45%,transparent)}
.pack-result .pr-note{color:var(--p-g-n);font-size:11px}
.pack-result .pr-footer{display:flex;align-items:center;gap:8px}
.pack-result .pr-footer .btn{min-height:0;height:46px;border-radius:12px;font-weight:800}
.pack-result .pr-footer .btn:nth-child(2){flex:1;display:flex;flex-direction:column;justify-content:center;gap:1px;line-height:1.1;white-space:nowrap;background:var(--p-navy);border-color:color-mix(in srgb,var(--p-g-n) 55%,var(--p-ink));color:var(--c-white)}
.pack-result .pr-footer .btn:nth-child(2):disabled{opacity:.5}
.pack-result .pr-footer .btn.primary{flex:1.2;background:linear-gradient(140deg,var(--p-g-sr),var(--p-g-sr));border-color:var(--p-g-sr);color:var(--c-white);box-shadow:0 6px 18px color-mix(in srgb,var(--p-g-sr) 45%,transparent)}
.pack-result .pr-footer .btn.icon-only{flex:none;width:46px;padding:0;display:grid;place-items:center;background:var(--p-navy);border-color:color-mix(in srgb,var(--p-g-n) 55%,var(--p-ink));color:var(--c-white)}
.pack-result .pr-footer .icon-only .gi{width:18px;height:18px}
.pack-result .pr-footer>p{display:none}
.pack-opening.reveal-complete .pr-rays{animation:pr-turn 40s linear infinite!important}   /* keep the rays turning after the opening effect */
.pack-result .pr-footer .btn small{font-size:11px;font-weight:700;color:var(--c-slate-80)}

/* Pack opening v2 (public/pack-fx.js: GSAP drives every transform and resets the CSS translate property, so centring uses margins; CSS only sets the look). Grade colours are
   metallic gradients (--m1 dark, --m2 light) so they sit with the gold pack art. */
.pk-fx{position:fixed;inset:0;overflow:hidden;color:var(--c-white);cursor:pointer;background:radial-gradient(ellipse at 50% 46%,color-mix(in srgb,var(--c-navy-6) 10%,transparent) 0%,color-mix(in srgb,var(--p-ink) 55%,transparent) 70%,color-mix(in srgb,var(--c-black) 85%,transparent) 100%),url(/assets/art-pk-stage.jpg) center/cover no-repeat,var(--p-ink)}
@media (min-aspect-ratio:1/1){.pk-fx{background:radial-gradient(ellipse at 50% 46%,color-mix(in srgb,var(--c-navy-6) 10%,transparent) 0%,rgba(4,7,15,.55) 70%,color-mix(in srgb,var(--c-black) 85%,transparent) 100%),url(/assets/art-pk-stage-wide.jpg) center/cover no-repeat,#070d1c}}   /* table stage: portrait art on phones, wide art on PC */
.pk-fx::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 120%,color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 10%,transparent),transparent 60%);pointer-events:none}
.pk-fx .fx-tap{left:0;right:0;text-align:center;z-index:6}
.pk-fx .fx-skip{z-index:7}
.pk-sparks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:6}
.pk-glow{position:absolute;left:50%;top:46%;width:min(130vw,820px);aspect-ratio:1;margin:calc(min(130vw,820px)/-2) 0 0 calc(min(130vw,820px)/-2);border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--g) 70%,var(--c-gold-96-2)) 0%,color-mix(in srgb,var(--g) 38%,transparent) 26%,color-mix(in srgb,var(--g) 12%,transparent) 46%,transparent 66%);opacity:0;pointer-events:none}
.pk-rays{position:absolute;left:50%;top:46%;aspect-ratio:1;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--g) 60%,color-mix(in srgb,var(--p-gold) 60%,var(--p-white))) 0deg 3deg,transparent 3deg 15deg);opacity:0;mix-blend-mode:screen;pointer-events:none}
.pk-fx[data-grade="LR"] .pk-rays{background:repeating-conic-gradient(from 0deg,var(--c-red-64) 0deg 3deg,transparent 3deg 12deg,var(--c-gold-84) 12deg 15deg,transparent 15deg 24deg,var(--p-green) 24deg 27deg,transparent 27deg 36deg,color-mix(in srgb,var(--p-blue) 60%,var(--p-white)) 36deg 39deg,transparent 39deg 48deg,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)) 48deg 51deg,transparent 51deg 60deg)}
.pk-beam{position:absolute;left:50%;bottom:50%;width:min(50vw,240px);height:62vh;margin-left:calc(min(50vw,240px)/-2);background:linear-gradient(to top,var(--c-gold-98) 0%,color-mix(in srgb,var(--g) 75%,color-mix(in srgb,var(--p-gold) 60%,var(--p-white))) 18%,color-mix(in srgb,var(--g) 25%,transparent) 60%,transparent 100%);filter:blur(10px);-webkit-mask:linear-gradient(90deg,transparent,var(--c-black) 30%,var(--c-black) 70%,transparent);mask:linear-gradient(90deg,transparent,var(--c-black) 30%,var(--c-black) 70%,transparent);transform-origin:50% 100%;opacity:0;pointer-events:none;mix-blend-mode:screen;z-index:1}
.pk-flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 44%,var(--c-orange-98) 0%,color-mix(in srgb,var(--g) 55%,var(--c-gold-96-2)) 22%,transparent 68%);opacity:0;pointer-events:none;mix-blend-mode:screen;z-index:5}
.pk-ring{--rc:var(--c-white);position:absolute;width:110px;height:110px;border-radius:50%;border:2px solid var(--c-gold-98);box-shadow:0 0 18px 4px var(--rc),inset 0 0 18px 4px var(--rc);pointer-events:none;z-index:5}
.pk-pack{position:absolute;left:50%;top:50%;width:min(58vw,270px);aspect-ratio:2/3;margin:calc(min(58vw,270px)*-.75) 0 0 calc(min(58vw,270px)/-2);z-index:2;transform-style:preserve-3d;touch-action:none}   /* no filter here: it would flatten the 3D edges */
.pk-pack img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.pk-body{clip-path:inset(10.5% 11% 4.5% 11% round 0 0 6px 6px)}
.pk-edge{position:absolute;top:4%;bottom:4.5%;width:9px;transform-origin:0 50%;transform:rotateY(90deg);background:linear-gradient(180deg,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),color-mix(in srgb,var(--p-g-ssr) 80%,var(--p-ink)) 30%,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 60%,color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink)));pointer-events:none}
.pk-edge.l{left:11%}.pk-edge.r{left:89%}
.pk-gloss{position:absolute;top:4%;bottom:4.5%;left:11%;right:11%;pointer-events:none;mix-blend-mode:screen;background:linear-gradient(105deg,transparent 30%,color-mix(in srgb,var(--c-gold-96-2) 38%,transparent) 46%,color-mix(in srgb,var(--c-white) 10%,transparent) 52%,transparent 66%) 0 0/260% 100% no-repeat}
.pk-reflect{top:91%!important;transform:scaleY(-1);clip-path:inset(10.5% 11% 4.5% 11%);opacity:.32;-webkit-mask:linear-gradient(to top,var(--c-black) 0%,transparent 32%);mask:linear-gradient(to top,var(--c-black) 0%,transparent 32%);pointer-events:none}   /* the art has a dark backdrop around the pack: crop to the pack itself */
.pk-top{clip-path:inset(3.6% 11% 89.3% 11%);transform-origin:80% 10%}
.pk-seam{position:absolute;left:11%;right:11%;top:10.2%;height:4px;border-radius:4px;background:var(--c-gold-98);box-shadow:0 0 10px 3px color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),0 0 30px 10px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 60%,var(--p-white)) 70%,transparent);   /* one colour for every grade: the seam must not hint the result */opacity:0;transform:scaleX(.2)}
.pk-hint{position:absolute;left:0;right:0;bottom:max(26px,4vh);margin:0;text-align:center;font-size:13px;font-weight:800;letter-spacing:.12em;color:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));opacity:0;z-index:6}
.pk-row{--cw:min(29vw,180px);position:absolute;left:0;right:0;top:46%;margin-top:calc(var(--cw)*-2/3);display:flex;justify-content:center;gap:clamp(10px,3vw,26px);perspective:1100px;z-index:3;pointer-events:none}
.pk-card{position:relative;width:var(--cw);aspect-ratio:3/4;transform-style:preserve-3d}
.pk-stage{position:absolute;left:50%;top:44%;z-index:4;perspective:1200px;pointer-events:none}
.pk-big{--cw:min(64vw,300px,calc((100dvh - 220px)*.75));position:absolute;left:calc(var(--cw)/-2);top:calc(var(--cw)*-2/3)}
.pk-big .pk-info b{font-size:clamp(17px,5.2vw,23px)}.pk-big .pk-info small{font-size:clamp(12px,3.4vw,14px)}
.pk-big .pk-grade{top:10px;left:10px;padding:3px 10px;font-size:14px}.pk-big .pk-front em{top:10px;right:10px;padding:3px 8px;font-size:12px}
.pk-big .pk-face{border-radius:16px}.pk-big .pk-front{border-width:4px}
.pk-face{position:absolute;inset:0;border-radius:12px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.pk-back{--glow:0px;display:grid;place-items:center;color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink));background:radial-gradient(circle at 50% 36%,color-mix(in srgb,var(--p-blue) 80%,var(--p-ink)) 0%,var(--p-navy) 52%,color-mix(in srgb,var(--p-navy) 55%,var(--p-ink)) 100%);box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--p-navy) 55%,var(--p-ink)),inset 0 0 0 5px color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)),inset 0 0 0 6px color-mix(in srgb,var(--p-navy) 55%,var(--p-ink)),inset 0 0 0 7px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 45%,transparent),0 0 var(--glow) calc(var(--glow)/4) var(--c),0 10px 24px color-mix(in srgb,var(--c-black) 55%,transparent)}
.pk-back svg{width:52%;filter:drop-shadow(0 0 6px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 50%,transparent))}
.pk-back::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,color-mix(in srgb,var(--c-white) 16%,transparent) 48%,transparent 60%)}
.pk-front{transform:rotateY(180deg);border:3px solid transparent;background:linear-gradient(var(--c-navy-6),var(--c-navy-6)) padding-box,linear-gradient(140deg,var(--m1) 0%,var(--m2) 38%,var(--m1) 62%,var(--m2) 100%) border-box;box-shadow:0 0 18px 2px color-mix(in srgb,var(--c) 45%,transparent),0 12px 28px color-mix(in srgb,var(--c-black) 55%,transparent)}

.pk-front img{position:absolute;inset:0 0 26% 0;width:100%;height:74%;object-fit:cover;object-position:50% 18%;border-radius:9px 9px 0 0}
.pk-front::before{content:"";position:absolute;inset:0 0 26% 0;z-index:1;background:linear-gradient(to bottom,transparent 55%,color-mix(in srgb,var(--c-navy-6) 90%,transparent)),linear-gradient(140deg,color-mix(in srgb,var(--c) 22%,transparent),transparent 45%);pointer-events:none}
.pk-info{position:absolute;left:0;right:0;bottom:0;height:26%;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:0 8px;text-align:center;background:linear-gradient(to top,var(--c-navy-6),var(--c-navy-11))}
.pk-info b{font-size:clamp(12px,3.4vw,16px);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--c-gold-98)}
.pk-info small{font-size:clamp(9px,2.5vw,11px);color:var(--c-slate-74);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pk-grade{position:absolute;top:6px;left:6px;z-index:2;padding:2px 7px;border-radius:5px;background:linear-gradient(140deg,var(--m1),var(--m2) 50%,var(--m1));color:var(--c-white);text-shadow:0 1px 2px color-mix(in srgb,var(--c-black) 45%,transparent);font-size:11px;font-weight:900;letter-spacing:.06em;box-shadow:0 1px 4px color-mix(in srgb,var(--c-black) 40%,transparent)}
.pk-card[data-grade="SSR"] .pk-grade,.pk-card[data-grade="N"] .pk-grade{color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));text-shadow:0 1px 0 color-mix(in srgb,var(--c-white) 40%,transparent)}

.pk-front em{position:absolute;top:6px;right:6px;z-index:2;padding:2px 6px;border-radius:5px;background:var(--c-gold-96-2);color:color-mix(in srgb,var(--p-g-ssr) 55%,var(--p-ink));font-size:10px;font-weight:900;font-style:normal}
.pk-shine{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(115deg,transparent 28%,color-mix(in srgb,var(--c-gold-98) 50%,transparent) 44%,color-mix(in srgb,var(--c) 45%,transparent) 50%,transparent 64%);mix-blend-mode:screen;transform:translateX(-130%)}
.pk-card.foil .pk-shine{animation:pk-shine 2.6s .1s ease-in-out infinite}
.pk-card[data-grade="LR"].foil .pk-shine{background:linear-gradient(115deg,transparent 25%,color-mix(in srgb,var(--c-red-64) 40%,transparent) 38%,color-mix(in srgb,var(--c-gold-84) 50%,transparent) 44%,color-mix(in srgb,var(--p-green) 40%,transparent) 50%,color-mix(in srgb,color-mix(in srgb,var(--p-blue) 60%,var(--p-white)) 40%,transparent) 56%,transparent 68%)}
@keyframes pk-shine{0%{transform:translateX(-130%)}55%,100%{transform:translateX(130%)}}


.fly-coin{border-radius:0;background:none;box-shadow:none;color:color-mix(in srgb,var(--p-gold) 60%,var(--p-white));filter:drop-shadow(0 0 4px color-mix(in srgb,var(--p-gold) 60%,transparent))}
.fly-coin .gi{display:block;width:100%;height:100%}   /* line coin icon, no drawn ball */


/* Notification dots: one style for the menu and header (red with a white ring, readable at a glance) */
.notification-dot,.mail-dot{width:8px!important;height:8px!important;border-radius:50%;background:var(--p-red)!important;box-shadow:0 0 0 2px var(--c-white)}
.notification-dot{top:8px!important;left:calc(50% + 8px)!important}
.mail-dot{top:4px!important;right:4px!important}


/* pack opening tiers: dark room (UR/LR), rainbow light pillars and the LEGEND word (LR) */
.pk-dim{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--c-black) 55%,transparent),var(--c-black) 75%);opacity:0;pointer-events:none;z-index:0}
.pk-pillars{position:absolute;inset:0;display:flex;justify-content:space-evenly;opacity:0;pointer-events:none;mix-blend-mode:screen;z-index:1}
.pk-pillars i{width:9vw;max-width:70px;height:100%;background:linear-gradient(to top,transparent,var(--pc) 35%,transparent 90%);opacity:.7;animation:pk-pillar 2.4s ease-in-out infinite alternate}
.pk-pillars i:nth-child(1){--pc:var(--c-red-64)}.pk-pillars i:nth-child(2){--pc:var(--c-gold-84);animation-delay:.3s}.pk-pillars i:nth-child(3){--pc:var(--p-green);animation-delay:.6s}.pk-pillars i:nth-child(4){--pc:color-mix(in srgb,var(--p-blue) 60%,var(--p-white));animation-delay:.9s}.pk-pillars i:nth-child(5){--pc:color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white));animation-delay:1.2s}
@keyframes pk-pillar{to{opacity:.35;transform:scaleX(.6)}}
.pk-legend{position:absolute;left:0;right:0;top:max(48px,7vh);display:flex;justify-content:center;gap:clamp(4px,1.6vw,12px);pointer-events:none;z-index:6}
.pk-legend b{font-size:clamp(34px,11vw,72px);font-weight:900;letter-spacing:.02em;background:linear-gradient(180deg,var(--c-gold-96) 0%,var(--p-gold) 45%,var(--p-g-ssr) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px color-mix(in srgb,var(--p-gold) 60%,transparent)) drop-shadow(0 3px 0 color-mix(in srgb,var(--c-black) 45%,transparent))}

/* pack opening light effects: lens flare, sigil, comets and glass shards */
.pk-flare{--fc:var(--c-white);position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none;z-index:6}
.pk-flare i{position:absolute;left:-60vw;top:-2px;width:120vw;height:4px;border-radius:4px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--fc) 60%,transparent) 30%,var(--c-white) 50%,color-mix(in srgb,var(--fc) 60%,transparent) 70%,transparent);filter:blur(1.5px);box-shadow:0 0 18px 4px color-mix(in srgb,var(--fc) 55%,transparent);mix-blend-mode:screen;transform:scaleX(0);opacity:0}
.pk-flare b{position:absolute;left:-60px;top:-60px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,var(--c-white) 0%,color-mix(in srgb,var(--fc) 70%,transparent) 22%,transparent 62%);mix-blend-mode:screen;opacity:0}
.pk-sigil{position:absolute;left:50%;top:50%;width:300px;height:300px;pointer-events:none;z-index:2;overflow:visible;filter:drop-shadow(0 0 6px currentColor) drop-shadow(0 0 2px var(--c-white));opacity:0}
.pk-comet{position:absolute;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--c-white);box-shadow:0 0 14px 6px var(--cc),0 0 30px 12px color-mix(in srgb,var(--cc) 50%,transparent);pointer-events:none;z-index:5}
.pk-comet::after{content:"";position:absolute;right:50%;top:50%;width:160px;height:6px;margin-top:-3px;border-radius:6px;background:linear-gradient(90deg,transparent,var(--cc) 70%,var(--c-white));filter:blur(2px)}
.pk-shard{z-index:5;pointer-events:none;box-shadow:inset 0 0 0 1px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 32%,var(--p-white)) 50%,transparent)!important}

/* pack opening performance: moving light layers get their own GPU layer and no backdrop blending; shards skip filters */
.pk-rays,.pk-pillars,.pk-beam{mix-blend-mode:normal;will-change:transform,opacity}
.pk-glow,.pk-pillars i,.pk-flash,.pk-comet,.pk-shard,.pk-sigil{will-change:transform,opacity}
.pk-shard svg{filter:none}

/* legend fusion v2 (fuseOpen): failure caption under the returned card */
.fz2-fail{position:absolute;left:0;right:0;bottom:max(70px,11vh);margin:0;display:grid;gap:4px;text-align:center;z-index:6;pointer-events:none}
.fz2-fail strong{font-size:22px;font-weight:700;color:color-mix(in srgb,var(--p-red) 32%,var(--p-white))}.fz2-fail small{font-size:14px;color:var(--c-gold-96-2)}.fz2-fail span{font-size:12px;color:var(--c-slate-74)}
/* LR lag: pillars soften with a mask instead of a blur filter, rays a third of the area, letters on their own layer */
.pk-pillars i{filter:none;-webkit-mask:linear-gradient(90deg,transparent,var(--c-black) 40%,var(--c-black) 60%,transparent);mask:linear-gradient(90deg,transparent,var(--c-black) 40%,var(--c-black) 60%,transparent);will-change:transform,opacity}
.pk-rays{width:92vmax;margin:-46vmax 0 0 -46vmax;-webkit-mask:radial-gradient(circle,var(--c-black) 0%,color-mix(in srgb,var(--c-black) 55%,transparent) 26%,transparent 70%);mask:radial-gradient(circle,var(--c-black) 0%,color-mix(in srgb,var(--c-black) 55%,transparent) 26%,transparent 70%)}
.pk-legend b{will-change:transform,opacity}

/* home hub (Compya-style): bright stadium hero with the club and the ace card, four big shortcut tiles */
.hub{display:grid;gap:14px;max-width:1080px;margin:0 auto}
.hub-hero{min-height:clamp(250px,52vw,380px);box-shadow:0 10px 26px color-mix(in srgb,var(--c-navy-15) 18%,transparent)}
.hub-hero::after{pointer-events:none}
.hub-club{position:absolute;left:14px;top:14px;z-index:1;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border-radius:16px;background:color-mix(in srgb,var(--c-white) 92%,transparent);box-shadow:0 4px 14px color-mix(in srgb,var(--c-navy-15) 16%,transparent);max-width:calc(100% - clamp(118px,30vw,170px) - 46px)}
.hub-club .team-logo{width:46px;height:46px;object-fit:contain}
.hub-club div{display:grid;min-width:0}.hub-club small{font-size:11px;color:var(--muted);font-weight:700}
.hub-club b{font-size:17px;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hub-club span{font-size:12px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hub-club small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:480px){.hub-club{padding:6px 10px 6px 6px;gap:7px}.hub-club .team-logo{width:34px;height:34px}.hub-club b{font-size:15px}.hub-club span{font-size:11px}}.hub-club strong{font-size:15px;color:var(--blue)}
.hub-ace{position:absolute;right:16px;bottom:14px;z-index:1;width:clamp(118px,30vw,170px);border-radius:14px;text-align:left;}
.hub-tiles{display:grid;grid-template-columns:repeat(2,1fr);}
@media (min-width:900px){.hub-tiles{grid-template-columns:repeat(4,1fr)}}
.hub-tile{justify-items:start;gap:2px;cursor:pointer}
.hub-tile .hub-art{width:100%!important;height:clamp(84px,22vw,120px)!important;margin:0 0 8px;border-radius:0!important;border:0;box-shadow:none;clip-path:none;-webkit-mask:none;mask:none}
.hub-tile b{padding:0 14px;}.hub-tile span{padding:0 14px;}

.hub-tile .notification-dot{top:10px!important;left:auto!important;}
.hub-back{margin-bottom:4px}
.hub-club .hub-ovr{color:var(--muted);font-weight:700}

/* shop (Compya-style): light currency bar, product tiles, purchase sheet */
.wallet.shop-wallet{background:var(--c-white);color:var(--navy);border:1px solid var(--line);box-shadow:0 2px 8px color-mix(in srgb,var(--c-navy-15) 6%,transparent);padding:10px 16px;gap:10px;flex-wrap:wrap}
.shop-wallet div{flex-direction:row!important;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--paper)}
.shop-wallet span{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--muted);font-weight:700}.shop-wallet span .gi{width:16px;height:16px;color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink))}
.shop-wallet b{font-size:16px}
.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
@media (min-width:900px){.shop-grid{grid-template-columns:repeat(6,1fr);gap:12px}}
.shop-item{position:relative;display:grid;justify-items:center;align-content:start;gap:4px;padding:0 6px 10px;cursor:pointer;min-width:0;text-align:center}
.shop-item.selected{border-color:var(--blue);box-shadow:0 0 0 2px color-mix(in srgb,var(--c-blue-41) 18%,transparent)}
.shop-tag{justify-self:stretch;margin:0 -6px 6px;padding:4px 2px;background:var(--c-blue-96);color:var(--navy);font-size:11px;font-weight:600}
.shop-tag.ghost{color:var(--muted);font-weight:600}
.shop-item .foil-pack.small{width:62%;height:auto;aspect-ratio:2/3;object-fit:contain}
.shop-item b{font-size:13px;line-height:1.25;color:var(--navy);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.shop-price{display:inline-flex;align-items:center;gap:3px;font-style:normal;font-size:14px;font-weight:700;color:var(--navy)}
.shop-price .gi{width:15px;height:15px;color:color-mix(in srgb,var(--p-gold) 80%,var(--p-ink))}
.shop-price.short{color:var(--danger)}
.shop-free{color:var(--p-g-sr);font-weight:700}
.shop-item .notification-dot{position:absolute;top:30px!important;left:auto!important;right:8px}
.shop-sheet .pack-hero{background:var(--c-white);color:var(--navy);box-shadow:none;border:0;padding:0}
.shop-sheet .pack-hero h2,.shop-sheet .pack-hero .eyebrow{color:var(--navy)}
.shop-sheet .pack-hero p,.shop-sheet .pack-hero small,.shop-sheet .pack-probability,.shop-sheet .pack-probability span,.shop-sheet .pack-probability small{color:var(--muted)}
.shop-sheet .pack-probability b,.shop-sheet .reveal-pref span{color:var(--navy)}
.shop-sum{display:grid;gap:6px;margin:0 0 12px;padding:10px 14px;border-radius:12px;background:var(--paper)}
.shop-sum div{display:flex;justify-content:space-between;align-items:center}.shop-sum dt{font-size:13px;color:var(--muted)}.shop-sum dd{margin:0;font-size:15px;font-weight:700;color:var(--navy)}
.shop-sum dd.short{color:var(--danger)}
.shop-sheet .pack-odds{margin-top:12px}
.shop-sheet .pack-odds summary::before{content:none}
.shop-sheet .foil-pack{max-height:min(34vh,260px);width:auto}.shop-sheet .pack-options{margin:10px 0}.shop-sheet .pack-hero .shop-sum{margin:12px 0}
.shop-sheet .pack-hero .shop-sum,.shop-sheet .pack-hero .pack-options,.shop-sheet .pack-hero .btn{align-self:stretch;width:auto}

/* audit fixes 1 (2026-10-23): press feedback on every button (the independent scale property, so layout transforms
   and translate-centred slots keep working; instant like a physical button, nothing to interrupt); disabled .btn in
   fill, ink and cursor instead of opacity alone; the danger red one step darker for 4.5:1 on white; no overshoot
   on header state changes (celebrations keep their --pop); exits leave on a strong ease-out instead of ease-in. */
button:active:not(:disabled),.btn:active:not(:disabled),[role="button"]:active{scale:.97}
:where(main:not(.match-page),dialog) .btn:disabled:not(.pack-repeat-footer *){opacity:1!important;background:var(--c-gray-91)!important;color:var(--c-slate-56)!important;border-color:var(--c-gray-88)!important;cursor:not-allowed;box-shadow:none}   /* !important: older .btn:not(...) rules outrank it */
:is(.button,.btn).danger{background:var(--p-red)}
.header-tools button.bump{animation-timing-function:cubic-bezier(.23,1,.32,1)}
.cel.out,.cel.out .cel-band,html.ui-v3 .cel.out,.legend-fx.out,.rare-fx.out,.fuse-fx.out{animation-timing-function:cubic-bezier(.23,1,.32,1)}

/* audit fixes 2 (2026-10-23): no thick left stripes on boxes: the accent moves to a thin all-round edge (the colour
   still tells the kind: field position, AI style, LR/UR power, call, skill, special tactic); small labels keep their
   case but drop the wide tracking; horizontal overflow is clipped on html and body (clip keeps sticky docks). */
.selected-detail.decision-guide{border:1px solid color-mix(in srgb,var(--blue) 45%,var(--line))}
.field-library-card{border-left:1px solid color-mix(in srgb,var(--field-tone) 70%,var(--c-white));border-color:color-mix(in srgb,var(--field-tone) 55%,var(--c-white))}
.ai-style-card{border:1px solid color-mix(in srgb,var(--style-accent) 55%,var(--c-white))}
.lr-power{border:1px solid color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white))}
.ur-power{border:1px solid color-mix(in srgb,var(--p-red) 60%,var(--p-white));border-left-width:1px}
html.ui-v3 .bc-impact .bc-bar{border:2px solid var(--call,var(--p-green))}
.skill-receipt{border:1px solid color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white))}
.special-card{border-left-width:1px}
.review-label,.eyebrow,.kicker,.player-art span,.reveal-label,.result-call>span,.in-deck,.wallet span,.pack-object span,.login-brand p,.guide-hero>span,.sheet-header span,.final-call>span,.note-section-title span,.walkoff-banner small,.league-hero span,.postseason-banner span,.bulk-hero>span,.overall-badge small,.clutch-hero small,.clutch-burst>small,.sim-moments>span,.ps-stage-head span,.bc-bar small,.cel-label,.cel-hint,html.ui-v3 .plate-result .result-call>span,.pk-hint,.pack-result .pr-stage>.eyebrow{letter-spacing:.01em}
html,body{overflow-x:clip}
html.ui-v3 .match-shell .action-dock .selection-copy b{overflow-x:clip}
dialog.fx-dialog{width:100%}   /* 100vw counts the scrollbar and overflows */

/* emil review (2026-10-23): the match is seen dozens of times a game, so its per-turn motion is short and never
   makes the result wait; big moments (home run, walk-off) keep their longer beat. */
html body .phase-arrive .hand-head,html body .phase-arrive .prepare-panel,html body .phase-arrive .result-animation{animation-duration:.18s;animation-delay:0s}
html body .phase-arrive .revealed>div:first-child,html body .phase-arrive .revealed>div:last-child{animation-duration:.2s}
html body .phase-arrive .duel-face{animation-duration:.24s}
html body .phase-arrive .phase-strip .active{animation-duration:.3s}
html body .phase-arrive .result-call{animation-duration:.2s;animation-delay:0s}
html body .phase-arrive .result-animation{animation-delay:.08s}
html body .phase-arrive .result-double .result-call{animation-duration:.3s}
html body .phase-arrive .result-homer .result-call{animation-duration:.5s}
/* the winning duel card: the gold edge at once and a short settle, no animated box-shadow (it repaints each frame) */
html body .phase-arrive .duel-card.won{animation:duel-won-settle .22s cubic-bezier(.23,1,.32,1);box-shadow:0 0 0 2px color-mix(in srgb,var(--p-gold) 60%,var(--p-white)),0 6px 18px color-mix(in srgb,color-mix(in srgb,var(--p-gold) 80%,var(--p-ink)) 25.1%,transparent)}
@keyframes duel-won-settle{from{scale:.97}to{scale:1}}
/* shimmer and holo only where one card is shown big (detail, home ACE, pack result) or under the pointer; in grids of
   many cards they stay still */
.player-card.pc .pc-fx,.player-card[data-grade="LR"],.player-card[data-grade] .player-card-art::after{animation-play-state:paused}
:is(dialog,.hub-ace,.pack-result) .player-card.pc .pc-fx,:is(dialog,.hub-ace,.pack-result) .player-card[data-grade="LR"],:is(dialog,.hub-ace,.pack-result) .player-card[data-grade] .player-card-art::after{animation-play-state:running}
@media (hover:hover) and (pointer:fine){.player-card.pc:hover .pc-fx,.player-card[data-grade="LR"]:hover,.player-card[data-grade]:hover .player-card-art::after{animation-play-state:running}}
/* hover lifts only for a real hovering pointer (a tap would leave them stuck on phones) */
@media (hover:none),(pointer:coarse){:is(.button,.btn).primary:hover,.player-card[data-grade]:hover{transform:none}html.ui-v3 .tactic-card:not(:disabled):hover{translate:none}}
/* one primary action per match turn: the main button full width on top, exchange and quick play beside each other */
.match-shell .dock-buttons:has(.quick-prepare) .primary{grid-column:1/-1;order:-1;min-height:48px;font-size:14px}
.match-shell .dock-buttons:has(.quick-prepare) .quick-prepare{grid-column:auto;min-height:44px}
/* home ACE: a player card on the stadium, one press style for the tiles (the shared scale) */
.hub-ace{background:none;border:0;padding:0;box-shadow:none;overflow:visible;cursor:auto}
.hub-ace .player-card{width:100%;box-shadow:0 10px 24px color-mix(in srgb,var(--c-navy-15) 35%,transparent)}
.hub-tile:active{transform:none}
/* home tile art toned toward the stadium illustration (softer, warmer) */


/* field mini cards (2026-10-23): deck slots and the library show the player like the collection card */
:is(.field-slot,.field-library-card){--m1:var(--c-slate-56);--bg1:var(--c-gray-96);--bg2:var(--c-slate-82)}
:is(.field-slot,.field-library-card)[data-grade="R"]{--m1:var(--p-g-r);--bg1:var(--c-blue-96);--bg2:color-mix(in srgb,var(--p-g-r) 32%,var(--p-white))}
:is(.field-slot,.field-library-card)[data-grade="SR"]{--m1:var(--p-g-sr);--bg1:var(--c-purple-94);--bg2:color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white))}
:is(.field-slot,.field-library-card)[data-grade="SSR"]{--m1:var(--p-g-ssr);--bg1:color-mix(in srgb,var(--p-gold) 32%,var(--p-white));--bg2:var(--p-gold)}
:is(.field-slot,.field-library-card)[data-grade="UR"]{--m1:var(--p-ink);--bg1:color-mix(in srgb,var(--p-red) 60%,var(--p-white));--bg2:var(--p-g-ur)}
.field-slot .field-portrait,.field-library-card>img{position:relative;overflow:hidden;border-radius:6px;background:radial-gradient(ellipse 70% 55% at 50% 40%,color-mix(in srgb,var(--c-white) 70%,transparent),transparent 70%),linear-gradient(170deg,var(--bg1) 0%,var(--bg2) 55%,var(--m1) 100%)}
.field-slot[data-grade="LR"] .field-portrait,.field-library-card[data-grade="LR"]>img{background-blend-mode:normal}
.make-deck .field-slot{grid-template-rows:12px 50px 15px 20px}
.make-deck .roster-field>.field-slot{height:110px}
.make-deck .field-reserves .field-slot{height:112px;min-height:112px}

.make-deck .field-slot>.field-portrait{display:block;height:50px;width:100%}
.make-deck .field-portrait>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 2px 3px color-mix(in srgb,var(--c-black) 30%,transparent))}
/* cut-outs keep a card-like figure size in wide reserve slots (head and torso, never just a cap) */
.make-deck .field-portrait>img[src*="/assets/cut-"]{inset:0 auto auto 50%;width:76px;height:auto;translate:-50% 0}
.make-deck .field-portrait .compact-ovr{position:absolute;right:2px;top:2px;z-index:1}
.field-library-card>img{width:52px;height:68px;flex-shrink:0;object-fit:contain;object-position:50% 100%}
.field-library-card>img[src*="/assets/cut-"]{object-fit:cover;object-position:50% 4%}
/* LR cut-out: deep base with a prism ray burst, like the UR tier's drama but every colour */

.player-card.pc.cut[data-grade="LR"]::before{-webkit-mask:radial-gradient(ellipse 95% 85% at 50% 40%,var(--c-black) 35%,color-mix(in srgb,var(--c-black) 40%,transparent) 95%);mask:radial-gradient(ellipse 95% 85% at 50% 40%,var(--c-black) 35%,color-mix(in srgb,var(--c-black) 40%,transparent) 95%)}


/* LR purple (2026-10-26): deep royal purple with violet rays and gold sparkles; the rainbow stays on the frame and badge */

.player-card.pc.cut[data-grade="LR"]{background-blend-mode:normal}




/* LR purple frame (2026-10-26): frame, grade badges and deck tone in the same purple as the backdrop */



.player-card.pc[data-grade="LR"] .pc-grade,.pk-card[data-grade="LR"] .pk-grade{background:linear-gradient(90deg,color-mix(in srgb,var(--p-g-sr) 60%,var(--p-white)),var(--p-g-sr) 50%,var(--p-g-sr));color:var(--c-white);text-shadow:0 1px 0 color-mix(in srgb,var(--c-black) 35%,transparent)}




/* cut photo below the OVR (2026-10-26): the figure starts under the OVR/position/grade corner, never behind it */
.player-card.pc.cut .pc-photo{top:17%;height:83%;object-fit:contain;object-position:50% 0}

/* matte grade badge (2026-10-26): one flat grade colour, a dark outline, no gloss or glow */
.player-card.pc .pc-grade,.player-card.pc[data-grade] .pc-grade{background:var(--m1);color:var(--c-white);text-shadow:none;box-shadow:none;border:.5cqw solid var(--p-ink)}



/* LR emerald (2026-10-26): SR is purple, so LR is a deep emerald card with mint rays, an emerald frame and badge */






.player-card[data-grade="LR"]{box-shadow:0 6px 22px color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)) 33.3%,transparent),0 0 0 1px color-mix(in srgb,color-mix(in srgb,var(--p-green) 32%,var(--p-white)) 33.3%,transparent)}


.pk-card[data-grade="LR"] .pk-grade{text-shadow:none}
.grade-badge[data-grade="LR"],html.ui-v3 .grade-badge[data-grade="LR"]{text-shadow:none}




/* LR aura (2026-10-26): the top grade carries the most effects: slow emerald light beams turning behind the player,
   gold and mint sparkles rising, a double light sweep and a soft emerald glow round the card. Like the other card
   effects it moves only where one card is shown big or under the pointer, and never with reduced motion. */

.player-card.pc .pc-aura{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.player-card.pc .pc-aura::before{content:"";position:absolute;left:50%;top:40%;width:170%;aspect-ratio:1;translate:-50% -50%;-webkit-mask:radial-gradient(circle,var(--c-black) 12%,transparent 62%);mask:radial-gradient(circle,var(--c-black) 12%,transparent 62%);animation:lr-beams 16s linear infinite}
.player-card.pc .pc-aura::after{content:"";position:absolute;inset:0;opacity:.85;animation:lr-rise 7s linear infinite}
.player-card.pc[data-grade="LR"] .pc-fx{mix-blend-mode:screen;animation-duration:2.6s}
@keyframes lr-beams{to{rotate:360deg}}
@keyframes lr-rise{from{background-position:3cqw 0,11cqw 9cqw,6cqw 15cqw}to{background-position:3cqw -42cqw,11cqw -45cqw,6cqw -38cqw}}
.player-card.pc .pc-aura::before,.player-card.pc .pc-aura::after{animation-play-state:paused}
:is(dialog,.hub-ace,.pack-result) .player-card.pc .pc-aura::before,:is(dialog,.hub-ace,.pack-result) .player-card.pc .pc-aura::after{animation-play-state:running}
@media (hover:hover) and (pointer:fine){.player-card.pc:hover .pc-aura::before,.player-card.pc:hover .pc-aura::after{animation-play-state:running}}
@media (prefers-reduced-motion:reduce){.player-card.pc .pc-aura::before,.player-card.pc .pc-aura::after{animation:none}}
html.reduced-motion .player-card.pc .pc-aura::before,html.reduced-motion .player-card.pc .pc-aura::after{animation:none}


/* LR emerald soft (2026-10-26): a lighter, clean emerald, no gold; mint and white light only */
[data-grade="LR"]{--rarity:var(--p-g-lr);--rarity-rgb:60,199,154}
.player-card.pc[data-grade="LR"]{--m1:var(--p-g-lr);background:radial-gradient(ellipse 66% 50% at 50% 40%,color-mix(in srgb,var(--p-g-lr) 32%,var(--p-white)),transparent 70%),linear-gradient(170deg,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 0%,var(--p-g-lr) 50%,color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)) 100%);box-shadow:0 0 0 1px color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 16%,var(--p-white)) 60%,transparent),0 0 16px color-mix(in srgb,var(--p-g-lr) 40%,transparent),0 8px 24px color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)) 33.3%,transparent)}
.player-card.pc.cut[data-grade="LR"]{background:radial-gradient(ellipse 60% 46% at 50% 40%,color-mix(in srgb,color-mix(in srgb,var(--p-green) 8%,var(--p-white)) 75%,transparent),transparent 70%),linear-gradient(170deg,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 0%,var(--p-g-lr) 48%,color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)) 100%)}
.player-card.pc.cut[data-grade="LR"]::before{background:radial-gradient(circle,var(--c-white) 0 .55cqw,transparent .75cqw) 1cqw 3cqw/9cqw 12cqw,radial-gradient(circle,color-mix(in srgb,var(--p-g-lr) 16%,var(--p-white)) 0 .4cqw,transparent .6cqw) 5cqw 8cqw/12cqw 15cqw,repeating-conic-gradient(from 0deg at 50% 38%,color-mix(in srgb,color-mix(in srgb,var(--p-green) 16%,var(--p-white)) 38%,transparent) 0 3deg,transparent 3deg 9deg),linear-gradient(118deg,transparent 0 56%,color-mix(in srgb,color-mix(in srgb,var(--p-green) 8%,var(--p-white)) 55%,transparent) 56% 59%,transparent 59% 63%,color-mix(in srgb,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 35%,transparent) 63% 70%,transparent 70%)}
.player-card[data-grade="LR"]{--frame:conic-gradient(from var(--holo),color-mix(in srgb,var(--p-green) 16%,var(--p-white)),color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)),var(--p-g-lr),color-mix(in srgb,var(--p-g-lr) 32%,var(--p-white)),var(--p-g-lr),color-mix(in srgb,var(--p-green) 16%,var(--p-white)));border-color:var(--p-g-lr)}
.player-card.pc[data-grade="LR"]::after{background:linear-gradient(140deg,color-mix(in srgb,var(--p-green) 16%,var(--p-white)),color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 30%,var(--p-g-lr) 55%,color-mix(in srgb,var(--p-g-lr) 32%,var(--p-white)) 78%,var(--p-g-lr))}
.player-card.pc[data-grade="LR"] .pc-grade{background:var(--p-g-lr);color:var(--c-white)}
.player-card.pc.cut[data-grade="LR"] .pc-name,.player-card.pc.cut[data-grade="LR"] .pc-ovr b{text-shadow:0 0 2cqw color-mix(in srgb,var(--p-g-lr) 55%,transparent)}
.player-card.pc[data-grade="LR"] .pc-fx{background:linear-gradient(105deg,transparent 30%,color-mix(in srgb,color-mix(in srgb,var(--p-green) 16%,var(--p-white)) 45%,transparent) 37%,transparent 43%,transparent 50%,color-mix(in srgb,color-mix(in srgb,var(--p-green) 32%,var(--p-white)) 35%,transparent) 56%,transparent 64%)}
.player-card.pc .pc-aura::before{background:repeating-conic-gradient(from 0deg,color-mix(in srgb,color-mix(in srgb,var(--p-green) 16%,var(--p-white)) 26%,transparent) 0 5deg,transparent 5deg 20deg)}
.player-card.pc .pc-aura::after{background:radial-gradient(circle,var(--c-white) 0 .7cqw,transparent .9cqw) 3cqw 0/17cqw 21cqw,radial-gradient(circle,color-mix(in srgb,var(--p-green) 32%,var(--p-white)) 0 .5cqw,transparent .7cqw) 11cqw 9cqw/23cqw 27cqw,radial-gradient(circle,var(--c-white) 0 .35cqw,transparent .55cqw) 6cqw 15cqw/13cqw 19cqw}
.grade-badge[data-grade="LR"],html.ui-v3 .grade-badge[data-grade="LR"]{background:linear-gradient(120deg,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)),var(--p-g-lr) 55%,color-mix(in srgb,var(--p-g-lr) 80%,var(--p-ink)));color:var(--c-white);border-color:color-mix(in srgb,var(--p-g-lr) 80%,var(--p-ink))}
.pk-card[data-grade="LR"] .pk-grade{background:linear-gradient(90deg,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)),var(--p-g-lr));color:var(--c-white)}
.pk-card[data-grade="LR"] .pk-front{background:linear-gradient(var(--c-navy-6),var(--c-navy-6)) padding-box,linear-gradient(140deg,color-mix(in srgb,var(--p-green) 16%,var(--p-white)),color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)),var(--p-g-lr),color-mix(in srgb,var(--p-g-lr) 32%,var(--p-white)),var(--p-g-lr)) border-box}
.field-workspace [data-grade="LR"]{--field-tone:var(--p-g-lr);--field-tint:color-mix(in srgb,var(--p-g-lr) 8%,var(--p-white))}
.field-slot[data-grade="LR"] .field-portrait,.field-library-card[data-grade="LR"]>img{background:radial-gradient(ellipse 62% 48% at 50% 40%,color-mix(in srgb,color-mix(in srgb,var(--p-green) 8%,var(--p-white)) 70%,transparent),transparent 70%),linear-gradient(170deg,color-mix(in srgb,var(--p-g-lr) 60%,var(--p-white)) 0%,var(--p-g-lr) 55%,color-mix(in srgb,var(--p-g-lr) 55%,var(--p-ink)) 100%)}

/* premium polish (2026-10-27): quieter chrome and depth. Hairline borders and two-layer ink-tinted shadows instead
   of grey boxes, frosted top bar and nav, one icon colour in the nav (the active tab in ink, no gold cup), tighter
   headings and tabular numbers. Layout untouched. */
:root{--hair:1px solid color-mix(in srgb,var(--p-line) 80%,var(--p-white));
  --elev-1:0 1px 2px color-mix(in srgb,var(--p-ink) 5%,transparent),0 6px 18px color-mix(in srgb,var(--p-ink) 6%,transparent);
  --elev-2:0 2px 4px color-mix(in srgb,var(--p-ink) 6%,transparent),0 14px 34px color-mix(in srgb,var(--p-ink) 11%,transparent)}
h1,h2,h3{letter-spacing:-.02em}
.topbar{background:color-mix(in srgb,var(--p-white) 86%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:var(--hair)}
.product-nav{-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:none}


.product-nav [data-tab="season"] svg{color:inherit}
.panel,.hub-tile,.shop-item,.wallet{border:var(--hair);box-shadow:var(--elev-1)}
.hub-ace .player-card,.hub-hero{box-shadow:var(--elev-2)}
.btn.primary:not(:disabled){box-shadow:inset 0 1px 0 color-mix(in srgb,var(--p-white) 14%,transparent),0 6px 16px color-mix(in srgb,var(--p-ink) 16%,transparent)}
.pc-ovr b,.hub-ovr,.compact-ovr strong,.library-overall,.wallet b,.shop-price{font-variant-numeric:tabular-nums}

/* compya reference (2026-10-27): currency bar, segmented tabs, dock OVR ticks, buy row, unowned greyscale, goal rows,
   set track */
.currency-bar{flex-basis:100%;display:flex;gap:6px;padding:6px 0 0;overflow-x:auto;scrollbar-width:none}
.cur-item{display:flex;align-items:center;gap:5px;flex:1 0 auto;min-height:32px;padding:0 4px 0 10px;border-radius:999px;background:var(--p-bg);border:var(--hair);font-size:12px;color:var(--p-slate)}
.cur-item .gi{width:15px;height:15px;color:var(--p-navy)}
.cur-item b{margin-left:auto;color:var(--p-navy);font-variant-numeric:tabular-nums}
.cur-item button{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:0;background:var(--p-navy);color:var(--p-white);cursor:pointer}
.cur-item button .gi{width:13px;height:13px;color:inherit}
.topbar:has(.currency-bar){flex-wrap:wrap;height:auto;min-height:54px;padding-bottom:8px}
.topbar>.currency-bar{flex-direction:row;align-items:center;margin:0}
.topbar .cur-item b{font-size:13px;font-weight:800}
.topbar .cur-item span{font-size:12px;font-weight:600}
.tabs{display:flex;gap:4px;padding:4px;background:var(--p-bg);border:var(--hair);overflow-x:auto;scrollbar-width:none}
.tabs>button{flex:1 0 auto;white-space:nowrap;border:0;min-height:38px;padding:0 12px;background:transparent;color:var(--p-slate);font-weight:700;box-shadow:none}

.tabs>button.active::after,.tabs>button[aria-pressed="true"]::after{display:none}
.save-dock .dock-ovr{display:inline-flex;flex-direction:row;align-items:center;gap:6px;margin-left:12px}
.save-dock .dock-ovr small{display:inline;font-size:11px;color:var(--p-slate)}
.save-dock .dock-ovr b{font-size:22px;line-height:1;color:var(--p-navy)}
.dock-ovr b{font-size:22px;line-height:1;color:var(--p-navy);font-variant-numeric:tabular-nums}
.dock-ovr small{font-size:11px;color:var(--p-slate)}
.ovr-ticks{position:relative;width:56px;height:6px;border-radius:3px;background:var(--p-line);overflow:hidden}
.ovr-ticks i{position:absolute;inset:0 auto 0 0;background:var(--p-blue);border-radius:3px}
.buy-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.buy-row>.btn{width:100%;margin:0}
.player-card.pc.unowned{filter:grayscale(.9) brightness(.97)}
.player-card.pc.unowned:hover{filter:grayscale(.4)}
.goal-card:not(.has-art){display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:center}
.goal-card:not(.has-art)>h3{grid-area:title;margin:0}
.goal-card:not(.has-art)>.goal-progress{grid-area:progress;margin:0}
.goal-card:not(.has-art)>strong{grid-area:reward;justify-self:end;font-size:13px;color:var(--p-navy)}
.goal-card:not(.has-art)>.status-pill{grid-area:status;justify-self:end}
.goal-card.earned:not(.has-art)>.status-pill{background:var(--p-line);color:var(--p-slate)}
.set-track{position:relative;height:22px;margin:4px 2px 10px}
.set-track::before{content:"";position:absolute;left:0;right:0;top:4px;height:6px;border-radius:3px;background:var(--p-line)}
.set-track i{position:absolute;left:0;top:4px;height:6px;border-radius:3px;background:var(--p-blue)}
.set-track span{position:absolute;top:0;translate:-50% 0;display:grid;place-items:center;min-width:22px;height:14px;padding:0 4px;border-radius:7px;font-size:10px;font-weight:600;background:var(--p-white);border:1px solid var(--p-line);color:var(--p-slate)}
.set-track span.on{background:var(--p-navy);border-color:var(--p-navy);color:var(--p-white)}
.set-track span:last-child{translate:-100% 0}

/* bullpen roles (2026-10-27): role picker per reliever and role badges in the pitcher change sheet */
.bullpen-role-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:3px;border-radius:9px;background:var(--p-bg);border:var(--hair)}
.bullpen-role-pick button{min-width:0;min-height:30px;padding:0 2px;border:0;border-radius:7px;background:transparent;color:var(--p-slate);font-size:11.5px;font-weight:700;white-space:nowrap;letter-spacing:-.02em;cursor:pointer}
.bullpen-role-pick button.active{background:var(--p-navy);color:var(--p-white)}
.bullpen-role-pick button.role-closer.active{background:var(--p-red)}
.bullpen-role-badge{display:inline-block;margin-left:4px;padding:1px 6px;border-radius:6px;font-size:11px;font-style:normal;font-weight:600;background:var(--p-bg);color:var(--p-slate);border:var(--hair)}
.bullpen-role-badge.role-closer{background:var(--p-red);border-color:var(--p-red);color:var(--p-white)}
.bullpen-role-badge.role-setup{background:var(--p-navy);border-color:var(--p-navy);color:var(--p-white)}


/* compya deck (2026-10-27): deck screen rebuilt after Compya V26's lineup. Colours sampled from its frames:
   charcoal chrome, cobalt tabs/headers, cool light-grey surfaces, grey blurred stadium, dark grey column heads, crimson
   closer head, teal progress on a dark track. Grade colours live only on the cards. */
:root{--cp-chrome:#46474b;--cp-chrome-2:#3d3e42;--cp-blue:#183c88;--cp-blue-hi:#1a5dd0;--cp-tab:#dbdddc;--cp-tab-text:#7d8088;--cp-surface:#d8dbe1;--cp-tool:#e7e9ee;--cp-tool-line:#b5b8c0;--cp-ink:#2b2c30;--cp-muted:#6f7074;--cp-head:#3f4044;--cp-closer:#6a0512;--cp-teal:#30f9df;--cp-track:#494c4f;--cp-field:#c9ccd1}
.make-deck .deck-status{background:var(--cp-chrome);border:0;border-radius:6px}
.make-deck .deck-status .slot-switch button.active{background:var(--p-white);color:var(--cp-ink)}
/* main tabs: 타자 / 투수 / 보관 선수 */
.deck-main-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:14px 0 0;background:var(--cp-tab);border-radius:6px 6px 0 0;overflow:hidden}
.deck-main-tabs>button{min-height:44px;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--cp-tab-text);font-size:15px;font-weight:600;cursor:pointer}
.deck-main-tabs>button.active{background:var(--cp-blue);border-bottom-color:var(--cp-blue-hi);color:var(--p-white)}
/* sub bar: 타순 / 작전 / 강화 / 분석 */
.deck-sub-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--cp-chrome-2)}
.deck-sub-tabs>button{min-height:36px;border:0;border-right:1px solid color-mix(in srgb,var(--p-white) 10%,transparent);background:transparent;color:#c9cad0;font-size:13px;font-weight:700;cursor:pointer}
.deck-sub-tabs>button:last-child{border-right:0}
.deck-sub-tabs>button.active{background:#5a5b60;color:var(--p-white)}
/* tool row: mode on the left, square tool buttons on the right */
.make-deck .deck-tools{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px;margin:0;padding:8px;background:var(--cp-surface)}
.deck-tools-right,.make-deck .deck-tools .field-mode-switch,.make-deck .deck-tools .roster-mode-tabs{display:flex;flex-wrap:wrap;gap:4px;margin:0}
.make-deck .tool-btn,.make-deck .deck-tools .btn{min-height:30px;padding:0 10px;border:1px solid var(--cp-tool-line);border-radius:3px;background:var(--cp-tool);color:var(--cp-head);font-size:12px;font-weight:700;box-shadow:none;cursor:pointer}
.make-deck .deck-tools .btn.primary{background:var(--cp-blue);border-color:var(--cp-blue);color:var(--p-white)}
.make-deck .tool-btn:disabled{opacity:.45;cursor:default}
/* field: grey blurred stadium */
.make-deck .field-workspace{background:var(--cp-surface);padding:0 0 10px}
.make-deck .field-selection{margin:0;border-radius:0;background:color-mix(in srgb,var(--p-white) 55%,transparent);border:0}
.make-deck .roster-field{isolation:isolate;margin:0;border:0;border-radius:0;background:var(--cp-field)}
.make-deck .roster-field::after{content:"";position:absolute;inset:-14px;z-index:-1;}
.make-deck .roster-field:before{background:color-mix(in srgb,var(--p-white) 22%,transparent);border:2px solid color-mix(in srgb,var(--p-white) 75%,transparent)}
/* mini full-art card */
.make-deck .roster-field>.field-slot,.make-deck .field-reserves .field-slot{display:flex;flex-direction:column;align-items:center;gap:2px;height:auto;min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;grid-template-rows:none}
.make-deck .field-slot .field-position{padding:0 4px;border-radius:2px;background:color-mix(in srgb,var(--p-white) 80%,transparent);color:var(--cp-ink);font-size:10px;font-weight:600;line-height:14px}
.mc-art{--m1:var(--p-g-n);position:relative;display:block;width:100%;overflow:hidden;}
.mc-art[data-grade="R"]{--m1:var(--p-g-r)}.mc-art[data-grade="SR"]{--m1:var(--p-g-sr)}.mc-art[data-grade="SSR"]{--m1:var(--p-g-ssr)}.mc-art[data-grade="UR"]{--m1:var(--p-g-ur)}.mc-art[data-grade="LR"]{--m1:var(--p-g-lr)}
.mc-art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.mc-art>img.cut{top:16%;height:84%;object-fit:contain;object-position:50% 100%}
.mc-art>.compact-ovr{position:absolute;display:flex;flex-direction:column;align-items:flex-start;gap:0;background:none;color:var(--p-white);text-shadow:0 1px 2px #000c}

.mc-pos{position:absolute;right:2px;top:2px;z-index:1;padding:0 3px;border-radius:2px;background:#0008;color:var(--p-white);font-size:9px;font-weight:800;line-height:13px}
.mc-art>.awaken-inline{position:absolute;left:2px;bottom:2px;z-index:1;margin:0;min-height:14px;padding:0 3px;border:0;background:#000a;color:var(--p-white);font-size:9px;line-height:14px;box-shadow:none}
.mc-name{display:flex;align-items:center;justify-content:center;gap:2px;width:100%;min-width:0;padding:1px 2px;color:var(--p-white);font-size:10px;line-height:14px}
.mc-name b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:800}
.mc-name small{color:#b9bbc1;font-size:8px}
.mc-name .grade-badge{flex:none;min-height:0;padding:0 2px;font-size:8px;line-height:11px}
.make-deck .field-slot.selected .mc-art,.make-deck .field-slot.field-drop-over .mc-art{outline:3px solid var(--cp-blue-hi);outline-offset:1px}
.make-deck .bench-strip{margin:8px 0 6px;padding:4px;background:var(--cp-head);color:var(--p-white);text-align:center;font-size:12px}
.make-deck .bench-strip small{color:#c9cad0}
.make-deck .field-workspace .field-reserves{display:flex;gap:6px;padding:0 8px;overflow-x:auto}
/* pitchers: n선발 row, bullpen role columns */
.make-deck .rotation-editor{margin:0;border:0;border-radius:0;background:var(--cp-surface);box-shadow:none}
.make-deck .rotation-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.make-deck .rotation-cards>article,.bullpen-col>article{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;padding:0;border:0;background:none;box-shadow:none}
.slot-head{display:block;width:100%;background:var(--cp-blue);color:var(--p-white);text-align:center;font-size:11px;font-weight:600;line-height:18px}
.make-deck .rotation-editor .rotation-face{display:flex;flex-direction:column;align-items:center;width:100%;max-width:84px;padding:0;border:0;background:none;box-shadow:none;cursor:pointer}
.make-deck .rotation-face .pitch-role-note{font-size:9px;line-height:12px}
.make-deck .rotation-cards>article>div{display:flex;gap:2px}
.make-deck .rotation-cards>article>div .btn{padding:0;font-size:14px}
.make-deck .rotation-editor .text-btn{font-size:11px;}
.bullpen-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}
.bullpen-col{display:flex;flex-direction:column;align-items:center;min-width:0}
.col-head{display:block;width:100%;background:var(--cp-head);color:var(--p-white);text-align:center;font-size:12px;font-weight:600;line-height:22px}
.col-closer .col-head{background:var(--cp-closer)}
.col-setup .col-head{background:var(--cp-blue)}
.col-empty{margin:0;color:var(--cp-muted);font-size:11px}
.make-deck .bullpen-empty{display:grid;place-content:center;gap:2px;width:100%;aspect-ratio:3/4;border:1px dashed #9a9da3;border-radius:4px;background:color-mix(in srgb,var(--p-white) 35%,transparent);color:var(--cp-muted);font-size:10px;cursor:pointer}
.make-deck .bullpen-empty strong{font-size:22px;line-height:1;color:var(--cp-head)}
.bullpen-col .bullpen-role-pick{width:100%;padding:2px;gap:1px;border:1px solid var(--cp-tool-line);border-radius:3px;background:var(--cp-tool)}
.bullpen-col .bullpen-role-pick button{font-size:10px;border-radius:2px;color:var(--cp-muted)}
.bullpen-col .bullpen-role-pick button.active{background:var(--cp-head);color:var(--p-white)}
.bullpen-col .bullpen-role-pick button.role-setup.active{background:var(--cp-blue)}
.bullpen-col .bullpen-role-pick button.role-closer.active{background:var(--cp-closer)}
.make-deck .field-help{margin:8px 0 0}
/* bottom bar: big OVR, teal progress on a dark track */
.make-deck .save-dock{background:#d7dae0;border-top:1px solid var(--cp-tool-line)}
.make-deck .dock-ovr small{color:var(--cp-muted)}
.make-deck .dock-ovr b{color:var(--cp-ink);font-size:24px}
.make-deck .ovr-ticks{background:var(--cp-track)}
.make-deck .ovr-ticks i{background:var(--cp-teal)}
.make-deck .save-dock .btn.primary{background:var(--cp-blue);border-color:var(--cp-blue)}
@media (min-width:900px){.make-deck .rotation-cards,.bullpen-cols{max-width:560px;margin-inline:auto}}
.make-deck .roster-field{height:620px;min-height:620px}
.make-deck .roster-field>.field-slot,.make-deck .field-reserves .field-slot{width:66px}
.mc-art>.grade-badge{position:absolute;right:2px;bottom:2px;z-index:1;min-height:0;padding:0 3px;font-size:8px;line-height:12px}
@media (min-width:900px){.make-deck .roster-field>.field-slot{width:80px}}
.make-deck .mc-name b,.make-deck .field-slot .mc-name b{color:var(--p-white)}
.make-deck .rotation-cards article.rotation-cards,.make-deck .rotation-editor article:is(:last-child,:not(:last-child)) .rotation-face{display:flex;flex-direction:column;align-items:center;gap:0;min-height:0;grid-template-columns:none}
.make-deck .rotation-face .mc-art>img,.make-deck .field-slot .mc-art>img{position:absolute;inset:0;width:100%;height:100%;grid-row:auto}
.make-deck .rotation-face .mc-art>img.cut,.make-deck .field-slot .mc-art>img.cut{top:16%;height:84%}
.make-deck .deck-tools .btn{white-space:nowrap}

.make-deck .roster-field::after{background:url(/assets/art-bg-login.jpg) center 42%/auto 135%;filter:grayscale(1) blur(4px) brightness(1.35) contrast(.7)}
.make-deck .rotation-editor{position:relative;isolation:isolate;overflow:hidden}
.make-deck .rotation-editor::after{position:absolute;inset:-14px;z-index:-1;background:url(/assets/art-bg-login.jpg) center 35%/cover;filter:grayscale(1) blur(5px) brightness(1.45) contrast(.6);opacity:.55}

/* compya global (2026-10-27): the whole app moves to the Compya V26 scheme. The palette tokens are retuned, so every
   screen built from them follows: navy -> charcoal (dark surfaces, heading text), blue -> cobalt (selected, links,
   progress), cool light-grey page. Chrome (top bar, currency bar, bottom nav) goes charcoal, primary actions cobalt,
   purchase actions Compya purple. Grade colours, gold, green and red stay. */
:root{--p-ink:#232428;--p-navy:#3f4044;--p-slate:#6f7074;--p-line:#c9ccd2;--p-bg:#e4e6ea;--p-blue:#183c88;--cp-buy:#6b08c7;--cp-dot:#d8243f}
body{background:#d8dbe1}
/* top bar + currency bar */
.topbar,.topbar.dark{background:var(--cp-chrome);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:0;color:var(--p-white)}
.topbar :is(h1,b,strong,small,span),.topbar .header-icon,.topbar button{color:var(--p-white)}
.topbar>div>small,.topbar .kicker{color:#b9bbc1}
.topbar>.currency-bar{padding-top:6px}
.topbar .cur-item{background:#2f3034;border:0;color:#b9bbc1}
.topbar .cur-item .gi{color:#e6e7ea}
.topbar .cur-item b{color:var(--p-white)}
.topbar .cur-item button{background:var(--cp-blue-hi);color:var(--p-white)}
.notification-dot,.nav-dot{background:var(--cp-dot)}
/* bottom nav: charcoal, selected = lighter block */
.product-nav{background:var(--cp-chrome);-webkit-backdrop-filter:none;backdrop-filter:none;border-top:0}
.product-nav button{color:#a9abb1}
.product-nav button.active{color:var(--p-white);background:#5a5b60}
.product-nav button.active::before{display:none}
/* buttons and tabs */
.btn.primary{background:var(--cp-blue);border-color:var(--cp-blue);color:var(--p-white)}
.btn.primary:hover{background:#1f4aa3}
.tabs>button.active,.tabs>button[aria-pressed="true"]{background:var(--cp-blue);color:var(--p-white)}
.buy-row .btn.primary,.shop-sheet .btn.primary,[data-do="pack"].btn.primary,[data-do="pack-ten"]{background:var(--cp-buy);border-color:var(--cp-buy);color:var(--p-white)}
/* panels: light surfaces with a charcoal heading strip feel */
.panel{background:#f1f2f5;border:1px solid var(--p-line);border-radius:6px;box-shadow:none}
.status-pill.good{background:var(--cp-blue);color:var(--p-white)}
/* home: Compya lobby. Profile banner (ace card + OVERALL + 3 stats) and full-art mode tiles with a red dot */
.hub-hero{position:relative;isolation:isolate;overflow:hidden;border-radius:6px;background:var(--cp-chrome)}
.hub-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:url(/assets/art-bg-login.jpg) center 40%/cover;filter:grayscale(.85) brightness(.55);opacity:.9}
.hub-hero .hub-club{background:color-mix(in srgb,#1d1e21 70%,transparent);color:var(--p-white);border:0;border-radius:6px;box-shadow:none}
.hub-hero .hub-club :is(small,span){color:#c9cad0}
.hub-hero .hub-club b{color:var(--p-white)}
.hub-ovr{color:#c9cad0}
.hub-ovr strong{color:var(--cp-teal);font-size:30px;line-height:1}
.hub-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:8px;background:#ffffff26;border-radius:4px;overflow:hidden}
.hub-stats>div{display:flex;flex-direction:column;align-items:center;padding:4px 2px;background:#1d1e21b3}
.hub-stats small{color:#b9bbc1;font-size:10px}
.hub-stats b{color:var(--p-white);font-size:16px;font-variant-numeric:tabular-nums}
.hub-tiles{gap:6px}
.hub-tile{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;min-height:132px;padding:10px 12px;border:0;border-radius:6px;background:#2f3034;box-shadow:none;text-align:left}
.hub-tile .hub-art{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.85)}
.hub-tile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,#16171acc 78%)}
.hub-tile b{color:var(--p-white);font-size:18px;font-weight:700;text-shadow:0 1px 3px #0009}
.hub-tile span{color:#d4d6db;font-size:11px}
.hub-tile .notification-dot{position:absolute;top:8px;right:8px;left:auto;width:16px;height:16px;border-radius:50%;background:var(--cp-dot);box-shadow:0 0 0 2px #fff3}
.hub-tile.wide{grid-column:1/-1;min-height:104px;background:var(--cp-blue)}
.hub-tile.wide::after{background:linear-gradient(90deg,#183c88f2 35%,#183c8840)}
.hub-tile.wide .hub-art{left:auto;right:0;width:55%}
.hub-tile .hub-round{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--cp-teal);text-shadow:none}
/* shop: Compya scout. Charcoal header strip per product, purple buy buttons */
.shop-item{overflow:hidden;border:1px solid var(--p-line);border-radius:6px;background:#f1f2f5;box-shadow:none}
.shop-item .shop-tag{display:block;padding:3px 0;border-radius:0;background:var(--cp-chrome);color:var(--p-white);text-align:center;font-size:11px;font-weight:600}
.shop-item .shop-price{color:var(--cp-ink)}
.hub-tiles>.hub-tile:nth-child(even):last-child{grid-column:1/-1;min-height:96px}
.hub-tiles>.hub-tile:nth-child(even):last-child .hub-art{left:auto;right:0;width:55%}
@media (max-width:420px){.topbar .cur-item .cur-label{display:none}.topbar .cur-item{padding-left:8px;gap:4px}}
.buy-row>.btn,.buy-row>.btn.primary{min-height:52px;padding:8px 6px;background:var(--cp-buy);border-color:var(--cp-buy);color:var(--p-white);font-size:13px;line-height:1.25;white-space:normal;text-align:center;justify-content:center}
.buy-row>.btn:disabled{background:#9a9ca3;border-color:#9a9ca3}
.shop-item{padding-top:0}

/* compya match: charcoal scoreboard, cobalt inning plate, my-side bars bright blue vs red, grey stage */
html .scoreboard .inning,html.ui-v3 .scoreboard .inning{background:var(--cp-blue);color:var(--p-white);border:0}
html.ui-v3 .scoreboard .inning :is(b,span),.scoreboard .inning :is(b,span){color:var(--p-white)}
html.ui-v3 .scoreboard .inning span,.scoreboard .inning span{color:#c9d6f5}

.versus-card,.duel-bars{background:#f1f2f5;border:1px solid var(--p-line);box-shadow:none}
.match-shell{background:#d8dbe1}
/* compya shapes: squarer corners and flat light-grey surfaces everywhere */
.btn{border-radius:4px}
:is(.goal-card,.panel,.shop-item,.hub-tile,.season-card,.choice-card,.record-card,.notice-panel){border-radius:6px}
.goal-card{background:#f1f2f5;border:1px solid var(--p-line);box-shadow:none}
.tabs{border-radius:6px}
.tabs>button{border-radius:4px}
/* compya: no big page heading, the charcoal top bar already names the screen */
.page-title{display:none}
/* compya league banner: ROUND n / N, my emblem VS next opponent, blue play button */
.league-next>span{color:var(--cp-teal);font-weight:700;letter-spacing:.02em}
.league-vs{display:flex;align-items:center;gap:10px}
.league-vs .team-logo{width:44px;height:44px;padding:4px;border-radius:6px;background:var(--p-white)}
.league-vs em{font-style:normal;font-weight:700;font-size:18px;color:var(--p-white)}
.league-vs strong{margin-left:4px}
.league-hero .league-play,.league-hero .btn.primary{background:var(--cp-blue-hi);border-color:var(--cp-blue-hi);color:var(--p-white)}
/* compya player detail: the collection card itself instead of a bare photo */
.detail-identity>.detail-card{flex:none;}
.detail-card>.player-card{width:100%;pointer-events:none}
.season-track i.w{background:var(--cp-teal)}
.mc-art>:is(.enhancement-inline,.transcend-inline,.level-badge){position:absolute;left:2px;bottom:2px;z-index:1;margin:0;font-size:9px;line-height:13px;padding:0 3px}
/* compya: plain UI boxes lose the old violet tint (grade/awaken/special colours stay) */
:is(.album-bonus,.album-fill-one,.growth-card.album,.report-growth-grid>div){background:#eef0f3;border-color:var(--p-line)}
/* compya chips: squarer, selected cobalt */
.chips>button{border-radius:4px}
.chips>button.active,.chips>button[aria-pressed="true"]{background:var(--cp-blue);border-color:var(--cp-blue);color:var(--p-white)}
/* compya mission rows: mail as one row (title + reward | claim button), the generic message text hidden */
.mail-card:has(>[data-do="claim-mail"]){display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"meta meta" "title btn" "loot btn";gap:4px 10px;align-items:center;padding:10px 12px;border-radius:6px;background:#f1f2f5;border:1px solid var(--p-line);box-shadow:none}
.mail-card:has(>[data-do="claim-mail"])>.eyebrow{grid-area:meta}
.mail-card:has(>[data-do="claim-mail"])>h3{grid-area:title;margin:0;font-size:14px}
.mail-card:has(>[data-do="claim-mail"])>p{display:none}
.mail-card:has(>[data-do="claim-mail"])>.starter-loot{grid-area:loot;margin:0}
.mail-card:has(>[data-do="claim-mail"])>.starter-loot img{width:28px;height:28px}
.mail-card>[data-do="claim-mail"]{grid-area:btn;width:auto;min-height:40px;padding:0 16px;margin:0}
/* compya deck header: compact, tabs come up sooner */
.make-deck .deck-status{padding:10px 12px;min-height:0}
.make-deck .deck-status h2{font-size:18px;margin:2px 0}
.make-deck .deck-toolbar{min-height:0;margin:4px 0;justify-content:flex-end}
.make-deck .slot-panel[hidden]{display:none;margin:0}
.make-deck .team-colors{margin:6px 0;padding:8px 12px}
.make-deck .deck-main-tabs{margin-top:8px}

/* compya pass 2 (2026-10-27) */
/* currency: coloured filled icons, round fixed-size plus button */
.topbar .cur-item .gi{width:17px;height:17px}
.topbar .cur-item .gi-cur-coin{color:#f5c542}
.topbar .cur-item .gi-cur-shard{color:#6fd6e8}
.topbar .cur-item .gi-cur-ticket{color:#c39bff}
.topbar .cur-item button{flex:none;width:24px;height:24px;min-width:0;padding:0;display:grid;place-items:center;border-radius:50%}
/* mini card: LR transcend star badge like the awaken one */
.mc-art>.transcend-inline{display:inline-flex;align-items:center;gap:2px;background:#000a;color:#ffe08a;border:0}
.mc-art>.transcend-inline .gi{width:9px;height:9px}
/* deck editor sits flat on the grey page like Compya (no white rounded box) */
.make-deck .deck-editor{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}
/* pitcher tab: tighter, no stadium wash, notes only when there is a penalty */
.make-deck .rotation-editor::after{content:none}
.make-deck .rotation-editor{padding:8px 6px}
.make-deck .rotation-editor .field-help{margin:6px 0 0}
.make-deck .rotation-face .pitch-usage:not(.mismatch){display:none}
.make-deck .rotation-face .pitch-usage.mismatch{font-size:9px;line-height:12px;color:var(--p-red)}

.bullpen-col{gap:6px}
.bullpen-col>article{gap:2px}
.bullpen-col .bullpen-role-pick{margin-top:2px}
.bullpen-col .text-btn{min-height:20px;font-size:11px;padding:0}
.make-deck .rotation-cards>article>div{margin-top:2px}
/* friendly starter: mini cards like the league rotation, today's starter in cobalt */
.make-deck .friendly-starter{margin:0;padding:8px 6px;border:0;border-radius:0;background:var(--cp-surface)}
.make-deck .friendly-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px 4px;margin-top:6px}
.make-deck .friendly-cards>article{display:flex;flex-direction:column;align-items:center;gap:0;min-width:0;padding:0;border:0;background:none;box-shadow:none}
.make-deck .friendly-cards .slot-head{background:var(--cp-head)}
.make-deck .friendly-cards>article.active .slot-head{background:var(--cp-blue)}
.make-deck .friendly-cards .rotation-face{display:flex;flex-direction:column;align-items:center;gap:0;min-height:0;grid-template-columns:none;width:100%;max-width:84px;padding:0;border:0;background:none;box-shadow:none;cursor:pointer}
.make-deck .friendly-cards>article.active .mc-art{outline:3px solid var(--cp-blue-hi);outline-offset:1px}
/* shop: header strip reaches the tile edges; scout-style colour burst behind each pack */
.shop-item .shop-tag{margin:0 -6px 8px;width:calc(100% + 12px)}
.shop-item{isolation:isolate;--pk:#1a5dd0}
.shop-item[data-shop-item="premium"]{--pk:#c9921a}.shop-item[data-shop-item="season"]{--pk:#1f9a63}.shop-item[data-shop-item="club"]{--pk:#c32f3e}.shop-item[data-shop-item="archive"]{--pk:#8a5a2b}.shop-item[data-shop-item="tactics"]{--pk:#6b08c7}
.shop-item::before{content:"";position:absolute;left:0;right:0;top:22px;z-index:-1;}
.shop-item .foil-pack{filter:drop-shadow(0 6px 10px #0008)}
.shop-item.selected{outline:2px solid var(--cp-blue-hi);outline-offset:-2px}
.make-deck .bullpen-col .rotation-face{max-width:66px}
.bullpen-col .bullpen-role-pick{max-width:100%}
.bullpen-col .bullpen-role-pick button{min-height:22px;padding:0 1px}
.make-deck .rotation-editor .text-btn{min-height:18px;line-height:18px;padding:0}
.make-deck .rotation-cards>article>div .btn{min-height:22px;min-width:24px}
.make-deck .bullpen-empty{max-width:66px}

/* compya pass 3 (2026-10-27) */
/* Compya card art: vivid grade colour, a light burst behind the player, two diagonal accent bands, dark foot */
.mc-art{--m2:#9fb4c9}
.mc-art[data-grade="R"]{--m2:#33c4e8}.mc-art[data-grade="SR"]{--m2:#e04fb4}.mc-art[data-grade="SSR"]{--m2:#ff8a1f}.mc-art[data-grade="UR"]{--m2:#ff3d7a}.mc-art[data-grade="LR"]{--m2:#35e0d0}
.mc-art{background:
 linear-gradient(180deg,transparent 62%,color-mix(in srgb,var(--m1) 45%,#000) 100%),
 linear-gradient(118deg,transparent 0 52%,color-mix(in srgb,var(--m2) 70%,transparent) 52% 60%,transparent 60% 66%,color-mix(in srgb,#fff 35%,transparent) 66% 68%,transparent 68%),
 linear-gradient(118deg,transparent 0 14%,color-mix(in srgb,#fff 22%,transparent) 14% 17%,transparent 17%),
 radial-gradient(circle at 50% 38%,color-mix(in srgb,#fff 70%,var(--m1)) 0,color-mix(in srgb,var(--m1) 60%,#fff) 28%,transparent 62%),
 linear-gradient(160deg,color-mix(in srgb,var(--m1) 75%,#fff) 0%,var(--m1) 42%,color-mix(in srgb,var(--m1) 70%,#000) 100%)}
.mc-art>img:not(.cut){-webkit-mask-image:radial-gradient(ellipse 72% 68% at 50% 42%,#000 58%,transparent 82%);mask-image:radial-gradient(ellipse 72% 68% at 50% 42%,#000 58%,transparent 82%)}
/* pitcher tab: cards only, selected card lifts with a bright frame */
.make-deck .rotation-editor article.picked .mc-art{outline:3px solid #ffd84a;outline-offset:1px}
.make-deck .rotation-editor .rotation-face{transition:transform .12s ease-out}
.make-deck .rotation-editor .rotation-face:active{transform:scale(.97)}
/* bottom action sheet (상세 정보 · 교체 · 순번/역할) */
.pitch-sheet{position:sticky;bottom:calc(var(--dock-h,64px) + 8px);z-index:5;display:grid;grid-template-columns:64px minmax(0,1fr) 28px;gap:10px;align-items:start;margin:8px 0 0;padding:10px;border-radius:6px;background:var(--cp-chrome);color:var(--p-white);box-shadow:0 6px 18px #0006}
.pitch-sheet-card .mc-art{width:64px}
.pitch-sheet-card{display:flex;flex-direction:column}
.pitch-sheet-body{display:grid;gap:6px;min-width:0}
.pitch-sheet-body>b{font-size:14px;color:var(--p-white)}
.pitch-sheet-body .pitch-usage{font-size:11px;color:#c9cad0}
.pitch-sheet-body .pitch-usage.mismatch{color:#ff8a8a}
.pitch-sheet-extra,.pitch-sheet-main{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px}
.pitch-sheet .btn{min-height:34px;padding:0 6px;font-size:12px;border-radius:4px;background:#5a5b60;border-color:#5a5b60;color:var(--p-white)}
.pitch-sheet .btn.primary{background:var(--cp-blue-hi);border-color:var(--cp-blue-hi)}
.pitch-sheet .btn.active.role-setup{background:var(--cp-blue)}.pitch-sheet .btn.active.role-chase{background:#2b2c30;outline:1px solid #8a8c92}.pitch-sheet .btn.active.role-closer{background:var(--cp-closer)}
.pitch-sheet-close{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:#5a5b60;color:var(--p-white);cursor:pointer}
.pitch-sheet-close .gi{width:14px;height:14px}
/* pitch sheet floats right above the save bar + bottom nav, Compya-style */
.make-deck .pitch-sheet{position:fixed;left:50%;translate:-50% 0;width:min(560px,calc(100% - 16px));bottom:calc(env(safe-area-inset-bottom) + 138px);margin:0;z-index:30}
.pitch-sheet .pitch-sheet-extra .btn,.pitch-sheet .pitch-sheet-main .btn{background:#5a5b60;border:1px solid #6c6d72;color:var(--p-white);box-shadow:none}
.pitch-sheet .pitch-sheet-main .btn.primary{background:var(--cp-blue-hi);border-color:var(--cp-blue-hi)}
.pitch-sheet .pitch-sheet-extra .btn.active.role-setup{background:var(--cp-blue);border-color:#7f9be0}
.pitch-sheet .pitch-sheet-extra .btn.active.role-chase{background:#232428;border-color:#c9cad0}
.pitch-sheet .pitch-sheet-extra .btn.active.role-closer{background:var(--cp-closer);border-color:#ff8a8a}
.pitch-sheet .btn:disabled{opacity:.45}
.make-deck .bullpen-col .rotation-face,.make-deck .bullpen-empty{max-width:76px}


/* compya card face (2026-10-27): matches Compya V26's card anatomy, scaled for the mini cards */
.mc-art{aspect-ratio:3/4.1;border:1.5px solid color-mix(in srgb,var(--m1) 70%,#fff);border-radius:5px 5px 0 0;container-type:inline-size}
.mc-stars{position:absolute;left:0;right:0;top:0;z-index:2;display:flex;justify-content:center;gap:1px;padding:1px 0 2px;background:linear-gradient(180deg,#000b,#0000)}
.mc-stars .gi{width:9cqw;height:9cqw;color:#c58bff;filter:drop-shadow(0 0 1px #000)}
.mc-art[data-grade="N"] .mc-stars .gi,.mc-art[data-grade="R"] .mc-stars .gi{color:#8fd3ff}
.mc-art[data-grade="SSR"] .mc-stars .gi{color:#ffd54a}
.mc-art[data-grade="UR"] .mc-stars .gi{color:#ff6b8a}

.mc-art>.compact-ovr{top:11cqw;left:2cqw;padding:0;font-size:0;line-height:0}
.mc-art>.compact-ovr strong{font-size:27cqw;line-height:1;font-weight:900;letter-spacing:-.04em;color:#fff;text-shadow:0 1px 0 #0009,0 0 4px #000a}
.mc-club{position:absolute;right:3cqw;top:12cqw;z-index:2;width:22cqw;height:22cqw;object-fit:contain;filter:drop-shadow(0 1px 1px #000a)}
.mc-art>.mc-pos{right:3cqw;top:36cqw;padding:0 2cqw;border-radius:2px;background:#0f1a14e6;color:#5fe08a;font-size:12cqw;line-height:17cqw;font-weight:900}
.mc-art>:is(.awaken-inline,.transcend-inline,.enhancement-inline){left:2cqw;bottom:22cqw;top:auto}
.mc-ribbon{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:2px;height:18cqw;padding:0 3cqw 0 2cqw;background:linear-gradient(100deg,#0000 0 30%,#1d5fd6 30%,#2a8de8 100%);clip-path:polygon(0 30%,100% 0,100% 100%,0 100%)}
.mc-ribbon .grade-badge{position:static;min-height:0;padding:0 2cqw;font-size:10cqw;line-height:13cqw;margin-top:4cqw}
.mc-ribbon i{font-style:italic;font-weight:900;color:#fff;margin-top:4cqw;white-space:nowrap}
.mc-art>.grade-badge{display:none}
.mc-art>img.mc-photo{z-index:1}
.mc-art>img.mc-photo.cut{top:12%;height:88%}
.mc-name{border-radius:0 0 5px 5px;background:#1c1d21}
/* textured art backgrounds per grade */
.mc-art[data-grade="N"]{background:repeating-linear-gradient(135deg,#ffffff14 0 2px,#0000 2px 9px),radial-gradient(circle at 60% 35%,#e9ecf0 0,#0000 55%),linear-gradient(160deg,#c7ccd3,#6e747d)}
.mc-art[data-grade="R"]{background:radial-gradient(circle at 55% 38%,#bff4ff 0,#0000 45%),repeating-linear-gradient(135deg,#21a6b4 0 7px,#147d8a 7px 14px,#0c5c66 14px 18px),linear-gradient(180deg,#0a3b44,#0b2a33)}
.mc-art[data-grade="SR"]{background:radial-gradient(ellipse 40% 26% at 22% 70%,#ff5fb8cc,#0000 70%),radial-gradient(ellipse 50% 30% at 85% 30%,#ff9be0aa,#0000 70%),linear-gradient(120deg,#0000 0 55%,#ffffff40 55% 58%,#0000 58%),radial-gradient(circle at 50% 40%,#fbe0ff 0,#0000 50%),linear-gradient(160deg,#c47bd6,#6d2f9e 55%,#2c1048)}
.mc-art[data-grade="SSR"]{background:repeating-radial-gradient(circle at 30% 20%,#ffffff10 0 1px,#0000 1px 4px),repeating-radial-gradient(circle at 70% 80%,#00000018 0 2px,#0000 2px 6px),radial-gradient(circle at 50% 38%,#fff2c4 0,#0000 52%),linear-gradient(160deg,#d9b35a,#9a7228 50%,#4a3510)}
.mc-art[data-grade="UR"]{background:radial-gradient(ellipse 45% 30% at 80% 25%,#ff2d55d9,#0000 70%),radial-gradient(ellipse 35% 22% at 15% 75%,#ff2d5599,#0000 70%),linear-gradient(115deg,#0000 0 60%,#ff3b5c66 60% 64%,#0000 64%),radial-gradient(circle at 50% 40%,#ffd1da 0,#0000 46%),linear-gradient(160deg,#3a1d24,#160b0f)}

/* pitch sheet: dark buttons with white text in every state; bottom room only while the sheet is open */
.make-deck .bullpen-editor{padding-bottom:8px}
.make-deck .bullpen-editor:has(~ .pitch-sheet){padding-bottom:170px}
.make-deck .pitch-sheet .btn,.make-deck .pitch-sheet .btn:hover,.make-deck .pitch-sheet .btn.active{background:#5a5b60;border:1px solid #6c6d72;color:#fff;box-shadow:none;font-weight:600}
.make-deck .pitch-sheet .btn.primary{background:var(--cp-blue-hi);border-color:var(--cp-blue-hi);color:#fff}
.make-deck .pitch-sheet .btn.role-setup.active{background:var(--cp-blue);border-color:#9fb6ff}
.make-deck .pitch-sheet .btn.role-chase.active{background:#232428;border-color:#e6e7ea}
.make-deck .pitch-sheet .btn.role-closer.active{background:var(--cp-closer);border-color:#ff9a9a}
.make-deck .pitch-sheet-card .mc-art{width:64px}
.mc-art>img.mc-club,.make-deck :is(.rotation-face,.field-slot,.pitch-sheet-card) .mc-art>img.mc-club{position:absolute;inset:auto;right:3cqw;top:12cqw;left:auto;bottom:auto;width:22cqw;height:22cqw;object-fit:contain;z-index:2;-webkit-mask-image:none;mask-image:none}
.mc-art>.compact-ovr{z-index:3}
.make-deck .pitch-sheet .btn:not(.primary):not(.danger):not(.ghost){background:#5a5b60;border:1px solid #6c6d72;color:#fff}
.make-deck .pitch-sheet .btn.role-setup.active:not(.primary){background:var(--cp-blue);border-color:#9fb6ff}
.make-deck .pitch-sheet .btn.role-chase.active:not(.primary){background:#232428;border-color:#e6e7ea}
.make-deck .pitch-sheet .btn.role-closer.active:not(.primary){background:var(--cp-closer);border-color:#ff9a9a}
html.ui-v3 .mc-art>.compact-ovr,html .mc-art>.compact-ovr{font-size:0;color:transparent;top:12cqw}
.ps-btn{min-height:34px;padding:0 6px;border:1px solid #6c6d72;border-radius:4px;background:#5a5b60;color:#fff;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.ps-btn.primary{background:var(--cp-blue-hi);border-color:var(--cp-blue-hi)}
.ps-btn.active.role-setup{background:var(--cp-blue);border-color:#9fb6ff}
.ps-btn.active.role-chase{background:#232428;border-color:#e6e7ea}
.ps-btn.active.role-closer{background:var(--cp-closer);border-color:#ff9a9a}
.ps-btn:disabled{opacity:.45;cursor:default}
/* every mini card in a column is the same size (the card no longer shrinks to a short name) */
.make-deck .bullpen-col>article,.make-deck .bullpen-col>.bullpen-empty{width:min(76px,100%);max-width:76px}
.make-deck .bullpen-col .rotation-face,.make-deck .rotation-cards .rotation-face,.make-deck .friendly-cards .rotation-face{width:100%;max-width:none;align-items:stretch}
.make-deck .rotation-face>.mc-art,.make-deck .rotation-face>.mc-name{width:100%}
@media (max-width:480px){.make-deck .bullpen-col>article,.make-deck .bullpen-col>.bullpen-empty{width:68px}}
/* bullpen columns read as separate lanes: a faint panel under each head, full height */
.bullpen-cols{align-items:stretch;gap:4px}
.bullpen-col{justify-content:flex-start;padding:0 0 10px;border-radius:0 0 4px 4px;background:color-mix(in srgb,#fff 38%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,#fff 55%,transparent)}
.bullpen-col.col-setup{background:color-mix(in srgb,#183c88 9%,#ffffff60)}
.bullpen-col.col-closer{background:color-mix(in srgb,#6a0512 9%,#ffffff60)}
.bullpen-col>.col-head{margin-bottom:4px}
.bullpen-col>.col-empty{margin-top:6px}
html .make-deck .pitch-sheet>.pitch-sheet-close{min-width:0;min-height:0;width:28px;height:28px;padding:0;justify-self:end;align-self:start}
.detail-identity>.detail-card{display:flex;flex-direction:column;width:112px}
.detail-card>.mc-art{width:100%}
.detail-card>.mc-name{font-size:13px;line-height:20px}

/* compya collection cards (2026-10-27): the collection / album / pack-result / home ace cards use the same Compya face */
.player-card.cp-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:0;border:0;border-radius:6px;background:none;box-shadow:0 2px 6px #0003;text-align:center;cursor:pointer;overflow:visible}
.player-card.cp-card>.mc-art{width:100%}
.player-card.cp-card>.mc-name{display:flex;flex-direction:column;align-items:center;gap:1px;padding:3px 4px 4px;font-size:13px;line-height:17px}
.player-card.cp-card>.mc-name b{color:#fff;font-weight:800;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.player-card.cp-card>.mc-name small{color:#c9cad0;font-size:10.5px;line-height:13px}
.player-card.cp-card>.mc-name .card-extra{color:#ffd96a}
.player-card.cp-card.unowned{filter:grayscale(.9) brightness(.95)}
.player-card.cp-card.unowned:hover{filter:grayscale(.4)}
.player-card.cp-card:hover{transform:translateY(-2px);transition:transform .15s ease-out}
.mc-flags{position:absolute;right:3cqw;bottom:22cqw;z-index:3;display:flex;gap:2px}
.mc-flags i{display:grid;place-items:center;width:15cqw;height:15cqw;border-radius:50%;background:#000b;color:#fff}
.mc-flags .gi{width:9cqw;height:9cqw}
.mc-flags .pc-up{background:#1f9a63}
/* shine: a glint sweeps across SR and up; SSR/UR add twinkles, LR adds a moving holo sheen */
.mc-shine{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none;border-radius:inherit}
.mc-shine::before{content:"";position:absolute;top:-25%;bottom:-25%;left:0;width:38%;background:linear-gradient(100deg,#fff0,#ffffff8c 50%,#fff0);transform:translateX(-170%) skewX(-18deg);animation:mc-glint 4.6s ease-in-out infinite}
.mc-art[data-grade="N"] .mc-shine{display:none}




.mc-art:is([data-grade="SSR"],[data-grade="UR"],[data-grade="LR"]) .mc-shine::after{content:"";position:absolute;inset:0;background:radial-gradient(circle,#fff 0 1.2px,#fff0 2px) 18% 30%/100% 100% no-repeat,radial-gradient(circle,#fff 0 1px,#fff0 1.8px) 78% 48%/100% 100% no-repeat,radial-gradient(circle,#fff 0 1.4px,#fff0 2.2px) 30% 72%/100% 100% no-repeat,radial-gradient(circle,#fff 0 1px,#fff0 1.8px) 64% 20%/100% 100% no-repeat;animation:mc-twinkle 2.4s ease-in-out infinite}

@keyframes mc-glint{0%,58%{transform:translateX(-170%) skewX(-18deg)}80%,100%{transform:translateX(340%) skewX(-18deg)}}
@keyframes mc-twinkle{0%,100%{opacity:.15}50%{opacity:1}}
@keyframes mc-holo{0%{background-position:0% 0%}100%{background-position:220% 220%}}
:is(.collection-grid,.owned-grid,.bullpen-col,.rotation-cards,.roster-field,.field-reserves)>:nth-child(3n+2) .mc-shine::before{animation-delay:-1.5s}
:is(.collection-grid,.owned-grid,.bullpen-col,.rotation-cards,.roster-field,.field-reserves)>:nth-child(3n) .mc-shine::before{animation-delay:-3s}
@media (prefers-reduced-motion:reduce){.mc-shine,.mc-shine::before,.mc-shine::after{animation:none}.mc-shine::before{display:none}}
/* pack opening cards: the Compya card face (front only; the flip back stays) */
.pk-front.cp-front{display:flex;flex-direction:column;padding:0;overflow:hidden;background:#1c1d21;border:2px solid var(--m2)}
.pk-front.cp-front::before{content:none}
.pk-front.cp-front>.mc-art{flex:1 1 auto;width:100%;aspect-ratio:auto;border:0;border-radius:0}
.pk-front.cp-front img.mc-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%;border-radius:0}
.pk-front.cp-front img.mc-photo.cut{top:12%;height:88%;object-fit:contain;object-position:50% 100%}
.pk-front.cp-front img.mc-club{position:absolute;inset:auto;right:3cqw;top:12cqw;width:22cqw;height:22cqw;object-fit:contain;border-radius:0}
.pk-front.cp-front>.mc-name{flex:none;border-radius:0;font-size:15px;line-height:24px}
.pk-front.cp-front>.mc-name b{color:#fff}
.pk-small .pk-front.cp-front>.mc-name{font-size:11px;line-height:17px}
/* LR card, premium (2026-10-27): deep emerald with a mint core light and slowly turning light rays behind the
   player, mint frame glow, emerald ribbon; no paint blobs */
.mc-art[data-grade="LR"]{border-color:#a8f7dc;background:radial-gradient(circle at 50% 40%,#f2fff9 0,#9cf0d2 12%,#2fb88d55 30%,#0000 52%),radial-gradient(ellipse 120% 60% at 50% 110%,#000a,#0000 60%),linear-gradient(165deg,#13684f 0%,#0b4636 42%,#05201a 100%)}
.mc-art[data-grade="LR"]::before{content:"";position:absolute;left:50%;top:40%;z-index:0;width:240%;aspect-ratio:1;translate:-50% -50%;-webkit-mask-image:radial-gradient(circle,#000 10%,#0000 55%);mask-image:radial-gradient(circle,#000 10%,#0000 55%);animation:mc-rays 30s linear infinite}
@keyframes mc-rays{to{rotate:360deg}}
.mc-art[data-grade="LR"] .mc-ribbon{background:linear-gradient(100deg,#0000 0 30%,#0f7a5c 30%,#47dcb0 100%)}
.mc-art[data-grade="LR"] .mc-stars .gi{color:#b9ffe8;filter:drop-shadow(0 0 2px #3fd6a8)}


.player-card.cp-card[data-grade="LR"]{box-shadow:0 0 0 1.5px #a8f7dc,0 0 16px #3fd6a880,0 2px 6px #0004}
.player-card.cp-card[data-grade="LR"]>.mc-name{background:linear-gradient(180deg,#0c2a22,#081a15)}
.player-card.cp-card[data-grade="LR"]>.mc-name b{color:#eafff7}
@media (prefers-reduced-motion:reduce){.mc-art[data-grade="LR"]::before{animation:none}}
/* card effect ladder (2026-10-27): each grade adds a layer, so higher grades read as clearly flashier.
   N none · R faint glint · SR glint + soft frame glow · SSR gold foil sweep + twinkles + pulsing gold glow
   · UR turning red rays + rising sparks + pulsing red glow · LR turning mint rays + holo flow + rising sparks
   + two-tone breathing glow */
.mc-art[data-grade="R"] .mc-shine::before{opacity:.35;animation-duration:7s}
.mc-art[data-grade="SR"] .mc-shine::before{opacity:.6;animation-duration:5.5s}
.mc-art[data-grade="SSR"] .mc-shine::before{opacity:.85;width:46%;animation-duration:4s;background:linear-gradient(100deg,#fff0,#fff0d0e6 45%,#ffd76a99 55%,#fff0)}
.mc-art[data-grade="UR"] .mc-shine::before{opacity:.9;width:46%;animation-duration:3.4s;background:linear-gradient(100deg,#fff0,#ffe1e8e6 45%,#ff6b8a99 55%,#fff0)}
.mc-art[data-grade="LR"] .mc-shine::before{opacity:1;width:50%;animation-duration:2.8s;background:linear-gradient(100deg,#fff0,#f0fffae6 40%,#9dfde0b3 55%,#fff0)}
/* frame glows */
.mc-art[data-grade="SR"]{box-shadow:0 0 6px #a57bff80}
.mc-art:is([data-grade="SSR"],[data-grade="UR"],[data-grade="LR"]){animation:mc-glow 2.6s ease-in-out infinite}
.mc-art[data-grade="SSR"]{--glow:#ffcf4a}
.mc-art[data-grade="UR"]{--glow:#ff4d6d}
.mc-art[data-grade="LR"]{--glow:#5ff2c4;animation-duration:2s}
@keyframes mc-glow{0%,100%{box-shadow:0 0 4px color-mix(in srgb,var(--glow) 50%,transparent)}50%{box-shadow:0 0 14px var(--glow),0 0 2px #fff}}
/* SSR gold foil: fine diagonal foil lines drifting */

/* UR turning red rays behind the player */
.mc-art[data-grade="UR"]::before{content:"";position:absolute;left:50%;top:40%;z-index:0;width:240%;aspect-ratio:1;translate:-50% -50%;background:repeating-conic-gradient(from 0deg,#ff6b8a2e 0 5deg,#0000 5deg 16deg);-webkit-mask-image:radial-gradient(circle,#000 10%,#0000 55%);mask-image:radial-gradient(circle,#000 10%,#0000 55%);animation:mc-rays 40s linear infinite}
.mc-art[data-grade="LR"]::before{animation-duration:20s;background:repeating-conic-gradient(from 0deg,#d2fff02e 0 5deg,#0000 5deg 13deg)}
/* UR / LR rising sparks (tile of light dots drifting up) */

.mc-art[data-grade="UR"] .mc-shine::after{filter:drop-shadow(0 0 2px #ff6b8a)}
.mc-art[data-grade="LR"] .mc-shine::after{filter:drop-shadow(0 0 2px #5ff2c4);animation-duration:2.8s}
@keyframes mc-rise{from{transform:translateY(0)}to{transform:translateY(-50%)}}
/* LR holo flow stronger, multi-hue */

@media (prefers-reduced-motion:reduce){.mc-art,.mc-art::before,.mc-shine,.mc-shine::before,.mc-shine::after{animation:none!important}}
/* LR: no diagonal holo band flow (user: remove) */
.mc-art[data-grade="LR"] .mc-shine{background:none;animation:none}
/* no rising sparks (user: remove); UR/LR keep the in-place twinkle like SSR */
.mc-art:is([data-grade="UR"],[data-grade="LR"]) .mc-shine::after{inset:0;filter:none;background:radial-gradient(circle,#fff 0 1.2px,#fff0 2px) 18% 30%/100% 100% no-repeat,radial-gradient(circle,#fff 0 1px,#fff0 1.8px) 78% 48%/100% 100% no-repeat,radial-gradient(circle,#fff 0 1.4px,#fff0 2.2px) 30% 72%/100% 100% no-repeat,radial-gradient(circle,#fff 0 1px,#fff0 1.8px) 64% 20%/100% 100% no-repeat;animation:mc-twinkle 2.4s ease-in-out infinite}
/* SSR: no drifting diagonal foil lines (user: remove) */
.mc-art[data-grade="SSR"] .mc-shine{background:none;animation:none}
.mc-art[data-grade="LR"] .mc-shine::after{content:none}
/* effects never cover the player: every shine layer sits behind the photo; UR twinkles removed */
.mc-art>.mc-shine{z-index:0}
.mc-art[data-grade="UR"] .mc-shine::after{content:none}
/* card animations run only while the pointer is on the card (always-on animation lagged with many cards) */
.mc-art,.mc-art::before,.mc-shine,.mc-shine::before,.mc-shine::after{animation-play-state:paused}
:hover>.mc-art,:hover>.mc-art::before,:hover>.mc-art .mc-shine,:hover>.mc-art .mc-shine::before,:hover>.mc-art .mc-shine::after,.mc-art:hover,.mc-art:hover::before,.mc-art:hover .mc-shine,.mc-art:hover .mc-shine::before,.mc-art:hover .mc-shine::after{animation-play-state:running}
html .mc-art[data-grade],html .mc-art[data-grade]::before,html .mc-art[data-grade] .mc-shine,html .mc-art[data-grade] .mc-shine::before,html .mc-art[data-grade] .mc-shine::after{animation-play-state:paused}
html :hover>.mc-art[data-grade],html :hover>.mc-art[data-grade]::before,html :hover>.mc-art[data-grade] .mc-shine,html :hover>.mc-art[data-grade] .mc-shine::before,html :hover>.mc-art[data-grade] .mc-shine::after,html .mc-art[data-grade]:hover,html .mc-art[data-grade]:hover::before,html .mc-art[data-grade]:hover .mc-shine,html .mc-art[data-grade]:hover .mc-shine::before,html .mc-art[data-grade]:hover .mc-shine::after{animation-play-state:running}
/* player photos everywhere carry the card grade background, so the grade reads at a glance (static, no effects) */
img.player-art[data-grade]{background-color:transparent}
img.player-art[data-grade="N"]{background:radial-gradient(circle at 60% 35%,#e9ecf0 0,#0000 55%),linear-gradient(160deg,#c7ccd3,#6e747d)}
img.player-art[data-grade="R"]{background:radial-gradient(circle at 55% 38%,#bff4ff 0,#0000 45%),repeating-linear-gradient(135deg,#21a6b4 0 7px,#147d8a 7px 14px,#0c5c66 14px 18px)}
img.player-art[data-grade="SR"]{background:radial-gradient(circle at 50% 40%,#fbe0ff 0,#0000 50%),linear-gradient(160deg,#c47bd6,#6d2f9e 55%,#2c1048)}
img.player-art[data-grade="SSR"]{background:radial-gradient(circle at 50% 38%,#fff2c4 0,#0000 52%),linear-gradient(160deg,#d9b35a,#9a7228 50%,#4a3510)}
img.player-art[data-grade="UR"]{background:radial-gradient(circle at 50% 40%,#ffd1da 0,#0000 46%),radial-gradient(ellipse 45% 30% at 80% 25%,#ff2d55d9,#0000 70%),linear-gradient(160deg,#3a1d24,#160b0f)}
img.player-art[data-grade="LR"]{background:radial-gradient(circle at 50% 40%,#f2fff9 0,#9cf0d2 14%,#0000 52%),linear-gradient(165deg,#13684f,#05201a)}
img.player-art[data-grade]{border:1.5px solid #fff6;box-shadow:0 1px 3px #0003}
.player-side .season-yy{margin-left:3px;font-size:.78em;font-weight:700;color:var(--p-slate)}
/* library rows: same grade background behind the photo */
.field-library-card[data-grade]>img{border:1.5px solid #fff6;border-radius:6px}
.field-library-card[data-grade="N"]>img{background:radial-gradient(circle at 60% 35%,#e9ecf0 0,#0000 55%),linear-gradient(160deg,#c7ccd3,#6e747d)}
.field-library-card[data-grade="R"]>img{background:radial-gradient(circle at 55% 38%,#bff4ff 0,#0000 45%),repeating-linear-gradient(135deg,#21a6b4 0 7px,#147d8a 7px 14px,#0c5c66 14px 18px)}
.field-library-card[data-grade="SR"]>img{background:radial-gradient(circle at 50% 40%,#fbe0ff 0,#0000 50%),linear-gradient(160deg,#c47bd6,#6d2f9e 55%,#2c1048)}
.field-library-card[data-grade="SSR"]>img{background:radial-gradient(circle at 50% 38%,#fff2c4 0,#0000 52%),linear-gradient(160deg,#d9b35a,#9a7228 50%,#4a3510)}
.field-library-card[data-grade="UR"]>img{background:radial-gradient(circle at 50% 40%,#ffd1da 0,#0000 46%),radial-gradient(ellipse 45% 30% at 80% 25%,#ff2d55d9,#0000 70%),linear-gradient(160deg,#3a1d24,#160b0f)}
.field-library-card[data-grade="LR"]>img{background:radial-gradient(circle at 50% 40%,#f2fff9 0,#9cf0d2 14%,#0000 52%),linear-gradient(165deg,#13684f,#05201a)}
/* league menu: 9 views as a 3x3 Compya segmented grid, no horizontal scroll */
.league-tabs.league-main-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;height:auto;padding:4px;overflow:visible;border-radius:6px;background:var(--cp-tab);border:0}
.league-main-tabs>button{min-width:0;min-height:38px;padding:0 4px;border:0;border-radius:4px;background:#ffffff8c;color:var(--cp-head);font-size:13px;font-weight:600;white-space:nowrap;box-shadow:none}
.league-main-tabs>button.active,.league-main-tabs>button[aria-pressed="true"]{background:var(--cp-blue);color:#fff}
.league-main-tabs>button::after,.league-main-tabs>button.active::after{display:none}
@media (min-width:720px){.league-tabs.league-main-tabs{grid-template-columns:repeat(9,minmax(0,1fr))}}

/* compya gap list (2026-10-27) */
/* 1 dock: big OVR + step track with numbered ticks */
.make-deck .save-dock .dock-ovr{display:inline-flex;align-items:baseline;gap:4px;margin-left:8px}
.make-deck .save-dock .dock-ovr small{font-size:11px;font-weight:600;color:var(--cp-muted)}
.make-deck .save-dock .dock-ovr b{font-size:28px;line-height:1;font-weight:700;font-style:normal;letter-spacing:-.04em;color:var(--cp-ink)}
.ovr-track{position:relative;display:inline-block;width:120px;height:6px;margin:16px 6px 0 12px;border-radius:3px;background:var(--cp-track);vertical-align:middle}
.ovr-track>i{position:absolute;inset:0 auto 0 0;border-radius:3px;background:var(--cp-teal)}
.ovr-track>em{position:absolute;top:-17px;translate:-50% 0;padding:0 3px;border-radius:3px;background:#b9bcc4;color:#fff;font-size:9.5px;font-weight:600;font-style:normal;line-height:13px}
.ovr-track>em.on{background:var(--cp-blue)}
.ovr-track>em:first-of-type{translate:0 0}.ovr-track>em:last-of-type{translate:-100% 0}
@media (max-width:420px){.make-deck .save-dock #dirty-label{display:none}}
/* 2 big enhancement number (Compya yellow) */
.mc-lv{position:absolute;right:3cqw;top:55cqw;z-index:3;font-size:24cqw;line-height:1;font-weight:900;font-style:italic;color:#ffe14a;text-shadow:0 1px 0 #000a,0 0 4px #000c;letter-spacing:-.04em}
.mc-art>:is(.awaken-inline,.transcend-inline){bottom:21cqw}
/* 9 ribbon: season tag on the right */
.mc-ribbon i{letter-spacing:-.02em}
/* 3 NEXT starter */
.slot-head.next{background:var(--cp-blue-hi);box-shadow:0 0 0 1px #9fc0ff inset}
.slot-head i{display:block;margin:-14px auto 0;width:max-content;padding:0 4px;border-radius:2px;background:var(--cp-blue-hi);color:#fff;font-size:9px;font-style:normal;line-height:12px}
.make-deck .rotation-cards>article{padding-top:2px}
/* 4 bullpen slot tags + empty slots */
.slot-tag{display:block;width:100%;background:#9a9da3;color:#fff;text-align:center;font-size:10px;font-weight:600;line-height:15px;border-radius:2px 2px 0 0}
.bp-slot-empty,.make-deck .bullpen-col>.bullpen-empty{display:grid;place-content:center;justify-items:center;gap:4px;width:68px;aspect-ratio:3/4.4;border:1px dashed #8f9298;border-radius:5px;background:#ffffff4d;color:var(--cp-muted)}
.bp-slot-empty b,.make-deck .bullpen-empty strong{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--cp-head);color:#fff;font-size:18px;line-height:1}
.bp-slot-empty small,.make-deck .bullpen-empty span{padding:0 4px;font-size:9px;line-height:12px;text-align:center}
/* 5 centred screen title */
.topbar{position:relative}
.topbar>div:first-child{position:absolute;left:50%;top:9px;translate:-50% 0;max-width:56%;text-align:center}
.topbar:has(.currency-bar)>div:first-child{top:9px}
/* 6 shop sheet strip */
.shop-sheet-strip{display:flex;justify-content:space-between;align-items:center;margin:-4px 0 10px;padding:6px 10px;border-radius:4px;background:var(--cp-chrome);color:#fff;font-size:12px;font-weight:600}
.shop-sheet-strip .text-btn{min-height:24px;padding:0 8px;border-radius:3px;background:#5a5b60;color:#fff;font-size:11px}
/* 7 home VS emblems on the league band */
.hub-vs{position:absolute;right:12px;top:50%;translate:0 -50%;z-index:1;display:flex;align-items:center;gap:8px}
.hub-vs img{width:40px;height:40px;padding:4px;border-radius:6px;background:#fff;object-fit:contain}
.hub-vs em{font-style:normal;font-weight:700;font-size:16px;color:#fff}
/* 8 goal shortcut */
.goal-card:not(.has-art){grid-template-areas:"title reward" "progress status" "progress go"}
.goal-card .goal-go{grid-area:go;justify-self:end;min-height:30px;padding:0 12px;border:0;border-radius:4px;background:var(--cp-blue);color:#fff;font-size:12px;font-weight:600;cursor:pointer}
/* 11 condensed italic numerals for the big numbers */
.mc-art>.compact-ovr strong,.hub-ovr strong,.hub-stats b,.league-progress b{font-style:italic;letter-spacing:-.05em}
/* coloured filled icons for rewards everywhere */
.gi-cur-coin{color:#f5c542}.gi-cur-shard{color:#4fc6dc}.gi-cur-ticket{color:#a66bff}
.gi-trophy{color:#e0a92a}.gi-heart-fill{color:#e5484d}.gi-crown{color:#f5c542}
.status-pill .gi-check,.gi-check.done{color:#1f9a63}
.btn.primary .gi-cur-coin,.ps-btn .gi-cur-coin{filter:drop-shadow(0 0 1px #0006)}
.topbar>div:nth-child(2){margin-left:auto}
html .make-deck .save-dock .dock-ovr>b{font-size:28px;line-height:1;font-weight:700}
@media (max-width:420px){.ovr-track{width:124px}}
.mc-ribbon i{font-size:11cqw}

/* play scene + auto-play reel (2026-10-27) */
.play-scene .scene-tag{font-size:22px;font-weight:700;font-style:normal;fill:#ffdf92;paint-order:stroke;stroke:#14263d;stroke-width:3px}
.diamond-broadcast.mini .broadcast-field{max-width:220px;margin:0 auto;display:block}
.reel-overlay{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px;background:#000b}
.reel-card{width:min(420px,100%);display:grid;gap:8px;padding:12px;border-radius:8px;background:var(--cp-chrome);color:#fff;box-shadow:0 12px 32px #000a}
.reel-card header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;font-size:12px;color:#c9cad0}
.reel-card header>span:last-child{text-align:right}
.reel-card header b{font-size:14px;color:#fff;white-space:nowrap}
.reel-card header strong{font-size:20px;font-style:normal;color:var(--cp-teal)}
.reel-caption{display:grid;gap:2px;text-align:center}
.reel-caption b{font-size:20px;font-weight:700}
.reel-caption small{font-size:12px;color:#c9cad0}
.reel-card .play-scene{width:100%;height:auto;border-radius:6px;background:#0b3b31}
.reel-progress{height:4px;border-radius:2px;background:var(--cp-track);overflow:hidden}
.reel-progress i{display:block;height:100%;background:var(--cp-teal)}
.reel-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.reel-actions button{min-height:38px;border:1px solid #6c6d72;border-radius:4px;background:#5a5b60;color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.reel-actions button.primary{background:var(--cp-blue-hi);border-color:var(--cp-blue-hi)}
.reel-card header strong.bump{animation:reel-bump .5s ease-out}
@keyframes reel-bump{0%{transform:scale(1.6);color:#fff}100%{transform:scale(1)}}
.reel-card header strong{display:inline-block}
/* manual play pop: lighter backdrop, sits in the upper half */
.reel-overlay.pop{background:#0007;place-items:start center;padding-top:88px}
.reel-actions.one{grid-template-columns:1fr}

/* scene v2 (2026-10-27): ballpark scene styling */
.play-scene{border-radius:10px;overflow:hidden}
.play-scene .pf-man circle{fill:#f4f8f6;stroke:#0b2a22;stroke-width:1.2}
.play-scene .pf-man.on circle{fill:#ffc94a;stroke:#fff;stroke-width:1.4}
.play-scene .pf-pos{font-size:7.5px;font-weight:600;fill:#fff;paint-order:stroke;stroke:#0b2a22;stroke-width:2.2px}
.play-scene .pf-base{fill:#fff;stroke:#0b2a2233;stroke-width:.6}
.play-scene .pf-base.on{fill:#ffd24a}
.play-scene .pf-runner{fill:#ffd24a;stroke:#0b2a22;stroke-width:1.2}
.play-scene .pf-bat circle{fill:#ffd24a;stroke:#0b2a22;stroke-width:1.2}
.play-scene .pf-bat line{stroke:#e9d2a6;stroke-width:1.8;stroke-linecap:round}
.play-scene .pz-bg{fill:#0b1a16d9;stroke:#ffffff40;stroke-width:.6}
.play-scene .pz-box{fill:none;stroke:#fff;stroke-width:.9}
.play-scene .pz-grid{stroke:#ffffff38;stroke-width:.5}
.play-scene .pz-ball{fill:#fff;stroke:#0b2a22;stroke-width:.8}
.play-scene .pz-ball.in{fill:#ffd24a}
.play-scene .pz-type{font-size:7px;font-weight:600;fill:#fff;paint-order:stroke;stroke:#0b2a22;stroke-width:2px}
.play-scene .pf-tag rect{fill:#14263de6;stroke:#ffffffb3;stroke-width:.6}
.play-scene .pf-tag text{font-size:8px;font-weight:700;fill:#fff;letter-spacing:.02em}
.play-scene .pf-tag.out rect{fill:#a3122ae6}
.play-scene .pf-tag.safe rect{fill:#1d5fd6e6}
.play-scene .pf-tag.hr rect{fill:#c98a12f0}
.play-scene .pf-tag.run rect{fill:#1f9a63f0}
.diamond-broadcast .play-scene{width:min(320px,100%);height:auto;box-shadow:0 4px 14px #0003}
/* match screen colour cleanup (2026-10-27): one meaning per colour.
   my side = cobalt, opponent = crimson, neutral text = ink/slate, actions = grey tool buttons, primary = cobalt,
   momentum = gold (resource). Rating tiers no longer recolour every number (bar length already shows it). */
.match-core :is(.versus-card,.trait-chip,.situation-advice,.situation-row,.hand-head,.tactic-card,.phase-strip){border-radius:6px}
.player-side .stat-value,.player-side [class*="rating-"]{color:var(--cp-ink);font-weight:600}
.duel-bars [class*="rating-"]{color:inherit}
.duel-bars>div>b:first-child{color:var(--cp-blue)}
.duel-bars>div>b:last-child{color:#b3263a}
.duel-bars>div:last-child>b:last-child{color:var(--cp-ink)}
.duel-bars>div>small,.duel-bars>div>span:not([class]){color:var(--cp-muted)}
html.ui-v3 .duel-a i,.duel-a i{background:var(--cp-blue)}
html.ui-v3 .duel-b i,.duel-b i{background:#b3263a}
.trait-chip{background:#f1f2f5;border:1px solid var(--p-line);box-shadow:none}
.trait-chip span>*{color:var(--cp-muted)}
.trait-chip span>:first-child{color:var(--cp-ink);font-weight:600}
.trait-chip span>:nth-child(2){color:var(--cp-blue);font-weight:600}
.situation-advice{background:#eef0f3;border:0;border-left:3px solid var(--cp-blue);color:var(--cp-head)}
.situation-advice b,.situation-advice strong{color:var(--cp-blue)}
.match-guide-tools>button{min-height:34px;border:1px solid var(--cp-tool-line);border-radius:4px;background:var(--cp-tool);color:var(--cp-head);box-shadow:none;font-weight:600}
.match-guide-tools>button :is(span,small,b){color:inherit}
.match-guide-tools>.opponent-note-button{background:var(--cp-chrome);border-color:var(--cp-chrome);color:#fff}
.match-guide-tools>.opponent-note-button small{color:#c9cad0}
.phase-strip>div{color:var(--cp-muted)}
.phase-strip>div.active{color:var(--cp-blue)}
.phase-strip>div.active span{background:var(--cp-blue);color:#fff}
.hand-head{background:transparent;border:0}
.hand-head .eyebrow{color:var(--cp-muted)}
.tactic-card{background:#fff;border:1px solid var(--p-line);box-shadow:0 1px 2px #0001}
.tactic-card .tactic-tag{color:var(--cp-muted)}
.tactic-card b{color:var(--cp-ink)}
.tactic-card:is(.selected,[aria-pressed="true"]){border-color:var(--cp-blue);box-shadow:0 0 0 2px var(--cp-blue)}
.action-dock{background:#e9ebef;border-top:1px solid var(--p-line)}
.dock-buttons .btn:not(.primary):not(.danger){background:var(--cp-tool);border:1px solid var(--cp-tool-line);color:var(--cp-head);box-shadow:none}
.dock-buttons .btn:disabled{opacity:.5}


html .match-core .duel-bars>div:last-child>b:last-child>.stat-value,html .match-core .duel-bars>div:last-child>b:last-child{color:var(--cp-ink)}

html .match-core .trait-chip span>small{color:var(--cp-blue);font-weight:600}
html .match-core .trait-chip span>small.trait-situ{color:var(--cp-muted);font-weight:700}
/* rating tier colours are !important globally; in the match header they give way to side colours */
html .match-core .duel-bars>div>b:first-child>.stat-value{color:var(--cp-blue)!important}
html .match-core .duel-bars>div>b:last-child>.stat-value{color:#b3263a!important}
html .match-core .duel-bars>div:last-child>b:last-child>.stat-value{color:var(--cp-ink)!important}
html .match-core .player-side .stat-value{color:var(--cp-ink)!important}

/* tactic hand feel (2026-10-27): picked card lifts with a glow, new cards deal in, played/exchanged cards leave */
.tactic-card{transition:transform .16s ease-out,box-shadow .16s ease-out}
.tactic-card.selected,.tactic-card[aria-pressed="true"]{transform:translateY(-8px) scale(1.04);border-color:var(--cp-blue-hi);box-shadow:0 10px 18px #183c8840,0 0 0 2px var(--cp-blue-hi);animation:card-pick .3s ease-out;z-index:1}
@keyframes card-pick{0%{transform:translateY(0) scale(1)}55%{transform:translateY(-12px) scale(1.08)}100%{transform:translateY(-8px) scale(1.04)}}
.tactic-card.deal-in{animation:card-deal .42s cubic-bezier(.2,.7,.2,1) both}
@keyframes card-deal{0%{transform:translateY(40px) rotate(6deg) scale(.85);opacity:0}100%{transform:none;opacity:1}}
.card-ghost{transform-origin:50% 60%}
/* momentum ready: gold glow pulse + a sweeping shine, so it reads "use me" */
.clutch-open.momentum:not(:disabled){overflow:hidden;animation:momo-pulse 1.6s ease-in-out infinite;border-color:#e0a92a;color:#5a3d00}
.clutch-open.momentum:not(:disabled)::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,#fff0,#ffffffb3,#fff0);transform:translateX(-150%) skewX(-18deg);animation:momo-shine 2.2s ease-in-out infinite;pointer-events:none}
@keyframes momo-pulse{0%,100%{box-shadow:0 0 0 0 #f5c54266}50%{box-shadow:0 0 0 6px #f5c54200,0 0 14px #f5c542aa}}
@keyframes momo-shine{0%,55%{transform:translateX(-150%) skewX(-18deg)}85%,100%{transform:translateX(330%) skewX(-18deg)}}
/* duel rows as separate cells */
.versus-card .duel-bars{display:grid;gap:3px;padding:4px;border-radius:6px;background:#e1e4e9;border:0}
.versus-card .duel-bars>div{padding:4px 8px;border-radius:4px;background:#fff}
@media (prefers-reduced-motion:reduce){.tactic-card.selected,.tactic-card.deal-in,.clutch-open.momentum,.clutch-open.momentum::after{animation:none!important}}
/* match header: the same card face as the deck (grade art, stars, club, ribbon with season) */
.player-side{grid-template-columns:60px minmax(0,1fr)}
.player-side.pitcher{grid-template-columns:minmax(0,1fr) 60px}
.player-side>.vs-card{display:block;width:60px;flex:none}
.player-side>.vs-card>.mc-art{width:100%;border-radius:5px}
.player-side.pitcher>.vs-card{order:2}
html .versus-card .player-side.pitcher>.vs-card{order:9}
html .versus-card .player-side.pitcher>div{order:1;text-align:right}
html .versus-card .player-side.pitcher>.vs-card,html .versus-card .player-side.pitcher>div,.player-side.pitcher>.vs-card{order:0}
html .player-side .vs-card .mc-art>.mc-pos{background:#0f1a14e6}

html .player-side .vs-card .mc-art{color:#fff}

/* compact pass (2026-10-27): less empty space everywhere, left-aligned intro panels, Compya density */
.page-wrap{padding:8px 8px 110px}
.panel{padding:12px;margin:8px 0}
.panel h2{font-size:18px;line-height:1.3;margin:2px 0 6px}
.panel h3{font-size:15px;margin:2px 0 6px}
.panel p{margin:4px 0}
.panel .help,.help{font-size:12px;line-height:1.5;margin:4px 0}
.panel .eyebrow,.eyebrow,.kicker{font-size:10.5px;margin:0 0 2px}
.btn{min-height:40px}
.tabs{margin:8px 0}
.goal-grid,.league-grid,.shop-grid,.collection-grid,.hub-tiles{gap:6px}
.league-grid>.panel{padding:12px}
/* league start panel: compact, left aligned, coloured trophy */
.league-new{gap:8px;text-align:left;justify-items:stretch;padding:14px}
.league-new .league-cup{width:40px;height:40px;color:#e0a92a;filter:drop-shadow(0 2px 4px #e0a92a55)}
.league-new>.league-cup{grid-row:span 2;float:none}
.league-new h2{margin:0;font-size:19px}
.league-new>p:first-of-type{margin:0;color:var(--cp-muted);font-size:13px}
.league-new .league-club{justify-content:flex-start;gap:8px;margin:0}
.league-new .league-club .team-logo{width:36px;height:36px;padding:3px}
.league-length{gap:6px}
.league-length>button{min-height:54px;padding:6px 8px;border-radius:6px}
.tier-picker{gap:6px}
.tier-picker>button{padding:8px;border-radius:6px}
.tier-picker .tier-art{width:40px;height:40px}

/* compya stars (2026-10-27): star colour by count (1-3 blue, 4 gold, 5 purple); awakening / transcend as a small
   gold mark at the end of the star row; enhancement stays the big yellow number */
html .mc-art .mc-stars .gi{color:#7cc8ff;filter:drop-shadow(0 0 1px #000)}
html .mc-art[data-grade="SSR"] .mc-stars .gi{color:#ffd54a}
html .mc-art:is([data-grade="UR"],[data-grade="LR"]) .mc-stars .gi{color:#c58bff}
html .mc-art>:is(.awaken-inline,.transcend-inline){bottom:auto;z-index:3;display:inline-flex;align-items:center;gap:1px;min-height:0;padding:0 2cqw;border:0;border-radius:3px;background:#000a;color:#ffd24a;font-size:9cqw;line-height:11cqw;font-weight:900}


html .mc-art .mc-stars{justify-content:flex-start;}
/* shop tiles: only a faint, desaturated tint behind the pack (no rays) */
.shop-item::before{background:radial-gradient(ellipse 70% 65% at 50% 50%,color-mix(in srgb,color-mix(in srgb,var(--pk) 45%,#8a8f99) 22%,#fff),#f1f2f5 75%);clip-path:none;height:62%}
/* match card chips: same look as the deck cards (generic .player-side span text styles must not leak in) */
html .player-side .vs-card .mc-art>.mc-pos{color:#5fe08a!important;font-size:12cqw!important;font-weight:900!important;line-height:17cqw!important;padding:0 2cqw!important}
html .player-side .vs-card .mc-ribbon i{font-size:11cqw!important;font-weight:900!important}
html .player-side .vs-card span{white-space:nowrap}
/* Compya card reading: enhancement "+N" as a small shield badge under the OVR (bronze, gold from +8);
   awakening stays the gold mark at the end of the star row */
html .mc-art>.mc-lv{left:2cqw;right:auto;top:41cqw;padding:0 2.4cqw;border-radius:2cqw 2cqw 5cqw 5cqw;background:linear-gradient(180deg,#e2b46a,#94621c);color:#fff;font-size:11cqw;line-height:15cqw;font-style:normal;font-weight:900;letter-spacing:-.02em;text-shadow:0 1px 0 #0008;box-shadow:0 0 0 .8px #0007}
html .mc-art>.mc-lv.hi{background:linear-gradient(180deg,#fff0a8,#d39a14)}
/* match header text alignment */
.player-side.pitcher>div{text-align:right}
.player-side.pitcher>div>.eyebrow{justify-content:flex-end}
.match-guide-tools>.opponent-note-button{padding:0 12px;justify-content:space-between;gap:6px}
.match-guide-tools>button{padding:0 10px;justify-content:center}
html .versus-card .player-side>div{min-width:0;}

html .versus-card .player-side>div>.eyebrow{white-space:nowrap;overflow:visible}
html .versus-card .player-side>div{flex:1 1 0}
html .versus-card .player-side>div>b{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html .versus-card .player-side>div>.eyebrow{display:block;font-size:10.5px}
html .versus-card .player-side{gap:6px}

/* enhance stage (2026-10-27): Compya-style enhancement / awakening result */
.enh-stage{position:fixed;inset:0;z-index:90;display:grid;place-items:center;overflow:hidden;cursor:pointer;color:#fff;text-align:center}
.enh-bg{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,#1d4f9e,#0b2350 60%,#06142e)}


@keyframes enh-ok-bg{to{background:radial-gradient(circle at 50% 40%,#5aa6ff,#1a5dd0 55%,#0d3a8f)}}
@keyframes enh-fail-bg{0%{background:radial-gradient(circle at 50% 40%,#c04ab0,#7a1f6a 60%,#3a0c33)}100%{background:radial-gradient(circle at 50% 40%,#22396b,#121f40 60%,#0a1228)}}
.enh-silhouette{position:absolute;left:50%;top:44%;width:120px;aspect-ratio:3/4;translate:-50% -50%;border-radius:6px;background:#fff;box-shadow:0 0 30px #fff,0 0 80px #9fc4ff;animation:enh-sil .95s ease-in both}
@keyframes enh-sil{0%{opacity:0;transform:scale(.6)}30%{opacity:1;transform:scale(1)}70%{transform:scale(1.04)}100%{opacity:0;transform:scale(1.25)}}
.enh-streaks{position:absolute;left:50%;top:44%;width:0;height:0}
.enh-streaks i{position:absolute;left:0;top:0;width:2px;height:70px;border-radius:2px;background:linear-gradient(#fff0,#fff);transform-origin:50% 0;rotate:var(--r);opacity:0;animation:enh-streak .9s var(--d) ease-out both}
.enh-streaks i:nth-child(3n){background:linear-gradient(#ff7ad900,#ff7ad9)}
@keyframes enh-streak{0%{opacity:0;transform:translateY(40px) scaleY(.3)}40%{opacity:1}100%{opacity:0;transform:translateY(190px) scaleY(1)}}
.enh-shards{position:absolute;left:50%;top:44%;width:0;height:0}
.enh-shards i{position:absolute;left:-6px;top:-6px;width:12px;height:10px;clip-path:polygon(50% 0,100% 100%,0 100%);opacity:0;rotate:var(--r)}
.enh-stage.ok .enh-shards i{background:hsl(calc(var(--r) * 1),85%,65%);animation:enh-shard 1.3s .95s cubic-bezier(.2,.7,.2,1) both}
.enh-stage.fail .enh-shards i{background:#e9e2ff;border:1px solid #fff;animation:enh-glass .9s .9s cubic-bezier(.1,.8,.3,1) both}
@keyframes enh-shard{0%{opacity:0;transform:translateY(0) scale(.4)}20%{opacity:1}100%{opacity:0;transform:translateY(calc(-170px * var(--k))) rotate(260deg) scale(1)}}
@keyframes enh-glass{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:.95}100%{opacity:0;transform:translateY(calc(-210px * var(--k))) rotate(-200deg) scale(1.3)}}
.enh-result{position:relative;display:grid;justify-items:center;gap:10px;opacity:0;animation:enh-in .45s .95s cubic-bezier(.2,.7,.2,1) both}
@keyframes enh-in{0%{opacity:0;transform:scale(.9) translateY(10px)}100%{opacity:1;transform:none}}
.enh-title{font-size:30px;font-weight:700;font-style:normal;letter-spacing:-.02em;text-shadow:0 2px 10px #0008}
.enh-stage.fail .enh-title{color:#d9d4ff}
.enh-card{display:flex;flex-direction:column;width:150px;filter:drop-shadow(0 10px 24px #0009)}
.enh-card .mc-art{width:100%}
.enh-card .mc-name{font-size:14px;line-height:22px}
.enh-card .mc-name b{color:#fff}
.enh-badges{display:flex;align-items:center;gap:10px}
.enh-badge{display:inline-grid;place-items:center;min-width:42px;height:30px;padding:0 8px;border-radius:5px 5px 12px 12px;background:linear-gradient(180deg,#e2b46a,#94621c);color:#fff;font-weight:700;font-size:16px;text-shadow:0 1px 0 #0008;box-shadow:0 0 0 1px #0007}
.enh-badge.hi{background:linear-gradient(180deg,#fff0a8,#d39a14)}
.enh-badge.awk{border-radius:5px;background:linear-gradient(180deg,#b88cff,#5e3fc4)}
.enh-stage.ok .enh-badges .enh-badge:last-child{animation:enh-pop .5s 1.35s ease-out both}
.enh-stage.fail .enh-badges .enh-badge:last-child{filter:grayscale(.6) brightness(.85)}
@keyframes enh-pop{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1)}}
.enh-arrow{color:#ffd24a;font-size:22px}
.enh-sub{font-size:13px;color:#e3ecff}
.enh-hint{font-size:11px;color:#ffffff99}
.enh-stage.still *{animation:none!important}.enh-stage.still .enh-result{opacity:1}.enh-stage.still .enh-silhouette,.enh-stage.still .enh-streaks,.enh-stage.still .enh-shards{display:none}
/* awakening chip readable everywhere (outside the cards it sat cobalt-on-navy) */
.awaken-inline{background:#2b2c30;color:#ffd24a;border:0}
.awaken-inline i{background:#ffd24a}
html .versus-card .player-side>div{display:block!important;overflow:hidden}
html .versus-card .player-side>div>*{max-width:100%}
html .versus-card .player-side>div>span:not(.eyebrow){display:block;white-space:normal!important;word-break:keep-all;font-size:10.5px;line-height:1.35}
/* awakening: a purple gem badge stacked right under the "+N" shield (same family, same size) */
html .mc-art>.awaken-inline{left:2cqw;right:auto;top:57cqw;bottom:auto;z-index:3;display:inline-flex;align-items:center;gap:1.5cqw;min-height:0;padding:0 2.4cqw;border:0;border-radius:2cqw;background:linear-gradient(180deg,#c9a2ff,#6a3fd0);color:#fff;font-size:10cqw;line-height:14cqw;font-weight:900;text-shadow:0 1px 0 #0008;box-shadow:0 0 0 .8px #0007}
html .mc-art>.awaken-inline i{width:5.5cqw;height:5.5cqw;background:#fff;border-radius:1px;transform:rotate(45deg)}
html .mc-art>.transcend-inline{left:2cqw;right:auto;top:57cqw;bottom:auto;padding:0 2.4cqw;border-radius:2cqw;background:linear-gradient(180deg,#9ff5d8,#169a72);color:#fff;font-size:10cqw;line-height:14cqw;box-shadow:0 0 0 .8px #0007}
html .mc-art>.transcend-inline .gi{color:#fff}
html .mc-art>.awaken-inline:only-of-type{top:41cqw}
/* awakening gem badge moves to the right column, under the position chip (balances the +N shield on the left) */
html .mc-art>:is(.awaken-inline,.transcend-inline){left:auto;right:3cqw;top:55cqw}
/* the stage is its own modal dialog so it sits above an open sheet (top layer) */
dialog.enh-stage{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:#fff}
dialog.enh-stage[open]{display:grid}
dialog.enh-stage::backdrop{background:transparent}

/* enhance sheet cleanup (2026-10-27): Compya-like header (card + name), one compact tool row, slim step track */
.enhance-player{display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px;align-items:center;padding:12px;border:0;border-radius:6px;background:linear-gradient(135deg,#183c88,#0d2a5a);color:#fff;box-shadow:none}
.enhance-player :is(h2,p,b){color:#fff}
.enhance-player p{color:#c9d6f5;font-size:12px}
.enhance-player h2{font-size:20px;margin:2px 0}
.enh-head-card{display:block;width:84px}
.enh-head-card .mc-art{width:100%;border-radius:5px}
.enhance-player.finish-gold,.enhance-player.finish-silver{background:linear-gradient(135deg,#183c88,#0d2a5a)}
/* tool row: target / list / favorite / lock as one line of small grey buttons */
.enhance-player~.target-toggle,.enhance-player~.target-list-link,.enhance-player~.inventory-buttons{display:inline-flex;margin:8px 4px 0 0;vertical-align:top}
.enhance-player~.target-toggle,.enhance-player~.inventory-buttons>button{min-height:32px;padding:0 10px;border:1px solid var(--cp-tool-line);border-radius:4px;background:var(--cp-tool);color:var(--cp-head);font-size:12px;font-weight:600;box-shadow:none}
.enhance-player~.target-list-link{min-height:32px;font-size:12px;align-items:center}
.enhance-player~.inventory-buttons{gap:4px}
.enhance-player~small.help{display:block;margin:6px 0 0;font-size:11px;color:var(--cp-muted)}
.metal-bonus{margin:8px 0;padding:8px 10px;border-radius:6px;font-size:12px}
.metal-bonus b,.metal-bonus strong{font-size:13px}
/* +0..+10 as one slim segmented track */
.enhance-steps{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:2px;margin:8px 0;padding:3px;border-radius:5px;background:#d5d8de}
.enhance-steps>span{display:grid;place-items:center;min-width:0;height:24px;padding:0;border-radius:3px;background:#fff;color:var(--cp-muted);font-size:10.5px;font-weight:600;box-shadow:none}
.enhance-steps>span.done{background:var(--cp-blue);color:#fff}
.enhance-steps>span.done:nth-child(n+9){background:linear-gradient(180deg,#f2c95a,#c48a12)}
.awaken-panel{padding:10px 12px;border-radius:6px}
.enhance-player~.inventory-buttons>button{white-space:nowrap}
.enhance-player h2 .awaken-inline,.enhance-player h2 .enhancement-inline{background:#ffffff2e;color:#ffd24a;border:0}
.enhance-player h2 .awaken-inline i{background:#ffd24a}

/* card art v2 (2026-10-28): printed-card backgrounds (SVG assets per grade) and a refined bottom band
   (no flat blue slab: dark glass fade, a thin accent line, metallic grade chip, embossed season text) */
html .mc-art[data-grade="N"]{background:url(/assets/card-bg-n.svg) center/cover,#8d949e}
html .mc-art[data-grade="R"]{background:url(/assets/card-bg-r.svg) center/cover,#167f8c}
html .mc-art[data-grade="SR"]{background:url(/assets/card-bg-sr.svg) center/cover,#6d2f9e}
html .mc-art[data-grade="SSR"]{background:url(/assets/card-bg-ssr.svg) center/cover,#a8761f}
html .mc-art[data-grade="UR"]{background:url(/assets/card-bg-ur.svg) center/cover,#7a1426}
html .mc-art[data-grade="LR"]{background:url(/assets/card-bg-lr2.svg) center/cover,#1a1626}
html .mc-art .mc-ribbon,html .mc-art[data-grade="LR"] .mc-ribbon{height:22cqw;align-items:flex-end;padding:0 3cqw 2.4cqw;clip-path:none;background:linear-gradient(180deg,#0000 0,#0009 45%,#000d 100%)}
html .mc-art .mc-ribbon::before{content:"";position:absolute;left:3cqw;right:3cqw;height:1px;background:linear-gradient(90deg,#fff0,var(--m1,#fff) 30%,#fff 50%,var(--m1,#fff) 70%,#fff0);opacity:.85}
html .mc-art .mc-ribbon .grade-badge{margin:0;border-radius:1.6cqw;box-shadow:inset 0 1px 0 #ffffff80,inset 0 -1px 0 #0006,0 1px 2px #0008}
html .mc-art .mc-ribbon i{margin:0;font-size:10.5cqw;line-height:13cqw;font-weight:900;font-style:italic;letter-spacing:.08em;color:#fff;background:linear-gradient(180deg,#fff 30%,#c9d2e0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 0 #000a)}
html .player-side .vs-card .mc-ribbon i{color:#fff!important}
.topbar .cur-item{padding-right:12px}

/* sheets v2 (2026-10-28) */
/* reward / celebration band: dark glass card, accent glow by tone, white type */
html.ui-v3 .cel .cel-band{background:linear-gradient(160deg,#22305a,#0f1730 70%);border:1px solid #ffffff1f;border-top:0;color:#fff;box-shadow:0 18px 40px #000a,inset 0 1px 0 #ffffff26}
html.ui-v3 .cel .cel-band::before{content:"";position:absolute;left:18%;right:18%;top:0;height:2px;border-radius:2px;background:linear-gradient(90deg,#fff0,var(--cel-acc,#5aa6ff),#fff0);box-shadow:0 0 14px var(--cel-acc,#5aa6ff)}
html.ui-v3 .cel.tone-gold{--cel-acc:#ffd24a}.cel.tone-red{--cel-acc:#ff5a6e}.cel.tone-purple{--cel-acc:#b88cff}.cel.tone-holo{--cel-acc:#5ff2c4}.cel.tone-silver{--cel-acc:#d6dbe3}
html.ui-v3 .cel .cel-stripes{opacity:.12}
html.ui-v3 .cel .cel-mark{box-shadow:0 0 0 3px #ffffff1f,0 0 24px color-mix(in srgb,var(--cel-acc,#5aa6ff) 55%,transparent);border-radius:50%}
html.ui-v3 .cel .cel-tag{color:var(--cel-acc,#ffd24a);background:none;font-weight:900;letter-spacing:.02em}
html.ui-v3 .cel .cel-title,.cel .cel-count,.cel .cel-unit{color:#fff}
html.ui-v3 .cel .cel-count{font-style:italic;letter-spacing:-.03em;text-shadow:0 2px 12px color-mix(in srgb,var(--cel-acc,#5aa6ff) 60%,transparent)}
html.ui-v3 .cel .cel-label,.cel .cel-sub{color:#c9d6f5}
html.ui-v3 .cel .cel-chips>span{background:#ffffff14;border:1px solid #ffffff2e;color:#fff;border-radius:999px}
html.ui-v3 .cel .cel-hint{color:#ffffff99}
/* player comparison: card faces, stat rows as bars with delta chips */
html.ui-v3 .player-comparison{padding:12px;border-radius:8px;background:linear-gradient(160deg,#22305a,#121c38);color:#fff;border:0}
html.ui-v3 .player-comparison .comparison-scope{color:#9fb6ff;font-size:11px;font-weight:600}
html.ui-v3 .player-comparison .compare-head{display:grid;grid-template-columns:1fr 1fr;gap:8px}
html.ui-v3 .player-comparison .compare-head>div{display:flex;gap:8px;align-items:center;padding:8px;border-radius:6px;background:#ffffff12}
html.ui-v3 .player-comparison .compare-head>div:last-child{background:color-mix(in srgb,#1a5dd0 35%,#ffffff12);box-shadow:inset 0 0 0 1px #5aa6ff66}
html.ui-v3 .cmp-card{display:block;flex:none;width:46px}
html.ui-v3 .cmp-card .mc-art{width:100%;border-radius:4px}
html.ui-v3 .player-comparison .compare-head small{color:#b9c6e6}
html.ui-v3 .player-comparison .compare-head b{color:#fff}
html.ui-v3 .player-comparison .compare-head .compact-ovr{color:#b9c6e6}
html.ui-v3 .player-comparison .compare-head .compact-ovr strong{color:#fff}
html.ui-v3 .player-comparison .compare-stats{display:grid;gap:3px;margin-top:8px}
html.ui-v3 .player-comparison .compare-stats>div{display:grid;grid-template-columns:52px 1fr auto;align-items:center;padding:6px 8px;border-radius:4px;background:#ffffff0f}
html.ui-v3 .player-comparison .compare-stats span{color:#b9c6e6;font-size:12px}
html.ui-v3 .player-comparison .compare-stats b{color:#fff;text-align:right;padding-right:8px;font-variant-numeric:tabular-nums}
html.ui-v3 .player-comparison .compare-stats strong{min-width:40px;padding:1px 8px;border-radius:999px;text-align:center;font-size:12px}
html.ui-v3 .player-comparison .compare-stats strong.up{background:#1f9a63;color:#fff}
html.ui-v3 .player-comparison .compare-stats strong.down{background:#b3263a;color:#fff}
html.ui-v3 .player-comparison .compare-stats strong.same{background:#ffffff1f;color:#c9d6f5}
html.ui-v3 .player-comparison>p{color:#9fb0d6;font-size:11px}
/* deck impact panel */
html.ui-v3 .deck-impact{padding:12px;border-radius:8px;background:#f1f2f5;border:1px solid var(--p-line);box-shadow:none}
html.ui-v3 .deck-impact h3{font-size:14px;margin:0 0 8px}
html.ui-v3 .deck-impact .impact-verdict>div{border-radius:6px;border-left:3px solid var(--cp-blue);background:#fff}
html.ui-v3 .deck-impact .impact-position{display:flex;justify-content:space-between;padding:8px;border-radius:6px;background:#fff;margin:6px 0}
html.ui-v3 .deck-impact .pitch-role-change{margin:6px 0;padding:8px 10px;border-radius:6px;background:#fff;border:0;border-left:3px solid #e0a92a}
html.ui-v3 .deck-impact .impact-note,.deck-impact .impact-unchanged{font-size:11.5px;color:var(--cp-muted)}
/* item box rows (mailbox items): same panel language */
.item-row,.ticket-row{border-radius:6px;background:#fff;border:1px solid var(--p-line)}

/* trade fx (2026-10-28) */
html.ui-v3 .trade-fx{position:relative;display:grid;justify-items:center;gap:2px;margin:-4px -4px 10px;padding:18px 12px 14px;border-radius:10px;background:radial-gradient(circle at 50% 35%,#2b4a8f,#121c38 70%);color:#fff;overflow:hidden}
.tr-stage{position:relative;width:96px;height:132px;display:grid;place-items:center}
.tr-card{width:96px;filter:drop-shadow(0 10px 18px #0009)}
.tr-card .mc-art{width:100%;border-radius:5px}
.tr-bits{position:absolute;left:50%;top:50%;width:0;height:0}
.tr-bits i{position:absolute;left:-9px;top:-9px;width:18px;height:18px;opacity:0;rotate:var(--a)}
.tr-bits .gi{width:18px;height:18px;color:#6fd6e8;filter:drop-shadow(0 0 6px #6fd6e8)}
.trade-fx.recycle .tr-card{animation:tr-break .55s ease-in both}
@keyframes tr-break{0%{transform:none;opacity:1}35%{transform:rotate(-3deg) scale(1.03)}55%{transform:rotate(3deg)}100%{transform:scale(.6);opacity:0;filter:brightness(2) blur(2px)}}
.trade-fx.recycle .tr-bits i{animation:tr-out .9s calc(.35s + var(--d)) cubic-bezier(.2,.7,.2,1) both}
@keyframes tr-out{0%{opacity:0;transform:translateY(0) scale(.4)}20%{opacity:1}100%{opacity:0;transform:translateY(-90px) scale(1)}}
.trade-fx.recruit .tr-bits i{animation:tr-in .6s var(--d) cubic-bezier(.5,0,.75,0) both}
@keyframes tr-in{0%{opacity:0;transform:translateY(-110px) scale(1)}30%{opacity:1}100%{opacity:0;transform:translateY(0) scale(.3)}}
.trade-fx.recruit .tr-card{animation:tr-reveal .55s .55s cubic-bezier(.2,.7,.2,1) both}
@keyframes tr-reveal{0%{opacity:0;transform:scale(.6);filter:brightness(3)}60%{opacity:1;transform:scale(1.06)}100%{transform:none;filter:none}}
.trade-fx.recycle .tr-stage::after{content:"";position:absolute;inset:auto;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 0 #6fd6e8aa;animation:tr-ring .7s .4s ease-out both}
@keyframes tr-ring{0%{box-shadow:0 0 0 0 #6fd6e8cc}100%{box-shadow:0 0 0 70px #6fd6e800}}
.tr-gain{font-size:30px;font-weight:700;font-style:normal;letter-spacing:-.03em;color:#fff;text-shadow:0 0 14px #6fd6e899}
.tr-unit{display:inline-flex;gap:4px;align-items:center;color:#c9eef5;font-size:12px;font-weight:600}
.tr-unit .gi{width:14px;height:14px;color:#6fd6e8}
.trade-fx.still *{animation:none!important}.trade-fx.still.recycle .tr-card{opacity:.25}
html.ui-v3 .trade-receipt{padding:4px 4px 10px;text-align:center}
html.ui-v3 .trade-receipt h3{font-size:16px;margin:0 0 4px}
html.ui-v3 .trade-receipt p{display:inline-flex;gap:4px;align-items:center;justify-content:center;color:var(--cp-head)}
html.ui-v3 .trade-receipt p .gi{width:14px;height:14px}
html.ui-v3 .trade-receipt small{display:block;margin-top:4px;color:var(--cp-muted)}

/* metal tiers (2026-10-28): +1~4 bronze, +5~7 silver, +8~10 gold, on cards and on the enhance stage */
html .mc-art>.mc-lv.bronze{background:linear-gradient(180deg,#e2a874,#8a4f22);color:#fff}
html .mc-art>.mc-lv.silver{background:linear-gradient(180deg,#ffffff,#9aa4b0);color:#2b2c30;text-shadow:0 1px 0 #fff8}
html .mc-art>.mc-lv.gold{background:linear-gradient(180deg,#fff0a8,#d39a14);color:#3d2a00;text-shadow:0 1px 0 #fff8}
.enh-badge.bronze{background:linear-gradient(180deg,#e2a874,#8a4f22)}
.enh-badge.silver{background:linear-gradient(180deg,#ffffff,#9aa4b0);color:#2b2c30;text-shadow:none}
.enh-badge.gold{background:linear-gradient(180deg,#fff0a8,#d39a14);color:#3d2a00;text-shadow:none}
/* player detail: trait cards compact (one row head, short text, no big blank) */
html.ui-v3 .player-detail :is(.trait-card,.skill-card,.situation-card,.trait-panel){padding:10px 12px;margin:6px 0;border-radius:8px;background:#fff;border:1px solid var(--p-line);box-shadow:none}
html.ui-v3 .player-detail :is(.trait-card,.skill-card,.situation-card,.trait-panel)>*{margin-top:0;margin-bottom:4px}
html.ui-v3 .player-detail :is(.trait-card,.skill-card,.situation-card,.trait-panel) p{font-size:12.5px;line-height:1.5;color:var(--cp-head)}

/* enh rules 2 (2026-10-28) */
html .mc-art .mc-ribbon::before{top:3cqw}
html.ui-v3 .enhance-steps span.done.base,html.ui-v3 .enhance-steps span.done.bronze{background:linear-gradient(180deg,#e2a874,#8a4f22);color:#fff}
html.ui-v3 .enhance-steps span.done.silver{background:linear-gradient(180deg,#ffffff,#9aa4b0);color:#2b2c30}
html.ui-v3 .enhance-steps span.done.gold{background:linear-gradient(180deg,#fff0a8,#d39a14);color:#3d2a00}
html.ui-v3 .enhance-steps span:not(.done){background:#ffffffa6;color:#9aa0aa}
html.ui-v3 .enhance-mode button.active{color:#fff!important}
html.ui-v3 .enhance-mode button:not(.active){color:var(--cp-head)!important}
/* awakening panel: step track like the enhance track, purple gems */
html.ui-v3 .awaken-panel.v2{display:grid;gap:8px;padding:10px 12px;margin:10px 0;border-radius:8px;border:0;background:linear-gradient(160deg,#2a1d55,#171236);color:#fff}
.awaken-panel.v2 .aw-head{display:flex;align-items:baseline;gap:8px}
.awaken-panel.v2 .aw-head b{font-size:14px}
.awaken-panel.v2 .aw-head span{color:#cbbcff;font-size:12px;font-weight:600}
.awaken-panel.v2 .aw-head strong{margin-left:auto;color:#ffd24a;font-size:15px;font-weight:700}
.awaken-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:3px;border-radius:5px;background:#ffffff14}
.awaken-steps span{display:grid;place-items:center;height:24px;border-radius:3px;font-size:11.5px;font-weight:600;color:#a99bd6;background:#ffffff0d}
.awaken-steps span.done{color:#fff;background:linear-gradient(180deg,#c3a2ff,#6a3fd0);box-shadow:inset 0 1px 0 #ffffff66}
.awaken-steps span.next{color:#fff;box-shadow:inset 0 0 0 1.5px #b88cff}
.awaken-panel.v2 .aw-gain{display:flex;flex-wrap:wrap;gap:6px}
.awaken-panel.v2 .aw-gain span{padding:3px 8px;border-radius:999px;background:#ffffff14;font-size:12.5px;color:#fff}
.awaken-panel.v2 .aw-gain .stat-value{color:#fff!important}
.awaken-panel.v2 .aw-rule{color:#b9aee0;font-size:11px;line-height:1.5}
.awaken-panel.v2 .enhance-state.max{background:#ffffff14;color:#ffd24a}
/* awakening stage: violet field, rings rising from the card, five gems lighting in turn */
.enh-rings{position:absolute;left:50%;top:44%;width:0;height:0;display:none}
.enh-stage.awaken .enh-rings{display:block}
.enh-stage.awaken .enh-streaks,.enh-stage.awaken .enh-shards{display:none}
.enh-stage.awaken .enh-bg{background:radial-gradient(circle at 50% 42%,#5b34b8,#25145a 60%,#0f0828);animation:none}
.enh-stage.awaken .enh-silhouette{background:#efe6ff;box-shadow:0 0 30px #c9a8ff,0 0 90px #8a5cff}
.enh-rings i{position:absolute;left:-40px;top:-40px;width:80px;height:80px;border-radius:50%;border:2px solid #d9c4ff;opacity:0;animation:enh-ring 1.1s calc(var(--n,0) * .18s) cubic-bezier(.2,.7,.2,1) both}
.enh-rings i:nth-child(2){--n:1}.enh-rings i:nth-child(3){--n:2}
@keyframes enh-ring{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(3.2)}}
.aw-gems{display:flex;gap:8px}
.aw-gems i{width:14px;height:14px;rotate:45deg;border-radius:2px;background:#ffffff26;box-shadow:inset 0 0 0 1px #ffffff40}
.aw-gems i.on{background:linear-gradient(135deg,#f1e6ff,#9a6bff);box-shadow:0 0 8px #b88cff}
.aw-gems i.fresh{animation:aw-gem .6s 1.35s cubic-bezier(.2,.7,.2,1) both}
@keyframes aw-gem{0%{transform:scale(.3);opacity:0}60%{transform:scale(1.5);opacity:1}100%{transform:none}}

/* deck tools v2 (2026-10-28) */
html .make-deck .rotation-cards article:last-child .rotation-face{display:flex;flex-direction:column}
.deck-editor .eyebrow,.deck-editor .kicker{display:none}
html.ui-v3 .deck-editor :is(.section-head h3,.section-title h2,.collapse-title h2){position:relative;padding-left:10px;font-size:15px;margin:0}
html.ui-v3 .deck-editor :is(.section-head h3,.section-title h2,.collapse-title h2)::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:3px;border-radius:2px;background:var(--cp-blue)}
html.ui-v3 .deck-editor p.help,html.ui-v3 .deck-editor .assist-note{font-size:11.5px;line-height:1.5;margin:4px 0 8px;color:var(--cp-muted)}
/* tactic presets: compact tiles, coloured edge per style, selected = cobalt */
html.ui-v3 .tactic-preset-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
@media (max-width:720px){html.ui-v3 .tactic-preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
html.ui-v3 .tactic-preset{display:grid;gap:3px;align-content:start;padding:9px 10px;border-radius:6px;border:0;border-top:3px solid var(--tp,#183c88);background:#fff;box-shadow:0 1px 0 #0000001a;text-align:left;min-height:0}
html.ui-v3 .tactic-preset[data-tactic-preset="onbase"]{--tp:#1f9a63}
html.ui-v3 .tactic-preset[data-tactic-preset="power"]{--tp:#c8372d}
html.ui-v3 .tactic-preset[data-tactic-preset="speed"]{--tp:#e0a92a}
html.ui-v3 .tactic-preset>span{display:flex;justify-content:space-between;align-items:baseline}
html.ui-v3 .tactic-preset>span b{font-size:14px}
html.ui-v3 .tactic-preset>span small{font-size:11px;color:var(--cp-muted)}
html.ui-v3 .tactic-preset strong{font-size:12px;color:var(--tp,#183c88)}
html.ui-v3 .tactic-preset p{margin:0;font-size:11px;line-height:1.45;color:var(--cp-muted)}
html.ui-v3 .tactic-preset em{justify-self:start;margin-top:3px;padding:2px 8px;border-radius:999px;background:#eef0f4;font-style:normal;font-size:11px;font-weight:600;color:var(--cp-head)}
html.ui-v3 .tactic-preset.selected{background:linear-gradient(160deg,#22305a,#121c38);color:#fff}
html.ui-v3 .tactic-preset.selected :is(b,strong){color:#fff}
html.ui-v3 .tactic-preset.selected :is(p,small){color:#b9c6e6}
html.ui-v3 .tactic-preset.selected em{background:var(--tp,#1a5dd0);color:#fff}
/* deck report */
html.ui-v3 .report-overview,html.ui-v3 .report-ratios{padding:12px;border-radius:8px;box-shadow:none}
html.ui-v3 .report-verdict{display:grid;grid-template-columns:1fr 1fr;gap:6px}
html.ui-v3 .report-verdict article{padding:9px 10px;border-radius:6px;background:#fff;border:0;border-left:3px solid #1f9a63}
html.ui-v3 .report-verdict article+article{border-left-color:#e0a92a}
html.ui-v3 .report-verdict span{font-size:11px;font-weight:600;color:var(--cp-muted)}
html.ui-v3 .report-verdict strong{display:block;font-size:13.5px;margin:2px 0}
html.ui-v3 .report-verdict p{margin:0;font-size:11px;line-height:1.45;color:var(--cp-muted)}
html.ui-v3 .report-metrics{display:grid;gap:3px}
html.ui-v3 .report-metrics>div{display:grid;grid-template-columns:1fr auto 52px;align-items:center;gap:8px;padding:7px 10px;border-radius:4px;border:0;background:linear-gradient(90deg,#183c881f var(--v,0%),#fff 0)}
html.ui-v3 .report-metrics>div>span{font-size:12.5px;font-weight:700}
html.ui-v3 .report-metrics em{justify-self:end;padding:1px 7px;border-radius:999px;background:#1f9a63;color:#fff;font-style:normal;font-size:11.5px;font-weight:600}
html.ui-v3 .report-metrics em.below{background:#b3263a}
html.ui-v3 .report-growth-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
html.ui-v3 .report-growth-grid>div{padding:8px 10px;border-radius:6px;background:#fff;border:0}
html.ui-v3 .ratio-row{padding:6px 0}
html.ui-v3 .ratio-track{height:6px;border-radius:3px;background:#e3e6ec}
html.ui-v3 .ratio-track i{border-radius:3px;background:linear-gradient(90deg,#1a5dd0,#183c88)}
/* enhance rows with the card face */
.er-card{display:block;flex:none;width:44px}
.er-card .mc-art{width:100%;border-radius:4px}
html.ui-v3 .enhance-row-player{display:flex;gap:10px;align-items:center}
html.ui-v3 .enhance-list>article{border-radius:6px;background:#fff;border:0;box-shadow:0 1px 0 #0000001a;padding:6px 8px}

/* trait cards compact (2026-10-28): charcoal head strip, small medallion, condition chips and status on one line */
html .player-detail .ability-card{margin:6px 0;border:0;border-radius:8px;background:#fff;box-shadow:0 1px 0 #0000001a}
html .player-detail .ability-card>header{padding:8px 10px;gap:9px;background:linear-gradient(110deg,#3f4044,#2b2c30);color:#fff}
html .player-detail .ability-medallion{width:32px;height:32px;border-width:1.5px}
html .player-detail .ability-card header small{font-size:10.5px;color:#c9cdd6}
html .player-detail .ability-card h3{font-size:14px;margin:0!important;line-height:1.3;color:#fff}
html .player-detail .ability-card header>strong{font-size:19px;color:#ffd24a}
html .player-detail .ability-card header>strong small{font-size:10.5px;color:#ffe9a8}
html .player-detail .situation-card>header{background:linear-gradient(110deg,#183c88,#122c66)}
html .player-detail .ability-body{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px}
html .player-detail .ability-condition{gap:4px;font-size:11px}
html .player-detail .ability-condition>span{padding:2px 8px;font-size:11px;border-radius:999px}
html .player-detail .ability-body p{order:3;flex-basis:100%;margin:0;font-size:11.5px;line-height:1.5}
html .player-detail .ability-status{display:inline-block;margin-left:auto;padding:2px 8px}

/* card ribbon grade chip: never inherit the fixed-size badge box (match header showed a 27x18 box with 5px text) */
html .mc-art .mc-ribbon .grade-badge{width:auto!important;min-width:0!important;height:auto!important;min-height:0!important;border:0!important;padding:0 2.4cqw!important;font-size:9.5cqw!important;line-height:13cqw!important}

/* scene drama (2026-10-28) */
.play-scene .pf-slam{font-size:27px;font-weight:700;font-style:normal;letter-spacing:-.02em;fill:#ffd24a;stroke:#3d2a00;stroke-width:1.6px;paint-order:stroke;filter:drop-shadow(0 0 6px #ffd24acc)}

/* 141+ ratings: solid magenta instead of rainbow text (2026-10-28) */
html .rating-prism,html .player-side .rating-prism,html .pack-hero .rating-prism{display:inline;background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;-webkit-text-fill-color:currentColor!important;color:#b0189e!important;text-shadow:none!important}
html .stat-legend .rating-prism i{background:#b0189e!important}

/* bulk stage (2026-10-28) */
dialog.bulk-stage{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:none;color:#fff;display:grid;place-items:center;overflow:auto;cursor:pointer}
dialog.bulk-stage::backdrop{background:#0008}
.bs-bg{position:fixed;inset:0;background:radial-gradient(circle at 50% 40%,#1d4f9e,#0b2350 60%,#06142e)}
.bulk-stage.awaken .bs-bg{background:radial-gradient(circle at 50% 40%,#5b34b8,#25145a 60%,#0f0828)}
.bulk-stage.tactic .bs-bg{background:radial-gradient(circle at 50% 40%,#1f7a6a,#0d3a3a 60%,#061a1c)}
.bs-wrap{position:relative;display:grid;justify-items:center;gap:12px;width:min(560px,100% - 32px);padding:24px 0;text-align:center}
.bs-title{font-size:26px;font-weight:700;font-style:normal;letter-spacing:-.02em;text-shadow:0 2px 10px #0008;animation:bs-in .4s cubic-bezier(.2,.7,.2,1) both}
.bs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px 8px;width:100%}
.bulk-stage.solo .bs-grid{grid-template-columns:150px;justify-content:center}
.bs-item{display:grid;justify-items:center;gap:5px;animation:bs-deal .45s calc(var(--i) * 70ms) cubic-bezier(.2,.7,.2,1) both}
.bs-face{position:relative;width:100%;display:grid;justify-items:center;gap:3px}
.bs-face .mc-art{width:100%;border-radius:4px}
.bs-name{font-size:11.5px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.bulk-stage.solo .bs-name{font-size:15px}
.bs-item.ok .bs-face{animation:bs-glow .7s calc(.5s + var(--i) * 120ms) ease-out both}
.bs-item.fail .bs-face{animation:bs-dim .4s calc(.5s + var(--i) * 120ms) ease-out both}
.bs-res{display:inline-flex;align-items:center;gap:4px;min-height:24px;animation:bs-stamp .45s calc(.5s + var(--i) * 120ms) cubic-bezier(.2,.7,.2,1) both}
.bs-res .enh-badge{min-width:30px;height:22px;font-size:12px;font-style:normal;padding:0 5px}
.bulk-stage.solo .bs-res .enh-badge{min-width:42px;height:30px;font-size:16px}
.bs-res>b{color:#ffd24a;font-size:14px}
.bs-res em{font-style:normal;font-size:12px;font-weight:600;color:#c9c4e0}
.bs-tac{position:relative;display:grid;place-items:center;gap:6px;width:100%;aspect-ratio:3/4;border-radius:6px;background:linear-gradient(160deg,#2a3f6e,#121c38);box-shadow:inset 0 0 0 1.5px var(--tc,#5aa6ff)}
.bs-tac[data-grade="SSR"]{--tc:#ffd24a}.bs-tac[data-grade="SR"]{--tc:#b88cff}.bs-tac[data-grade="R"]{--tc:#5aa6ff}
.bs-tac .tactic-symbol{width:56%;aspect-ratio:1;height:auto;border-radius:50%;overflow:hidden}
.bs-sub{font-size:13px;color:#e3ecff}
@keyframes bs-in{0%{opacity:0;transform:scale(.9)}100%{opacity:1;transform:none}}
@keyframes bs-deal{0%{opacity:0;transform:translateY(40px) rotate(-6deg) scale(.8)}100%{opacity:1;transform:none}}
@keyframes bs-glow{0%{filter:brightness(1)}35%{filter:brightness(1.9) drop-shadow(0 0 14px #9fd0ff)}100%{filter:drop-shadow(0 0 6px #9fd0ff88)}}
.bulk-stage.awaken .bs-item.ok .bs-face{animation-name:bs-glow-aw}
@keyframes bs-glow-aw{0%{filter:brightness(1)}35%{filter:brightness(1.8) drop-shadow(0 0 14px #c9a8ff)}100%{filter:drop-shadow(0 0 6px #b88cff88)}}
@keyframes bs-dim{to{filter:grayscale(.85) brightness(.7)}}
@keyframes bs-stamp{0%{opacity:0;transform:scale(1.8)}60%{opacity:1;transform:scale(.92)}100%{opacity:1;transform:none}}
.bulk-stage.still *{animation:none!important}
.tactic-bulk-btn{margin:6px 0 8px}

/* reel caption: the result is revealed when the ball lands, not before the play (2026-10-28) */
.reel-caption .rc-reveal{opacity:0;animation:rc-reveal .35s var(--rd,0s) cubic-bezier(.2,.7,.2,1) forwards}
.reel-caption b.rc-reveal{display:block;animation-name:rc-slam}
@keyframes rc-reveal{to{opacity:1}}
@keyframes rc-slam{0%{opacity:0;transform:scale(1.5)}60%{opacity:1;transform:scale(.96)}100%{opacity:1;transform:none}}

/* plate result compact (2026-10-28): duel cards as one row each (icon + text), result as one band (art + title + chips) */
html.ui-v3 .plate-result .reveal-label{padding:5px 10px!important;font-size:11px!important;min-height:0!important}
html.ui-v3 .plate-result .revealed{grid-template-columns:1fr auto 1fr!important;gap:6px!important;padding:6px 8px!important}
html.ui-v3 .plate-result .duel-card{display:grid!important;grid-template-columns:36px 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;text-align:left!important;padding:6px 8px!important;min-height:0!important;border-radius:8px!important}
html.ui-v3 .plate-result .duel-card .duel-face{grid-row:1/3;width:36px!important;height:36px!important;margin:0!important}
html.ui-v3 .plate-result .duel-card>span:not(.duel-face){font-size:10.5px!important;margin:0!important}
html.ui-v3 .plate-result .duel-card b{font-size:14px!important;margin:0!important;line-height:1.25}
html.ui-v3 .plate-result .revealed>strong{font-size:11px!important}
html.ui-v3 .plate-result .result-call{display:grid!important;grid-template-columns:52px 1fr auto;grid-template-areas:"art label run" "art title run" "art who trait";column-gap:10px;row-gap:1px;align-items:center;text-align:left!important;padding:8px 12px!important;min-height:0!important}
html.ui-v3 .plate-result .result-call .result-art{grid-area:art;width:52px!important;height:52px!important;margin:0!important}
html.ui-v3 .plate-result .result-call>span:first-of-type{grid-area:label;font-size:10px!important;margin:0!important}
html.ui-v3 .plate-result .result-call>b{grid-area:title;font-size:24px!important;line-height:1.1!important;margin:0!important}
html.ui-v3 .plate-result .result-call>p{grid-area:who;font-size:11.5px!important;margin:0!important}
html.ui-v3 .plate-result .result-call .run-impact{grid-area:run;justify-self:end;font-size:18px!important;margin:0!important}
html.ui-v3 .plate-result .result-call .trait-trigger{grid-area:trait;justify-self:end;font-size:10.5px!important;padding:2px 8px!important;margin:0!important}

/* LR v2 (2026-10-28): obsidian card - drop the old green rays/border; gold edge, iridescent ribbon line */
html .mc-art[data-grade="LR"]{border-color:#f3d27a!important}
html .mc-art[data-grade="LR"]::before{display:none!important}
html .mc-art[data-grade="LR"] .mc-ribbon{--m1:#ff9de2}

/* enhance stage: success and failure share the same opening background until the result moment (the failure keyframe
   used fill-mode both, so its purple first frame showed during the delay and gave the result away) */
.enh-stage.fail .enh-bg{animation:enh-fail-bg 1s .9s ease-out forwards}
.enh-stage.ok .enh-bg{animation:enh-ok-bg .5s .9s ease-out forwards}

/* enhance preview stats as tiles: next value big, gain chip on the stats that rise, the rest dimmed (2026-10-28) */
html.ui-v3 .enhance-stats.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(58px,1fr));gap:4px;margin:8px 0}
html.ui-v3 .enhance-stats.grid>span{display:grid;justify-items:center;gap:1px;padding:6px 4px;border-radius:6px;background:#fff;opacity:.6}
html.ui-v3 .enhance-stats.grid>span.up{opacity:1;box-shadow:inset 0 0 0 1.5px var(--cp-blue)}
html.ui-v3 .enhance-stats.grid small{font-size:10.5px;font-weight:700;color:var(--cp-muted)}
html.ui-v3 .enhance-stats.grid .stat-value{font-size:17px;line-height:1.1}
html.ui-v3 .enhance-stats.grid em{font-style:normal;font-size:10.5px;font-weight:700;color:#fff;background:#1f9a63;border-radius:999px;padding:0 6px}

/* field library as card faces (same as the deck cards), 4 to a row (2026-10-28) */
html.ui-v3 .field-library-list:has(.fl-v2){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:8px 6px}
html.ui-v3 .field-library-card.fl-v2{display:flex!important;flex-direction:column;padding:0!important;min-height:0!important;height:auto!important;border:0!important;background:none!important;box-shadow:none!important;border-radius:6px}
html.ui-v3 .field-library-card.fl-v2 .mc-art{width:100%}
html.ui-v3 .field-library-card.fl-v2.selected{outline:2.5px solid var(--cp-blue-hi);outline-offset:2px}
html.ui-v3 .field-library-card.fl-v2:active{transform:scale(.97)}
html.ui-v3 .field-library .player-sort-tools,html.ui-v3 .field-library .field-filter{gap:6px}
html.ui-v3 .field-library :is(select,input){min-height:36px!important;height:36px;font-size:13px}
html.ui-v3 .field-library>.help{font-size:11px;margin:2px 0 8px}
/* player detail: compact rating block and synergy totals */
html.ui-v3 .player-detail .detail-section{padding:10px 12px!important;margin:8px 0!important}
html.ui-v3 .player-detail .detail-rating-heading h3{font-size:14px}
html.ui-v3 .player-detail .detail-rating-heading>small{font-size:10.5px}
html.ui-v3 .player-detail .stat-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(52px,1fr))!important;gap:4px!important;margin-top:6px}
html.ui-v3 .player-detail .stat-grid>div{padding:5px 2px!important;min-height:0!important;border-radius:6px}
html.ui-v3 .player-detail .stat-grid span{font-size:10.5px!important}
html.ui-v3 .player-detail .stat-grid .stat-value{font-size:17px!important;line-height:1.15}
html.ui-v3 .synergy-totals{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(92px,1fr))!important;gap:4px!important}
html.ui-v3 .synergy-totals>div{min-width:0;padding:6px 4px!important}
html.ui-v3 .synergy-totals>div>b{gap:2px;font-size:12px!important;white-space:nowrap}
html.ui-v3 .synergy-totals>div>b .stat-value{font-size:13px!important}
/* top bar subtitle no longer runs into the currency pills on phones */
@media (max-width:760px){html .topbar .save-status{display:none}}

/* card face v3 (friend feedback 2026-10-28): grade chip top-right, position in the bottom band, smaller OVR, photo
   scaled up from the top so the legs crop out and the face sits clear of the OVR */
html .mc-art>.mc-pos.mc-gr,html .player-side .vs-card .mc-art>.mc-pos.mc-gr{padding:0!important;background:none!important;line-height:0!important}
html .mc-art .mc-gr .grade-badge{display:inline-block;width:auto!important;min-width:0!important;height:auto!important;min-height:0!important;border:0!important;margin:0!important;padding:0 2.4cqw!important;border-radius:1.6cqw;box-shadow:inset 0 1px 0 #ffffff80,inset 0 -1px 0 #0006,0 1px 2px #0008}
html .mc-art .mc-ribbon .mc-rpos{margin:0;padding:0 2cqw;border-radius:1.6cqw;background:#0f1a14e6;color:#5fe08a;font-size:10cqw;line-height:13cqw;font-weight:900}
html .mc-art>.compact-ovr strong,html.ui-v3 .mc-art>.compact-ovr strong{font-size:20cqw!important}
html .mc-art>img.mc-photo.cut,html .pk-front.cp-front img.mc-photo.cut{top:9%;height:118%;object-fit:contain;object-position:50% 0}
html .mc-art>img.mc-photo:not(.cut){object-position:50% 8%}

.count-row{display:flex;gap:6px}.count-row input{flex:1;min-width:0}.count-row .btn{flex:none;min-width:64px}
html .mc-art .mc-gr .grade-badge{font-size:11.5cqw!important;line-height:15cqw!important}

/* grade backgrounds on every player thumbnail (lineup, targets, lists) - same art as the cards (2026-10-28) */
html img.player-art[data-grade="N"]{background:url(/assets/card-bg-n.svg) center/cover}
html img.player-art[data-grade="R"]{background:url(/assets/card-bg-r.svg) center/cover}
html img.player-art[data-grade="SR"]{background:url(/assets/card-bg-sr.svg) center/cover}
html img.player-art[data-grade="SSR"]{background:url(/assets/card-bg-ssr.svg) center/cover}
html img.player-art[data-grade="UR"]{background:url(/assets/card-bg-ur.svg) center/cover}
html img.player-art[data-grade="LR"]{background:url(/assets/card-bg-lr2.svg) center/cover}
/* lineup rows: white tiles, cobalt order number, tighter */
html.ui-v3 .lineup-row{padding:5px 6px!important;margin:3px 0!important;border-radius:8px;background:#fff;border:0!important;box-shadow:0 1px 0 #0000001a;min-height:0!important}
html.ui-v3 .lineup-row .order{color:var(--cp-blue);font-style:normal;font-weight:700;font-size:16px}
html.ui-v3 .lineup-row .lineup-photo img{width:40px!important;height:52px!important;object-fit:cover;object-position:50% 8%;border-radius:4px}
html.ui-v3 .lineup-row .lineup-name b{font-size:14px;color:var(--cp-head)}
html.ui-v3 .lineup-row .lineup-name>span{font-size:11px;color:var(--cp-muted)}
html.ui-v3 .lineup-row .position{min-height:36px!important;padding:2px 8px!important;background:#2b2c30!important;color:#5fe08a!important;border:0!important;border-radius:6px}
html.ui-v3 .lineup-row .position small{color:#9aa0aa}
html.ui-v3 .lineup-row .move-buttons button{min-height:36px!important;min-width:34px!important}
/* bench as card faces */
html.ui-v3 .bench-chips.bench-faces{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:8px 6px}
html.ui-v3 .bench-chips.bench-faces>button{display:flex!important;flex-direction:column;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;min-height:0!important}
html.ui-v3 .bench-chips.bench-faces .mc-art{width:100%}
/* training targets: compact cards */
html.ui-v3 .target-grid{gap:8px!important}
html.ui-v3 .target-grid>article{padding:10px!important;gap:6px!important}
html.ui-v3 .target-player img.player-art{width:56px!important;height:74px!important;object-fit:cover;object-position:50% 8%;border-radius:5px}
html.ui-v3 .target-player{display:flex!important;gap:8px;align-items:center;text-align:left}
html.ui-v3 .target-grid>article>b{font-size:13px}
html.ui-v3 .target-grid>article>p,html.ui-v3 .target-grid>article>small{font-size:11px;margin:0}
html.ui-v3 .target-grid .growth-pips{margin:2px 0}
html.ui-v3 .target-grid .btn{min-height:36px!important;font-size:12.5px}
html.ui-v3 .training-targets>.help{font-size:11px}
html.ui-v3 .lineup-row{grid-template-columns:16px 18px 40px minmax(0,1fr) auto auto auto!important;column-gap:6px!important}
html.ui-v3 .lineup-row .lineup-photo{width:40px!important;padding:0!important}

/* vs header: the position chip in the card band is not a player-side text span */
html.ui-v3 .versus-card .player-side .mc-art .mc-ribbon .mc-rpos,html .player-side .vs-card .mc-ribbon .mc-rpos{font-size:10cqw!important;line-height:13cqw!important;color:#5fe08a!important;font-weight:900!important;white-space:nowrap!important;padding:0 2cqw!important;background:#0f1a14e6!important}
/* legend fusion: LR card faces; not owned = dimmed, owned = full colour with a gold edge */
html.ui-v3 .fuse-face{display:flex!important;flex-direction:column;align-items:stretch;gap:3px;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;min-height:0!important}
html.ui-v3 .fuse-face .mc-art{width:100%;filter:grayscale(.9) brightness(.8);opacity:.75;transition:filter .2s ease,opacity .2s ease}
html.ui-v3 .fuse-face.owned .mc-art{filter:none;opacity:1;box-shadow:0 0 0 1.5px #f3d27a}
html.ui-v3 .fuse-face.picked .mc-art{outline:2.5px solid var(--cp-blue-hi);outline-offset:2px;filter:none;opacity:1}
html.ui-v3 .fuse-face small{font-size:11px;font-weight:600;text-align:center;color:var(--cp-head)}
html.ui-v3 .fuse-face .fuse-tr{z-index:4}
html.ui-v3 .fuse-legends{gap:6px!important}
html.ui-v3 .fuse-mosaic{gap:8px 6px!important}
html.ui-v3 .fuse-card{padding:10px!important;gap:8px}
/* trade filter checkbox as an inline chip */
html.ui-v3 .trade-missing{display:inline-flex!important;flex-direction:row!important;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#fff;font-size:12.5px;font-weight:700;white-space:nowrap}
html.ui-v3 .trade-missing input{width:16px!important;height:16px!important;margin:0}
/* auto deck sheet: compact controls, fixed-player list with grade-backed thumbnails */
html.ui-v3 .auto-deck-controls{display:flex!important;align-items:center;gap:8px}
html.ui-v3 .auto-deck-controls label{flex:none;font-size:12px;font-weight:600}
html.ui-v3 .auto-deck-controls select{flex:1;min-height:38px!important;height:38px}
html.ui-v3 .auto-fixed{margin:8px 0!important;padding:8px 10px!important;border-radius:8px;background:#fff}
html.ui-v3 .auto-fixed summary{font-size:13px;font-weight:600}
html.ui-v3 .auto-fixed-list{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px}
html.ui-v3 .auto-fixed-list label{display:flex!important;align-items:center;gap:6px;padding:4px 6px;border-radius:6px;background:#f1f2f5;font-size:12px}
html.ui-v3 .auto-fixed-list img{width:30px!important;height:40px!important;object-fit:cover;object-position:50% 8%;border-radius:3px;background:#8d949e}
html.ui-v3 .auto-deck-dialog .help,html.ui-v3 dialog .auto-deck-note{font-size:11px}

/* replacement picker: card faces, tighter rows (2026-10-28) */
html.ui-v3 .candidate-photo.cface{width:52px!important;height:auto!important;flex:none;background:none!important;border:0!important;padding:0!important;overflow:visible!important}
html.ui-v3 .candidate-photo.cface .mc-art{width:100%}
html.ui-v3 label:has(>.candidate-photo.cface){padding:6px 8px!important;gap:8px!important;min-height:0!important}
html.ui-v3 label:has(>.candidate-photo.cface) .candidate-main b{font-size:14px}
html.ui-v3 label:has(>.candidate-photo.cface) .candidate-main>span{font-size:11px}
/* toast inside an open sheet sits above it */
dialog[open]>#toast{position:fixed;z-index:10}
/* special tactic cards: one compact row - icon, text, count; enhance controls inline */
html.ui-v3 .special-card{grid-template-columns:44px minmax(0,1fr) auto!important;gap:4px 10px!important;padding:8px 10px!important;border-radius:8px!important;min-height:0!important}
html.ui-v3 .special-card .tactic-symbol{width:44px!important;height:44px!important;align-self:start}
html.ui-v3 .special-card small{font-size:10.5px!important}
html.ui-v3 .special-card b{font-size:14px!important;display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:1px 0!important}
html.ui-v3 .special-card p{display:flex;flex-wrap:wrap;gap:2px 8px;margin:2px 0!important;font-size:11.5px!important;line-height:1.4}
html.ui-v3 .special-card .special-enhance{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px!important}
html.ui-v3 .special-card .special-enhance .btn{min-height:32px!important;padding:0 12px!important;font-size:12px}
html.ui-v3 .special-card .special-mat{font-size:11px!important}
html.ui-v3 .special-card>strong{font-size:16px!important;align-self:start}
html.ui-v3 .special-grid{gap:6px!important}

/* star row on a dark pill (2026-10-28): the old top fade let the stars sink into busy backgrounds (LR sweeps) */
html .mc-art .mc-stars{left:2cqw;right:auto;top:2cqw;gap:.4cqw;padding:.8cqw 1.8cqw;border-radius:4cqw;background:#000000b8;box-shadow:0 0 0 .6px #ffffff2e}
html .mc-art .mc-stars .gi{width:8cqw;height:8cqw}

/* lineup name chips (2026-10-28): the generic grey ".lineup-name span" rule out-ranked the chip colours */
html .lineup-row .lineup-name .awaken-inline{color:#ffd24a}
html .lineup-row .lineup-name>span.compact-ovr{color:#c9ccd3}
html .lineup-row .lineup-name>.compact-ovr strong{color:#fff}

/* awaken / transcend chips outside the card match the card chips (2026-10-28): awaken purple, transcend mint, white text */
html .awaken-inline,html .lineup-row .lineup-name .awaken-inline{border:0;background:linear-gradient(180deg,#c9a2ff,#6a3fd0);color:#fff;text-shadow:0 1px 0 #0008;box-shadow:0 0 0 1px #0004}
html .awaken-inline i,html .lineup-row .lineup-name .awaken-inline i{background:#fff}
html .transcend-inline,html .lineup-row .lineup-name .transcend-inline{border:0;background:linear-gradient(180deg,#9ff5d8,#169a72);color:#fff;text-shadow:0 1px 0 #0008;box-shadow:0 0 0 1px #0004}
html .transcend-inline .gi{color:#fff}
html .mc-art>.transcend-inline .gi{width:9cqw;height:9cqw}

/* fusion faces (2026-10-28): the transcend stars replace the card's own star row in the same dark pill, not on top of it */
html .fuse-face .mc-art .mc-stars{display:none}
html .fuse-face .fuse-tr{left:4px;right:auto;top:4px;padding:1px 4px;border-radius:8px;background:#000000b8;box-shadow:0 0 0 .6px #ffffff2e}
html .fuse-face .fuse-tr .tr-stars{gap:1px}
/* the old ".fuse-face img" gold ring leaked onto the card photo and club logo */
html .fuse-face .mc-art img{border:0;box-shadow:none}
html .fuse-face .mc-art .mc-photo{border-radius:0}

/* pack reveal switch at the top of the pack sheet (2026-10-28): easy to reach without scrolling */
html .shop-sheet>.reveal-pref{margin:0 0 8px;padding:6px 10px;border-radius:10px;background:#fff;box-shadow:0 0 0 1px #0000000f;flex-wrap:nowrap;overflow-x:auto}
html .shop-sheet>.reveal-pref span{color:var(--navy);white-space:nowrap}
html .shop-sheet>.reveal-pref button{white-space:nowrap;padding:4px 9px}

/* pack smooth (2026-10-28): no blend modes or filters on big moving layers (each forced a repaint per frame);
   cinema bars and the grade title for SSR+ */
html .pk-gloss,html .pk-flash,html .pk-flare b,html .pk-pillars{mix-blend-mode:normal}
html .pk-sigil,html .pk-comet::after,html .pk-back svg{filter:none}
html .pk-sigil g{stroke-width:2.4}
html :is(.pk-pack,.pk-glow,.pk-ring,.pk-flare i,.pk-flare b,.pk-sigil,.pk-flash,.pk-dim){will-change:transform,opacity}
html .pk-lb{position:absolute;left:0;right:0;height:11vh;background:#000;z-index:6;pointer-events:none;transform:scaleY(0);will-change:transform}
html .pk-lb.t{top:0;transform-origin:50% 0}
html .pk-lb.b{bottom:0;transform-origin:50% 100%}
html .pk-title{position:absolute;left:0;right:0;top:13vh;z-index:7;text-align:center;opacity:0;pointer-events:none;font-size:clamp(40px,13vw,84px);font-weight:900;font-style:italic;letter-spacing:-.03em;line-height:1;color:#ffd24a;-webkit-text-stroke:2px #3d2a00;paint-order:stroke;text-shadow:0 3px 0 #0008;will-change:transform,opacity}
html .pk-title[data-grade="UR"]{color:#ff5d73;-webkit-text-stroke-color:#4a0010}
@media (prefers-reduced-motion:reduce){html .pk-lb,html .pk-title{display:none}}
/* grounded pack scene (2026-10-28): no spinning rays, rainbow pillars, glitter, sigil or giant letters; a dark room
   with one overhead spotlight, cinema bars and the card itself carry the moment */
html .pk-fx :is(.pk-rays,.pk-pillars,.pk-sigil,.pk-legend,.pk-title,.pk-sparks,.pk-comet){display:none!important}
html .pk-fx .pk-glow{position:absolute;inset:0;width:auto;height:auto;margin:0;border-radius:0;box-shadow:none;filter:none}

/* result sheet: same grounded look (no starburst); the opening dialog fills the screen edge to edge */
html .pr-stage .pr-rays{display:none!important}
html .pr-stage{background:radial-gradient(ellipse 60% 48% at 50% 0%,color-mix(in srgb,var(--pr-c,#ffc94a) 22%,transparent),transparent 75%)}
html .pr-stage[data-grade="LR"]{--pr-c:#ffc94a}html .pr-stage[data-grade="UR"]{--pr-c:#ff5d73}html .pr-stage[data-grade="SSR"]{--pr-c:#ffd24a}html .pr-stage[data-grade="SR"]{--pr-c:#a98bff}html .pr-stage:is([data-grade="R"],[data-grade="N"]){--pr-c:#8fb4e8}
html dialog.pk-fx{border-radius:0;background:#0b0c0f}

/* goals screen v2 (2026-10-28): navy banner like the other hubs, one scrolling chip row, compact mission rows */
html.ui-v3 .goal-banner,html .goal-banner{display:flex;align-items:center;gap:10px;padding:12px 14px;border:0;border-radius:14px;background:linear-gradient(135deg,#1d2a52,#121933);color:#fff;box-shadow:0 6px 18px #0b12302e}
html .goal-banner>div{min-width:0;flex:1}
html .goal-banner small{color:#9fb0dd;font-size:11px;font-weight:700}
html .goal-banner h2{margin:2px 0 4px;color:#fff;font-size:17px;font-weight:700}
html .goal-banner span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#c3cbe3;font-size:11px;line-height:1.45}
html .goal-banner .btn{flex:none;min-height:34px;padding:0 12px;border-radius:999px;background:#ffd24a;color:#2b1d00;font-size:12px;font-weight:700;border:0}
html.ui-v3 .goal-tabs,html .goal-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:12px 0 8px;padding:2px 0}
html .goal-tabs::-webkit-scrollbar{display:none}
html .goal-tabs .btn{flex:none;min-height:32px;padding:0 13px;border-radius:999px;font-size:12px;font-weight:600;border:1px solid #d5d9e3;background:#fff;color:#3a3f4c;box-shadow:none}
html .goal-tabs .btn[aria-pressed="true"]{background:#1d2a52;border-color:#1d2a52;color:#fff}
html.ui-v3 .goal-grid,html .goal-grid{display:grid;grid-template-columns:1fr;gap:6px}
html.ui-v3 .goal-card,html .goal-card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title reward" "progress progress" "status go";align-items:center;gap:6px 10px;min-height:0;padding:10px 12px;border-radius:12px;border:1px solid #e3e6ee;background:#fff;box-shadow:none}
html .goal-card h3{grid-area:title;margin:0;font-size:14px;font-weight:700;color:#1b2033}
html .goal-card>strong{grid-area:reward;justify-self:end;padding:2px 8px;border-radius:999px;background:#fff6d6;color:#8a5a00;font-size:12px;font-weight:700;white-space:nowrap}
html .goal-card .goal-progress{grid-area:progress;display:flex;align-items:center;gap:8px;margin:0}
html .goal-card .goal-progress b{flex:none;font-size:12px;color:#1b2033}
html .goal-card .goal-progress progress{flex:1;height:6px}
html .goal-card .status-pill{grid-area:status;justify-self:start;position:static;margin:0;font-size:10.5px;padding:2px 8px}
html .goal-card .goal-go,html .goal-card>button{grid-area:go;justify-self:end;min-height:28px;padding:0 12px;border-radius:999px;font-size:12px}
html .goal-card.done,html .goal-card:has(.goal-claimed){background:#fffaf0;border-color:#f3dfa6}
html.ui-v3 .goal-banner .btn.primary{background:#ffd24a!important;color:#2b1d00!important;opacity:1}
html.ui-v3 .goal-card .goal-progress{width:auto}
html.ui-v3 .goal-grid .goal-card{min-height:0!important;padding:10px 12px!important}
html.ui-v3 .goal-grid .goal-card .status-pill{justify-self:start!important}

/* card back v2 (2026-10-28): deep navy with a fine diamond lattice, a thin gold inner frame, a small emblem and
   the wordmark, like a printed trading-card back (was a flat grey-blue glow) */
html .pk-fx .pk-back{
  color:#e2bf6b;}
html .pk-fx .pk-back svg{width:34%;margin-top:-10%}
html .pk-fx .pk-back::before{content:"DIAMOND ORIGIN";position:absolute;left:0;right:0;text-align:center;font-weight:900;letter-spacing:.32em;text-indent:.32em;opacity:.9}
html .pk-fx .pk-back::after{background:linear-gradient(115deg,transparent 38%,#ffffff12 48%,transparent 58%)}
/* card back art as an image (foil frame, lattice, emblem); the wordmark sits between its two gold rules */
html .pk-fx .pk-back{box-shadow:none;border:0}
html .pk-fx .pk-back svg{display:none}
html .pk-fx .pk-back::before{bottom:auto;display:flex;align-items:center;justify-content:center;font-size:clamp(9px,3vw,14px);color:#f0d38a;text-shadow:0 1px 0 #000a}

/* text colour fixes (2026-10-28): energy tiles in the navy comparison panel, grade text on the match VS card */
html .player-comparison .compare-energy>div{background:#ffffff14!important;color:#fff}
html .player-comparison .compare-energy small{color:#b9c6e6!important}
html .player-comparison .compare-energy b{color:#fff!important}
html .player-side .vs-card .mc-art .grade-badge{color:#fff!important;text-shadow:0 1px 0 #0007}
/* dark sheets: a dark scrollbar track instead of the bright default strip beside the close button */
html dialog#player-dialog,html dialog#player-dialog .sheet-body{scrollbar-color:#ffffff4d transparent}

/* team colours v2 (2026-10-28): compact rows like the other deck panels; art, name and level on one line, the
   count as a badge, the effect under it, a small pill toggle; the chosen rows carry a navy edge */
html .team-colors{border-radius:14px;border:1px solid #e1e4ec;background:#fff}

html .team-colors>summary b{font-size:15px;font-weight:700;color:#1b2033}
html .team-colors>summary small{display:block;color:#5d6475;font-size:11.5px}
html .team-colors>.help{margin:6px 0 8px;font-size:11px;line-height:1.45;color:#6b7182}
/* head: title, auto tag, count, caret; then the active colours as chips */
html .team-colors>summary{display:grid;cursor:pointer;list-style:none}
html .team-colors>summary::-webkit-details-marker{display:none}
.tcs-head{display:flex;align-items:center;gap:8px}
.tcs-head b{flex:1}
.tcs-head em{font-style:normal;font-size:11px;font-weight:600;color:#6b7182;padding:2px 8px;border-radius:999px;background:#eef0f5}
.tcs-caret{width:16px;height:16px;color:#6b7182;transition:transform .2s ease-out}
html .team-colors[open] .tcs-caret{transform:rotate(180deg)}
.tcs-chips{display:flex;flex-wrap:wrap;gap:6px}
.tcs-chips small{font-size:12px;color:#6b7182}
.tcs-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border-radius:999px;background:#121933;color:#f4efe6}
.tcs-chip .tcs-art{width:24px;height:24px;border-radius:999px;object-fit:cover}
.tcs-chip b{font-size:12.5px;font-weight:600}
.tcs-chip i{font-style:normal;font-size:10.5px;font-weight:700;color:#d9b25a}

html .team-colors .color-list{display:grid;gap:6px}
html .team-colors .color-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name count" "effect btn";align-items:center;gap:4px 10px;padding:8px 10px;border-radius:12px;border:1px solid #e3e6ee;border-left-width:1px;background:#f7f8fb;box-shadow:none}
html .team-colors .color-row>div{grid-area:name;min-width:0}
html .team-colors .color-row>div b{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:#1b2033}
html .team-colors .color-row .color-art{width:28px;height:28px;border-radius:8px;object-fit:cover;flex:none}
html .team-colors .color-row .color-level{padding:0 6px;border-radius:999px;background:#1d2a52;color:#ffd24a;font-size:10px;font-style:normal;font-weight:700;line-height:16px}
html .team-colors .color-row>div small{display:block;margin:2px 0 0 34px;color:#6b7182;font-size:11px}
html .team-colors .color-row>strong{grid-area:count;justify-self:end;padding:2px 9px;border-radius:999px;background:#e9ecf4;color:#1b2033;font-size:12px;font-weight:700}
html .team-colors .color-row .color-effect{grid-area:effect;margin-left:34px;color:#2a3045;font-size:12px;font-weight:600;line-height:1.4}
html .team-colors .color-row .color-effect small{color:#7a8091;font-weight:600}
html .team-colors .color-row>.btn{grid-area:btn;justify-self:end;width:auto;min-height:28px;padding:0 12px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap}
html .team-colors .color-row>.btn:disabled{background:#eceef3;color:#9aa0ad;border-color:transparent}
html .team-colors .color-row.on{background:#fff;border-color:#1d2a52;box-shadow:inset 3px 0 0 #ffd24a}
html .team-colors .color-row.on>strong{background:#1d2a52;color:#fff}
html .team-colors .color-row:not(.met):not(.on){opacity:.6}

/* signing room (2026-10-28): the SSR+ announcement scene in pack-fx.js signing() */
html .pk-sign{position:absolute;inset:0;z-index:9;opacity:0;overflow:hidden;pointer-events:none;--tc:#2b3d6b}
html .ps-wall{position:absolute;left:0;right:0;top:0;bottom:30%;background:repeating-linear-gradient(90deg,#ffffff08 0 1px,transparent 1px 64px),linear-gradient(180deg,color-mix(in srgb,var(--tc) 62%,#0a1020),color-mix(in srgb,var(--tc) 34%,#060a14))}
html .pk-sign[data-grade="LR"] .ps-wall{background:repeating-linear-gradient(90deg,#ffd77a12 0 1px,transparent 1px 64px),linear-gradient(180deg,#3a2a10,#120c04)}
html .ps-logo{position:absolute;left:50%;top:13%;width:min(46%,240px);transform:translateX(-50%);opacity:.85;filter:drop-shadow(0 6px 14px #0008)}
html .ps-lamp{position:absolute;top:-10%;width:60%;height:70%;background:radial-gradient(ellipse 50% 60% at 50% 0,#fff3d633,transparent 70%)}
html .ps-lamp.l{left:-6%}html .ps-lamp.r{right:-6%}
html .ps-player{position:absolute;left:50%;bottom:24%;width:min(78%,420px);height:58%;transform:translateX(-50%);will-change:transform}
html .ps-player img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%}
html .ps-sil{filter:brightness(0) drop-shadow(0 0 1px #ffffff40)}
html .ps-table{position:absolute;left:-4%;right:-4%;bottom:0;height:31%;background:linear-gradient(180deg,#8a6a45 0,#6b4f30 6%,#4a3520 40%,#2a1e12);box-shadow:0 -2px 0 #b89366 inset,0 -14px 30px #0009}
html .ps-paper{position:absolute;left:50%;top:14%;width:34%;height:30%;transform:translateX(-50%) perspective(300px) rotateX(38deg);background:linear-gradient(#f4f1ea,#ddd7ca);border-radius:2px;box-shadow:0 4px 10px #0007}
html .ps-plate{position:absolute;left:50%;top:52%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:1px;min-width:42%;padding:5px 14px;border-radius:4px;background:linear-gradient(180deg,#1a1d24,#0c0e12);box-shadow:0 0 0 1px #c9a24a99,0 4px 10px #0008;color:#f0d38a}
html .ps-plate b{font-size:clamp(13px,4vw,18px);font-weight:700;letter-spacing:.06em;min-height:1em}
html .ps-plate small{font-size:clamp(10px,3vw,12px);font-weight:600;color:#d8c08a}
html .ps-black{position:absolute;inset:0;background:#000;will-change:opacity}
@media (prefers-reduced-motion:reduce){html .pk-sign{display:none}}

/* exchange ui v2 (2026-10-28): the recent trade as a navy receipt, card faces in the recycle list, completed growth
   states as calm navy panels, readable special-card counters */
html .trade-latest{display:flex;align-items:center;gap:10px;margin:10px 0;padding:10px 12px;border-radius:12px;background:linear-gradient(135deg,#1d2a52,#121933);color:#fff;box-shadow:0 4px 14px #0b123029}
html .trade-latest span{flex:none;padding:2px 8px;border-radius:999px;background:#ffd24a;color:#2b1d00;font-size:11px;font-weight:700}
html .trade-latest b{min-width:0;font-size:13px;font-weight:600;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html .recycle-row .recycle-player{gap:10px}
html .recycle-row .rp-face{flex:none;width:46px;container-type:inline-size}
html .recycle-row .rp-face .mc-art{display:block;width:100%;aspect-ratio:3/4}
html .recycle-row .recycle-player>span:last-child{display:grid;gap:2px}
html .recycle-row .recycle-player .grade-badge{justify-self:start}
html .detail-growth-summary{border:0;border-radius:12px;background:linear-gradient(135deg,#1d2a52,#121933);color:#fff}
html .detail-growth-summary b{color:#ffd24a;font-size:14px;font-weight:700}
html .detail-growth-summary span{color:#c3cbe3;font-size:12px}
html .detail-growth-summary.ready{background:linear-gradient(135deg,#2a3f7a,#1a2550)}
html .training-targets .target-grid article>b{display:inline-flex;align-items:center;gap:6px;color:#1b2033;font-size:13.5px;font-weight:700}
html .training-targets .growth-pips.gems{justify-content:flex-start;gap:6px;margin:4px 0}
html .training-targets .growth-pips.gems i{filter:none;box-shadow:none}
html .special-builder .counter{border-radius:999px;background:#eef0f5;padding:2px}
html .special-builder .counter>button{width:28px;height:28px;border-radius:999px;color:#1b2033;font-weight:700;background:#fff;border:1px solid #d9dde6}
html .special-builder .counter>button:disabled{color:#b6bbc6;background:#f4f5f8}
html .special-builder .special-count{min-width:34px;justify-content:center;color:#1b2033;font-size:14px;font-weight:700}
html .special-builder .special-count small{color:#7a8091;font-size:11px;font-weight:700;margin-left:1px}
/* generated room and card-back art (Gemini, 2026-10-28): the room photo is the stage; a second copy of it, clipped to
   the table, sits in front of the player so they appear seated behind it */
html .pk-sign{background:#05070c url(/assets/sign-room.webp) center/cover no-repeat}
html .pk-sign[data-grade="LR"]{background-image:url(/assets/sign-room-lr2.webp)}
html .pk-sign .ps-wall,html .pk-sign[data-grade="LR"] .ps-wall{inset:0;background:none}
html .pk-sign .ps-lamp,html .pk-sign .ps-paper{display:none}


html .pk-sign .ps-player{bottom:35%;}

html .pk-sign .ps-front{position:absolute;inset:0;background:inherit;clip-path:inset(63% 0 0 0)}

html .pk-sign .ps-table{inset:0;height:auto;background:none;box-shadow:none}
html .pk-sign .ps-plate{top:auto;bottom:8%}
html .pk-fx .pk-back{background:#0d1a3c url(/assets/card-back.webp) center/cover no-repeat}
html .pk-fx .pk-back::before{top:79%;height:7%}
/* keep the room at its photo's own 4:7 shape on wide screens, so the chair, table and player line up */
html .pk-sign{left:50%;right:auto;width:min(100%,57.14dvh);background-size:cover}
html .pk-sign{box-shadow:0 0 0 100vmax #05070c}

/* reveal polish (2026-10-28): GSAP centres the room (xPercent) so it can push in; UR gets its own crimson room;
   a soft light band passes over the player as the silhouette turns into the photo; fusion in the hall-of-fame vault */
html .pk-sign{transform:none}
html .pk-sign[data-grade="UR"]{background-image:url(/assets/sign-room-ur.webp)}

html .pk-sign[data-grade="UR"] .ps-player{bottom:37%}
html .pk-sign[data-grade="UR"] .ps-front{clip-path:inset(63% 0 0 0)}
html .ps-sweep{position:absolute;left:0;right:0;top:20%;height:46%;background:linear-gradient(180deg,transparent,#fff4dc33 45%,#fff4dc55 50%,#fff4dc33 55%,transparent);pointer-events:none;will-change:transform,opacity}
html dialog.pk-fx.fz2{background:#05070c url(/assets/fuse-vault.webp) center/cover no-repeat}
html dialog.pk-fx.fz2 .pk-dim{background:radial-gradient(ellipse 55% 45% at 50% 48%,transparent 30%,#000 85%)}
html .pk-sign .ps-player{height:37%}

/* generated backgrounds (Gemini, 2026-10-28): a night ballpark behind the home hero, a top-down field under the deck */
html .hub-hero{background:#141820 url(/assets/hub-stadium.webp) center 45%/cover no-repeat}
html .hub-hero::after{background:linear-gradient(90deg,#05070ccc 0%,#05070c66 55%,#05070c22 100%);filter:none;opacity:1}
html .make-deck .roster-field::after{background:url(/assets/field-top.webp) center 62%/cover no-repeat;filter:brightness(.82) saturate(.85)}

/* pack matte (2026-10-28) */
html .pk-fx .pk-body{clip-path:inset(13.6% 13.4% 6% 13.4% round 0 0 6px 6px)}
html .pk-fx .pk-top{clip-path:inset(4% 13.4% 86.4% 13.4%)}
html .pk-fx .pk-edge.l{left:13.4%}html .pk-fx .pk-edge.r{left:86.6%}
html .pk-fx .pk-gloss{left:13.4%;right:13.4%}

html .pk-fx .pk-beam{background:linear-gradient(to top,#f3e6c84d 0%,#f3e6c826 30%,transparent 80%);-webkit-mask:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent);mask:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent)}
html .pk-fx .pk-flare i{height:2px;filter:none;box-shadow:none;background:linear-gradient(90deg,transparent,#f3e6c855 40%,#f6efe0aa 50%,#f3e6c855 60%,transparent)}
html .pk-fx .pk-flare b{background:radial-gradient(circle,#f6efe066 0%,#f3e6c822 30%,transparent 62%)}
html .pk-fx .pk-ring{border:1px solid #e8d8b080;box-shadow:none}
html .pk-fx .pk-flash{background:radial-gradient(circle at 50% 44%,#f6efe0cc 0%,#f3e6c833 35%,transparent 65%)}
html .pk-fx .pk-glow{background:radial-gradient(ellipse 46% 62% at 50% -4%,color-mix(in srgb,var(--g) 18%,#f3e6c833) 0%,color-mix(in srgb,var(--g) 8%,transparent) 45%,transparent 72%)}
html .pk-fx .pk-card.foil .pk-shine{opacity:.35}
html .pk-sign .ps-logo{top:23%;width:min(20%,96px);opacity:1;filter:none}
html .pk-sign[data-grade="UR"] .ps-logo{top:29%;width:min(18%,90px)}

html .ps-title{position:absolute;left:0;right:0;bottom:12%;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}
html .ps-title .pt-pos{font-size:clamp(44px,15vw,72px);font-weight:700;line-height:.9;letter-spacing:.02em;color:#f4efe6;text-shadow:0 2px 0 #0008}
html .ps-title .pt-rule{display:block;width:min(46%,200px);height:1px;background:#c9a256;transform-origin:50% 50%}
html .ps-title .pt-yr{font-size:clamp(13px,4vw,17px);font-weight:600;letter-spacing:.14em;color:#d9c08a}
html .pk-sign[data-grade="UR"] .ps-title .pt-rule{background:#b8434f}
/* the field photo already shows the infield: no drawn diamond on top */
html .make-deck .roster-field::before{display:none!important}

/* squeeze reveal (2026-10-28): front copy behind the back for the peek, a matte charge on the back; no titles or bars */
html .pk-fx .pk-peek{position:absolute;inset:0;border-radius:12px;overflow:hidden;container-type:inline-size;background:#14161c;box-shadow:0 0 0 1px #ffffff1f;will-change:transform}
html .pk-fx .pk-peek>.mc-art{position:absolute;inset:0;width:100%;height:auto;aspect-ratio:auto}
html .pk-fx .pk-peek>.mc-name{display:none}
html .pk-fx .pk-charge{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse 70% 60% at 50% 50%,color-mix(in srgb,var(--cc) 30%,transparent),transparent 75%);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--cc) 55%,#0000),inset 0 0 24px color-mix(in srgb,var(--cc) 45%,#0000);will-change:opacity}
html .pk-fx .pk-lb,html .ps-title{display:none!important}
html .pr-stage .pr-title{display:none}
/* no drawn tear line or side edges on the pack: they never matched the printed art */
html .pk-fx .pk-seam,html .pk-fx .pk-edge{display:none}

/* hairline seam (2026-10-28): a 1px matte line along the crimp, only while cutting */
html .pk-fx .pk-seam{display:block;height:1px;left:14%;right:14%;top:13.4%;border-radius:0;background:#ecd9a6;box-shadow:none}
html .pk-sign .ps-plate b{font-size:clamp(14px,4.4vw,19px)}
html .pk-sign .ps-plate small{font-size:clamp(11px,3.2vw,13px);letter-spacing:.12em}

/* home tiles use photo art (Gemini, 2026-10-28): fill the tile, darker toward the text */
html .hub-tile .hub-art{object-fit:cover;object-position:50% 45%;filter:none;opacity:1}
html .hub-tile::after{background:linear-gradient(180deg,transparent 25%,#0b0d12d9 80%)}
html .hub-tile.wide::after{background:linear-gradient(90deg,#0f1f4af2 30%,#0f1f4a66 70%,#0f1f4a22)}
/* achievement cards: the round art sits in its own column instead of over the reward chip */
html .achievement-tracks .goal-card{padding-right:78px!important;position:relative}
html .achievement-tracks .goal-card .goal-art{top:12px;right:12px}

/* revealed card and room plate without gold outlines (2026-10-28): the card art carries its own frame */
html .pk-fx .pk-front,html .pk-fx .pk-front.cp-front{border:1px solid #ffffff1a!important;box-shadow:0 12px 28px #0000008c!important}
html .pk-sign .ps-plate{box-shadow:0 6px 14px #0009,inset 0 1px 0 #ffffff14;background:linear-gradient(180deg,#22252c,#121419)}
html .pk-sign .ps-plate b{color:#f1ece2}
html .pk-sign .ps-plate small{color:#b9b2a3}
/* LR room v2: walnut wall with a picture light; the chair sits higher than in the gold room */
html .pk-sign[data-grade="LR"] .ps-logo{top:28%;width:min(22%,100px)}
html .pk-sign[data-grade="LR"] .ps-player{bottom:32%}
html .pk-sign[data-grade="LR"] .ps-front{clip-path:inset(68% 0 0 0)}
/* every grade lifts with its own colour ring on hover (only UR had one) */
@media (hover:hover) and (pointer:fine){
 html .player-card[data-grade]:hover{transform:translateY(-3px);box-shadow:0 0 0 2px var(--hv,#8fb4e8),0 12px 26px color-mix(in srgb,var(--hv,#8fb4e8) 35%,transparent)}
 html .player-card[data-grade="N"]{--hv:#aab2bf}html .player-card[data-grade="R"]{--hv:#6f9ee8}html .player-card[data-grade="SR"]{--hv:#a98bff}
 html .player-card[data-grade="SSR"]{--hv:#f0c24a}html .player-card[data-grade="UR"]{--hv:#e2566a}html .player-card[data-grade="LR"]{--hv:#f0d68a}
}

/* scoreboard names only (2026-10-28): team colour shorthand removed from the score row */
html .scoreboard .team-score span.team-color{display:none!important}

/* tier picker v2 (2026-10-28): one row per tier (art, label, title, fact chips), active tier in navy */
html .tier-picker{display:grid;grid-template-columns:1fr;gap:6px}
html .tier-picker>button{display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:10px;row-gap:2px;align-items:center;text-align:left;padding:8px 10px;border-radius:12px;border:1px solid #e1e4ec;background:#fff;min-height:0;height:auto}
html .tier-picker>button .tier-art{grid-row:1/4;width:40px;height:40px;border-radius:10px;margin:0}
html .tier-picker>button small{grid-column:2;color:#6b7182;font-size:10.5px;font-weight:600}
html .tier-picker>button b{grid-column:2;font-size:15px;font-weight:700;color:#1b2033;line-height:1.1}
html .tier-picker .tier-facts{grid-column:2;display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
html .tier-picker .tier-facts i{font-style:normal;padding:1px 7px;border-radius:999px;background:#eef0f5;color:#3a3f4c;font-size:11px;font-weight:600;line-height:17px}
html .tier-picker .tier-facts i.tf-coin{background:#fff3cf;color:#7a5200}
html .tier-picker>button.active{border-color:#1d2a52;background:#f4f6fb;box-shadow:inset 3px 0 0 #1d2a52}
html .tier-picker+.help{font-size:11.5px;line-height:1.55}

/* transcend v2 (2026-10-28) */
html .mc-flags .pc-up.tr{background:#d9b25a;color:#2b1d00}
html .transcend-sheet.v2 .tr-hero{display:flex;gap:14px;align-items:center;padding:14px;border-radius:16px;background:linear-gradient(135deg,#1d2a52,#0f1630);color:#fff;overflow:hidden}
html .transcend-sheet.v2 .tr-face{flex:none;width:96px;container-type:inline-size}
html .transcend-sheet.v2 .tr-face .mc-art{display:block;width:100%;aspect-ratio:3/4}
html .transcend-sheet.v2 .tr-info{min-width:0;display:grid;gap:6px}
html .transcend-sheet.v2 .tr-info h3{margin:0;color:#fff;font-size:20px;font-weight:700}
html .transcend-sheet.v2 .tr-stars .gi{width:18px;height:18px}
html .transcend-sheet.v2 .tr-now{margin:0;color:#c3cbe3;font-size:13px}
html .transcend-sheet.v2 .tr-now b{color:#fff;font-size:15px}html .transcend-sheet.v2 .tr-now b.next{color:#f0d68a}
html .transcend-sheet.v2 .tr-mat{margin:0;color:#9fb0dd;font-size:12px}html .transcend-sheet.v2 .tr-mat b{color:#fff}
html .transcend-sheet.v2 .tr-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:12px 0 8px}
html .transcend-sheet.v2 .tr-step{display:grid;justify-items:center;gap:2px;padding:8px 2px;border-radius:12px;border:1px solid #e1e4ec;background:#fff;text-align:center}
html .transcend-sheet.v2 .tr-step b{font-size:15px;font-weight:700;color:#1b2033}
html .transcend-sheet.v2 .tr-step small{font-size:11px;font-weight:600;color:#6b7182;line-height:1.25}
html .transcend-sheet.v2 .tr-step.done{background:#1d2a52;border-color:#1d2a52}html .transcend-sheet.v2 .tr-step.done :is(b,small){color:#f0d68a}
html .transcend-sheet.v2 .tr-step.next{border-color:#d9b25a;box-shadow:inset 0 0 0 1px #d9b25a;background:#fffaf0}
html .transcend-sheet.v2 .help{margin:4px 0 0;font-size:11.5px}
html .transcend-sheet.v2 .tr-art,html .transcend-sheet.v2 .tr-photo{display:none}
/* reveal: empty ballpark, one spotlight; card settles, star drops in, a light passes, then the text */
html dialog.tr2{background:#05070c;display:flex;flex-direction:column;align-items:center;gap:14px;overflow:hidden}
html .tr2>*:not(.tr2-bg){position:relative;z-index:1}
html .tr2-bg{position:absolute;inset:0;background:url(/assets/transcend-mound.webp) center 60%/cover no-repeat;opacity:0;animation:tr2-fade .8s ease-out forwards}
html .tr2-card{width:min(48vw,210px);container-type:inline-size;border-radius:12px;overflow:hidden;box-shadow:0 18px 40px #000c;opacity:0;transform:translateY(-14px) scale(.97);animation:tr2-in .7s .35s cubic-bezier(.2,.8,.2,1) forwards}
html .tr2-card .mc-art{display:block;width:100%;aspect-ratio:3/4}
html .tr2-sweep{position:absolute;inset:-20% 0;background:linear-gradient(180deg,transparent,#fff4dc40 48%,#fff4dc66 50%,#fff4dc40 52%,transparent);transform:translateY(-100%);animation:tr2-sweep 1s 1.75s ease-in-out forwards;pointer-events:none}
html .tr2-stars{display:flex;gap:8px}
html .tr2-stars i.old{color:#d9b25a}
html .tr2-stars i .gi{width:24px;height:24px}
html .tr2-stars i.new{color:#f0d68a;opacity:0;transform:translateY(-60px);animation:tr2-drop .6s 1.2s cubic-bezier(.3,1.4,.5,1) forwards}
html .tr2-text{display:grid;justify-items:center;gap:3px;opacity:0;transform:translateY(8px);animation:tr2-in .5s 2.2s ease-out forwards}
html .tr2-text small{color:#d9c08a;font-size:12px;font-weight:600;letter-spacing:.12em}
html .tr2-text strong{color:#f4efe6;font-size:22px;font-weight:700}
html .tr2-text span{color:#b9b2a3;font-size:13px;font-weight:700}
@keyframes tr2-fade{to{opacity:1}}
@keyframes tr2-in{to{opacity:1;transform:none}}
@keyframes tr2-drop{to{opacity:1;transform:none}}
@keyframes tr2-sweep{to{transform:translateY(100%)}}
@media (prefers-reduced-motion:reduce){html .tr2 :is(.tr2-bg,.tr2-card,.tr2-stars i.new,.tr2-text){animation:none;opacity:1;transform:none}html .tr2-sweep{display:none}}
html dialog.tr2 :is(.trx-pillars,.trx-ring,.trx-word,.trx-name,.trx-gain){display:none}
html .tr2-text{text-shadow:0 2px 6px #000e}

/* pack sheet v3 (2026-10-28): 10-pack summary as a horizontal ticket, odds as grade chips; favourite as a corner badge */
html .batch-pack-summary{display:grid;grid-template-columns:72px minmax(0,1fr);gap:6px 14px;align-items:center;padding:12px;border-radius:14px;background:linear-gradient(135deg,#1d2a52,#121933);color:#fff;text-align:left}
html .batch-pack-summary .foil-pack{grid-row:1;width:72px;height:auto;margin:0;border-radius:8px}
html .batch-pack-summary .bps-info{display:grid;gap:4px;min-width:0}
html .batch-pack-summary h3{margin:0;color:#fff;font-size:16px;font-weight:900}
html .batch-pack-summary .bps-info>b{color:#c3cbe3;font-size:12.5px;font-weight:700}
html .batch-pack-summary .bps-cost{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:2px}
html .batch-pack-summary .bps-cost span{padding:1px 8px;border-radius:999px;background:#ffffff1f;color:#fff;font-size:11px;font-weight:800}
html .batch-pack-summary .bps-cost strong{margin-left:auto;color:#ffd24a;font-size:16px;font-weight:900}
html .batch-pack-summary>small{grid-column:1/-1;color:#9fb0dd;font-size:11px}
html .shop-sheet .pack-probability{display:grid;gap:6px;justify-items:center}
html .shop-sheet .pack-probability b{font-size:11.5px}
html .odds-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}
html .odds-chips i{font-style:normal;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;color:#fff;background:#8a909c}
html .odds-chips i[data-grade="LR"]{background:#1f9b72}html .odds-chips i[data-grade="UR"]{background:#c32f3e}html .odds-chips i[data-grade="SSR"]{background:#d9a21c}
html .odds-chips i[data-grade="SR"]{background:#7a4fd6}html .odds-chips i[data-grade="R"]{background:#3e73cf}
html .owned-v2 .owned-fav{top:-6px;right:-6px;width:26px;height:26px;background:#fff;color:#b6bbc6;box-shadow:0 2px 6px #0003;border:1px solid #e1e4ec}
html .owned-v2 .owned-fav.on{background:#fff;color:#e2405a;border-color:#f3c2cb}
html .owned-v2 .owned-fav .gi{width:13px;height:13px}
html .owned-v2 .owned-player{position:relative;overflow:visible}
/* transcend reveal spacing: content sits above the tap hint; empty star slots stay visible */
html dialog.tr2{justify-content:flex-start;padding:12vh 16px 90px}
html dialog.tr2 .fx-tap{position:absolute;left:0;right:0;bottom:28px;text-align:center}
html .tr2-stars{position:relative;inset:auto;transform:none}
html .tr2-stars i{color:#ffffff2e}
/* old .trx-stars rules hid the empty slots (opacity 0, scale .4); the skip button and tap hint keep their own spots */
html .tr2-stars i:not(.new){opacity:1!important;transform:none!important;animation:none!important}
html .tr2>:is(.fx-skip,.fx-tap){position:absolute;z-index:3}
html .tr2>.fx-skip{top:16px;right:16px;left:auto;bottom:auto}

/* bps colours (2026-10-28): an older ".batch-pack-summary div" rule painted the info block light */
html .batch-pack-summary .bps-info,html .batch-pack-summary .bps-cost{background:none!important;padding:0!important;margin:0!important;border-radius:0!important;box-shadow:none!important}
html .batch-pack-summary .bps-info{color:#fff}
html .shop-sheet .pack-probability{padding-bottom:14px}

/* my attack / my defence (2026-10-28): a coloured role bar on the match card and a chip on the replay header */
html .versus-card .vs-role{display:flex;align-items:baseline;justify-content:center;gap:8px;padding:6px 10px;color:#fff;font-size:14px;font-weight:700}
html .versus-card .vs-role small{font-size:11.5px;font-weight:700;opacity:.85}
html .versus-card.atk .vs-role{background:linear-gradient(90deg,#1d4fbf,#1d2a52)}
html .versus-card.def .vs-role{background:linear-gradient(90deg,#c32f3e,#5a1620)}
html .versus-card.atk{box-shadow:inset 0 0 0 2px #1d4fbf55}html .versus-card.def{box-shadow:inset 0 0 0 2px #c32f3e55}
html .reel-role{display:inline-block;margin-right:6px;padding:1px 7px;border-radius:999px;font-style:normal;font-size:11px;font-weight:700;color:#fff;background:#1d4fbf}
html .reel-card.def .reel-role{background:#c32f3e}
/* the spark on the pack open button in colour */
html .buy-row .btn .gi-spark{color:#ffd24a;filter:drop-shadow(0 0 2px #ffd24a88)}
/* clutch play as a short banner over the top of the screen, not over the field animation */
html .clutch-cinematic{inset:auto 0 auto 0;top:72px;height:auto;background:none;pointer-events:none}
html .clutch-cinematic .clutch-burst{margin:0 auto;max-width:360px;padding:10px 16px;border-radius:14px;background:#0b0f1ae6;box-shadow:0 8px 24px #0008;transform:none}
/* role bar pinned to the top of the match card (the card is a grid, so it was auto-placed under the stamina row) */
html .versus-card:is(.atk,.def){padding-top:40px}
html .versus-card .vs-role{position:absolute;margin:0}
/* the rating colour legend is not needed on the collection page */
html main>.stat-legend{display:none}
/* role colour as the card's own border (the inset ring missed the stamina strip and the bar corners) */
html .versus-card:is(.atk,.def){box-shadow:none!important;overflow:hidden;}
html .versus-card.atk{border-color:#1d4fbf}html .versus-card.def{border-color:#c32f3e}
html .versus-card .vs-role{border-radius:0}
/* an absolute grid item with grid-column uses its grid area (inside the padding) as its box: drop it so the bar spans
   the whole card */
html .versus-card .vs-role{grid-column:auto;grid-row:auto;left:0;right:0;top:0;width:auto}
html .versus-card:is(.atk,.def){border-width:1.5px!important;border-style:solid!important}
/* pack options (club / season picker): label above a full-width select, even padding */
html .shop-sheet .pack-options{padding:10px 12px;text-align:left}
html .shop-sheet .pack-options label{display:grid;gap:6px;width:100%;margin:0;font-size:11.5px;font-weight:800;color:#5d6475;text-align:left}
html .shop-sheet .pack-options select{width:100%;max-width:none;min-height:42px;margin:0;box-sizing:border-box}
html .shop-sheet .pack-options label,html .shop-sheet .pack-options select{max-width:none!important}

/* recommend + clutch glow (2026-10-28) */
html .rec-toggle{margin-left:6px;padding:1px 8px;border-radius:999px;border:1px solid #d5d9e3;background:#fff;color:#6b7182;font-size:10.5px;font-weight:600;vertical-align:middle}
html .rec-toggle.on{background:#1d2a52;border-color:#1d2a52;color:#ffd24a}
html .tactic-card.rec{outline:2px solid #ffd24a;outline-offset:1px;box-shadow:0 0 0 4px #ffd24a33}
html .tactic-card .rec-badge{position:absolute;z-index:3;border-radius:999px;background:#ffd24a;color:#2b1d00;font-size:10px;font-style:normal;font-weight:700;white-space:nowrap}
html .tactic-card{position:relative}
html .clutch-open.momentum.full{animation:clutch-ready 1.6s ease-in-out infinite;box-shadow:0 0 0 2px #ffd24a,0 0 14px #ffd24a88}
html .clutch-open.momentum.full::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 30%,#fff8 48%,transparent 62%);background-size:220% 100%;animation:clutch-shine 1.8s linear infinite;pointer-events:none}
html .clutch-open.momentum{position:relative;overflow:hidden}
@keyframes clutch-ready{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes clutch-shine{from{background-position:120% 0}to{background-position:-120% 0}}
@media (prefers-reduced-motion:reduce){html .clutch-open.momentum.full,html .clutch-open.momentum.full::after{animation:none}}
html .tactic-card .rec-badge{top:5px;right:5px;left:auto;transform:none;line-height:15px;padding:0 6px}

/* dice clutch (2026-10-28) */
html .dice-clutch{display:grid;gap:12px}
html .dice-clutch .dc-lead{margin:0;font-size:13px;line-height:1.5;color:#3a3f4c}
html .dice-clutch .dc-picks{display:grid;grid-template-columns:1fr 1fr;gap:10px}
html .dice-clutch .dc-pick{display:grid;justify-items:center;gap:2px;padding:16px 8px;border-radius:16px;border:1.5px solid #d9dde6;background:#fff;color:#1b2033}
html .dice-clutch .dc-pick b{font-size:28px;font-weight:700}
html .dice-clutch .dc-pick small{font-size:12px;color:#6b7182;font-weight:700}
html .dice-clutch .dc-pick.on,html .dice-clutch .dc-pick:hover{border-color:#1d2a52;background:#1d2a52;color:#ffd24a}
html .dice-clutch .dc-pick.on small,html .dice-clutch .dc-pick:hover small{color:#c3cbe3}
html .dice-clutch .dc-odds{display:flex;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:12px;background:#f4f6fb;font-size:12.5px;color:#3a3f4c}
html .dice-clutch .dc-odds b{color:#1b2033}
html .dice-clutch .dc-note{color:#7a8091;font-size:11px}
html .dice-fx{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;pointer-events:auto}
html .dice-fx .dfx-card{display:grid;justify-items:center;gap:12px;padding:20px 26px;border-radius:20px;background:#121933;box-shadow:0 18px 40px #000a;color:#fff;min-width:220px}
html .dice-fx small{color:#c3cbe3;font-size:12px;font-weight:800;letter-spacing:.06em}
html .dfx-die{display:grid;grid-template-areas:"p1 p2 p3" "p4 p5 p6" "p7 p8 p9";grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:6px;width:84px;height:84px;padding:12px;border-radius:18px;background:#f4efe6;box-shadow:inset 0 -4px 0 #d8cfbf,0 10px 24px #0008;transition:transform .07s linear}
html .dfx-die i{width:14px;height:14px;border-radius:50%;background:#1b2033;place-self:center}
html .dfx-die.land{animation:dfx-land .35s cubic-bezier(.3,1.5,.5,1)}
@keyframes dfx-land{from{transform:scale(1.25)}to{transform:none}}
html .dfx-call{min-height:20px;font-size:16px;font-weight:900;color:#f4efe6}
html .dice-fx.win .dfx-call{color:#ffd24a}html .dice-fx.lose .dfx-call{color:#ff8a96}
html .dice-fx.win .dfx-die{box-shadow:inset 0 -4px 0 #d8cfbf,0 0 0 3px #ffd24a,0 10px 24px #0008}
html .tactic-card.special .rec-badge{top:auto;bottom:4px;right:4px}
html .pinch-boost{margin:6px 0 8px;padding:8px 12px;border-radius:12px;background:#1d2a52;color:#c3cbe3;font-size:12.5px}
html .pinch-boost b{color:#ffd24a;margin-right:6px}
html .dice-fx{background:#05070c}

/* auto-play sheet v2 (2026-10-29): two option tiles, short notes */
html .auto-play-sheet.v2{display:grid;gap:12px}
html .auto-play-sheet.v2 .ap-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}
html .auto-play-sheet.v2 .ap-opt{display:grid;justify-items:start;gap:4px;padding:14px 12px;border-radius:16px;border:1px solid #d9dde6;background:#fff;color:#1b2033;text-align:left;min-height:0}
html .auto-play-sheet.v2 .ap-opt b{font-size:15px;font-weight:700}
html .auto-play-sheet.v2 .ap-opt small{font-size:11.5px;color:#6b7182;font-weight:700}
html .auto-play-sheet.v2 .ap-opt .ap-ic{display:inline-flex;gap:0;padding:6px;border-radius:10px;background:#eef0f5;color:#1d2a52}
html .auto-play-sheet.v2 .ap-opt .ap-ic .gi{width:18px;height:18px}
html .auto-play-sheet.v2 .ap-opt.main{background:linear-gradient(135deg,#1d2a52,#121933);border-color:#1d2a52;color:#fff}
html .auto-play-sheet.v2 .ap-opt.main small{color:#c3cbe3}
html .auto-play-sheet.v2 .ap-opt.main .ap-ic{background:#ffffff1f;color:#ffd24a}
html .auto-play-sheet.v2 .ap-notes{display:grid;gap:4px;margin:0;padding:10px 14px;border-radius:12px;background:#f4f6fb;list-style:none}
html .auto-play-sheet.v2 .ap-notes li{font-size:12px;color:#3a3f4c}
html .auto-play-sheet.v2 .ap-notes li::before{content:"";display:inline-block;width:5px;height:5px;margin:0 8px 2px 0;border-radius:1px;background:#1d2a52;vertical-align:middle}
html .auto-play-sheet.v2>.text-btn{justify-self:center}

/* auto deck sheet v2 (2026-10-29): one settings card, a navy summary, shape chips, clean metric tiles */
html .auto-deck-controls{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:#fff;border:1px solid #e1e4ec}
html .auto-deck-controls label{font-size:12px;font-weight:700;color:#1b2033}
html .auto-deck-controls select{width:100%;min-height:40px;margin:0}
html .auto-fixed{margin:8px 0;border-radius:14px;border:1px solid #e1e4ec;background:#fff;padding:10px 12px}
html .auto-fixed summary{font-size:13px;font-weight:700;color:#1b2033;cursor:pointer}
html .auto-deck-summary{gap:3px;margin:10px 0 6px;padding:12px 14px;border-radius:14px;background:linear-gradient(135deg,#1d2a52,#121933);color:#fff;font-size:13px}
html .auto-deck-summary b{color:#ffd24a;font-weight:700}
html .auto-deck-summary small{color:#c3cbe3;font-size:11.5px}
html .auto-deck-shape{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 10px}
html .auto-deck-shape span{padding:2px 10px;border-radius:999px;background:#eef0f5;color:#1b2033;font-size:12px;font-weight:700}
html .auto-deck-shape small{color:#7a8091;font-size:11px}
html .auto-deck-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
html .auto-deck-metrics>div{display:grid;gap:2px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid #e1e4ec}
html .auto-deck-metrics span{font-size:11.5px;color:#6b7182;font-weight:600}
html .auto-deck-metrics b{font-size:18px;font-weight:700;color:#1b2033}
html .auto-deck-summary{display:block}html .auto-deck-summary small{display:block;margin-top:4px}

/* game over v2 (2026-10-29): matte walk-off strip, a navy final card with the score, white reward tiles,
   compact line score; the opponent-note button centred */
html .opponent-note-button{justify-content:center!important;text-align:center;gap:6px}
html .opponent-note-button>span:first-child{flex:none}
html .gameover-sheet{padding:12px;border-radius:18px;background:#f4f6fb;border:0}
html .gameover-sheet .walkoff-banner{display:grid;justify-items:center;gap:4px;padding:14px 12px;border-radius:14px;border:0;background:linear-gradient(135deg,#3a2c12,#1a140a);box-shadow:inset 0 0 0 1px #d9b25a55;text-align:center}
html .gameover-sheet .walkoff-banner small{color:#d9c08a;font-size:11.5px;font-weight:800;letter-spacing:.06em}
html .gameover-sheet .walkoff-banner strong{color:#f0d68a;font-size:24px;font-weight:900}
html .gameover-sheet .walkoff-banner span{color:#cfc6b4;font-size:12.5px}
html .gameover-sheet .final-call{margin-top:10px;padding:16px 14px;border-radius:16px;background:linear-gradient(160deg,#1d2a52,#0f1630);color:#fff;text-align:center;border:0}
html .gameover-sheet .final-call img.gi.art.final-art{width:64px;height:64px;margin:0 auto 6px;border-radius:50%;box-shadow:0 0 0 3px #ffffff22}
html .gameover-sheet .final-call>span{color:#9fb0dd;font-size:11px;font-weight:600;letter-spacing:.12em}
html .gameover-sheet .final-call h2{margin:2px 0 8px;font-size:30px;font-weight:700;color:#fff}
html .gameover-sheet .final-call.win h2{color:#ffd24a}html .gameover-sheet .final-call.lose h2{color:#ff8a96}
html .gameover-sheet .final-call>div{display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 10px;border-radius:12px;background:#ffffff12}
html .gameover-sheet .final-call>div b{display:flex;align-items:center;gap:8px;color:#fff;font-size:14px;font-weight:600}
html .gameover-sheet .final-call>div b strong{font-size:26px;font-weight:700;color:#fff}
html .gameover-sheet .final-call>div i{color:#9fb0dd;font-style:normal}
html .gameover-sheet .match-rewards{margin-top:10px;padding:12px;border-radius:16px;background:#fff;border:1px solid #e1e4ec}
html .gameover-sheet .reward-totals{margin:10px 0 8px;gap:8px}
html .gameover-sheet .reward-totals>div{padding:10px 12px;border-radius:12px;background:#f4f6fb;border:0}
html .gameover-sheet .reward-totals strong{font-size:20px;font-weight:700;color:#1d2a52}
html .gameover-sheet .score-table{margin-top:10px;border-radius:12px;overflow:hidden;background:#fff;font-size:12px}
html .gameover-sheet .score-table th,html .gameover-sheet .score-table td{padding:6px 4px;text-align:center}
html .gameover-sheet .score-table thead th{background:#1d2a52;color:#c3cbe3;font-weight:600}
html .gameover-sheet .score-table tbody th{color:#1b2033;font-weight:700}
html .gameover-sheet .score-table td b{color:#1d2a52;font-weight:700}
/* special head title duplicates the part tab */
html .tactic-section .special-head>b{font-size:0}html .tactic-section .special-head>b small{margin-top:0}
/* home ace card a size smaller (2026-10-29) */
html .hub-hero .hub-ace{width:clamp(100px,24vw,138px);top:50%;bottom:auto;transform:translateY(-50%)}
/* league hero over a dark stadium photo (2026-10-29) */
html .league-hero{background:linear-gradient(180deg,rgba(18,25,51,.3),rgba(18,25,51,.7) 62%,rgba(18,25,51,.9)),url(/assets/league-bg.webp) center 38%/cover,#121933}
html .team-colors>summary>.tcs-head{align-items:center;gap:8px;width:100%}html .team-colors>summary>.tcs-head>b{flex:1;display:block}html .team-colors>summary>.tcs-chips{display:flex;flex-wrap:wrap;gap:6px}html .team-colors>summary .tcs-chip{display:inline-flex}html .team-colors>summary>.tcs-head>.status-pill,html .team-colors>summary>.tcs-head>em{flex:none}
html .team-colors>summary .tcs-chip b{font-size:12.5px;font-weight:600;color:#f4efe6}
/* summary is a grid; space-between from the old flex head shrank the track to content */
html .team-colors>summary{justify-content:stretch}
html .team-colors>summary .tcs-chip{gap:6px;padding:3px 10px 3px 3px}html .team-colors>summary .tcs-chip i{margin-left:0;flex:none}html .team-colors>summary .tcs-chip b{white-space:nowrap}
/* team colour head: title and chips share one left edge, count + caret centred on the right, chips in a tray */
html .team-colors{padding:0;overflow:hidden}
html .team-colors>summary{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:'title pill caret' 'chips pill caret';gap:8px 10px;padding:14px 14px 14px 16px;align-items:center}
html .team-colors>summary>.tcs-head{display:contents}
html .team-colors>summary>.tcs-head>b{grid-area:title}html .team-colors>summary>.tcs-head>em{grid-area:title;justify-self:end}html .team-colors>summary>.tcs-head>.status-pill{grid-area:pill}html .team-colors>summary>.tcs-head>.tcs-caret{grid-area:caret}
html .team-colors>summary>.tcs-chips{grid-area:chips;padding:8px;border-radius:12px;background:#f1f3f7;border:1px solid #e3e6ee}
html .team-colors[open]>summary{margin-bottom:0;border-bottom:1px solid #e3e6ee}
html .team-colors>.color-list{padding:10px 12px}html .team-colors>.text-btn{margin:0 12px 12px}
html body details.panel.team-colors{padding:0}

/* text links read as buttons: small outline pills (2026-10-29) */
html .text-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:32px;padding:0 14px;border-radius:999px;border:1px solid #d6dae3;background:#fff;color:#1b2033;font-size:12.5px;font-weight:600;text-decoration:none;cursor:pointer;transition:transform .12s ease-out,background-color .15s ease,border-color .15s ease}
html .text-btn:hover{border-color:#121933}
html .text-btn:active{transform:scale(.97)}
html .text-btn:focus-visible{outline:2px solid #121933;outline-offset:2px}
html .text-btn:disabled{opacity:.5;cursor:default;transform:none}
html .text-btn .gi{width:14px;height:14px}
html .mail-rows .text-btn{color:var(--p-red);border-color:#f0d3d6}
/* deck management */
html .make-deck .deck-toolbar .deck-manage-btn{min-height:36px;padding:0 12px 0 14px}
html .make-deck .deck-manage-btn .dm-caret{transition:transform .2s ease-out}
html .make-deck .deck-manage-btn.on{background:#121933;border-color:#121933;color:#f4efe6}
html .make-deck .deck-manage-btn.on .dm-caret{transform:rotate(180deg)}
html .make-deck .slot-panel{padding:14px;border-radius:16px;border:1px solid #e1e4ec;background:#fff;box-shadow:none}
html .make-deck .slot-panel .section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px}
html .make-deck .slot-panel .section-heading h2{font-size:15px;font-weight:700;color:#1b2033;margin:0}
html .make-deck .slot-panel .section-heading span{font-size:11.5px;color:#6b7182}
html .make-deck .deck-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
html .make-deck .deck-slot{display:grid;gap:3px;align-content:start;text-align:left;padding:10px;border-radius:12px;border:1px solid #e1e4ec;background:#f6f7fa;color:#1b2033;cursor:pointer;transition:transform .12s ease-out,border-color .15s ease;min-width:0}
html .make-deck .deck-slot:active{transform:scale(.97)}
html .make-deck .deck-slot small{font-size:10.5px;font-weight:600;color:#8a90a0}
html .make-deck .deck-slot strong{font-size:14px;font-weight:700;overflow-wrap:anywhere}
html .make-deck .deck-slot span{font-size:11px;color:#6b7182;line-height:1.35}
html .make-deck .deck-slot.selected{background:#121933;border-color:#121933;color:#f4efe6}
html .make-deck .deck-slot.selected small{color:#d9b25a}html .make-deck .deck-slot.selected span{color:#c9cede}
html .make-deck .deck-slot.is-empty{background:#fff;border-style:dashed;border-color:#b8bdc9}
html .make-deck .deck-slot.is-empty strong{color:#2f5fc4}
html .make-deck .deck-slot:focus-visible{outline:2px solid #121933;outline-offset:2px}
html .make-deck .deck-save-target{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid #e9ecf2}
html .make-deck .deck-save-target label{display:grid;gap:4px;font-size:11.5px;font-weight:600;color:#6b7182}
html .make-deck .deck-save-target select,html .make-deck .deck-save-target input{height:40px;min-height:40px;padding:0 12px;border-radius:10px;border:1px solid #d6dae3;background:#fff;color:#1b2033;font:inherit;font-size:14px;font-weight:700}
/* empty states use the redrawn navy/gold icon (2026-10-30) */
html .empty:not(:has(img))::before{width:44px;height:44px;border-radius:12px;background:url(/assets/art-v2-em-empty.jpg?r=2) center/cover}

/* grade fusion (2026-10-30) */
.gf-top{display:grid;gap:12px;padding:14px;border-radius:16px;background:#fff;border:1px solid #e1e4ec;margin-bottom:12px}
.gf-head{display:flex;gap:12px;align-items:center}.gf-head .gf-art{width:56px;height:56px;border-radius:14px;flex:none}
.gf-head h3{margin:2px 0;font-size:18px;font-weight:700;color:#1b2033}.gf-head p{margin:0;font-size:12px;line-height:1.5;color:#5d6475}
.gf-tray{padding:10px;border-radius:14px;background:#121933;color:#f4efe6}
.gf-tray-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.gf-tray-head b{font-size:13px;font-weight:700}.gf-tray-head span{display:flex;gap:6px}
html .gf-tray .text-btn{min-height:28px;padding:0 10px;font-size:11.5px;background:#1c2546;border-color:#2c3658;color:#f4efe6}
.gf-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.gf-slot{position:relative;aspect-ratio:3/4;border-radius:8px;border:1px dashed #3a4568;display:grid;place-items:center;font-size:10px;color:#6f7a9c;background:transparent;padding:0;overflow:hidden}
.gf-slot.filled{cursor:pointer;}.gf-slot>img{width:100%;height:100%;object-fit:cover}
.gf-slot>i,.gf-card>i{position:absolute;left:3px;top:3px;font-style:normal;font-size:9px;font-weight:700;padding:1px 5px;border-radius:999px;color:#fff;background:#5b3fc4}
.gf-slot>i.g-ssr,.gf-card>i.g-ssr{background:#b8892c}
.gf-odds{display:grid;gap:6px}.gf-odd{display:grid;grid-template-columns:36px minmax(0,1fr) 46px;align-items:center;gap:8px}
.gf-odd b{font-size:12px;font-weight:700}.gf-odd i{height:8px;border-radius:999px;background:#eef0f5;overflow:hidden}.gf-odd em{display:block;height:100%;border-radius:999px;background:#b8892c;transition:width .3s ease-out}
.gf-odd.g-ur em{background:#2f5fc4}.gf-odd.g-lr em{background:linear-gradient(90deg,#d9b25a,#f4efe6)}.gf-odd.g-lr b{color:#9a7420}.gf-odd.g-ur b{color:#2f5fc4}
.gf-odd span{text-align:right;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;color:#1b2033}.gf-odds small{font-size:11px;color:#6b7182}
.gf-club b{display:block;font-size:13px;font-weight:700;color:#1b2033;margin-bottom:6px}.gf-club b small{font-weight:600;color:#6b7182;font-size:11px}
.gf-club-row{display:flex;gap:6px;scrollbar-width:none;padding-bottom:2px}
.gf-team{flex:none;height:38px;min-width:38px;padding:0 10px;border-radius:999px;border:1px solid #d6dae3;background:#fff;font:inherit;font-size:12px;font-weight:600;color:#1b2033;cursor:pointer;display:grid;place-items:center}
.gf-team .team-logo{width:24px;height:24px;object-fit:contain}.gf-team.on{border-color:#121933;box-shadow:inset 0 0 0 1.5px #121933;background:#f1f3f7}
.gf-team:focus-visible,.gf-card:focus-visible,.gf-slot:focus-visible{outline:2px solid #121933;outline-offset:2px}
.gf-pick{padding:14px;border-radius:16px;background:#fff;border:1px solid #e1e4ec;margin-bottom:12px}
.gf-pick-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}.gf-pick-head h4{margin:0;font-size:14px;font-weight:700}
.gf-grid{display:grid;gap:8px}
.gf-card{position:relative;display:grid;gap:2px;padding:0 0 6px;border-radius:10px;border:1px solid #e1e4ec;background:#f6f7fa;overflow:hidden;text-align:left;font:inherit;cursor:pointer;transition:transform .12s ease-out,border-color .15s ease}
.gf-card:active{transform:scale(.97)}.gf-card:disabled{opacity:.45;cursor:default}
.gf-card>img{width:100%;aspect-ratio:3/4;object-fit:cover;background:#dfe3ea}.gf-card b{padding:0 6px;font-size:12px;font-weight:700;color:#1b2033;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gf-card small{padding:0 6px;font-size:10px;color:#6b7182}.gf-card.picked{border-color:#121933;box-shadow:inset 0 0 0 1.5px #121933}
.gf-card em{position:absolute;right:4px;top:4px;min-width:20px;height:20px;border-radius:999px;background:#121933;color:#d9b25a;font-style:normal;font-size:11px;font-weight:700;display:grid;place-items:center}
/* roulette */
.gf-roulette{position:fixed;inset:0;z-index:2000;display:grid;align-content:center;gap:22px;background:#0b1024;color:#f4efe6}
.gf-r-title{text-align:center}.gf-r-title small{display:block;font-size:11px;font-weight:600;color:#d9b25a}.gf-r-title b{font-size:22px;font-weight:700}
.gf-r-window{position:relative;padding:18px 0;border-block:1px solid #2c3658;}
.gf-r-mark{position:absolute;left:50%;top:0;bottom:0;z-index:2}
.gf-r-track{display:flex;column-gap:10px;padding-left:10px;will-change:transform}
.gf-r-cell{position:relative;flex:none;width:96px;border-radius:10px;overflow:hidden;transition:transform .3s ease-out,box-shadow .3s ease-out}
.gf-r-cell>img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}.gf-r-cell b{display:block;padding:4px 6px 6px;font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gf-r-cell>i{position:absolute;left:4px;top:4px;font-style:normal;font-size:9.5px;font-weight:700;padding:1px 6px;border-radius:999px;background:#b8892c;color:#fff}
.gf-r-cell.g-ur{border-color:#2f5fc4}.gf-r-cell.g-ur>i{background:#2f5fc4}.gf-r-cell.g-lr{border-color:#d9b25a}.gf-r-cell.g-lr>i{background:#d9b25a;color:#121933}
.gf-r-cell.lit{transform:scale(1.12);z-index:1}
.gf-r-skip{justify-self:center;min-height:36px;padding:0 18px;border-radius:999px;border:1px solid #3a4568;background:transparent;color:#c9cede;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.gf-r-skip:focus-visible{outline:2px solid #d9b25a;outline-offset:2px}
@media (prefers-reduced-motion:reduce){.gf-r-track,.gf-r-cell{transition:none!important}}
.gf-top{grid-template-columns:minmax(0,1fr)}.gf-top>*,.gf-head>div,.gf-slot{min-width:0}.gf-slot>img{position:absolute;inset:0}

/* grade fusion faces and fit (2026-10-30) */
.gf-pick{display:grid;grid-template-columns:minmax(0,1fr)}.gf-pick>*{min-width:0}
.gf-pick-head{flex-wrap:wrap}
.gf-grid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}
html .gf-card{background:#fff;padding:4px 4px 6px;gap:3px}html .gf-card .mc-art{border-radius:6px}
html .gf-card b{padding:0 2px}html .gf-card small{padding:0 2px}
html .gf-card em{z-index:5}
html .gf-card:disabled{opacity:.5}
.gf-slot.filled{padding:0;border:0;background:none}html .gf-slot .mc-art{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border-radius:6px}
html .gf-slot .mc-art .mc-ribbon,html .gf-slot .mc-art .compact-ovr{display:none}
.gf-r-cell{background:#121933;border:0;padding:0}html .gf-r-cell .mc-art{border-radius:8px 8px 0 0}
.gf-r-cell b{background:#1c2546}
.gf-r-mark{width:0;height:0;margin-left:-9px;background:none;border-left:9px solid transparent;border-right:9px solid transparent}
.gf-r-mark.top{top:0;bottom:auto;border-top:12px solid #d9b25a}.gf-r-mark.bottom{top:auto;bottom:0;border-bottom:12px solid #d9b25a}
.gf-r-frame{position:absolute;left:50%;top:10px;bottom:10px;width:108px;margin-left:-54px;border:2px solid rgba(217,178,90,.55);border-radius:12px;z-index:2;pointer-events:none}
.gf-r-cell.lit{box-shadow:0 0 0 2px #d9b25a,0 10px 30px rgba(0,0,0,.5)}
/* small fusion faces: position and year overlapped on the ribbon; the year is in the caption */
html .gf-card .mc-ribbon i,html .gf-r-cell .mc-ribbon i{display:none}
/* club picker wraps instead of scrolling sideways */
.gf-club-row{flex-wrap:wrap;overflow:visible}

/* roulette v2 (2026-10-30) */
.gf-roulette{overflow:hidden;--tint:rgba(217,178,90,.18)}
.gf-r-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 45% at 50% 50%,var(--tint),transparent 70%),linear-gradient(180deg,rgba(11,16,36,.82),rgba(11,16,36,.95)),url(/assets/fuse-vault.webp) center/cover;opacity:.35}
.gf-roulette[data-grade="ur"]{--tint:rgba(47,95,196,.38)}.gf-roulette[data-grade="lr"]{--tint:rgba(244,239,230,.32)}.gf-roulette[data-grade="ssr"]{--tint:rgba(217,178,90,.3)}
.gf-r-window{background:rgba(18,25,51,.72);-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);overflow:visible}
.gf-r-track{transform-origin:left center}
.gf-r-cell{transform-origin:center center;will-change:transform,opacity}
.gf-r-frame{transition:border-color .3s ease,box-shadow .3s ease}
.gf-roulette[data-grade="ssr"] .gf-r-frame{border-color:#d9b25a;box-shadow:0 0 24px rgba(217,178,90,.35)}
.gf-roulette[data-grade="ur"] .gf-r-frame{border-color:#6f97ff;box-shadow:0 0 28px rgba(111,151,255,.4)}
.gf-roulette[data-grade="lr"] .gf-r-frame{border-color:#f4efe6;box-shadow:0 0 32px rgba(244,239,230,.45)}
.gf-r-sweep{position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);pointer-events:none;z-index:6}
.gf-r-result{display:grid;justify-items:center;gap:2px;min-height:64px;opacity:0}
.gf-r-result em{font-style:normal;font-size:28px;font-weight:700;letter-spacing:0;color:#d9b25a}
.gf-r-result em.g-ur{color:#8fb0ff}.gf-r-result em.g-lr{color:#f4efe6}
.gf-r-result b{font-size:17px;font-weight:700}.gf-r-result small{font-size:12px;color:#c9cede}
html .gf-r-cell{transition:none}
.gf-roulette{grid-template-columns:minmax(0,1fr)}.gf-roulette>*{min-width:0}.gf-r-window{width:100%}
html .gf-r-cell.lit{box-shadow:0 12px 30px rgba(0,0,0,.5)}
.gf-cost{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 12px;border-radius:10px;background:#f1f3f7;font-size:12px;color:#5d6475}.gf-cost .gi{width:18px;height:18px}.gf-cost b{color:#1b2033;font-weight:700;font-variant-numeric:tabular-nums}.gf-cost b.neg{color:#c32f3e}.gf-cost small{font-size:11px;color:#8a90a0}

/* roulette grade pillars (LR) */
.gf-r-pillars{position:absolute;inset:-60px 0;pointer-events:none;z-index:0;display:flex;justify-content:center;gap:150px}
.gf-r-pillars i{width:44px;height:100%;transform-origin:center bottom;background:linear-gradient(180deg,transparent,rgba(244,239,230,.22) 30%,rgba(217,178,90,.28) 70%,transparent);filter:blur(6px)}
.gf-head h3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.gf-fx-toggle{min-height:26px;padding:0 10px;border-radius:999px;border:1px solid #d6dae3;background:#fff;color:#6b7182;font:inherit;font-size:11px;font-weight:800;cursor:pointer}.gf-fx-toggle.on{background:#121933;border-color:#121933;color:#d9b25a}.gf-fx-toggle:focus-visible{outline:2px solid #121933;outline-offset:2px}

/* bulk recycle sheet (2026-10-30) */
.bulk-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:8px 0 10px}
.bulk-grades{display:flex;gap:4px;padding:3px;border-radius:999px;background:#eef0f5}
.bulk-grades button{min-height:32px;padding:0 12px;border:0;border-radius:999px;background:transparent;color:#5d6475;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.bulk-grades button.on{background:#121933;color:#f4efe6}.bulk-grades button:focus-visible{outline:2px solid #121933;outline-offset:1px}
html .bulk-row{grid-template-columns:44px minmax(0,1fr) auto;gap:10px;padding:8px 10px;border-radius:12px;border:1px solid #e1e4ec;background:#fff}
.bulk-face{width:44px;container-type:inline-size}.bulk-face .mc-art{width:100%;border-radius:4px}
.bulk-face .mc-ribbon,.bulk-face .compact-ovr{display:none}
html .bulk-row b{font-size:14px;font-weight:700;color:#1b2033}html .bulk-row small{margin-top:2px;font-size:11.5px;color:#6b7182}
html .bulk-row .bulk-gain{color:#9a7420;font-weight:700}
.bulk-step{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:999px;background:#eef0f5}
.bulk-step button{width:30px;height:30px;border-radius:999px;border:1px solid #d9dde6;background:#fff;color:#1b2033;font:inherit;font-weight:700;cursor:pointer}
.bulk-step button:disabled{color:#b6bbc6;background:#f4f5f8;cursor:default}.bulk-step button:focus-visible{outline:2px solid #121933;outline-offset:1px}
html .bulk-step input{width:36px;min-height:30px;height:30px;margin:0;padding:0;border:0;background:transparent;text-align:center;font-weight:700;font-size:15px;color:#1b2033;-moz-appearance:textfield}
html .bulk-step input::-webkit-inner-spin-button{display:none}
html .bulk-row.protected{background:#f6f7fa}html .bulk-row.protected .bulk-gain{color:#8a90a0}
/* roulette LR tease */
.gf-r-bg{transition:opacity .4s ease}.gf-roulette.near-lr .gf-r-frame{border-color:#f4efe6;box-shadow:0 0 34px rgba(244,239,230,.55)}.gf-roulette.near-lr{--tint:rgba(244,239,230,.3)}.gf-roulette.near-lr .gf-r-bg{opacity:.75!important}
/* no shine sweep on fusion faces (2026-10-30) */
html :is(.gf-r-cell,.gf-card,.gf-slot,.bulk-face) .mc-shine{display:none!important}
/* cut-out pack art: no dark slot behind it (2026-10-30) */
html img.foil-pack{background:none!important;border-radius:0!important;box-shadow:none!important;object-fit:contain;filter:drop-shadow(0 8px 14px rgba(18,25,51,.28))}

/* grade fusion failure + pack name plates (2026-10-30) */
.gf-odd.g-fail b{color:#8a90a0}.gf-odd.g-fail em{background:#c3c8d3}
.gf-roulette[data-grade="fail"]{--tint:rgba(140,148,170,.18)}.gf-roulette[data-grade="fail"] .gf-r-frame{border-color:#8a90a0;box-shadow:none}
.gf-r-result em.g-fail{color:#c3c8d3}
html .shop-item>b{display:inline-flex;align-items:center;justify-content:center;margin:6px auto 0;padding:4px 12px;border-radius:999px;border:1px solid #c9ced9;background:#fff;color:#1b2033;font-size:12.5px;font-weight:700;line-height:1.2;box-shadow:0 1px 0 rgba(18,25,51,.06)}

/* reel speed x1-x3 (2026-10-30) */
.reel-speed{display:flex;justify-content:center;gap:4px;margin-top:8px}
.reel-speed button{min-width:48px;min-height:32px;padding:0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:transparent;color:#d9dce4;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.reel-speed button[aria-pressed="true"]{background:var(--cp-teal,#4ee6d2);border-color:transparent;color:#0b1a22}
.reel-speed button:focus-visible{outline:2px solid #fff;outline-offset:1px}

/* gameover nav up (2026-10-30): next-game actions right under the result */
.gameover-nav{display:grid;gap:8px;margin:10px 0 4px}.gameover-nav .sheet-actions{margin:0}

/* grade fusion x5/x10 (2026-10-30) */
.gf-multi{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.gf-multi>small{grid-column:1/-1;text-align:center;font-size:11.5px;color:#6b7182}
.gf-multi .btn{min-height:40px;display:inline-flex;gap:6px;align-items:center;justify-content:center}.gf-multi .btn small{font-size:11px;font-weight:700;color:#6b7182}
.gf-batch{margin-top:12px;padding:12px;border-radius:14px;background:#121933;color:#f4efe6}
.gf-batch-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}.gf-batch-head>b{font-size:15px;font-weight:700}
.gf-batch-head>span{display:flex;gap:4px;flex-wrap:wrap;flex:1}.gf-batch-head em{font-style:normal;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.1)}
.gf-batch-head em.g-lr{color:#ff8f6b}.gf-batch-head em.g-ur{color:#d6a8ff}.gf-batch-head em.g-ssr{color:#e8c46a}.gf-batch-head em.g-fail{color:#aab0bf}
html .gf-batch .text-btn{color:#d9dce4;border-color:rgba(255,255,255,.25);background:transparent}
.gf-batch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.gf-batch-card{display:grid;gap:3px;min-width:0;text-align:center;container-type:inline-size}.gf-batch-card .mc-art{width:100%}
.gf-batch-card>b{font-size:12px;font-weight:700}.gf-batch-card>small{font-size:11px;color:#c3c8d3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gf-batch-card.fail{opacity:.55}

/* grade fusion x5/x10 result sheet (2026-10-30): every result at the end, over the page */
.gf-batch-wrap{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px;background:rgba(8,12,26,.72)}
html .gf-batch-wrap .gf-batch{width:min(560px,100%);max-height:calc(100dvh - 32px);overflow:auto;margin:0;box-shadow:0 18px 50px rgba(0,0,0,.45)}
.gf-batch-sum{margin:12px 0 10px;font-size:12px;color:#c3c8d3;text-align:center}
.gf-multi .btn{flex-direction:column;gap:1px;min-height:48px}.gf-multi .btn>span{font-weight:700}

/* grade fusion x5/x10 picker (2026-10-30) */
html body .gf-multi .btn.on{background:#121933!important;border-color:#121933!important;color:#f4efe6!important}html body .gf-multi .btn.on small{color:#d9b25a}

/* grade fusion x5/x10 plan (2026-10-30) */
.gf-plan{margin-top:10px;padding:10px;border-radius:12px;border:1px solid #e1e4ec;background:#f6f7fa}
.gf-plan-head{display:flex;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:13px}.gf-plan-head b{font-weight:700;color:#1b2033}.gf-plan-head span{font-weight:600;color:#9a7420}
.gf-plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px;max-height:260px;overflow:auto}
.gf-plan-card{display:grid;gap:2px;min-width:0;text-align:center;container-type:inline-size}.gf-plan-card .mc-art{width:100%}
.gf-plan-card>b{font-size:11.5px;font-weight:700;color:#1b2033;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gf-plan-card>small{font-size:10.5px;color:#6b7182}

/* grade fusion tray v2 (2026-10-30) */
html .gf-tray-head{flex-wrap:wrap}.gf-tray-head>b{font-size:13px;font-weight:700}
.gf-size{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:999px;background:#1c2546;margin-right:auto}
.gf-size button{width:28px;height:28px;border-radius:999px;border:1px solid #2c3658;background:#121933;color:#f4efe6;font:inherit;font-weight:700;cursor:pointer}
.gf-size button:disabled{color:#4c5677;cursor:default}.gf-size button:focus-visible{outline:2px solid #d9b25a;outline-offset:1px}
.gf-size output{min-width:40px;text-align:center;font-size:13px;font-weight:700;color:#d9b25a}
.gf-tray-sum{display:flex;flex-wrap:wrap;gap:4px 10px;margin:0 0 8px;font-size:11.5px;color:#aab3cc}.gf-tray-sum b{color:#f4efe6;font-weight:700}
.gf-tray-x{color:#d9b25a;font-weight:600}
.pitch-mix .pm-row{display:grid;grid-template-columns:5.5em minmax(0,1fr) 3.2em;gap:8px;align-items:center;font-size:13px;margin:6px 0}
.pitch-mix .pm-row i{position:relative;display:block;height:6px;border-radius:3px;background:#8a8f9833;overflow:hidden}
.pitch-mix .pm-row i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:#3d7bf0;border-radius:inherit}
.pitch-mix .pm-row b{text-align:right;font-variant-numeric:tabular-nums}
html.ui-v3 .pitch-duel{grid-area:duel;display:grid;gap:4px;margin:10px 0 0;padding:10px 12px;border-radius:12px;background:var(--m-soft);font-size:12px;color:var(--m-muted);min-width:0}
html.ui-v3 .pitch-duel p{margin:0;display:flex;gap:8px;align-items:baseline;min-width:0;overflow-wrap:anywhere}
html.ui-v3 .pitch-duel em{flex:none;width:72px;font-style:normal;font-weight:700;color:var(--m-ink)}
html.ui-v3 .pitch-duel b{color:var(--m-ink);font-weight:600}
@media(max-width:500px){html.ui-v3 .pitch-duel{padding:8px 10px;font-size:11px}html.ui-v3 .pitch-duel em{width:62px}}
html.ui-v3 .era-pick{margin-top:14px}
html.ui-v3 .era-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
html.ui-v3 .era-list button{display:grid;gap:2px;justify-items:start;min-height:52px;padding:8px 12px;border:1px solid var(--m-line);border-radius:12px;background:var(--c-white);color:var(--m-ink);text-align:left}
html.ui-v3 .era-list button.active{border-color:var(--m-ink);box-shadow:inset 0 0 0 1px var(--m-ink)}
html.ui-v3 .era-list b{font-size:13px;font-weight:600}html.ui-v3 .era-list small{font-size:11px;color:var(--m-muted)}
html.ui-v3 .season-awards{margin-top:18px;display:grid;gap:10px}
html.ui-v3 .season-awards h4{margin:4px 0 0;font-size:13px;color:var(--m-muted)}
html.ui-v3 .award-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
html.ui-v3 .award-grid>div{display:grid;gap:4px;padding:8px;border:1px solid var(--m-line);border-radius:12px;background:var(--c-white);min-width:0}
html.ui-v3 .award-grid small{font-size:11px;color:var(--m-muted);font-weight:700}
html.ui-v3 .award-player{display:flex;align-items:center;gap:8px;padding:0;border:0;background:none;color:var(--m-ink);text-align:left;min-width:0}
html.ui-v3 .award-player .player-art{width:32px;height:42px;object-fit:cover;border-radius:6px;flex:none}
html.ui-v3 .award-player span{display:grid;min-width:0}html.ui-v3 .award-player b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html.ui-v3 .award-player small{font-weight:400}
html.ui-v3 .award-vote{display:flex;flex-wrap:wrap;gap:8px}html.ui-v3 .award-vote small{font-weight:400;opacity:.75}
html.ui-v3 .award-mvp{margin:0;font-size:14px}html.ui-v3 .award-mvp b{font-weight:600}
html.ui-v3 .award-history>div{display:flex;flex-wrap:wrap;gap:6px}
html.ui-v3 .award-chip{padding:4px 10px;border-radius:999px;border:1px solid var(--m-line);font-size:12px;font-weight:700;color:var(--m-ink);background:var(--m-soft)}
html.ui-v3 .career-bars{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
html.ui-v3 .career-bars button{flex:0 0 44px;display:grid;grid-template-rows:72px auto auto auto;justify-items:center;gap:2px;padding:4px 2px;border:1px solid var(--m-line);border-radius:10px;background:var(--c-white);color:var(--m-muted)}
html.ui-v3 .career-bars button.current{border-color:var(--m-ink);box-shadow:inset 0 0 0 1px var(--m-ink)}
html.ui-v3 .career-bars i{align-self:end;width:14px;height:max(4px,var(--h));border-radius:4px 4px 0 0;background:var(--c-gray-91)}
html.ui-v3 .career-bars button.have i{background:var(--m-ink)}
html.ui-v3 .career-bars b{font-size:12px;font-weight:600;color:var(--m-ink);font-variant-numeric:tabular-nums}
html.ui-v3 .career-bars small,html.ui-v3 .career-bars span{font-size:10px;white-space:nowrap}
/* home hub polish (2026-11-09, unslop by @heydamir): Korean sentence-case labels, upright scoreboard figures,
   one 16px inset for every tile line, calmer weights, a small flat notification dot and a 3-up shortcut row on PC */
html body .hub{gap:12px}
html body .hub-club small{font-weight:500}
html body .hub-club b{font-weight:600}
html body .hub-ovr{font-size:12px;font-weight:500;letter-spacing:0}
html body .hub-ovr strong{font-size:28px;font-weight:600;font-style:normal;letter-spacing:0}
html body .hub-stats>div{min-width:40px;padding:4px 8px}
html body .hub-stats small{font-size:11px;font-weight:500}
html body .hub-stats b{font-size:16px;font-weight:600;font-style:normal;letter-spacing:0}
html body .hub-tile{padding:12px 16px;gap:4px}
html body .hub-tile b,html body .hub-tile>span:not(.hub-vs){padding:0}
html body .hub-tile b{font-size:18px;font-weight:600;text-shadow:none}
html body .hub-tile>span:not(.hub-vs){font-size:12px}
html body .hub-tile .hub-round{font-size:12px;font-weight:500;letter-spacing:0}
html body .hub-tile .notification-dot{top:12px!important;right:12px;width:10px;height:10px;box-shadow:none}
html body .hub-vs em{font-style:normal;font-weight:600;font-size:14px}
@media (min-width:900px){html body .hub-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}html body .hub-tiles>.hub-tile:nth-child(even):last-child{grid-column:auto;min-height:132px}html body .hub-tiles>.hub-tile:nth-child(even):last-child .hub-art{left:0;width:100%}}

/* unslop pass (2026-11-09, unslop by @heydamir): Korean labels need no tracking; small labels sit at 600 */
html body :is(.eyebrow,.kicker,.page-title .eyebrow){letter-spacing:0;text-transform:none}

/* pitch flight in the strike-zone inset (2026-11-09) */
.play-scene .pz-trail{fill:none;stroke:#ffffff8c;stroke-width:.7;stroke-linecap:round}
.play-scene .pz-flight{fill:#fff}
.play-scene .pz-where{font-size:6px;font-weight:600;fill:#fff;paint-order:stroke;stroke:#0b2a22;stroke-width:2px}
.play-scene .pz-side{font-size:4.5px;fill:#ffffff99}
/* larger result scene so the pitch flight reads (2026-11-09) */
html body .diamond-broadcast.mini .broadcast-field{max-width:260px;height:200px}

/* pitch view before the field play (2026-11-09): replaces the corner inset */
html body .play-scene .pz-veil{fill:#0b1a16}
html body .play-scene .pz-view .pz-box{fill:#ffffff0d;stroke:#fff;stroke-width:1.2}
html body .play-scene .pz-view .pz-grid{stroke:#ffffff38;stroke-width:.6}
html body .play-scene .pz-view .pz-type{font-size:14px;font-weight:600;fill:#fff;stroke:none}
html body .play-scene .pz-view .pz-where{font-size:13px;font-weight:600;fill:#fff;stroke:none}
html body .play-scene .pz-view .pz-side{font-size:9px;fill:#ffffff99}
html body .play-scene .pz-view .pz-trail{stroke:#ffffff8c;stroke-width:1.4}
html body .play-scene .pz-view .pz-ball{stroke-width:1.2}

/* swing and contact in the pitch view (2026-11-09) */
html body .play-scene .pz-view .pz-bat line{stroke:#e9d2a6;stroke-width:3.2;stroke-linecap:round}
html body .play-scene .pz-view .pz-hit circle{fill:none;stroke:#fff;stroke-width:1.6}
html body .play-scene .pz-view .pz-hit path{stroke:#ffd24a;stroke-width:1.6;stroke-linecap:round}

/* bat shape (2026-11-09) */
html body .play-scene .pz-view .pz-bat :is(path,ellipse){fill:#d8b47a;stroke:#5a3c1a;stroke-width:.6;stroke-linejoin:round}

/* catcher view: batter, mitt (2026-11-09) */
html body .play-scene .pz-view .pz-batter{fill:#ffffff17}
html body .play-scene .pz-view .pz-mitt ellipse{fill:#7a4b22}
html body .play-scene .pz-view .pz-mitt .pocket{fill:#4a2c12}

/* softer batter, gloves (2026-11-09) */
html body .play-scene .pz-view .pz-batter path{fill:#ffffff12;stroke:#ffffff12;stroke-width:2;stroke-linejoin:round}
html body .play-scene .pz-view .pz-batter .helmet{fill:#ffffff24}
html body .play-scene .pz-view .pz-hands{fill:#e9e4da;stroke:#0b1a16;stroke-width:.6}

/* profile batter, contact quality (2026-11-09) */
html body .play-scene .pz-view .pz-batter :is(path,circle){fill:#ffffff14;stroke:#ffffff14;stroke-width:1.5;stroke-linejoin:round}
html body .play-scene .pz-view .pz-batter .helmet{fill:#ffffff26}
html body .play-scene .pz-view .pz-flash{fill:#fff}
html body .play-scene .pz-view .pz-hit.solid circle{stroke:#fff;stroke-width:2.4}
html body .play-scene .pz-view .pz-hit.solid .r2{stroke:#ffd24a;stroke-width:1.6}
html body .play-scene .pz-view .pz-hit.solid path{stroke:#ffd24a;stroke-width:2;stroke-linecap:round}
html body .play-scene .pz-view .pz-hit.weak circle{stroke:#ffffff8c;stroke-width:1.2}

/* batter stance and arms (2026-11-09) */
html body .play-scene .pz-view .pz-batter .limb{fill:none;stroke:#ffffff17;stroke-width:6.5;stroke-linecap:round;stroke-linejoin:round}
html body .play-scene .pz-view .pz-batter .foot{fill:none;stroke:#ffffff17;stroke-width:4;stroke-linecap:round}
html body .play-scene .pz-view .pz-arm{fill:none;stroke:#ffffff1f;stroke-width:4;stroke-linecap:round}
/* batter readable while turning (2026-11-09) */
html body .play-scene .pz-view .pz-batter :is(path,circle){fill:#ffffff1f;stroke:#ffffff1f}
html body .play-scene .pz-view .pz-batter .limb,html body .play-scene .pz-view .pz-batter .foot{fill:none;stroke:#ffffff21}
html body .play-scene .pz-view .pz-batter .helmet{fill:#ffffff33}

/* batter joints (2026-11-09) */
html body .play-scene .pz-view .pz-arm{stroke-linejoin:round}

/* 3D batter rig (2026-11-09) */
html body .play-scene .pz-view .pz-rig{opacity:.2}
html body .play-scene .pz-view .pz-rig path{fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round}
html body .play-scene .pz-view .pz-rig .leg{stroke-width:7}
html body .play-scene .pz-view .pz-rig .leg.far{stroke:#aab5b0}
html body .play-scene .pz-view .pz-rig .torso{stroke-width:12}
html body .play-scene .pz-view .pz-rig circle{fill:#fff;stroke:none}
html body .play-scene .pz-view .pz-rig .brim{stroke-width:3.4}
html body .play-scene .pz-view .pz-rig .torso{fill:#fff}

/* 3D batter silhouette: thighs heavier than shins, far side darker (2026-11-09) */
html body .play-scene .pz-view .pz-rig .thigh{stroke-width:8.5}
html body .play-scene .pz-view .pz-rig .shin{stroke-width:5.6}
html body .play-scene .pz-view .pz-rig .arm{stroke-width:4.4}
html body .play-scene .pz-view .pz-rig .torso{stroke-width:6;fill:#fff}
html body .play-scene .pz-view .pz-rig .far{stroke:#9aa6a1}

/* diving catch / fence leap: afterimages and a speed streak behind the fielder, ball in the glove (2026-11-09) */
.play-scene .pf-streak{fill:none;stroke:#fff;stroke-opacity:.7;stroke-width:3;stroke-linecap:round}
.play-scene .pf-ghost circle{fill:#ffc94a}
.play-scene .pf-dust{fill:#f1e2bf}
.play-scene .pf-burst{fill:none;stroke:#ffe08a;stroke-width:1.6}
.play-scene .pf-man.on .pf-glove{fill:#fff;stroke:#0b2a22;stroke-width:.6}

/* home run: lit wall, sparks, glow under the gold trail, gold trot around the bases (2026-11-09) */
.play-scene .pf-wall-glow{fill:none;stroke:#ffd24a;stroke-width:3.5;stroke-linecap:round}
.play-scene .pf-spark{fill:#ffd24a}
.play-scene .pf-spark.w{fill:#fff}
.play-scene .pf-hr-glow{fill:none;stroke:#ffd24a;stroke-opacity:.28;stroke-width:6;stroke-linecap:round}
.play-scene .pf-trot{fill:none;stroke:#ffd24a;stroke-width:1.6;stroke-opacity:.8;stroke-linecap:round;stroke-linejoin:round}
.play-scene .pf-slam-sub{font-size:10px;font-weight:700;fill:#fff;stroke:#3d2a00;stroke-width:1.2px;paint-order:stroke;letter-spacing:.04em}

/* outfield wall and stands so a home run visibly leaves the park (2026-11-09) */
.play-scene .pf-stands{fill:#24503f}
.play-scene .pf-tier{fill:none;stroke:#ffffff2e;stroke-width:.6}
.play-scene .pf-wall{fill:none;stroke:#2b7390;stroke-width:3.6}
.play-scene .pf-hrline{fill:none;stroke:#ffd24a;stroke-width:.8}
.play-scene .pf-pole{fill:none;stroke:#ffd24a;stroke-width:1.2;stroke-linecap:round}

/* play scene v2 (scene-v2.js): tilted 3D stage */
.play-scene.sv2 .sv-sky{fill:#07110f}.play-scene.sv2 .sv-stands{fill:#10231f}.play-scene.sv2 .sv-crowd{fill:none;stroke:#cfe6dc;stroke-opacity:.35;stroke-width:.9;stroke-linecap:round}
.play-scene.sv2 .sv-grass,.play-scene.sv2 .sv-infield{fill:#1f7a55}.play-scene.sv2 .sv-mow{fill:#1b6e4c}.play-scene.sv2 .sv-track{fill:#a9814c}.play-scene.sv2 .sv-wall{fill:#17384a}
.play-scene.sv2 .sv-wall-top{fill:none;stroke:#ffd24a;stroke-width:.7}.play-scene.sv2 .sv-pole{fill:none;stroke:#ffd24a;stroke-width:1;stroke-linecap:round}
.play-scene.sv2 .sv-dirt{fill:#b78c56}.play-scene.sv2 .sv-line{fill:none;stroke:#fff;stroke-width:.8}.play-scene.sv2 .sv-path{fill:none;stroke:#efe2c4;stroke-width:.7;stroke-opacity:.8}
.play-scene.sv2 .sv-mound{fill:#c59b63}.play-scene.sv2 .sv-plate,.play-scene.sv2 .sv-base{fill:#fff}.play-scene.sv2 .sv-base.on{fill:#ffd24a}
.play-scene.sv2 .sv-shadow{fill:#000;fill-opacity:.32}.play-scene.sv2 .sv-body{fill:none;stroke:#f2f5f3;stroke-width:3.8;stroke-linecap:round}.play-scene.sv2 .sv-head{fill:#e9c9a4}.play-scene.sv2 .sv-cap{fill:#14263d}
.play-scene.sv2 .sv-man.on .sv-body{stroke:#ffd24a}.play-scene.sv2 .sv-man.run .sv-body{stroke:#e2553f}.play-scene.sv2 .sv-man.run .sv-cap{fill:#7d1f16}
.play-scene.sv2 .sv-pos{font-size:5.4px;font-weight:700;fill:#fff;fill-opacity:.85;paint-order:stroke;stroke:#0b2a22;stroke-width:1.5px}
.play-scene.sv2 .sv-bat{fill:none;stroke:#e9d2a6;stroke-width:1.5;stroke-linecap:round}
.play-scene.sv2 .sv-ball{fill:#fff}.play-scene.sv2 .sv-trail{fill:none;stroke:#fff;stroke-opacity:.55;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}.play-scene.sv2 .sv-trail.gold{stroke:#ffd24a;stroke-opacity:.8;stroke-width:1.6}
.play-scene.sv2 .sv-trot{fill:none;stroke:#ffd24a;stroke-width:1.2;stroke-opacity:.75;stroke-linecap:round;stroke-linejoin:round}
.play-scene.sv2 .sv-ring{fill:none;stroke:#fff;stroke-width:1}.play-scene.sv2 .sv-ring.gold{stroke:#ffd24a;stroke-width:1.4}.play-scene.sv2 .sv-dust{fill:#f1e2bf}
.play-scene.sv2 .sv-tag rect{fill:#14263de6;stroke:#ffffff99;stroke-width:.5}.play-scene.sv2 .sv-tag text{font-size:6.6px;font-weight:700;fill:#fff}
.play-scene.sv2 .sv-tag.out rect{fill:#a3122ae6}.play-scene.sv2 .sv-tag.safe rect{fill:#1d5fd6e6}.play-scene.sv2 .sv-tag.run rect{fill:#1f9a63f0}
.play-scene.sv2 .sv-flash{fill:#fff;pointer-events:none}.play-scene.sv2 .sv-lb{fill:#000}.play-scene.sv2 .sv-wall-glow{fill:none;stroke:#ffd24a;stroke-width:2.4;stroke-linecap:round}
.play-scene.sv2 .sv-slam text{font-size:24px;font-weight:800;fill:#ffd24a;stroke:#3d2a00;stroke-width:1.4px;paint-order:stroke;letter-spacing:-.02em}.play-scene.sv2 .sv-slam .sub{font-size:8px;fill:#fff;stroke-width:1px;letter-spacing:.04em}

/* pitch view v2: the park behind the plate, a pitcher on the mound, a lit batter */
.play-scene.sv2 .pz-veil{fill:#07110f}.play-scene.sv2 .pz-stands{fill:#10231f}.play-scene.sv2 .pz-crowd{fill:none;stroke:#cfe6dc;stroke-opacity:.3;stroke-width:1.4;stroke-linecap:round}
.play-scene.sv2 .pz-wall{fill:#17384a}.play-scene.sv2 .pz-wall-top{fill:none;stroke:#ffd24a;stroke-width:.9}.play-scene.sv2 .pz-grass{fill:#1b6e4c}.play-scene.sv2 .pz-mow{fill:#1f7a55}
.play-scene.sv2 .pz-dirt{fill:#a9814c}.play-scene.sv2 .pz-chalk{fill:none;stroke:#fff;stroke-opacity:.75;stroke-width:1.2;stroke-linejoin:round}.play-scene.sv2 .pz-plate{fill:#f4f1e8}
.play-scene.sv2 .pz-shade{fill:#07110f;fill-opacity:.3}
.play-scene.sv2 .pz-pitcher{opacity:.9}.play-scene.sv2 .pz-pitcher path{fill:none;stroke:#eef1ee;stroke-width:4.4;stroke-linecap:round;stroke-linejoin:round}.play-scene.sv2 .pz-pitcher .leg{stroke:#dfe5e1;stroke-width:3.6}.play-scene.sv2 .pz-pitcher .arm{stroke-width:2.6}
.play-scene.sv2 .pz-pitcher circle{fill:#e9c9a4}.play-scene.sv2 .pz-pitcher .cap{fill:#14263d;stroke:none}.play-scene.sv2 .pz-pitcher ellipse{fill:#000;fill-opacity:.3}
.play-scene.sv2 .pz-view .pz-rig{opacity:1;filter:drop-shadow(0 1px 1.5px #07110fcc)}
.play-scene.sv2 .pz-view .pz-rig path{stroke:#eef1ee}.play-scene.sv2 .pz-view .pz-rig .far,.play-scene.sv2 .pz-view .pz-rig .leg.far{stroke:#bcc7c2}
.play-scene.sv2 .pz-view .pz-rig .torso{fill:#eef1ee}.play-scene.sv2 .pz-view .pz-rig circle{fill:#14263d}.play-scene.sv2 .pz-view .pz-rig .brim{stroke:#14263d}
.play-scene.sv2 .pz-view .pz-box{fill:#ffffff14;stroke:#fff;stroke-width:1}.play-scene.sv2 .pz-view .pz-grid{stroke:#ffffff47}
.play-scene.sv2 .pz-view .pz-trail{stroke:#ffffffb3;stroke-width:1.2}
.play-scene.sv2 .pz-view :is(.pz-type,.pz-where){paint-order:stroke;stroke:#07110f;stroke-width:3px;stroke-linejoin:round}
.play-scene.sv2 .pz-view .pz-rig :is(.thigh,.shin){stroke:#d9e0dc}.play-scene.sv2 .pz-view .pz-rig :is(.thigh,.shin).far{stroke:#a9b5b0}
html .match-shell[data-phase] .broadcast-field.sv2{width:100%;max-width:320px;height:auto;aspect-ratio:200/182}
.play-scene.sv2 .pz-view .pz-rig circle{fill:#d9442f}.play-scene.sv2 .pz-view .pz-rig .brim{stroke:#d9442f}
/* pitch view: face, neck and belt on the batter */
.play-scene.sv2 .pz-view .pz-rig circle.skin{fill:#e9c9a4}.play-scene.sv2 .pz-view .pz-rig path.helmet{fill:#d9442f;stroke:none}
.play-scene.sv2 .pz-view .pz-rig path.neck{stroke:#e9c9a4;stroke-width:3.8}.play-scene.sv2 .pz-view .pz-rig path.belt{stroke:#14263d;stroke-width:2.6}
.play-scene.sv2 .pz-view .pz-rig .torso{stroke-width:5}

/* pitch view redesign: night park, drawn pitcher, uniformed batter */
.play-scene.sv2 .pz-tower{fill:none;stroke:#0d1826;stroke-width:1.6}.play-scene.sv2 .pz-lamps{fill:#eaf6ff}.play-scene.sv2 .pz-stands{fill:#0e1c27}
.play-scene.sv2 .pz-row{fill:none;stroke:#1b3040;stroke-width:.8}.play-scene.sv2 .pz-crowd{fill:none;stroke:#bcd3e0;stroke-opacity:.35;stroke-width:1.5;stroke-linecap:round}
.play-scene.sv2 .pz-wall{fill:#14344a}.play-scene.sv2 .pz-pad{fill:none;stroke:#0e2636;stroke-width:.8}.play-scene.sv2 .pz-wall-top{fill:none;stroke:#ffd24a;stroke-width:1}
.play-scene.sv2 .pz-mow{fill:#fff;fill-opacity:.055}.play-scene.sv2 .pz-mound{fill:#b98a55}.play-scene.sv2 .pz-rubber{fill:#f4f1e8}
.play-scene.sv2 .pz-chalk{fill:none;stroke:#fff;stroke-opacity:.7;stroke-width:1;stroke-linejoin:round}.play-scene.sv2 .pz-plate{fill:#f4f1e8}.play-scene.sv2 .pz-shade{fill-opacity:.1}
.play-scene.sv2 .pz-shadow{fill:#000;fill-opacity:.28}
.play-scene.sv2 .pz-pitcher{opacity:1}.play-scene.sv2 .pz-pitcher ellipse{fill:#000;fill-opacity:.35}
.play-scene.sv2 .pz-pitcher path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.play-scene.sv2 .pz-pitcher path.leg{stroke:#c6d0dc;stroke-width:3.6}.play-scene.sv2 .pz-pitcher path.body{stroke:#e6ecf2;stroke-width:6}.play-scene.sv2 .pz-pitcher path.arm{stroke:#e6ecf2;stroke-width:2.8}
.play-scene.sv2 .pz-pitcher circle.skin{fill:#e9c9a4}.play-scene.sv2 .pz-pitcher path.cap{fill:#2f5fb3;stroke:none}.play-scene.sv2 .pz-pitcher path.bill{stroke:#2f5fb3;stroke-width:1.3}
.play-scene.sv2 .pz-pitcher circle.glove{fill:#7a4b22}.play-scene.sv2 .pz-pitcher circle.ball{fill:#fff}
.play-scene.sv2 .pz-view .pz-rig{opacity:1;filter:drop-shadow(0 1px 1.2px #050b14aa)}
.play-scene.sv2 .pz-view .pz-rig path{fill:none;stroke:#f1efe8;stroke-linecap:round;stroke-linejoin:round}
.play-scene.sv2 .pz-view .pz-rig path.thigh{stroke-width:9.5}.play-scene.sv2 .pz-view .pz-rig path.shin{stroke-width:7}
.play-scene.sv2 .pz-view .pz-rig path.sock{stroke:#c23a28;stroke-width:7}.play-scene.sv2 .pz-view .pz-rig path.shoe{stroke:#12161b;stroke-width:5.2}
.play-scene.sv2 .pz-view .pz-rig path.up{stroke-width:6.6}.play-scene.sv2 .pz-view .pz-rig path.fore{stroke:#c23a28;stroke-width:4.8}
.play-scene.sv2 .pz-view .pz-rig path.far{stroke:#c3cad0}.play-scene.sv2 .pz-view .pz-rig path.sock.far,.play-scene.sv2 .pz-view .pz-rig path.fore.far{stroke:#96291b}
.play-scene.sv2 .pz-view .pz-rig path.torso{fill:#f1efe8;stroke:#f1efe8;stroke-width:6.5}.play-scene.sv2 .pz-view .pz-rig path.torso.chest{fill:#c3cad0;stroke:#c3cad0}
.play-scene.sv2 .pz-view .pz-rig path.neck{stroke:#dcb48a;stroke-width:4.2}.play-scene.sv2 .pz-view .pz-rig path.belt{stroke:#12161b;stroke-width:3}
.play-scene.sv2 .pz-view .pz-rig circle.skin{fill:#e9c9a4}.play-scene.sv2 .pz-view .pz-rig path.helmet{fill:#d9442f;stroke:none}.play-scene.sv2 .pz-view .pz-rig path.brim{stroke:#d9442f;stroke-width:3.8}
.play-scene.sv2 .pz-view .pz-hands{fill:#c23a28;stroke:#12161b;stroke-width:.6}
.play-scene.sv2 .pz-view .pz-box{fill:#ffffff0a;stroke:#fff;stroke-opacity:.9;stroke-width:.8}.play-scene.sv2 .pz-view .pz-grid{stroke:#ffffff40;stroke-width:.5}
.play-scene.sv2 .pz-view .pz-mitt ellipse{fill:#6d4220;stroke:#3a210e;stroke-width:1}.play-scene.sv2 .pz-view .pz-mitt .pocket{fill:#452a13;stroke:none}
.play-scene.sv2 .pz-view .pz-type{font-size:11px;font-weight:700;letter-spacing:.06em}.play-scene.sv2 .pz-view .pz-where{font-size:11px;font-weight:700}

/* signing room: the club mark hangs inside the wall frame (UR) / on the centre panel under the lamp (LR), clear of the player's head */
html .pk-sign[data-grade="UR"] .ps-logo{top:15%;width:min(24%,128px)}
html .pk-sign[data-grade="LR"] .ps-logo{top:14%;width:min(22%,110px)}
html .pk-sign .ps-player,html .pk-sign[data-grade] .ps-player{height:44%}html .pk-sign[data-grade="UR"] .ps-player{bottom:35%}

/* grade fusion roulette, dot look: hard pixel frame and cards, stepped edge fade, no glows (pixel effects carry the reveal) */
html .gf-r-cell,html .gf-r-cell .mc-art{border-radius:0}
html .gf-r-cell.lit,html .gf-r-cell.lit{box-shadow:0 0 0 3px #d9b25a,6px 6px 0 rgba(0,0,0,.5)!important}
html .gf-r-frame{border-radius:0;border-width:3px;box-shadow:none!important;transition:none}
html .gf-roulette[data-grade="ur"] .gf-r-cell.lit{box-shadow:0 0 0 3px #6f97ff,6px 6px 0 rgba(0,0,0,.5)!important}
html .gf-roulette[data-grade="lr"] .gf-r-cell.lit{box-shadow:0 0 0 3px #f4efe6,6px 6px 0 rgba(0,0,0,.5)!important}
html .gf-roulette.near-lr .gf-r-frame{border-color:#f4efe6}
html .gf-r-window{-webkit-mask-image:linear-gradient(90deg,transparent 0 5%,#0006 5% 10%,#000b 10% 15%,#000 15% 85%,#000b 85% 90%,#0006 90% 95%,transparent 95%);mask-image:linear-gradient(90deg,transparent 0 5%,#0006 5% 10%,#000b 10% 15%,#000 15% 85%,#000b 85% 90%,#0006 90% 95%,transparent 95%);border-block:2px solid #2c3658}
html .gf-r-bg{background:linear-gradient(#0b1024b0,#0b1024b0),url(/assets/fuse-vault.webp) center/cover;opacity:1;image-rendering:pixelated}
html .gf-r-skip{border-radius:0;border-width:2px;box-shadow:3px 3px 0 #000}
html .gf-r-pillars{display:none}
/* the room pictures carry the wall: the generated stepped copy of the old LR wall gradient (retro.css) must not cover the LR room */
html body .pk-sign[data-grade] .ps-wall{background:none}

/* match scene: unique skill / clutch cue (dot tags, hard edges, no glow) */
.skill-cue{position:absolute;left:8px;top:8px;z-index:6;display:grid;gap:4px;justify-items:start;pointer-events:none;max-width:calc(100% - 16px)}
.sc-tag{--sc:#d9b25a;display:flex;align-items:center;gap:6px;padding:4px 8px 4px 4px;background:#0b1024ee;border:2px solid var(--sc);box-shadow:3px 3px 0 #000;color:#f4efe6;min-width:0}
.sc-tag.ai{--sc:#c32f3e}.sc-tag.clutch.miss{--sc:#8a93a3}
.sc-tag .sc-ic{display:grid;place-items:center;width:22px;height:22px;flex:none;color:var(--sc)}
.sc-tag .sc-ic .gi{width:16px;height:16px}.sc-tag .sc-art{width:22px;height:22px;display:block}
.sc-tag b{display:block;font-size:12px;font-weight:700;line-height:1.2;color:var(--sc);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-tag small{display:block;font-size:11px;line-height:1.2;color:#c9cede;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (prefers-reduced-motion:reduce){.skill-cue{display:none}}

/* signature skill in the pitch view (display only): red power / blue contact / purple speed or break */
html body .play-scene .pz-view .sk-red{--skc:#ef5a5a;--skl:#ffb4a8}
html body .play-scene .pz-view .sk-blue{--skc:#3d86f0;--skl:#a8cbfa}
html body .play-scene .pz-view .sk-purple{--skc:#a050f0;--skl:#d4b0ff}
html body .play-scene .pz-view .pz-trail:is(.sk-red,.sk-blue,.sk-purple){stroke:var(--skc);stroke-width:2.6;stroke-linecap:butt}
html body .play-scene .pz-view .pz-trail.fast{stroke-width:3.4}
html body .play-scene .pz-view .pz-flight:is(.sk-red,.sk-blue,.sk-purple){fill:var(--skl);stroke:var(--skc);stroke-width:.9}
html body .play-scene .pz-view .sk-bat *{fill:var(--skc)!important;stroke:var(--skc)!important;stroke-width:3.4!important;stroke-linejoin:miter}
html body .play-scene .pz-view .pz-sk{font-size:7px;font-weight:700;fill:var(--skl);paint-order:stroke;stroke:#10141c;stroke-width:2px}
html body .play-scene .pz-view .sk-bat.wide *{stroke-width:5!important}
html body .play-scene .pz-view .pz-aim{fill:none;stroke:var(--skl);stroke-width:1.2;stroke-dasharray:4 2;shape-rendering:crispEdges}

/* friendly match: opponent tabs (clubs | era dream teams), the picked opponent, dream team marks */
html body .opp-tabs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0 0 10px;border:2px solid var(--m-ink,#1d2230);border-radius:0;background:var(--c-white,#fff)}
html body .opp-tabs button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 10px;border:0;border-radius:0;background:transparent;color:var(--m-muted,#6b7280);font-size:13px;font-weight:600}
html body .opp-tabs button+button{border-left:2px solid var(--m-ink,#1d2230)}
html body .opp-tabs button.active{background:var(--m-ink,#1d2230);color:#fff}
html body .opp-tabs button small{font-size:11px;opacity:.75}
html body .opp-tabs svg{width:14px;height:14px}
html body .opp-picked{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:12px;color:var(--m-muted,#6b7280)}
html body .opp-picked b{display:inline-flex;align-items:center;gap:6px;color:var(--m-ink,#1d2230);font-size:13px}
html body .opp-picked svg,html body .opp-picked img{width:18px;height:18px}
html body .era-pick{margin-top:0}
html body .era-reward{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:12px;color:var(--m-muted,#6b7280)}
html body .era-reward svg{width:14px;height:14px}
html body .era-pick .era-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
html body .era-pick .era-list button{position:relative;display:flex;align-items:center;gap:10px;min-height:58px;padding:8px 10px;border:2px solid var(--m-line,#d6d9e0);border-radius:0;background:var(--c-white,#fff);color:var(--m-ink,#1d2230);text-align:left;transition:transform .08s steps(2),background-color .12s steps(2)}
html body .era-pick .era-list button:active{transform:translateY(2px)}
html body .era-pick .era-list .era-mark{display:grid;place-items:center;flex:none;width:32px;height:32px;background:#f5c040;color:#5c3408}
html body .era-pick .era-list .era-mark svg{color:#5c3408!important;stroke:#5c3408}
html body .era-pick .era-list button.won .era-mark svg{color:#3a404c!important;stroke:#3a404c}
html body .era-pick .era-list .era-text{display:grid;gap:2px;min-width:0}
html body .era-pick .era-list b{font-size:13px;font-weight:700}
html body .era-pick .era-list small{font-size:11px;color:var(--m-muted,#6b7280)}
html body .era-pick .era-list button.won .era-mark{background:#dfe4ea;color:#3a404c}
html body .era-pick .era-list button.active{border-color:#d89418;background:#fff6dc;box-shadow:0 3px 0 #9a5e0c;transform:translateY(-2px)}
html body .era-pick .era-list button.active small{color:#9a5e0c}
html body .era-pick .era-list .era-check{position:absolute;top:-2px;right:-2px;display:grid;place-items:center;width:20px;height:20px;background:#d89418;color:#fff}
html body .era-pick .era-list .era-check svg{width:14px;height:14px}
@media (prefers-reduced-motion:reduce){html body .era-pick .era-list button{transition:none}html body .era-pick .era-list button.active{transform:none}}
/* pitch view dot puppets (batter, pitcher): crisp cells, no filters */
html body .play-scene .pz-view .pz-spr path{stroke:none}
html body .play-scene .pz-view .pz-px-shadow{fill:#000;fill-opacity:.3}
/* field sprites: short sleeves over a team-colour undershirt (fielders blue, runners dark red, the one on the ball gold) */
.play-scene.sv2 .sv-man .sv-sleeve{fill:#2d4f8c}.play-scene.sv2 .sv-man.run .sv-sleeve{fill:#7d1f16}.play-scene.sv2 .sv-man.on .sv-sleeve{fill:#9a5e0c}

/* landing / login in the game's own look: hub hero, hub tiles, square tabs, blocky card */
html body .login-page.login-v3{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;max-width:560px;margin:0 auto;padding:12px 12px 28px;min-height:auto;background:none}
html body .login-v3 .login-hero{display:grid;gap:8px;align-content:end;min-height:300px;padding:20px 18px;border:2px solid #10141c;background:#141820 url(/assets/hub-stadium.webp) center 45%/cover no-repeat;color:#fff;box-shadow:inset 0 -140px 80px -40px #10141ce6}
html body .login-v3 .login-hero p{margin:0;font-size:12px;color:#ffd24a}
html body .login-v3 .login-hero h1{margin:0;font-size:40px;line-height:1.05;color:#fff;letter-spacing:0}
html body .login-v3 .login-hero h1 em{font-style:normal;color:#ffd24a}
html body .login-v3 .login-hero span{font-size:13px;line-height:1.6;color:#dfe4ea}
html body .login-v3 .login-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
html body .login-v3 .login-tiles .hub-tile{cursor:default;min-height:96px}
html body .login-v3 .login-tiles .hub-tile:active{transform:none}
html body .login-v3 .login-card{display:grid;gap:12px;margin:0;padding:16px;border:2px solid #10141c;border-radius:0;background:#fff;box-shadow:0 4px 0 #10141c;max-width:none;width:auto}
html body .login-v3 .login-card .auth-tabs{margin:0}
html body .login-v3 .login-card h2{margin:4px 0 0;font-size:20px}
html body .login-v3 .login-card form{display:grid;gap:10px}
html body .login-v3 .login-card label{display:grid;gap:6px;font-size:12px;font-weight:600}
html body .login-v3 .login-card input{min-height:44px;border:2px solid #10141c;border-radius:0;padding:0 12px;font-size:15px;background:#fff}
html body .login-v3 .login-card input:focus-visible{outline:3px solid #ffd24a;outline-offset:0}
html body .login-v3 .login-card .error:empty{display:none}
html body .login-v3 .login-card small{font-size:11px;line-height:1.6;color:#6b7280}
@media (min-width:900px){html body .login-page.login-v3{max-width:1040px;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);grid-template-areas:"hero card";align-items:start;padding-top:28px}
 html body .login-v3 .login-hero{grid-area:hero;min-height:380px}html body .login-v3 .login-tiles{grid-area:tiles}html body .login-v3 .login-card{grid-area:card}}

/* 2026-11-12 text fit pass: tab strips slide (mouse drag/wheel in retro.js) with an edge fade where more tabs hide */
html body :is(.tabs,.goal-tabs,.league-main-tabs,.opp-tabs){overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
html body :is(.tabs,.goal-tabs,.league-main-tabs,.opp-tabs)::-webkit-scrollbar{display:none}
html body :is(.tabs,.goal-tabs,.league-main-tabs,.opp-tabs)>button{white-space:nowrap;flex-shrink:0}
html body .hs-more-end{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
html body .hs-more-start{-webkit-mask-image:linear-gradient(90deg,transparent,#000 36px);mask-image:linear-gradient(90deg,transparent,#000 36px)}
html body .hs-more-start.hs-more-end{-webkit-mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent)}
html body .hs-drag{cursor:grabbing;user-select:none}
@media (max-width:760px){
 /* page title never runs under the mail/box/menu buttons: it takes the space left of them */
 html body .topbar>div:first-child{left:14px!important;right:132px!important;width:auto!important;text-align:left!important;transform:none!important;translate:none!important;margin:0!important;overflow:hidden}
 html body .topbar>div:first-child>b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 /* match tools: the opponent note gets its own row, the three tools share the next */
 html body .match-guide-tools{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px}
 html body .match-guide-tools>.opponent-note-button{grid-column:1/-1}
 html body .match-guide-tools>button{min-width:0;width:auto}
 /* deck dock while a match runs: the OVR track gives way to the return button */
 html body .save-dock>div{min-width:0;flex:1 1 auto}
 html body .save-dock:has([data-do=league-resume]) .ovr-track{display:none}
 html body .save-dock>.btn{white-space:nowrap}
}

/* 2026-11-12 one-glance odds for the chosen card (bands from the opponent's best to worst answer, 0-100%) */
html body .odds-board{display:grid;gap:7px;margin:8px 0 2px;padding:10px 12px;background:#17181f;color:#fff}
html body .odds-row{display:grid;grid-template-columns:44px minmax(0,1fr) 76px;align-items:center;gap:10px}
html body .odds-name{font-size:12px;color:#c9ccd6;white-space:nowrap}
html body .odds-track{position:relative;height:12px;background:#2c2e38;box-shadow:inset 0 0 0 1px #3d404c}
html body .odds-track::before,html body .odds-track::after{content:"";position:absolute;top:0;bottom:0;pointer-events:none}
html body .odds-track::after{left:25%;right:25%;border-left:1px solid #3d404c;border-right:1px solid #3d404c}
html body .odds-track::before{left:50%;width:1px;background:#3d404c}
html body .odds-track i{position:absolute;top:0;bottom:0;transform-origin:left center;z-index:1}
html body .odds-row.good .odds-track i{background:#3c9a5f;box-shadow:0 0 0 1px #7fd19c}
html body .odds-row.bad .odds-track i{background:#c32f3e;box-shadow:0 0 0 1px #f08a94}
html body .odds-num{font-size:16px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
html body .odds-row.good .odds-num{color:#8fe0ab}html body .odds-row.bad .odds-num{color:#ff9aa4}
html body .odds-num small{font-size:11px;color:#9a9eab;margin:0 1px}
html body .odds-foot{margin:2px 0 0;font-size:11px;color:#9a9eab;line-height:1.5}
html body .odds-foot b{color:#ffd24a;font-weight:700}
/* build-up when a card is picked: bands fill, numbers land, row by row */
html body .odds-new .odds-track i{animation:odds-fill .42s cubic-bezier(.2,.8,.2,1) calc(var(--i)*90ms) both}
html body .odds-new .odds-num{animation:odds-land .3s steps(3,end) calc(var(--i)*90ms + .2s) both}
html body .odds-new{animation:odds-open .22s steps(3,end) both}
@keyframes odds-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes odds-land{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes odds-open{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
/* the chosen card rises, the rest of the hand steps back */
html body .tactic-hand:has(.tactic-card.selected) .tactic-card:not(.selected):not(:disabled){filter:saturate(.55) brightness(.92)}
html body .tactic-card.pick-in{animation:pick-in .32s cubic-bezier(.2,.9,.25,1.25) both}
@keyframes pick-in{0%{transform:translateY(0)}55%{transform:translateY(-12px) scale(1.06)}100%{transform:translateY(-6px) scale(1.03)}}
/* confirming: the card charges in the middle of the screen while the server decides */
html body .charge-veil{position:fixed;inset:0;z-index:650;background:rgba(10,11,16,.55);pointer-events:none;animation:veil-in .16s ease-out both}
@keyframes veil-in{from{opacity:0}to{opacity:1}}
html body .card-ghost.charge-card.charge-card{overflow:visible!important;box-shadow:0 0 0 2px #ffd24a,0 6px 0 #17181f!important}
html body .charge-ring{position:absolute;inset:-6px;border:3px solid #ffd24a;pointer-events:none;animation:charge-ring .5s steps(4,end) .3s infinite both}
html body .charge-ring.late{animation-delay:.55s}
@keyframes charge-ring{from{transform:scale(1);opacity:1}to{transform:scale(1.35);opacity:0}}
@media (prefers-reduced-motion:reduce){html body .odds-new .odds-track i,html body .odds-new .odds-num,html body .odds-new,html body .tactic-card.pick-in{animation:none}}
html body .selection-copy [data-do=cancel-selection]{white-space:nowrap;flex-shrink:0}
html body .set-track span{top:-1px;height:16px;line-height:16px;padding:0 5px;place-items:normal;text-align:center}
html body .play-scene.sv2 .sv-man .sv-glove{fill:#8a5a2b;stroke:#3a2410;stroke-width:.3}