/* Final six-screen composition: supplied wrestling posters, real data, local art.
   This layer owns the main boards and their desktop/tablet/phone breakpoints. */
:root {
  --paper:#f2e2bd; --cream:#f8edcf; --ink:#151c19; --line:#292b20;
  --red:#b52b21; --red-dark:#8b2018; --teal:#146174; --gold:#e6b84b;
  --board-space:12px; --board-rule:2px solid var(--line);
  --print-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.74' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23paper)' opacity='.32' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
}
body:before {background:rgba(7,15,18,.2)}
.board {background:var(--paper);border:3px double #393628;box-shadow:0 8px 24px #0006,inset 0 0 45px #0000001a;isolation:isolate}
.board:before {content:'';position:absolute;inset:0;background-image:var(--print-grain);background-size:180px 180px;mix-blend-mode:multiply;opacity:.38;pointer-events:none;z-index:0}
.board:after {inset:5px;border-color:#8b7958;z-index:3}
.board > * {position:relative;z-index:1}
.panel-title,.banner,.mslot,.nav button.is-on,.play-kind {background-image:var(--print-grain);background-blend-mode:multiply}
h1,h2,h3 {text-wrap:balance}
.topbar .brand {font-size:38px}
.brand > .ico {width:40px;height:40px;fill:var(--gold);stroke:var(--gold)}
.nav button {border-width:0 1px 0 0;border-radius:0}
.nav button:last-child {border-right:0}
.nav button.is-on {border:1px solid #d6bb8e}
.nav .ico {stroke-width:2.4}
.goalbar {align-items:center;min-height:26px;padding-block:3px;gap:18px}
.goalbar .guided-career-goal {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.goalbar > span:last-child {white-space:nowrap;font-size:11px}
.goalbar .guide-strip {padding:0;margin:0;border:0;background:transparent;color:var(--paper);font-size:12px;gap:12px;justify-content:flex-start;min-width:0}
.goalbar .guide-strip > b {color:var(--gold);font-size:12px}
.goalbar .guide-strip > span {max-width:none}
.goalbar .guide-strip .text-button {color:var(--paper);font-size:12px;min-height:22px}
.filter-disclosure {position:relative;flex-shrink:0;z-index:8;font-size:12px}
.filter-disclosure > summary {display:flex;align-items:center;gap:6px;cursor:pointer;list-style:none;color:var(--teal);font-weight:700;text-transform:uppercase;min-height:28px;width:max-content}
.filter-disclosure > summary::-webkit-details-marker {display:none}
.filter-disclosure > summary:after {content:'+';font-size:18px;margin-left:3px}
.filter-disclosure[open] > summary:after {content:'−'}
.filter-disclosure > summary > .ico {width:17px;height:17px}
.filter-disclosure .collection-tools {background:var(--cream);border:1px solid #847151;padding:12px;box-shadow:0 6px 16px #35251033;min-width:290px}
.roster-list > .filter-disclosure {position:absolute;right:0;top:0}
.roster-list > .filter-disclosure .collection-tools {position:absolute;right:0;top:30px;width:min(680px,75vw)}
.binder > .filter-disclosure {position:absolute;right:12px;top:4px}
.binder > .filter-disclosure .collection-tools {position:absolute;right:0;top:30px;width:min(760px,80vw)}
.wcard {border-radius:2px;box-shadow:inset 0 0 0 2px #f7edcd8c}
.wcard .portrait-window {box-shadow:inset 0 0 0 2px #f7edcd55;background-image:var(--print-grain);background-blend-mode:multiply}
/* Fit the source inside the zoom box: cover in a wide slot magnifies past the face. */
.cutout,.result-art .cutout {object-fit:contain;object-position:center top;filter:sepia(.18) saturate(.88) contrast(1.1) drop-shadow(1px 2px 1px #171c1940)}
/* Compact booking cards reserve their image for the wrestler; roster/detail cards show cost. */
.mrow .wcost {display:none}
.wcard.is-on {outline:2px solid #2d8892;outline-offset:2px}
.play-card {border-radius:2px}
.play-art > .ico {width:42px;height:42px}
.play-card:not(:has(.play-art img)) .play-art {background:linear-gradient(145deg,#f5e7bd,#d4c394);color:#1a2926}
.foil-pack {background-image:var(--print-grain),linear-gradient(110deg,#fff1,transparent 30%,#0002 65%,#fff2);background-blend-mode:multiply,normal;border-color:#263027;box-shadow:0 5px 10px #171c1940,inset 0 0 0 2px #e7cf8e}
.foil-pack .wrapper-name {font-style:italic;letter-spacing:.015em;text-shadow:1px 1px 0 #0c1b1b50}
.foil-pack .wrapper-portraits > img {height:175%;bottom:-48%;filter:sepia(.15) saturate(.85) contrast(1.15) drop-shadow(1px 1px 1px #071417)}
.foil-pack .wrapper-portraits > img:nth-child(2) {bottom:-43%}
.foil-pack .pack-brand {font-size:12px}
.foil-pack .wrapper-count {border-top:2px solid var(--wrap-trim);letter-spacing:.04em}
.story-action-art {display:block;position:relative;height:85px;overflow:hidden;background:var(--teal);border-bottom:1px solid var(--line)}
.story-action-art .cutout {position:absolute;width:100%;height:200%;top:0;object-fit:contain;object-position:top}
.story-action-copy {display:grid;grid-template-columns:30px 1fr;gap:4px 6px;padding:8px;text-align:left}
.story-action-copy > .ico {grid-row:1/3;align-self:center;width:28px;height:28px}
.story-action-copy b {font-family:Anton,sans-serif;text-transform:uppercase;font-size:18px}
.story-action-copy small {font-size:12px;line-height:1.35}
.story-actions {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.story-actions > button {padding:0;background:#f5e6c1;border:1px solid #8c7d5c;min-width:0}
.story-actions > button:disabled {opacity:.75}
.story-builder {border-top:1px solid #91805e;margin-top:12px;padding-top:10px}
.story-builder > summary {font:400 20px Anton,sans-serif;text-transform:uppercase;cursor:pointer;min-height:36px;display:flex;align-items:center;gap:8px;color:var(--teal)}
.story-builder .story-form {margin-top:8px;border-top:0;padding:0}
.story-builder .story-form h3 {display:none}
.story-builder > .text-button {margin-top:8px;font-size:13px}
.other-story-faces {display:flex;gap:3px;float:left;width:82px;height:68px;overflow:hidden;grid-row:1/3}
.other-story-faces .cutout {width:50%;height:180%;object-fit:contain;object-position:top}
.other-story:has(.other-story-faces) {display:grid;grid-template-columns:82px minmax(0,1fr);gap:4px 10px}
.daily-pack-art {min-height:0;display:flex;justify-content:center;align-items:center;flex:1}
.daily-pack-art .foil-pack {width:100%;max-width:100px;height:auto;max-height:180px;aspect-ratio:.6}
.daily-pack-art .wrapper-name {font-size:19px}
.daily-pack-art .pack-brand {font-size:8px;padding:4px 0}
.daily-pack-art .pack-brand > .ico {display:none}
.daily-pack-art .wrapper-count {font-size:7px}
/* A single board at desktop and landscape-tablet sizes. */
@media(min-width:901px) {
  :root {--nav:68px;--gap:10px}
  #app {min-height:650px}
  .stage {padding:8px clamp(18px,3.8vw,76px) 6px}
  .topbar {min-height:60px;height:60px;padding-inline:clamp(20px,4vw,76px)}
  .nav {padding:3px clamp(20px,3.2vw,64px)}
  .goalbar {padding-inline:clamp(20px,3.8vw,76px)}
  #app:has(.guide-strip) .board {overflow:visible}
  .board:is(.board-book,.board-roster,.board-stories,.board-live,.board-grade,.board-cards) {overflow:visible}
  #app:has(.guide-strip) :is(.book,.roster,.cards) {min-height:0}
  .book,.roster,.stories,.live,.grade,.cards {padding:12px;gap:10px;height:100%;overflow:visible}
  .shead h1 {font-size:clamp(35px,3.55vw,57px);line-height:1.05}
  /* Booking: portrait cards, three rows, hand and actions stay in the frame. */
  .book {grid-template-columns:minmax(0,1fr) clamp(230px,18vw,290px);grid-template-rows:56px minmax(0,1fr) 140px}
  .book > .shead {align-items:center;gap:18px}
  .book > .shead h1 {white-space:nowrap}
  .book > .shead p {font-size:16px;line-height:1.45}
  .book > .shead .text-button {font-size:12px}
  .brows {display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:8px}
  .mrow {min-height:0;grid-template-columns:130px minmax(100px,1fr) 30px minmax(100px,1fr) 96px 88px 80px 118px;gap:7px;padding:4px}
  .mslot {padding:14px 10px;gap:10px;border-right:1px solid #66251b}
  .mslot b {font-size:27px;line-height:1.1}
  .mslot span {font-size:13px;line-height:1.4;max-width:13ch}
  .mrow .wcard {height:100%;grid-template-rows:minmax(0,1fr) 23px;padding:4px}
  .mrow .wname {font-size:18px;grid-row:2;padding:3px 0 0;line-height:1.1}
  .mrow .wcost,.mrow .winfo,.mrow .fatigue {display:none}
  .mrow .portrait-window {grid-row:1;grid-column:1}
  .mrow .cutout {position:absolute;height:190%;width:148%;max-width:none;left:-24%;top:0;object-fit:contain;object-position:center top}
  .mrow .play-card {padding:3px;min-height:0}
  .mrow .play-kind {font-size:12px;padding:5px 1px}
  .mrow .play-card > b {font-size:14px;line-height:1.15;padding:0 2px}
  .mrow .play-card > small {font-size:10px;line-height:1.25}
  .mrate {gap:4px;justify-content:center;padding:4px}
  .mrate > span {font-size:12px}
  .mrate > b {font-size:35px}
  .mrate .stars {font-size:23px}
  .forecast {min-height:0;overflow:hidden}
  .forecast .panel-title {font-size:26px;padding:9px 10px;text-align:center}
  .forecast-inner {padding:12px 13px}
  .forecast .fbig {font-size:72px;line-height:1.2}
  .forecast .stars {font-size:33px}
  .forecast .ftarget {font-size:18px;margin-block:9px}
  .forecast .pbars {height:170px;margin:12px 0}
  .forecast .fnotes {font-size:15px;line-height:1.4;gap:9px}
  .hand-tray {min-height:0;display:flex;flex-direction:column;overflow:hidden}
  .hand-tray > h2 {padding:7px 9px;font-size:19px;min-height:34px}
  .hand-tray > h2 small {font-size:10px}
  .hand-row {flex:1;min-height:0;padding:6px;gap:7px;overflow:auto}
  .hand-row .play-card {flex:1 0 100px;width:auto;min-width:95px;max-width:155px;height:100%}
  .hand-row .play-kind {font-size:10px;padding:2px}
  .hand-row .play-card b {font-size:12px;line-height:1.1}
  .hand-row .play-card small {font-size:9px;line-height:1.1}
  .deck-note {font-size:10px;min-height:14px;line-height:1.2}
  .runbar {display:grid;grid-template-columns:.7fr 1.3fr;gap:7px;min-height:0}
  .runbar .btn {min-width:0;font-size:25px;flex-direction:column;padding:8px;gap:10px}
  .runbar .btn .ico {width:34px;height:34px}
  /* Roster: two full rows, then scroll further owned wrestlers. */
  .roster {grid-template-columns:minmax(0,1fr) clamp(290px,25vw,370px);grid-template-rows:78px minmax(0,1fr)}
  .roster .shead {gap:20px;align-items:center}
  .roster h1 {font-size:clamp(31px,3.25vw,52px);white-space:nowrap;max-width:none;text-underline-offset:9px}
  .capmeter {min-width:180px;max-width:300px}
  .capmeter > div {font-size:15px}
  .capmeter small {font-size:11px}
  .roster-list {position:relative;overflow:visible;padding-top:0}
  .roster-toolbar {min-height:28px;padding-right:115px;margin-bottom:8px}
  .rgrid {flex:1;min-height:0;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:calc((100% - 12px)/2);gap:12px;padding:3px;overflow:auto;align-content:start}
  .roster-card-wrap {height:100%;padding-bottom:0}
  .roster-card-wrap .size-roster {height:100%;grid-template-columns:minmax(0,1.25fr) minmax(76px,.9fr);grid-template-rows:30px minmax(0,1fr) 34px;gap:5px;padding:7px}
  .roster-card-wrap .wname {font-size:clamp(17px,1.65vw,25px);padding-right:42px;line-height:1.1}
  .roster-card-wrap .wcost {width:42px;height:42px;top:7px;right:7px;font-size:26px}
  .roster-card-wrap .wcost small {font-size:8px}
  .roster-card-wrap .winfo {padding-top:4px;gap:5px;overflow:visible}
  .roster-card-wrap .alignment {font-size:13px;padding:3px}
  .roster-card-wrap .wstyle {font-size:12px;min-height:16px;flex-shrink:0;line-height:1.25}
  .roster-card-wrap .wstats {margin:4px 0 0}
  .roster-card-wrap .wstats li {font-size:13px;padding:4px 0;line-height:1.2}
  .roster-card-wrap .wstats b {font-size:19px}
  .roster-card-wrap .cutout {position:absolute;height:195%;width:165%;max-width:none;left:-32.5%;top:0;object-fit:contain;object-position:center top}
  .roster-card-wrap .fatigue {font-size:10px;padding-bottom:5px}
  .squad-status {right:6px;bottom:4px;font-size:8px;background:var(--paper);padding:0 3px}
  .rside {display:grid;grid-template-rows:minmax(0,1fr) auto auto auto;align-content:stretch;gap:8px;padding-left:12px;overflow:visible}
  .rside .detail {display:flex;flex-direction:column;min-height:0;overflow:hidden;padding:7px}
  .detail .size-lg {flex:1;height:100%;min-height:0;grid-template-columns:minmax(0,1.25fr) minmax(100px,1fr);grid-template-rows:34px minmax(0,1fr) 35px;gap:6px;padding:3px}
  .detail .size-lg .wname {font-size:27px;line-height:1.15;padding-right:50px}
  .detail .size-lg .wcost {width:48px;height:48px;top:4px;right:3px;font-size:30px}
  .detail .size-lg .winfo {padding-top:7px;gap:5px;overflow:visible}
  .detail .size-lg .wstats li {font-size:15px;padding:5px 0;line-height:1.1}
  .detail .size-lg .wstats li b {font-size:23px}
  .detail .size-lg .wstyle {font-size:14px;min-height:18px;line-height:1.2;flex-shrink:0}
  .detail .size-lg .cutout {position:absolute;height:195%;width:165%;max-width:none;left:-32.5%;top:0;object-fit:contain;object-position:center top}
  .detail .flavor {display:none}
  .detail > .text-button {font-size:13px;min-height:25px;align-self:flex-start}
  .detail > .btn {min-height:37px;flex-shrink:0;font-size:17px;padding:6px}
  .rest-panel,.capcard {padding:10px;gap:10px;flex-wrap:nowrap;min-height:70px}
  .rest-panel h3,.capcard h3 {font-size:22px}
  .rest-panel p,.capcard p {font-size:13px;line-height:1.35;margin-top:4px}
  .capcard > .btn {font-size:14px;padding:8px;min-height:38px;max-width:120px}
  .capcard > .ico,.rest-panel > .ico {width:34px;height:34px}
  .roster-footer {margin:0;min-height:54px;padding-top:8px}
  .roster-footer > .btn {font-size:18px;padding:10px;min-height:43px}
  .roster-footer > b {font-size:12px;line-height:1.35}
  /* Results: the whole finance/fan column belongs above the continue panel. */
  .grade {grid-template-columns:minmax(0,1.9fr) minmax(335px,1fr);grid-template-rows:70px minmax(0,1fr) 155px}
  .grade .banner {padding:9px 14px}
  .grade .banner h1 {font-size:clamp(36px,3.9vw,60px);line-height:1.05}
  .grows {display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:8px}
  .grow {min-height:0;grid-template-columns:85px minmax(0,1fr) 135px}
  .gtag {font-size:22px}
  .result-person > b {font-size:18px;line-height:1.2;overflow-wrap:normal}
  .result-art {min-width:68px;width:44%}
  .result-art .cutout {height:240%;width:175%;left:-37.5%;top:0;object-fit:contain;object-position:top}
  .result-person.reverse .result-art .cutout {left:-37.5%}
  .grate .stars {font-size:26px}
  .grade .stars-fg {color:var(--red)}
  .grate > strong {font-size:32px;line-height:1.15}
  .results-rail {display:grid;grid-template-rows:minmax(0,1.15fr) minmax(0,1fr) minmax(85px,.6fr);gap:8px;overflow:visible;align-content:stretch}
  .gscore,.financial,.fansbox {min-height:0;padding:9px;overflow:hidden}
  .results-rail h2 {font-size:23px;padding-bottom:5px}
  .score-lockup {gap:18px;margin-top:8px}
  .gletter {font-size:95px;line-height:1;padding:6px 13px 2px}
  .gnum {font-size:61px;line-height:1.05}
  .gnum small {font-size:33px}
  .gscore .stars {font-size:31px}
  .gscore > p {font-size:13px;margin-top:6px;line-height:1.3}
  .money li {font-size:18px;padding:3px 0;line-height:1.15}
  .money li b {font-size:21px;line-height:1.15}
  .net {font-size:23px;padding:6px 8px;margin-top:5px}
  .fansbox {display:grid;grid-template-columns:1fr 1fr;grid-template-rows:25px 20px 15px 14px;gap:3px 8px}
  .fansbox h2 {grid-column:1/-1;font-size:21px;padding:0;border:0}
  .fansbox > b {font-size:25px;grid-row:2/4;line-height:1.1}
  .fansbox > span {font-size:11px;line-height:1.1}
  .fansbox > i {height:12px;align-self:center}
  .fansbox > small {font-size:11px;line-height:1.1}
  .why,.nextbox {min-height:0;overflow:auto}
  .why {padding:9px}
  .why h2,.nextbox h2 {font-size:23px}
  .why > .text-button {font-size:12px;min-height:22px}
  .reasons {padding-top:8px;gap:10px}
  .reasons > div {font-size:14px;line-height:1.35;gap:8px}
  .reasons .ico {width:32px;height:32px}
  .why details {margin-top:7px}
  .nextbox {gap:8px;padding:2px 0}
  .nextbox p {font-size:14px;line-height:1.4}
  .nextbox > .btn {font-size:21px;min-height:46px;padding:10px;flex-shrink:0}
  /* Collection: pack + Combine, then the visible horizontal binder. */
  .cards {grid-template-rows:52px 22px minmax(0,1fr) 190px;gap:8px;overflow:visible}
  .cards > .shead h1 {font-size:clamp(32px,3.2vw,51px);line-height:1.05}
  .cards-tabs {gap:4px}
  .cards-tabs button {font-size:12px;padding:7px 9px}
  .cards > .depth-links {margin:0;gap:20px;font-size:12px;align-items:center}
  .cards .cards-top {min-height:0;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:10px}
  .cards .packbox,.cards .combinebox {min-height:0;overflow:hidden}
  .cards .panel-title {font-size:22px;padding:7px 10px;line-height:1.2;min-height:40px}
  .cards .panel-title small {font-size:11px;padding-top:4px}
  .pack-content {grid-template-columns:minmax(100px,.8fr) minmax(180px,1.2fr) 100px;gap:10px;padding:10px;min-height:0}
  .pack-content > .foil-pack {max-height:265px;width:100%;height:auto;max-width:175px;aspect-ratio:.62}
  .pack-info {gap:7px;min-height:0}
  .pack-info > h3 {font-size:28px;line-height:1.1}
  .pack-info > p {font-size:11px;line-height:1.25}
  .pack-price {font-size:24px;line-height:1.2}
  .pack-price .ico {width:25px;height:25px}
  .pack-info > .btn {font-size:20px;min-height:44px;padding:8px;flex-shrink:0}
  .odds-box {padding:6px}
  .odds-box h3 {font-size:16px;line-height:1.1}
  .odds {margin-top:5px;gap:4px}
  .odds li {font-size:10px;gap:2px;line-height:1.2}
  .odds li b {font-size:16px;line-height:1.2}
  .odds-box > small {font-size:9px;line-height:1.1;display:block;margin-top:4px}
  .pity {padding:6px;margin-top:auto;font-size:11px;flex-shrink:0}
  .pity > small {font-size:10px;line-height:1.1}
  .pity i {height:10px;margin:4px 0}
  .daily {padding:7px;gap:5px}
  .daily h3 {font-size:20px;line-height:1.1}
  .daily p {font-size:13px;line-height:1.2}
  .daily .btn {min-height:32px;padding:5px 3px;font-size:12px;flex-shrink:0}
  .daily-pack-art .foil-pack {max-height:160px;max-width:88px}
  .combine-content {padding:9px;gap:7px;min-height:0}
  .combine-visual {min-height:0;flex:1;gap:12px;overflow:hidden}
  .spare-stack {padding-bottom:23px;min-width:0}
  .spare-stack .size-mini {height:125px;width:82px}
  .spare-stack > span {font-size:11px}
  .combine-preview {height:100%;max-height:205px;min-height:0;flex:0 1 150px}
  .combine-preview > .size-lg {width:100%;height:calc(100% - 16px);min-height:0;grid-template-rows:25px minmax(0,1fr);padding:4px}
  .combine-preview .size-lg .wname {font-size:16px;line-height:1.2}
  .combine-preview .size-lg .portrait-window {grid-column:1;grid-row:2}
  .combine-preview .cutout {position:absolute;height:195%;width:165%;max-width:none;left:-32.5%;top:0;object-fit:contain;object-position:top}
  .combine-preview .wgrade {bottom:7px;left:7px;font-size:11px}
  .combine-stats {padding:6px;flex-shrink:0}
  .combine-stats > div {font-size:11px;padding:0 7px;gap:2px}
  .combine-stats b {font-size:14px;line-height:1.2}
  .combine-content > .btn {font-size:21px;min-height:43px;padding:8px;flex-shrink:0}
  .combine-note {font-size:10px;line-height:1.15}
  .cards > .binder {position:relative;min-height:0;height:auto;overflow:visible;display:flex;flex-direction:column}
  .binder > header {padding:4px 10px;padding-right:145px;min-height:30px;flex-shrink:0}
  .binder h2 {font-size:21px}
  .binder h2 small {font-size:12px;margin-left:12px}
  .binder header > span {display:none}
  .binder .tray-row {padding:3px 9px 4px;flex:1;min-height:0;gap:9px}
  .binder-card {flex-basis:108px;min-height:0}
  .binder-card > .size-mini {height:100%;width:100%;min-height:0;grid-template-rows:minmax(0,1fr) 18px;flex:1}
  .binder-card .wname {font-size:12px;padding:2px 0;grid-row:2}
  .binder-card .winfo {display:none}
  .binder-card > small {font-size:9px;line-height:1.1}
  .binder .size-mini .cutout {position:absolute;width:140%;height:190%;max-width:none;left:-20%;top:0;object-fit:contain;object-position:top}
  .binder-do {min-height:22px;padding:2px 9px;gap:10px;flex-shrink:0;font-size:11px}
  .binder-do .text-button {font-size:11px;min-height:20px}
  /* Stories: poster portraits, illustrated actions, a compact real card builder. */
  .stories {grid-template-columns:minmax(0,1fr) clamp(280px,22vw,340px);grid-template-rows:86px minmax(0,1fr)}
  .stories .shead h1 {font-size:clamp(45px,5vw,80px);line-height:1.05}
  .stories .shead p {font-size:17px;max-width:120px}
  .story-content {grid-template-columns:minmax(0,.92fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 105px;gap:14px}
  .story-pair {gap:8px;grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr)}
  .story-pair .wcard {grid-template-rows:minmax(0,1fr) 32px;padding:6px;min-height:0}
  .story-pair .wname {font-size:23px;grid-row:2;line-height:1.1;white-space:nowrap}
  .story-pair .portrait-window {grid-column:1;grid-row:1}
  .story-pair .cutout {position:absolute;height:190%;width:180%;max-width:none;left:-40%;top:0;object-fit:contain;object-position:top}
  .story-center {overflow:auto}
  .heat-label > b {font-size:26px}
  .heat-label strong {font-size:49px}
  .story-heat {height:24px;margin-bottom:18px}
  .story-timeline {margin-bottom:18px}
  .story-timeline li {font-size:12px}
  .story-card {padding:5px;margin-bottom:10px}
  .story-card h2 {font-size:37px;padding:8px 12px}
  .story-card p {font-size:17px;padding:6px}
  .other-stories {min-height:0;overflow:auto}
  .other-stories h2 {font-size:19px;padding:5px 10px}
  .other-stories > div {padding:8px;gap:12px}
  .payoff {min-height:0;overflow:auto;padding-left:12px}
  .payoff .panel-title {font-size:26px;padding:8px 10px}
  .payoff > img {height:145px;object-position:top}
  .payoff > h3 {font-size:20px;margin:8px 0}
  .hot-crowd {background-color:var(--red);background-image:linear-gradient(#8e211ba0,#8e211ba0),url('../assets/ui/arena.webp');background-position:center 65%;background-size:cover;min-height:60px;padding:10px;font-size:23px;border:1px solid var(--line)}
  .payoff > p {font-size:16px;line-height:1.4;margin:10px 0}
  .payoff > .btn {font-size:19px;padding:11px;min-height:48px}
  .story-form {gap:7px}
  .story-form label {font-size:13px}
  .story-form select {min-height:34px}
  .story-form > .btn {font-size:18px;min-height:43px;margin-top:5px}
  .payoff > .text-button {font-size:12px;margin-top:8px;min-height:28px}
  /* Live show: the print and portrait treatment carries into the arena stage. */
  .live {grid-template-columns:minmax(0,1fr) clamp(285px,22vw,350px);grid-template-rows:72px minmax(0,1fr)}
  .live-title h1 {font-size:clamp(42px,4.6vw,72px);line-height:1.05}
  .live-main {grid-template-rows:56px minmax(0,1fr) 57px;gap:8px}
  .lstage {grid-template-columns:minmax(140px,1fr) minmax(0,2.7fr) minmax(140px,1fr);gap:7px}
  .lstage > .wcard {grid-template-rows:minmax(0,1fr) 29px;padding:6px}
  .lstage .wname {grid-row:2;font-size:23px;line-height:1.15;white-space:nowrap}
  .lstage .portrait-window {grid-column:1;grid-row:1}
  .lstage .cutout {position:absolute;height:180%;width:190%;max-width:none;left:-45%;top:0;object-fit:contain;object-position:top}
  .lart > img {filter:sepia(.12) contrast(1.1) saturate(.88);object-position:center 36%}
  .lart figcaption {font-size:18px;padding:8px 10px}
  .call-rail {overflow:hidden;gap:9px;padding:7px}
  .call-rail .panel-title {font-size:27px;padding:8px 10px}
  .calls-left {font-size:18px;margin:1px 0 4px}
  .call-btn {min-height:80px;padding:12px;flex:1;gap:13px}
  .call-btn > span {font-size:28px}
  .call-btn small {font-size:15px}
  .commentary {font-size:17px;padding:12px 5px;line-height:1.4}
  .call-rail > .continue {min-height:56px;font-size:22px;padding:10px;flex-shrink:0}
  .call-rail > .text-button {font-size:12px;min-height:20px}
}
@media(min-width:901px) {
  .cards {grid-template-rows:48px 20px minmax(0,1fr) 170px}
  .results-rail {grid-template-rows:minmax(155px,1.15fr) minmax(140px,1fr) 104px}
  .results-rail:has(.financial li:nth-child(4)) {grid-template-rows:minmax(150px,1fr) minmax(163px,1fr) 104px}
  .stories.no-story .hot-crowd,.stories.no-story .payoff > h3 {display:none}
  .stories.no-story .payoff > img {height:100px}
}
@media(min-width:901px) and (max-width:1200px) {
  :root {--nav:58px}
  .stage {padding:7px 18px 5px}
  .topbar {height:54px;min-height:54px;padding-inline:20px}
  .topbar .brand {font-size:30px}
  .brand > .ico {width:32px;height:32px}
  .hud {gap:12px}
  .hud > span {font-size:15px;padding-inline:8px}
  .nav {padding-inline:20px}
  .nav button {font-size:17px;gap:10px;padding:7px}
  .nav .ico {width:29px;height:29px}
  .goalbar {padding-inline:20px;min-height:24px}
  .goalbar .guide-strip {font-size:11px;gap:10px}
  .goalbar .guide-strip > b,.goalbar .guide-strip .text-button {font-size:11px}
  .goalbar > span:last-child {font-size:9px}
  .book,.roster,.stories,.live,.grade,.cards {padding:10px;gap:8px}
  .shead h1 {font-size:35px}
  .book {grid-template-columns:minmax(0,1fr) 205px;grid-template-rows:48px minmax(0,1fr) 116px}
  .book > .shead {gap:13px}
  .book > .shead h1 {font-size:33px}
  .book > .shead p {font-size:13px}
  .book > .shead .text-button {font-size:11px}
  .mrow {grid-template-columns:92px minmax(72px,1fr) 20px minmax(72px,1fr) 71px 64px 58px 78px;gap:4px;padding:4px}
  .mslot {padding:10px 7px;gap:8px}
  .mslot b {font-size:20px}
  .mslot span {font-size:10px;line-height:1.4}
  .mrow .wname {font-size:13px;padding-top:3px}
  .mrow .wcard {grid-template-rows:minmax(0,1fr) 19px;padding:3px}
  .mvs {font-size:23px}
  .mrow .play-card {padding:2px}
  .mrow .play-kind {font-size:10px;padding:4px 0}
  .mrow .play-card > b {font-size:11px;line-height:1.2}
  .mrow .play-card > small {font-size:9px;line-height:1.2}
  .mrow .play-art {margin-block:3px}
  .play-art > .ico {width:30px;height:30px}
  .mrate {gap:3px;padding:2px}
  .mrate > span {font-size:10px}
  .mrate > b {font-size:28px}
  .mrate small {font-size:17px}
  .mrate .stars {font-size:18px}
  .forecast .panel-title {font-size:23px;padding:8px 7px}
  .forecast-inner {padding:10px}
  .forecast .fbig {font-size:61px}
  .forecast .stars {font-size:28px}
  .forecast .ftarget {font-size:16px;margin-block:7px}
  .forecast hr {margin-block:10px}
  .forecast h3 {font-size:21px}
  .forecast .pbars {height:135px;margin-block:10px}
  .forecast .pbar > span {font-size:10px}
  .forecast .fnotes {font-size:13px;gap:6px}
  .hand-tray > h2 {min-height:29px;font-size:16px;padding:5px 7px}
  .hand-tray > h2 small {font-size:9px}
  .hand-row {padding:5px;gap:5px}
  .hand-row .play-card {min-width:74px;flex-basis:78px}
  .hand-row .play-kind {font-size:9px}
  .hand-row .play-card b {font-size:10px}
  .hand-row .play-card small {font-size:8px}
  .deck-note {font-size:8px;min-height:12px}
  .runbar {gap:5px}
  .runbar .btn {font-size:19px;padding:7px;gap:8px}
  .runbar .btn .ico {width:28px;height:28px}
  .roster {grid-template-columns:minmax(0,1fr) 285px;grid-template-rows:68px minmax(0,1fr)}
  .roster .shead {gap:14px}
  .roster h1 {font-size:31px}
  .capmeter {min-width:160px;max-width:255px}
  .capmeter > div {font-size:13px;gap:6px}
  .capmeter small {font-size:9px}
  .capmeter i {height:14px;margin-block:5px}
  .rgrid {gap:9px;grid-auto-rows:calc((100% - 9px)/2);padding:2px}
  .roster-card-wrap .size-roster {grid-template-columns:minmax(0,1.05fr) minmax(70px,.9fr);grid-template-rows:27px minmax(0,1fr) 30px;gap:4px;padding:6px}
  .roster-card-wrap .wname {font-size:17px;padding-right:34px}
  .roster-card-wrap .wcost {width:34px;height:34px;font-size:22px;top:6px;right:6px}
  .roster-card-wrap .wcost small {font-size:7px}
  .roster-card-wrap .winfo {gap:3px;padding-top:4px}
  .roster-card-wrap .alignment {font-size:11px;padding:2px}
  .roster-card-wrap .wstyle {font-size:10px;line-height:1.3;min-height:13px}
  .roster-card-wrap .wstats {margin-top:3px}
  .roster-card-wrap .wstats li {font-size:11px;padding:3px 0}
  .roster-card-wrap .wstats b {font-size:16px}
  .roster-card-wrap .fatigue {font-size:9px;padding-bottom:3px}
  .fatigue i {height:10px}
  .fatigue small {font-size:9px}
  .rside {padding-left:10px;gap:7px}
  .rside .detail {padding:6px}
  .detail .size-lg {grid-template-columns:minmax(0,1.2fr) minmax(95px,1fr);grid-template-rows:30px minmax(0,1fr) 30px;gap:5px;padding:2px}
  .detail .size-lg .wname {font-size:24px;padding-right:41px}
  .detail .size-lg .wcost {width:40px;height:40px;font-size:25px}
  .detail .size-lg .winfo {padding-top:4px;gap:4px}
  .detail .size-lg .wstyle {font-size:12px;min-height:16px}
  .detail .size-lg .wstats li {font-size:13px;padding:4px 0}
  .detail .size-lg .wstats li b {font-size:20px}
  .detail > .text-button {font-size:12px;min-height:23px}
  .detail > .btn {font-size:15px;min-height:34px}
  .rest-panel,.capcard {min-height:60px;padding:8px;gap:8px}
  .rest-panel h3,.capcard h3 {font-size:19px}
  .rest-panel p,.capcard p {font-size:12px;line-height:1.3}
  .capcard > .ico,.rest-panel > .ico {width:28px;height:28px}
  .capcard > .btn {font-size:12px;padding:6px;min-height:34px}
  .roster-footer {min-height:47px;padding-top:6px}
  .roster-footer > b {font-size:11px}
  .roster-footer > .btn {font-size:15px;padding:8px;min-height:37px}
  .grade {grid-template-columns:minmax(0,1.8fr) 310px;grid-template-rows:58px minmax(0,1fr) 130px}
  .grade .banner h1 {font-size:39px}
  .grow {grid-template-columns:70px minmax(0,1fr) 104px}
  .gtag {font-size:18px;padding:6px}
  .result-pair {grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr)}
  .result-person {gap:4px}
  .result-person > b {font-size:13px}
  .result-art {min-width:48px;width:44%}
  .grate {padding:5px 2px}
  .grate .stars {font-size:21px}
  .grate > strong {font-size:27px}
  .grate strong small {font-size:18px}
  .grate > span:last-child:not(.stars) {font-size:9px}
  .results-rail {gap:7px;grid-template-rows:minmax(150px,1.15fr) minmax(132px,1fr) 96px}
  .results-rail:has(.financial li:nth-child(4)) {grid-template-rows:minmax(150px,1fr) minmax(156px,1fr) 96px}
  .gscore,.financial,.fansbox {padding:7px}
  .results-rail h2 {font-size:21px;padding-bottom:4px}
  .score-lockup {gap:13px;margin-top:6px}
  .gletter {font-size:78px;padding:5px 11px 2px}
  .gnum {font-size:51px}
  .gnum small {font-size:28px}
  .gscore .stars {font-size:26px}
  .gscore > p {font-size:11px;margin-top:5px}
  .money li {font-size:16px;padding:3px 0}
  .money li b {font-size:19px}
  .net {font-size:20px;padding:5px 7px;margin-top:4px}
  .fansbox {grid-template-rows:22px 18px 12px 13px;gap:3px 7px}
  .fansbox h2 {font-size:19px}
  .fansbox > b {font-size:23px}
  .fansbox > span,.fansbox > small {font-size:10px}
  .why {padding:7px}
  .why h2,.nextbox h2 {font-size:21px}
  .why > .text-button {font-size:11px;min-height:20px}
  .reasons {padding-top:6px;gap:7px}
  .reasons > div {font-size:12px;gap:6px}
  .reasons > div + div {padding-left:7px}
  .reasons .ico {width:25px;height:25px}
  .why details {font-size:11px;margin-top:6px}
  .nextbox {gap:6px}
  .nextbox p {font-size:12px;line-height:1.35}
  .nextbox > .btn {font-size:18px;min-height:42px;padding:8px}
  .cards {grid-template-rows:44px 20px minmax(0,1fr) 145px;gap:7px}
  .cards > .shead h1 {font-size:33px}
  .cards-tabs button {font-size:10px;padding:6px 7px}
  .cards > .depth-links {font-size:11px;gap:16px}
  .cards .panel-title {font-size:20px;padding:6px 8px;min-height:34px}
  .cards .panel-title small {display:none}
  .pack-choose {font-size:10px}
  .pack-content {grid-template-columns:85px minmax(0,1fr) 77px;padding:8px;gap:8px}
  .pack-content > .foil-pack {max-height:200px;max-width:110px}
  .pack-content .pack-brand {font-size:8px;padding:5px 0}
  .pack-content .pack-brand > .ico {display:none}
  .pack-content .wrapper-name {font-size:23px}
  .pack-content .wrapper-count {font-size:8px;padding:5px 0}
  .pack-info {gap:4px}
  .pack-info > h3 {font-size:21px}
  .pack-info > p {font-size:10px;line-height:1.2}
  .pack-price {font-size:19px;line-height:1.2}
  .pack-price .ico {width:21px;height:21px}
  .pack-info > .btn {font-size:17px;min-height:33px;padding:6px}
  .odds-box {padding:5px}
  .odds-box h3 {font-size:14px}
  .odds {margin-top:4px;gap:2px}
  .odds li {font-size:9px;gap:2px;line-height:1.2}
  .odds .pip {width:8px;height:8px}
  .odds li b {font-size:13px;line-height:1.2}
  .odds-box > small {font-size:8px;line-height:1.15;margin-top:3px}
  .pity {font-size:10px;padding:5px}
  .pity i {height:8px;margin:3px 0}
  .pity > small {font-size:9px;line-height:1.15}
  .daily {padding:5px;gap:4px}
  .daily h3 {font-size:17px}
  .daily p {font-size:11px}
  .daily .btn {font-size:10px;min-height:30px;padding:4px 2px}
  .daily-pack-art .foil-pack {max-height:125px;max-width:68px}
  .daily-pack-art .wrapper-name {font-size:14px}
  .daily-pack-art .wrapper-count {font-size:6px}
  .daily-pack-art .pack-brand {font-size:6px}
  .combine-content {padding:7px;gap:6px}
  .combine-visual {gap:8px}
  .spare-stack {padding-bottom:19px}
  .spare-stack .size-mini {width:70px;height:102px}
  .spare-stack > span {font-size:10px}
  .combine-visual > .ico {width:24px;height:24px}
  .combine-preview {max-height:158px;flex-basis:120px}
  .combine-preview > .size-lg {grid-template-rows:21px minmax(0,1fr)}
  .combine-preview .size-lg .wname {font-size:13px}
  .combine-preview > span {font-size:9px}
  .combine-stats {padding:5px}
  .combine-stats > div {font-size:10px;padding:0 5px;gap:2px}
  .combine-stats b {font-size:12px}
  .combine-content > .btn {font-size:18px;min-height:35px;padding:6px}
  .combine-note {font-size:9px}
  .binder > header {min-height:27px;padding:3px 8px;padding-right:140px}
  .binder h2 {font-size:19px}
  .binder h2 small {font-size:10px;margin-left:10px}
  .binder .tray-row {padding:2px 8px 3px;gap:7px}
  .binder-card {flex-basis:90px}
  .binder-card .wname {font-size:11px}
  .binder-card > small {font-size:8px}
  .binder .size-mini .wcost {width:20px;height:20px;font-size:13px}
  .binder-do {font-size:10px;min-height:19px;padding:1px 8px}
  .binder-do .text-button {font-size:10px;min-height:19px}
  .stories {grid-template-columns:minmax(0,1fr) 255px;grid-template-rows:70px minmax(0,1fr)}
  .stories .shead h1 {font-size:48px}
  .stories .shead p {font-size:14px;max-width:95px}
  .story-content {grid-template-columns:minmax(0,.95fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 88px;gap:10px}
  .story-pair {grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr);gap:5px}
  .story-pair .wcard {grid-template-rows:minmax(0,1fr) 26px;padding:5px}
  .story-pair .wname {font-size:17px}
  .heat-label > b {font-size:21px}
  .heat-label strong {font-size:39px}
  .heat-label > span {font-size:12px}
  .story-heat {height:21px;margin:4px 0 13px}
  .story-timeline {margin-bottom:13px}
  .story-timeline li {font-size:10px;gap:5px}
  .story-card {margin-bottom:8px}
  .story-card h2 {font-size:29px;padding:6px 9px}
  .story-card p {font-size:14px;padding:5px}
  .story-actions {gap:6px}
  .story-action-art {height:65px}
  .story-action-copy {grid-template-columns:22px 1fr;padding:6px;gap:3px 4px}
  .story-action-copy > .ico {width:22px;height:22px}
  .story-action-copy b {font-size:14px}
  .story-action-copy small {font-size:10px;line-height:1.3}
  .other-stories h2 {font-size:17px;padding:4px 8px}
  .other-stories > div {padding:7px;gap:10px}
  .other-stories p {font-size:12px}
  .payoff {padding-left:10px}
  .payoff .panel-title {font-size:23px;padding:7px 9px}
  .payoff > img {height:112px}
  .payoff > h3 {font-size:17px;margin:7px 0}
  .hot-crowd {font-size:18px;min-height:48px;padding:8px;gap:7px}
  .payoff > p {font-size:13px;line-height:1.35;margin:9px 0}
  .payoff > .btn {font-size:16px;min-height:42px;padding:8px}
  .story-builder {margin-top:9px;padding-top:8px}
  .story-builder > summary {font-size:18px;min-height:32px}
  .story-form {gap:6px}
  .story-form label {font-size:12px}
  .story-form select {min-height:31px;font-size:12px;padding:4px}
  .story-form > .btn {font-size:16px;min-height:38px}
  .story-builder > .text-button,.payoff > .text-button {font-size:11px;min-height:24px}
  .stories.no-story .payoff > img {height:80px}
  .live {grid-template-columns:minmax(0,1fr) 265px;grid-template-rows:60px minmax(0,1fr)}
  .live-title h1 {font-size:45px}
  .live-title h1:before,.live-title h1:after {padding:0 12px}
  .live-main {grid-template-rows:46px minmax(0,1fr) 46px;gap:7px}
  .ltab {padding:6px;gap:5px}
  .ltab b {font-size:15px}
  .ltab > span,.ltab .stars {font-size:12px}
  .ltab .live-badge {font-size:15px;padding:1px 5px}
  .ltab .ico {width:18px}
  .lstage {grid-template-columns:minmax(108px,1fr) minmax(0,2.5fr) minmax(108px,1fr);gap:5px}
  .lstage > .wcard {grid-template-rows:minmax(0,1fr) 23px;padding:4px}
  .lstage .size-slot .wname {font-size:17px}
  .lart figcaption {font-size:15px;padding:7px 9px}
  .lart figcaption span {font-size:11px}
  .lmeter {padding:7px 9px;gap:9px}
  .lmeter > b {font-size:18px}
  .lmeter > i {height:18px}
  .lmeter > span {font-size:11px}
  .call-rail {gap:5px;padding:5px}
  .call-rail .panel-title {font-size:23px;padding:7px 9px}
  .calls-left {font-size:15px;margin:1px 0 3px}
  .call-btn {min-height:60px;padding:8px;gap:10px}
  .call-btn > span {font-size:23px}
  .call-btn small {font-size:12px;margin-top:3px}
  .call-btn > .ico {width:29px;height:29px}
  .commentary {font-size:14px;padding:8px 4px;line-height:1.3}
  .commentary > .ico {width:27px;height:27px}
  .call-rail > .continue {font-size:19px;min-height:44px;padding:8px}
  .call-rail > .text-button {font-size:11px;min-height:18px}
}
@media(max-width:900px) {
  .board:before {opacity:.32}
  .topbar .brand {font-size:28px}
  .brand > .ico {width:31px;height:31px}
  .goalbar {flex-wrap:wrap;gap:8px;padding:10px 18px 18px}
  .goalbar .guide-strip {font-size:12px;gap:9px;margin:0;flex-wrap:wrap;flex:1 1 100%}
  .goalbar .guide-strip > span {min-width:0;flex:1 1 200px;order:0}
  .goalbar .guide-strip > .text-button {order:0}
  .goalbar .guide-strip > b {font-size:12px}
  .goalbar .guide-strip .text-button {font-size:12px;min-height:30px}
  .goalbar > span:last-child {font-size:11px}
  .roster-list {position:relative}
  .roster-toolbar {padding-right:120px;min-height:30px}
  .roster-list > .filter-disclosure .collection-tools {width:min(620px,84vw)}
  .binder {position:relative;overflow:visible;height:260px}
  .binder > header {padding-right:130px}
  .binder > .filter-disclosure .collection-tools {width:min(620px,84vw)}
  .binder-card {flex-basis:118px;min-height:0}
  .binder-card > .size-mini {height:100%;width:100%;min-height:0}
  .binder .tray-row {min-height:0}
  .daily-pack-art {grid-column:1;grid-row:1/3}
  .daily-pack-art .foil-pack {max-width:90px;max-height:145px}
  .story-action-art {height:100px}
  .story-action-copy {grid-template-columns:25px 1fr}
  .story-action-copy b {font-size:16px}
  .story-action-copy small {font-size:12px}
  .story-action-copy > .ico {width:24px;height:24px}
  .story-builder > summary {min-height:43px;font-size:21px}
  .story-builder {margin-top:15px}
}
@media(max-width:650px) {
  .topbar .brand {font-size:26px}
  .brand > .ico {width:29px;height:29px}
  .goalbar {padding:12px 14px 20px}
  .goalbar .guide-strip > span {flex-basis:100%}
  .goalbar .guide-strip > b {min-width:0}
  .filter-disclosure > summary {font-size:11px;min-height:32px}
  .filter-disclosure .collection-tools {gap:9px;padding:11px}
  .filter-disclosure .collection-tools label {font-size:11px}
  .filter-disclosure .collection-tools input,.filter-disclosure .collection-tools select {min-height:40px;font-size:14px}
  .roster-toolbar {font-size:12px;padding-right:110px}
  .roster-toolbar > span {max-width:115px}
  .roster-toolbar > .text-button {font-size:11px}
  .binder {height:270px}
  .binder > header {padding:7px 120px 7px 9px;min-height:40px}
  .binder h2 {font-size:20px}
  .binder h2 small {display:block;font-size:11px;margin:1px 0 0}
  .binder header > span {display:none}
  .binder > .filter-disclosure {top:8px;right:8px}
  .binder-do {font-size:12px;padding:6px 9px;min-height:34px}
  .binder-card .wname {font-size:14px}
  .binder-card > small {font-size:10px}
  .story-actions {grid-template-columns:1fr;gap:10px}
  .story-actions > button {display:grid;grid-template-columns:95px 1fr;min-height:100px}
  .story-action-art {height:100%;border-bottom:0;border-right:1px solid var(--line)}
  .story-action-art .cutout {height:200%;width:150%;max-width:none;left:-25%}
  .story-action-copy {padding:12px;grid-template-columns:30px 1fr;gap:5px 8px;align-content:center}
  .story-action-copy b {font-size:20px}
  .story-action-copy small {font-size:14px;line-height:1.4}
  .story-builder .story-form label {font-size:14px}
  .story-builder .story-form select {min-height:42px;font-size:15px}
}
/* Keep base ink colors under the paper-grain image, including inactive rows. */
.mslot {background-color:var(--red)}
.mrow.is-focused .mslot {background-color:#9c211b;background-image:var(--print-grain)}
.nav button.is-on {background-color:var(--red)}
.wcard .portrait-window {background-color:#24606b}
.rarity-common .portrait-window {background-color:#a43e2b}
.rarity-uncommon .portrait-window {background-color:#246a76}
.rarity-rare .portrait-window {background-color:#9b762c}
.rarity-epic .portrait-window {background-color:#70416a}
.rarity-legendary .portrait-window {background-color:#5a7667}
.foil-pack .wrapper-portraits > img,.foil-pack .wrapper-portraits > img:nth-child(2) {top:0;bottom:auto;height:190%;object-fit:contain;object-position:top}
@media(min-width:901px) {
  .book > .shead {grid-column:1;grid-row:1}
  .forecast {grid-column:2;grid-row:1/3;overflow:auto}
  .forecast .pbars {height:140px}
  .forecast .fnotes {margin:0}
  .forecast .fnotes li {margin:5px 0}
  .cards {grid-template-columns:minmax(0,1fr);overflow:visible}
  .cards:has(.collection-tools) {overflow:visible}
  .cards > *,.cards-top,.packbox,.combinebox,.binder {min-width:0}
  .hand-tray > h2 {height:32px;min-height:32px;flex:0 0 32px;line-height:1.1;padding:6px 9px}
  .hand-row .play-kind,.hand-row .play-card > b,.hand-row .play-card > small {flex-shrink:0}
  .hand-row .play-art {min-height:18px;margin-block:3px}
}
@media(min-width:901px) and (max-width:1200px) {
  .hand-tray > h2 {height:27px;min-height:27px;flex-basis:27px;padding:5px 7px}
  .hand-row .play-art {min-height:14px;margin-block:2px}
  .forecast .fbig {font-size:55px;line-height:1.1}
  .forecast .stars {font-size:25px}
  .forecast .ftarget {font-size:15px;margin-block:6px}
  .forecast .pbars {height:95px;margin-block:9px}
  .forecast h3 {font-size:19px}
  .forecast .fnotes {font-size:12px;line-height:1.3}
}

.story-action-art {width:100%;flex-shrink:0}
.story-action-copy {width:100%}
.story-actions > button {gap:0;align-items:stretch}
.fatigue small span {display:inline}
/* Action captions share a full-width title so the longest payoff label stays visible. */
.story-action-copy b {grid-column:1/-1;grid-row:1;font-size:16px}
.story-action-copy > .ico {grid-column:1;grid-row:2}
.story-action-copy > small {grid-column:2;grid-row:2}
@media(min-width:901px) and (max-width:1200px){.story-action-copy b{font-size:14px}.story-action-copy > small{font-size:10px}}
@media(max-width:650px){.story-action-copy b{font-size:20px}}