/* Additional manor screens. Decorative illustrations never carry UI text. */
#pause{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:76px;padding:9px 12px;border-radius:12px;font-size:13px;font-weight:700;line-height:1;color:#715322;box-shadow:0 3px 0 #b59555,inset 0 0 0 2px #ffe4a0}
#pause svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;flex:none}
#pause:focus-visible{outline:3px solid #467967;outline-offset:3px}
@media(max-width:760px){.hud-actions{width:58px;flex:none}#pause{min-width:56px;min-height:44px;padding:8px 5px;font-size:11px;gap:3px}#pause svg{width:15px;height:15px}.kill-count{white-space:nowrap}}
@media(max-width:360px){.top-hud .player-card{width:143px}.top-hud .journey{max-width:88px;padding-inline:5px}.top-hud .hud-actions{width:56px}.top-hud{gap:3px}}
.dialog{scrollbar-width:thin;scrollbar-color:#b49a62 #f3e6c6;scroll-padding-block:18px}
.dialog[data-view] h2{font-weight:800;letter-spacing:1px}
.dialog[data-view]>.sub{color:#756449}
.dialog-art,.result-art{background:center/contain no-repeat;pointer-events:none;margin:0 auto 12px;width:92px;height:78px}
[data-view=help] .dialog-art,[data-view=codex] .dialog-art{background-image:url('assets/ui/camp-scroll.webp')}
[data-view=leaderboard] .dialog-art{background-image:url('assets/ui/rank-emblem.webp');width:110px;height:94px}
[data-view=pause] .dialog-art,[data-view=quit] .dialog-art,.result-art[data-outcome=lose]{background-image:url('assets/ui/hero-rest.webp')}
[data-view=pause] .dialog-art,[data-view=quit] .dialog-art{width:210px;height:170px;margin-bottom:20px}
.result-art{width:150px;height:125px}
.result-art[data-outcome=win]{background-image:url('assets/ui/hero-victory.webp')}
.dialog[data-view=pause],.dialog[data-view=quit]{width:min(620px,95vw)}
[data-view=pause] .dialog-actions{display:grid;grid-template-columns:1fr 1fr;max-width:400px;margin:24px auto 10px}
[data-view=pause] #resume,[data-view=pause] #quit{grid-column:1/-1}
[data-view=pause] #resume{margin-bottom:6px}
.dialog .secondary{border:1.5px solid #b19b70;background:linear-gradient(#fffae9,#eee2bf);color:#65543a;box-shadow:0 3px 0 #c5af7d;min-height:44px;text-decoration:none}
.dialog .secondary:hover{background:#fff4cd;border-color:#8c713c}
.dialog .primary{min-height:46px}
.dialog button:disabled{cursor:not-allowed;transform:none;box-shadow:none}
.dialog button:focus-visible,.dialog a:focus-visible,.dialog select:focus-visible{outline:3px solid #497967;outline-offset:3px}
.dialog-actions{padding-top:18px;border-top:1px dashed #bfa673;margin-top:24px}
.dialog .footnote{line-height:1.85;color:#817252}
/* Four readable illustrated pages of the beginner's manual. */
.help-grid{gap:13px}
.help-grid>div{position:relative;border:1.5px solid #bdab7c;border-radius:15px;padding:19px;background:linear-gradient(135deg,#fffbee,#f4e9ca);box-shadow:0 3px 0 #d6c599}
.help-grid>div:before{content:'';display:block;width:55px;height:55px;margin-bottom:13px;background:center/contain no-repeat}
.help-grid>div:nth-child(1):before{background-image:url('assets/ui/camp-tea.webp')}
.help-grid>div:nth-child(2):before{background-image:url('assets/battle/skills/duanchao.webp')}
.help-grid>div:nth-child(3):before{background-image:url('assets/battle/skills/fengche.webp')}
.help-grid>div:nth-child(4):before{background-image:url('assets/ui/rank-emblem.webp')}
.help-grid strong{font-size:17px;font-weight:800;color:#695335}
.help-grid p{color:#71644e;font-size:12px;line-height:1.95}
/* Camp supplies and three trail postcards. */
.route-options{gap:12px;text-align:left}
.route-options button{position:relative;display:flex;flex-direction:column;align-items:stretch;overflow:hidden;border:2px solid #b5a47b;border-radius:14px;background:#fff8e4;padding:0 12px 13px;color:#716044;box-shadow:0 3px 0 #d1bd91}
.route-options button:before{content:'';display:block;flex:none;height:68px;margin:0 -12px 12px;border-bottom:1px solid #c4ad76;background:center top/cover no-repeat;filter:saturate(.85)}
[data-route=steady]:before{background-image:url('assets/battle/map-lake.webp')!important}
[data-route=elite]:before{background-image:url('assets/battle/map-manor.webp')!important}
[data-route=swarm]:before{background-image:url('assets/battle/map-bamboo.webp')!important}
.route-options strong{color:#665036;font-size:14px}
.route-options small{line-height:1.8;color:#796b50}
.route-options button[aria-pressed=true]{background:#fff0bc;border-color:#927237;box-shadow:0 3px 0 #ad8744,inset 0 0 0 2px #ffe5a0}
.route-options button[aria-pressed=true]:after{content:'';position:absolute;top:10px;right:10px;width:14px;height:8px;border-left:3px solid #fff9de;border-bottom:3px solid #fff9de;transform:rotate(-45deg);filter:drop-shadow(0 1px 2px #3f542c)}
.camp-choices{gap:14px;margin-top:22px}
.camp-choices .choice{display:flex;flex-direction:column;align-items:stretch;padding:17px 17px 22px;min-height:236px;background:#fff9e9;border:2px solid #b49f70;box-shadow:0 4px 0 #d1bd92;text-align:center}
.camp-choices .choice:nth-child(2){background:#f0f0d9;border-color:#a6af87}
.camp-choices .choice:nth-child(3){background:#fbedcf;border-color:#c0a374}
.camp-choices .choice .glyph{position:static;display:block;width:110px;height:96px;margin:5px auto 15px;background:center/contain no-repeat;font-size:0;color:transparent}
.camp-choices [data-camp=heal] .glyph{background-image:url('assets/ui/camp-tea.webp')}
.camp-choices [data-camp=focus] .glyph{background-image:url('assets/ui/camp-sword.webp')}
.camp-choices [data-camp=insight] .glyph{background-image:url('assets/ui/camp-scroll.webp')}
.camp-choices .choice .category{top:12px;right:12px;color:#806942;font-size:9px;letter-spacing:1px;border:1px solid #c9b385;border-radius:5px;padding:3px 5px;background:#fff7df}
.camp-choices .choice strong{font-size:19px;color:#6b5435;letter-spacing:1px}
.camp-choices .choice p{color:#7a6a4d;font-size:12px;line-height:1.8}
/* Codex and build controls keep the same paper, ink and brass hierarchy. */
.codex-tabs{gap:9px;justify-content:center;padding:12px;background:#e7e6cd;border:1px solid #b7b68d;border-radius:14px}
.codex-tabs button{border:1.5px solid #b5a477;background:#fff7df;min-height:47px;font-weight:700;color:#766243;box-shadow:0 2px 0 #cfbc90}
.codex-tabs button[aria-pressed=true]{background:#ffe6a3;border-color:#957034;box-shadow:0 3px 0 #ae8543}
.codex-list{text-align:left;gap:14px}
.codex-list article{position:relative;border:1.5px solid #bdab7c;border-left:5px solid #ac8b48;border-radius:6px 15px 15px 6px;background:repeating-linear-gradient(0deg,transparent 0 27px,#bfa9770b 27px 28px),#fff9e7;padding:17px 18px;box-shadow:0 3px 0 #d3c29a55}
.codex-list strong{font-size:18px;color:#72552c}.codex-list article>div>span{color:#817049;background:#efe2bd;border-radius:5px;padding:3px 7px;flex:none}
.codex-list p{color:#625b43}.codex-list small{color:#83735a}.codex-list a{color:#786027;text-decoration:underline;text-underline-offset:3px}.codex-list em{color:#975a32;border-left:2px solid #c5925c;padding-left:8px;margin-top:5px}
.run-settings{border:1.5px solid #b7ad82;background:#ecebd4;box-shadow:inset 0 0 0 3px #f8f1d8;text-align:left;color:#665c42}
.run-settings select,.rank-filter select{min-height:42px;border:1.5px solid #b39a67;background:#fffae8;color:#6a5437;box-shadow:0 2px 0 #d5c298;border-radius:9px}
.run-settings>small,.upgrade-tools>span{color:#7e7155}
/* Results: four brass seals, skill-by-skill damage and a quiet sync note. */
.result-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0 18px}
.result-stats>div{border:2px solid #b89b60;border-radius:15px;padding:16px 8px;background:linear-gradient(#fff6d3,#efdc9e);box-shadow:inset 0 0 0 3px #fff7dd,0 3px 0 #c9b17a}
.result-stats>div:first-child{background:linear-gradient(#ffe7a0,#f0c963);border-color:#a27a35}
.result-stats strong{font-size:28px;color:#75511d;font-weight:800;font-variant-numeric:tabular-nums}
.result-stats span{font-size:11px;color:#7d6845}
.result-build{color:#7a6748;font-size:12px;line-height:1.9}
.damage-summary{max-width:none;gap:10px}
.damage-summary>span{background:#f3edd6;border:1px solid #c0ae7f;padding:12px 6px;border-radius:12px;color:#776241;font-size:13px}
.damage-icon{display:block;width:35px;height:35px;margin:0 auto 8px;background:var(--skill-art) center/contain no-repeat}
.damage-summary b{color:#85652f;font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}
.rank-submit{background:#e9ecd7;border:1px dashed #a6ad81;border-radius:12px;color:#687254;font-size:11px;line-height:1.8}
/* Ranking: sword medals for the podium, parchment rows for the entire list. */
.rank-filter{padding:10px 14px;border:1px solid #c6b383;background:#f4e9c9;border-radius:12px;color:#78623e}
.rank-login{border:1px solid #c1ae7f;background:#eee7cc;color:#756348;font-size:12px;line-height:1.8}
.rank-login .primary{font-size:13px;padding:12px 20px}
.rank-list{gap:10px}
.rank-row{border:1.5px solid #c6b48a;border-radius:12px;background:#fff9e9;box-shadow:0 3px 0 #d7c69f66;min-height:76px}
.rank-number{display:grid;place-items:center;width:39px;height:43px;border:1px solid #c0af87;border-radius:10px;background:#ece9d3;color:#8b7750;font-size:19px}
.rank-list:not(.rank-personal)>.rank-row:nth-child(-n+3) .rank-number{background:linear-gradient(#ffeb9c,#e8bf57);border:2px solid #ad873b;color:#705025;box-shadow:inset 0 0 0 2px #fff2bf;clip-path:polygon(0 0,100% 0,100% 83%,50% 100%,0 83%);height:49px;border-radius:7px 7px 0 0}
.rank-list:not(.rank-personal)>.rank-row:nth-child(2) .rank-number{background:linear-gradient(#ebefde,#becab4);border-color:#8d9c83;color:#5a6c50}
.rank-list:not(.rank-personal)>.rank-row:nth-child(3) .rank-number{background:linear-gradient(#f3dbc0,#cda57d);border-color:#ae855f;color:#805632}
.rank-self{background:#fff0bc;border-color:#b58a3c}.rank-player strong{color:#645037;font-size:14px}.rank-player small{color:#8b7759;font-size:11px}.rank-score{color:#936922;font-size:22px}
.rank-empty{padding:18px;border:1px dashed #bdad83;border-radius:12px;background:#f8f0d8;color:#847250;font-size:12px}
.rank-identity{border-left:3px solid #819773;background:#e9ecd6;text-align:left;padding:10px 14px;color:#63734e;font-size:12px}
.rank-count{color:#8a7653;font-size:11px;letter-spacing:1px}
@media(max-width:760px){
 .dialog[data-view]{padding:17px 10px}.dialog-art{width:72px;height:60px;margin-bottom:10px}.dialog[data-view] h2{font-size:23px}.dialog[data-view]>.sub{font-size:11px}
 [data-view=pause] .dialog-art,[data-view=quit] .dialog-art{width:170px;height:140px;margin-bottom:14px}.result-art{height:100px;width:120px}
 .dialog-actions{gap:12px;padding-top:17px}.dialog-actions .secondary{padding:12px 14px}.dialog .footnote{font-size:10px}
 .help-grid>div{padding:15px 14px 15px 70px}.help-grid>div:before{position:absolute;left:12px;top:18px;width:43px;height:43px;margin:0}.help-grid strong{font-size:14px}.help-grid p{font-size:11px;line-height:1.85}
 .route-options{gap:7px}.route-options button{padding:0 8px 10px}.route-options button:before{height:51px;margin:0 -8px 10px}.route-options strong{font-size:12px;line-height:1.5}.route-options small{font-size:10px;line-height:1.6}
 .camp-choices{gap:12px;margin-top:18px}.camp-choices .choice{min-height:118px;padding:21px 14px 18px 98px;text-align:left}.camp-choices .choice .glyph{position:absolute;width:76px;height:76px;left:11px;top:21px;margin:0}.camp-choices .choice strong{font-size:18px;margin-bottom:8px}.camp-choices .choice p{font-size:11px}.camp-choices .choice .category{top:7px;right:8px;padding:1px 4px;font-size:8px}
 .codex-tabs{gap:7px;padding:9px;display:grid;grid-template-columns:repeat(4,1fr)}.codex-tabs button{flex-direction:column;gap:5px;font-size:10px;padding:7px 3px}.codex-skill-icon{width:29px;height:29px}.codex-list article{padding:14px 12px}.codex-list strong{font-size:16px}.codex-list p{font-size:12px}.codex-list article>div>span{font-size:9px;padding:3px 5px;max-width:90px}
 .result-stats{gap:8px;grid-template-columns:repeat(2,1fr);margin:19px 0 16px}.result-stats>div{padding:12px 6px}.result-stats strong{font-size:26px}.result-stats span{margin-top:5px;font-size:11px}.result-build{font-size:11px}.damage-summary{gap:6px}.damage-summary>span{font-size:11px;padding:10px 3px}.damage-summary b{font-size:15px}.damage-icon{width:31px;height:31px}
 .rank-filter{font-size:12px;padding:8px}.rank-filter select{margin-left:5px;max-width:70%;font-size:12px}.rank-row{padding:10px 8px;gap:8px;min-height:71px}.rank-number{width:31px;height:36px;font-size:17px}.rank-player strong{font-size:12px}.rank-player small{font-size:10px;line-height:1.7}.rank-score{font-size:18px}.rank-login{padding:13px}.rank-login .primary{min-width:0;font-size:12px}.rank-empty{padding:13px}
}
@media(max-height:500px){
 .dialog-art,.result-art,[data-view=leaderboard] .dialog-art{width:68px;height:57px;margin-bottom:9px}[data-view=pause] .dialog-art,[data-view=quit] .dialog-art{width:95px;height:80px}
 .camp-choices .choice{min-height:202px;padding:14px 12px;text-align:center}.camp-choices .choice .glyph{position:static;width:82px;height:72px;margin:7px auto 12px}.camp-choices .choice strong{font-size:16px}.camp-choices .choice p{font-size:11px}.result-stats{grid-template-columns:repeat(4,1fr)}.help-grid{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){.dialog button,.dialog a{transition:none}.dialog button:hover,.dialog button:active{transform:none}}