/* Jade scroll interiors. All raster skins are genuine Nano Banana output;
   see assets/ui/jade/source.json. Text and state remain live DOM content. */
#game {
 --jade-paper:url('./assets/ui/jade/paper.png');--jade-dark:url('./assets/ui/jade/dark.png');
 --jade-primary:url('./assets/ui/jade/primary.png');--jade-secondary:url('./assets/ui/jade/secondary.png');
 --jade-danger:url('./assets/ui/jade/danger.png');--jade-disabled:url('./assets/ui/jade/disabled.png');
 --jade-row:url('./assets/ui/jade/row.png');--jade-ink:#203f46;--jade-muted:#506b70;
 --jade-gold:#e4c47e;--jade-title:'STKaiti','KaiTi','Songti SC','SimSun',serif;
}
#game#game#game :is(.overlay,.login-settings-dialog):not(#intro) {--ui-muted:var(--jade-muted);--v18-muted:var(--jade-muted);--v18-text:var(--jade-ink)}
#game#game#game :is(#loadout,#collection,#ranking,#upgrade){background:linear-gradient(#112c34a8,#112c3444),url('./assets/ui/jade/landscape.webp') center/cover;backdrop-filter:none}
#game#game#game :is(#pause,#result,#event-panel,#resume-choice,#abandon-dialog){background:#071a25c9;backdrop-filter:blur(7px)}

/* Native 44px targets, with the generated endcaps preserved by nine-slicing. */
#game#game#game :is(.overlay,.login-settings-dialog) :is(button,a.ui-button):where(:not(.login-hit,.hero-card,.card)) {
 --button-face:var(--jade-secondary);--button-ink:#f4eedb;--button-shadow:0 1px 2px #122d35;
 border:12px solid transparent;border-image:var(--button-face) 65 75 fill / 12px 17px / 0 stretch;
 padding:1px 10px;min-height:44px;background:none;border-radius:0;box-shadow:none;
 font-weight:700;letter-spacing:.04em;color:var(--button-ink);text-shadow:var(--button-shadow);
}
#game#game#game :is(.overlay,.login-settings-dialog) :is(.primary,#nickname-save,#abandon-cancel,#resume-run,#login-settings-close){--button-face:var(--jade-primary);--button-ink:#49361e;--button-shadow:0 1px #fff2c0}
#game#game#game :is(.overlay,.login-settings-dialog) :is(#restart-pause,#resume-abandon,#abandon-confirm){--button-face:var(--jade-danger);--button-ink:#fff2dc;--button-shadow:0 1px #43211d}
#game#game#game :is(.overlay,.login-settings-dialog) :is(button,a.ui-button):where(:not(.login-hit,.hero-card,.card)):active:where(:not(:disabled,[aria-disabled=true])){border-image-source:var(--button-face);filter:brightness(.83);transform:translateY(1px)}
#game#game#game :is(.overlay,.login-settings-dialog) :is(button,a.ui-button):where(:not(.login-hit,.hero-card,.card)):is(:disabled,[aria-disabled=true]){border-image-source:var(--jade-disabled);color:#e0e2da;text-shadow:0 1px #36494a;filter:saturate(.3);opacity:1}
#game#game#game :is(.overlay,.login-settings-dialog) :is(input:not([type=range]):not([type=checkbox]),select){background:#f3efe1;border:1px solid #95aea7;border-radius:3px;color:var(--jade-ink);min-height:44px;box-shadow:inset 0 1px 4px #1c464918}
#game#game#game :is(.overlay,.login-settings-dialog) input[type=range]{accent-color:#287b7c}
#game#game#game :is(.overlay,.login-settings-dialog) :is(button,a,input,select):focus-visible{outline:3px solid #ebbf55;outline-offset:2px;filter:drop-shadow(0 0 2px #0c2934)}

/* Shared light scroll and dark framed surfaces. */
#game#game#game :is(.dialog,.event-dialog,.book-wrap,.prebattle-roster,.login-settings-dialog){
 background:transparent;border:22px solid transparent;border-image:var(--jade-paper) 70 fill / 22px / 0 stretch;
 border-radius:0;box-shadow:0 14px 40px #00101866;color:var(--jade-ink);padding:8px 12px;
 color-scheme:light;
}
#game#game#game :is(.dialog,.event-dialog,.book-wrap,.login-settings-dialog) h2{font-family:var(--jade-title);color:var(--jade-ink);font-weight:700;letter-spacing:2px}
#game#game#game :is(.dialog,.event-dialog,.book-wrap)>p{color:var(--jade-muted);line-height:1.6}
#game#game#game :is(.dialog,.event-dialog,.book-wrap,.login-settings-dialog) .eyebrow{color:#7b6a48;letter-spacing:2px;font-size:10px}
#game#game#game :is(.dialog,.event-dialog,.book-wrap) .footnote{color:#526a6c;font-size:10px;margin:6px 0 0}
#game#game#game .loadout-top h2{font-family:var(--jade-title);letter-spacing:2px;font-size:25px}
#game#game#game .book-wrap{display:flex;flex-direction:column;width:min(1120px,96vw);max-height:calc(100dvh - 20px);overflow:hidden}
#game#game#game .book-wrap>.loadout-top{flex-shrink:0;min-height:46px;gap:8px;border-bottom:1px solid #a9b3a577;padding-bottom:7px}
#game#game#game .book-wrap>p{font-size:11px;margin:7px 0;flex-shrink:0}
#game#game#game .loadout-top .chip-button{font-size:12px;min-width:94px}

/* Selection: an illustrated hero dossier and a scroll of portrait cards. */
#game#game#game .loadout-wrap{width:100%;height:100%;max-height:none;background:transparent;display:flex;flex-direction:column}
#game#game#game .loadout-wrap>.loadout-top{background:#0f2a32e8;border-bottom:1px solid #c0a77280;min-height:65px;padding:5px var(--safe-right) 5px var(--safe-left);gap:10px}
#game#game#game .loadout-wrap>.loadout-top h2{color:#f5e3b4;font-size:23px;letter-spacing:2px}
#game#game#game .loadout-wrap>.loadout-top .eyebrow{color:#b9ccc7;font-size:9px}
#game#game#game #chapter-picker{gap:5px}
#game#game#game #chapter-picker button{font-size:12px;padding:0 7px;min-width:90px;white-space:nowrap}
#game#game#game #chapter-picker button.selected{--button-face:var(--jade-primary);--button-ink:#49361e;--button-shadow:none}
#game#game#game #chapter-picker button small{font-size:9px}
#game#game#game .prebattle-layout{grid-template-columns:43% minmax(0,1fr);padding-top:9px;padding-bottom:8px;gap:12px}
#game#game#game .selected-hero{position:relative;isolation:isolate;background:transparent;border:15px solid transparent;border-image:var(--jade-dark) 60 fill / 15px / 0 stretch;border-radius:0;box-shadow:0 8px 24px #06192355;color:#f1eddf;padding:0 8px 8px;overflow:auto;scrollbar-color:#ad9862 #18323b}
#game#game#game .chosen-heading{position:relative;min-height:130px;border:0;margin:0 -6px 5px;padding:12px 12px;overflow:hidden;align-items:flex-end;background:#17323a}
#game#game#game .chosen-heading::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#102b34f2,#102b3444 55%,transparent),linear-gradient(0deg,#17323a,transparent 35%);z-index:1;pointer-events:none}
#game#game#game .chosen-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;opacity:.95;z-index:0}
#game#game#game .chosen-heading>div{position:relative;z-index:2}
#game#game#game .chosen-heading .eyebrow{color:#d5be88;letter-spacing:2px}
#game#game#game .chosen-heading h3{font:700 34px/1.2 var(--jade-title);color:#f4dfaa;letter-spacing:4px;text-shadow:0 2px 5px #09222a}
#game#game#game .chosen-heading b{color:#d6e3de;font-size:12px}
#game#game#game .hero-story{color:#c4d4ce;font-size:11px}
#game#game#game .hero-stats{gap:0;border-top:1px solid #beab7455;border-bottom:1px solid #beab7455;margin:4px 0 7px;padding:5px 0}
#game#game#game .hero-stats>div{background:transparent;border-radius:0;border-right:1px solid #beab7433;padding:0 2px}
#game#game#game .hero-stats>div:last-child{border:0}
#game#game#game .hero-stats span{color:#b5c9c5;font-size:10px}
#game#game#game .hero-stats strong{color:#f1dca9;font-size:17px}
#game#game#game .hero-skills{gap:3px}
#game#game#game .hero-skills article{background:#0c263260;border:0;border-bottom:1px solid #c2ab732c;border-radius:0;padding:6px 3px;gap:7px}
#game#game#game .hero-skills article>span{color:#d9c28b;min-width:34px}
#game#game#game .hero-skills .game-icon{width:34px;height:34px}
#game#game#game .hero-skills b{color:#f5ead0;font-size:12px;font-weight:600}
#game#game#game .hero-skills small{color:#bed1cc;font-size:10px;line-height:1.5}
#game#game#game .hero-skills em{color:#77c8c8}
#game#game#game .hero-access{background:#123e3e;color:#d5e6cc;border:1px solid #9ab67c55;border-radius:2px;font-size:10px;padding:6px}
#game#game#game .hero-access.unavailable{color:#f1c4aa;background:#52372d}
#game#game#game .prebattle-roster{padding:2px 4px 6px;border-width:17px;border-image-width:17px;display:flex;flex-direction:column;overflow:hidden}
#game#game#game .roster-heading{flex-shrink:0;margin-bottom:8px;padding:0 2px 5px;border-bottom:1px solid #aebbb188}
#game#game#game .roster-heading h3{font:700 20px var(--jade-title);letter-spacing:3px;color:#264b4c}
#game#game#game #roster-count{background:none;color:#607a71;border-radius:0;padding:0;font-size:10px}
#game#game#game #hero-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;overflow:auto;min-height:0;padding:2px 3px 6px;touch-action:pan-y;align-content:start}
#game#game#game :is(#hero-options,#collection-grid) .hero-card{position:relative;display:flex;flex-direction:column;align-items:stretch;background:transparent;border:8px solid transparent;border-image:url('./assets/ui/jade/card.png') 40 fill / 8px / 0 stretch;border-radius:0;box-shadow:none;padding:0;overflow:hidden;min-width:0;color:#eceddb;text-shadow:none}
#game#game#game #hero-options .hero-card{min-height:132px}
#game#game#game #hero-options .hero-card{height:max-content}
#game#game#game #hero-options .hero-card>*{flex-shrink:0}
#game#game#game .hero-card .hero-card-art{display:block;width:100%;height:85px;object-fit:cover;object-position:50% 20%;border:0;border-radius:0}
#game#game#game .hero-card.locked .hero-card-art{filter:saturate(.45) brightness(.7)}
#game#game#game :is(#hero-options,#collection-grid) .hero-card.selected{border-image-source:url('./assets/ui/jade/card-selected.png');box-shadow:0 0 0 1px #c7a450;padding:0;color:#21474b}
#game#game#game :is(#hero-options,#collection-grid) .hero-card.selected::after{background:#e6cd85;color:#2a4c4b;top:3px;right:3px;z-index:3}
#game#game#game :is(#hero-options,#collection-grid) .hero-card:not(.selected)::after{z-index:3;filter:drop-shadow(0 1px 2px #092831)}
#game#game#game .hero-card .roster-tier{top:2px;left:2px;padding:2px 4px;background:#133d46da;color:#e5dbb4;border:1px solid #aa996c88;border-radius:0;z-index:2;font-size:8px!important}
#game#game#game :is(#hero-options,#collection-grid) .hero-card b{font-family:var(--jade-title);font-size:18px;line-height:1.5;color:inherit;letter-spacing:2px;margin:1px 0 0}
#game#game#game :is(#hero-options,#collection-grid) .hero-card small{font-size:9px;color:#b8cfca}
#game#game#game :is(#hero-options,#collection-grid) .hero-card em{font-size:9px;line-height:1.4;color:#d6d7b9;margin:0;padding:2px 2px 4px;font-style:normal}
#game#game#game :is(#hero-options,#collection-grid) .hero-card.selected :is(em,small){color:#3d625c}
#game#game#game .solo-note{display:none}
#game#game#game #launch-row{background:#0e2a33e8;border-top:1px solid #bfa36d88;min-height:62px;padding-top:7px;padding-bottom:7px;gap:12px}
#game#game#game #loadout-confirm{flex:1.3;font-family:var(--jade-title);font-size:20px;letter-spacing:2px}
#game#game#game #practice-scenario{font-size:12px;background:#dfe8de}

/* Collection is a real scrollable gallery, with all acquisition details. */
#game#game#game #collection-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;overflow:auto;min-height:0;padding:4px 3px 8px;touch-action:pan-y}
#game#game#game #collection-grid .hero-card{padding-bottom:5px;text-align:center;min-height:236px}
#game#game#game #collection-grid{grid-auto-rows:max-content;align-items:start}
#game#game#game #collection-grid .hero-card{height:max-content}
#game#game#game #collection-grid .hero-card>*{flex-shrink:0}
#game#game#game #collection-grid .hero-card .hero-card-art{height:145px;object-position:50% 12%}
#game#game#game #collection-grid .hero-card p{display:block;color:#bdcec7;font-size:10px;line-height:1.5;padding:0 5px;margin:3px 0}
#game#game#game #collection-grid .hero-card em{font-size:10px;color:#dec787;padding:3px 4px}

/* Ranking: scroll rows, readable numbers, truthful loading/error/empty states. */
#game#game#game .ranking-wrap{position:relative;padding-left:14px;width:min(1000px,96vw)}
#game#game#game .nickname-editor{margin:2px 0 9px;gap:7px;flex-shrink:0;font-size:11px}
#game#game#game .nickname-editor input{width:180px;min-width:100px;font-size:12px}
#game#game#game #nickname-save{min-width:85px}
#game#game#game #nickname-message{font-size:10px;color:#80502c}
#game#game#game #ranking-body{border:0;background:#dbe4db66;border-radius:0;min-height:100px;overflow:auto;flex:1;padding:0;color:var(--jade-muted)}
#game#game#game #ranking-body table{font-size:12px;border-collapse:separate;border-spacing:0 4px}
#game#game#game #ranking-body th{position:sticky;top:0;z-index:1;background:#d7e2d8;color:#365456;font-size:11px;font-weight:600;padding:8px 10px;border-bottom:1px solid #9cb2a5}
#game#game#game #ranking-body td{background:#f4f0e4;border-top:1px solid #b2bca5;border-bottom:1px solid #b2bca5;padding:8px 10px;color:#29494b}
#game#game#game #ranking-body td small{color:#65786d;font-size:10px}
#game#game#game #ranking-body td:nth-child(3){font-size:18px;color:#785a27;letter-spacing:.03em}
#game#game#game #ranking-body .mine td{background:#efe2bc}
#game#game#game .rank-number{display:grid;place-items:center;width:30px;height:30px;border:1px solid #a7956c;border-radius:50%;color:#6b704e;font-weight:800;background:#e3e7d9}
#game#game#game tr:nth-child(1) .rank-number{background:linear-gradient(#f8df95,#bd8e42);color:#57401f}
#game#game#game tr:nth-child(2) .rank-number{background:linear-gradient(#e4eceb,#95aaa8);color:#3e5656}
#game#game#game tr:nth-child(3) .rank-number{background:linear-gradient(#edc59b,#b57850);color:#623a22}
#game#game#game .rank-person{display:flex;gap:9px;align-items:center}
#game#game#game .rank-person img{width:36px;height:36px;border-radius:50%;border:1px solid #a38854;object-fit:cover;object-position:50% 16%}
#game#game#game .rank-outcome{color:#2c706b;border:1px solid #89aaa0;padding:3px 6px;font-size:10px;background:#dce8df;white-space:nowrap}
#game#game#game .rank-outcome.halved{color:#8b503e;background:#ecddd1;border-color:#c4a58b}
#game#game#game .ranking-state{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:16px}
#game#game#game .ranking-state .game-icon{width:42px;height:42px;opacity:.75}
#game#game#game .ranking-state b{font:700 21px var(--jade-title);letter-spacing:2px;color:#36575a}
#game#game#game .ranking-state p{font-size:11px;line-height:1.7;margin:0;max-width:46ch;color:#647a73}
#game#game#game .ranking-state a{width:auto;min-width:180px;font-size:12px}

/* Martial study cards. */
#game#game#game .upgrade-wrap{width:min(940px,97vw);padding:5px 8px 10px;color:#f4e8cc}
#game#game#game .upgrade-wrap .eyebrow{color:#d5c089;font-size:10px;letter-spacing:3px}
#game#game#game .upgrade-wrap h2{font:700 30px/1.3 var(--jade-title);letter-spacing:3px;color:#f8e9c2;margin:4px 0}
#game#game#game .upgrade-wrap h2 span{color:#e5bf70}
#game#game#game .upgrade-wrap>p{color:#bfd4d0;margin:0 0 12px;font-size:11px}
#game#game#game .upgrade-wrap>small{color:#c3d5ce;font-size:10px}
#game#game#game #cards{gap:12px}
#game#game#game .card{border:15px solid transparent;border-image:var(--jade-paper) 70 fill / 15px / 0 stretch;background:none;box-shadow:0 8px 18px #071b2766;border-radius:0;padding:6px 6px 4px;min-height:222px;overflow:visible;color:#23484c;align-items:center;text-align:center}
#game#game#game .card-icon{background:none;border-radius:50%;width:54px;height:54px;margin:0 0 5px;box-shadow:0 0 0 1px #b1a069}
#game#game#game .card-icon .game-icon{width:54px;height:54px;border-radius:50%}
#game#game#game .card-tag{position:static;max-width:100%;background:#d7e2d6;border:1px solid #afb99d;border-radius:1px;color:#587464;font-size:9px;padding:1px 5px;order:0;margin:0 0 5px}
#game#game#game .card h3{font:700 21px/1.4 var(--jade-title);color:#254b4e;margin:0 0 5px;letter-spacing:1px}
#game#game#game .card p{font-size:11px;color:#536c66;line-height:1.55;margin:0 0 7px}
#game#game#game .card-value{font-size:10px;color:#80612b;border-top:1px solid #b9b79e;font-weight:600;padding-top:5px;line-height:1.5}
#game#game#game .card-choose{align-self:stretch;border:9px solid transparent;border-image:var(--jade-primary) 65 75 fill / 9px 13px / 0 stretch;background:none;box-shadow:none;border-radius:0;color:#553f22;text-shadow:none;font-size:11px;padding:0 4px;min-height:34px;margin-top:7px}

/* Field actions, squad, skill book and map share the same materials. */
#game#game#game .event-dialog{width:min(800px,94vw);padding:6px 12px}
#game#game#game .event-dialog{display:flex;flex-direction:column;overflow:hidden}
#game#game#game .event-dialog>:not(#event-options){flex-shrink:0}
#game#game#game #event-title{font-size:27px;margin:2px 0 6px}
#game#game#game #event-copy{font-size:11px;margin:0 0 12px;color:#62766a}
#game#game#game #event-options{gap:9px;overflow:auto;min-height:0;flex:1;padding:2px;grid-auto-rows:max-content;align-content:start}
#game#game#game #event-options :is(.event-option,.event-info){border:12px solid transparent;border-image:var(--jade-row) 32 45 fill / 12px / 0 stretch;background:none;border-radius:0;box-shadow:none;padding:2px 4px;color:#254c50;text-shadow:none;min-height:70px}
#game#game#game #event-options button.event-option:active{border-image-source:var(--jade-row);filter:brightness(.9)}
#game#game#game #event-options button.event-option:disabled{border-image-source:var(--jade-row);filter:saturate(.1);opacity:.65;color:#647872}
#game#game#game #event-options .event-option b{font-size:14px;color:inherit;text-shadow:none}
#game#game#game #event-options .event-option>span:not(.event-icon){color:#5c716b;font-size:11px;font-weight:400;text-shadow:none;line-height:1.5}
#game#game#game #event-options .event-info{opacity:.85}
#game#game#game #event-options button.event-option{border-image:var(--jade-primary) 65 75 fill / 12px 17px / 0 stretch;color:#594323;padding:4px 7px}
#game#game#game #event-options button.event-option:active{border-image-source:var(--jade-primary)}
#game#game#game #event-options button.event-option:disabled{border-image-source:var(--jade-disabled);color:#e0e4d8;opacity:1}
#game#game#game #event-options button.event-option:disabled>span:not(.event-icon){color:#e0e4d8}
#game#game#game #event-options .event-tag{background:#d6e3d6;color:#6e5c2f;border:1px solid #afb69a;border-radius:1px;font-size:10px}
#game#game#game #event-options .event-group{color:#385954;border-bottom:1px solid #a7b8aa;font-family:var(--jade-title);letter-spacing:2px}
#game#game#game #event-close{width:min(240px,75%);margin:12px auto 0;font-size:14px}
#game#game#game .large-map{border:3px double #9bad91;border-radius:2px;max-height:50vh;width:auto;max-width:100%}
#game#game#game .event-dialog:has(.large-map){padding-top:0;padding-bottom:0}
#game#game#game .event-dialog .large-map{max-height:calc(100dvh - 270px);min-height:65px;flex-shrink:1;object-fit:contain;margin:4px auto}
#game#game#game .map-key{color:#4e6b65;font-size:10px}
#game#game#game .event-dialog .game-icon{filter:none}

/* Settlement and confirmations. */
#game#game#game .result-dialog{width:min(760px,94vw);padding:5px 12px;max-height:calc(100dvh - 20px)}
#game#game#game .result-grid{background:#dce5db88;border:1px solid #afbaa1;border-radius:0;padding:8px 0}
#game#game#game .result-grid span{color:#668071;font-size:10px}
#game#game#game .result-grid b{color:#244e50;font-family:var(--jade-title);font-size:25px}
#game#game#game .result-score{background:#ead9a866;border:1px solid #b5a275;border-radius:0;gap:20px}
#game#game#game .result-score span{color:#846b3b;font-size:11px}
#game#game#game .result-score strong{color:#9a6f28;font-size:30px;font-family:var(--jade-title)}
#game#game#game .build-chip{background:#dce5d9;border:1px solid #b3c0a8;color:#345b55;border-radius:2px;font-size:10px;padding:3px 7px}
#game#game#game .build-note{color:#637a6b;font-size:10px}
#game#game#game .result-actions{gap:8px;padding-top:9px}
#game#game#game :is(#resume-choice,#abandon-dialog) .dialog{max-width:510px;gap:10px;padding:12px 20px}
#game#game#game :is(#resume-choice,#abandon-dialog) .dialog h2{font-size:27px}
#game#game#game :is(#resume-choice,#abandon-dialog) .dialog p{font-size:12px}
#game#game#game .pause-dialog{width:min(540px,94vw);padding:8px 20px}
#game#game#game .pause-dialog h2{margin:3px 0 5px}
#game#game#game .pause-tools{border-top:1px solid #adbca180;padding-top:10px;margin-top:8px}
#game#game#game :is(.pause-note,.pause-volume,.login-settings-dialog small,.login-settings-dialog label){color:#536f66;font-size:11px}
#game#game#game .login-settings-dialog{max-width:480px;padding:12px 18px;color:#26474c}
#game#game#game .login-settings-dialog h2{color:#26474c;font-size:27px}
#game#game#game .login-settings-dialog::backdrop{background:#081e2bc9;backdrop-filter:blur(6px)}
#game#game#game #login-extra-actions :is(a,button){font-size:12px;letter-spacing:.03em}
#game#game#game #rotate-gate{background:#183a43 url('./assets/ui/jade/landscape.webp') center/cover;color:#f2e1b8}
#game#game#game #rotate-gate small{color:#d1dfd1}
#game#game#game .game-icon[src*="/jade/skills/"]{filter:none}
#game#game#game .ranking-state{padding:10px 12px;gap:5px;min-height:120px}
#game#game#game .ranking-state .game-icon{width:30px;height:30px}

@media(max-height:420px){
 #game#game#game .loadout-wrap>.loadout-top{min-height:57px}
 #game#game#game .loadout-wrap>.loadout-top h2{font-size:21px}
 #game#game#game .chosen-heading{min-height:105px}
 #game#game#game #hero-options .hero-card{min-height:126px}
 #game#game#game .hero-card .hero-card-art{height:80px}
 #game#game#game .prebattle-roster{border-width:13px;border-image-width:13px;padding:2px 4px}
 #game#game#game .prebattle-layout{padding-top:7px;padding-bottom:6px}
 #game#game#game .book-wrap{border-width:17px;border-image-width:17px;padding:3px 8px}
 #game#game#game .book-wrap>p{font-size:10px;margin:5px 0}
 #game#game#game .book-wrap>.loadout-top{padding-bottom:4px}
 #game#game#game #collection-grid .hero-card .hero-card-art{height:120px}
 #game#game#game #collection-grid .hero-card{min-height:215px}
 #game#game#game .card{min-height:219px;border-width:13px;border-image-width:13px;padding:3px 4px}
 #game#game#game .card h3{font-size:19px}
 #game#game#game .card-icon,#game#game#game .card-icon .game-icon{width:46px;height:46px}
 #game#game#game .upgrade-wrap h2{font-size:26px}
 #game#game#game .upgrade-wrap>p{margin-bottom:8px}
 #game#game#game .card p{font-size:10px}
 #game#game#game .pause-dialog{padding:3px 14px}
 #game#game#game .pause-dialog>p{margin:3px 0 8px}
}
@media(max-width:740px){
 #game#game#game .loadout-wrap>.loadout-top{gap:6px}
 #game#game#game #chapter-picker button{min-width:76px;font-size:10px;padding:0 2px;gap:3px}
 #game#game#game #chapter-picker button small{font-size:8px}
 #game#game#game .loadout-top .chip-button{min-width:84px;font-size:10px}
 #game#game#game .loadout-wrap>.loadout-top h2{font-size:19px}
 #game#game#game .prebattle-layout{grid-template-columns:42% minmax(0,1fr);gap:8px}
 #game#game#game #hero-options{gap:6px}
 #game#game#game #hero-options .hero-card{min-height:118px;border-width:6px;border-image-width:6px}
 #game#game#game .hero-card .hero-card-art{height:73px}
 #game#game#game :is(#hero-options,#collection-grid) .hero-card b{font-size:16px}
 #game#game#game :is(#hero-options,#collection-grid) .hero-card em{font-size:8px}
 #game#game#game #roster-count{font-size:9px}
 #game#game#game #collection-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
 #game#game#game #cards{gap:8px}
 #game#game#game .card h3{font-size:17px}
 #game#game#game .card-value{font-size:9px}
 #game#game#game #ranking-body td{padding:6px;font-size:11px}
 #game#game#game .rank-person{gap:5px}
 #game#game#game .rank-person img{width:30px;height:30px}
}