/* Chibi natural-material art direction. Geometry and gameplay remain unchanged. */
.nickname-overlay {position:absolute;inset:0;z-index:60;display:grid;place-items:center;padding:24px;background:#09251bc9;backdrop-filter:blur(7px);}
.nickname-overlay[hidden] {display:none;}
.nickname-card {width:100%;max-width:340px;max-height:100%;overflow-y:auto;padding:20px 22px 24px;border:2px solid #e2c37d;border-radius:24px;background:linear-gradient(150deg,#304f36,#123729);box-shadow:inset 0 0 0 4px #8ea76122,0 6px #10271c;color:#fff5ce;text-align:center;}
.nickname-spirit {display:block;width:100px;height:105px;object-fit:contain;margin:0 auto 8px;}
.nickname-card h2 {font-size:24px;margin:0 0 9px;}
.nickname-card>p {font-size:13px;line-height:1.5;color:#d7e2bc;margin:0 0 20px;}
.nickname-card label {display:block;text-align:left;font-size:13px;font-weight:800;margin-bottom:8px;}
#nicknameInput {width:100%;padding:13px 12px;border:1px solid #adbd7a;border-radius:12px;background:#102d23;color:#fff7db;font:inherit;font-size:17px;outline-offset:3px;}
#nicknameInput::placeholder {color:#b5c69f;font-size:14px;}
.nickname-options {display:flex;align-items:center;justify-content:space-between;margin-top:9px;font-size:12px;color:#b9cda7;}
#nicknameRandom {border:0;background:none;color:#efda9a;padding:6px 0;font:inherit;cursor:pointer;}
.nickname-card .nickname-error {min-height:20px;margin:8px 0;color:#ffcfb4;font-size:12px;}
.nickname-submit {width:100%;min-height:48px;border:2px solid #78e895;border-radius:12px;background:linear-gradient(#21d66f,#06b954);box-shadow:0 4px #278b44;color:white;font:inherit;font-size:19px;font-weight:900;cursor:pointer;}
.nickname-submit:disabled {opacity:.6;cursor:wait;}
@media(max-height:600px) {.nickname-overlay {padding:18px;}.nickname-card {padding:15px 18px 20px;}.nickname-spirit {height:75px;width:75px;}.nickname-card h2 {font-size:22px;}.nickname-card>p {margin-bottom:14px;}}
:root { --ui-panel:#183a2b; --ui-panel-light:#2c4d35; --ui-gold:#e2c37d; --ui-text:#fff9e2; --ui-muted:#c3d0ac; --ui-green:linear-gradient(#21d66f,#06b954); --ui-blue:linear-gradient(#35d3ff,#0ca7e0); }
:root { --ink:#344c3e; --cream:#faf3e5; }
body { background:radial-gradient(ellipse at 25% 10%,#fbf0d8,#bdd0b5 65%,#7f9d88); }
.phone { background:#f6f0e2; box-shadow:0 22px 80px #243d4860; }
.topbar { background:linear-gradient(120deg,#fffdf4,#f1e9d7); }
.title-wrap h1,.lobby-header h1 { color:#2d5544; text-shadow:0 2px 0 #fff9ed; letter-spacing:1px; }
.eyebrow,.lobby-header span { color:#6d8365; }
.icon-btn { background:linear-gradient(145deg,#fffef8,#e9dfc9); border:1px solid #c5cbb1; box-shadow:inset 0 2px 1px #fff,0 3px 5px #6f765923; color:#526d56; }
.hud { background:linear-gradient(130deg,#fffdf6,#f4efdf); border:1px solid #cbd1b6; box-shadow:inset 0 2px 0 #fff,0 4px 8px #56654118; }
.stat strong { color:#3b644e; }
.stat span,.stat small { color:#73836b; }
.speed-track { background:#ddd9c6; box-shadow:inset 0 2px 3px #73745c30; }
.speed-track i { background:linear-gradient(#e6bb70,#bd8545); box-shadow:inset 0 1px #fff4c1; }
.campaign-toolbar button,.modal-nav button { background:linear-gradient(#fffdf5,#e9e7d3); border-color:#c4cdb2; box-shadow:inset 0 1px white,0 2px 2px #59644913; color:#506c52; }
.notice { background:linear-gradient(100deg,#e8eed5,#f3f1dd); box-shadow:inset 0 1px #fff9; border:1px solid #ced8bb; }
.notice div span { color:#42634a; }
.factory { background:#b6c69a url('assets/art/qreal/garden.webp') center/cover no-repeat; border-top:1px solid #b8c8a3; }
.phone>.factory {margin-top:8px;min-height:0;flex:1;}
.scene-brief {position:absolute;z-index:9;top:10px;left:12px;right:12px;display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:8px;padding:8px 10px;border:1px solid #c0bc7b;border-radius:14px;background:linear-gradient(120deg,#24472deb,#173b2be8);box-shadow:inset 0 1px #e8e8b533,0 3px 8px #102b2440;color:#fff7d7;pointer-events:none;}
.scene-time {text-align:center;border-right:1px solid #a2b57b66;padding-right:8px;}
.scene-time>span {display:block;font-size:12px;font-weight:800;color:#e9edcc;}
.scene-time #timeLeft {display:block;font-size:25px;line-height:1.2;color:#ffe08a;}
.scene-brief .legend {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:center;color:#fff6d4;}
.scene-brief .legend>span {display:flex;align-items:center;gap:5px;min-width:0;}
.scene-brief .legend>span>span {display:flex;flex-direction:column;min-width:0;gap:2px;}
.scene-brief .legend small {font-size:12px;font-weight:800;color:#e5f0c5;}
.scene-brief .legend b {font-size:14px;line-height:1.3;overflow-wrap:anywhere;}
.scene-brief .legend .cookie {flex:0 0 27px;width:27px;height:27px;margin:0;border:0;border-radius:0;background-color:transparent;background-image:var(--item-art)!important;background-size:contain;background-repeat:no-repeat;font-size:0;animation:none;}
.scene-brief .legend .cookie::before,.scene-brief .legend .cookie::after {display:none;}
.factory .outcome-banner {top:80px;}
@media(max-width:350px) {.scene-brief {left:8px;right:8px;padding:7px;gap:6px;grid-template-columns:52px minmax(0,1fr);}.scene-brief .legend {gap:5px;}.scene-brief .legend b {font-size:12px;}.scene-time #timeLeft {font-size:23px;}.scene-brief .legend .cookie {flex-basis:24px;width:24px;height:24px;}}
.factory::before { background:radial-gradient(ellipse at 65% 10%,#fff3b4a0,transparent 65%); }
.factory .belt { border:3px solid #94764f; border-radius:18px; background:linear-gradient(180deg,#fff1c6 0%,#d9af74 8%,#9e7953 14%,#ddc59a 19%,#f0dfb8 44%,#ddc398 79%,#a27e54 87%,#f7deb0 94%,#c29c69 100%); box-shadow:inset 0 2px 2px #fff8,0 5px 0 #866340,0 10px 12px #243b3b42; }
.factory .belt::after { content:''; position:absolute; inset:0; pointer-events:none; background:repeating-linear-gradient(2deg,transparent 0 9px,#7a54210b 10px 11px,transparent 12px 17px); border-radius:inherit; z-index:0; }
.factory .belt-seams { opacity:.45; filter:drop-shadow(1px 0 0 #fff4d0); }
.factory .belt-items { z-index:2; }
.factory .belt-items .cookie { filter:drop-shadow(0 4px 2px #60482c4d); }
.factory .belt-items .tutorial-target { filter:drop-shadow(0 0 6px #fff2a1); }
.factory .qc-rabbit { width:144px; height:160px; background:url('assets/art/qreal/spirit.png') center/contain no-repeat; filter:drop-shadow(0 6px 4px #283d3c38); }
.qc-rabbit>div { display:none; }
.factory .rabbit-speech { background:linear-gradient(#fffef4,#efe9d5); border-color:#a1b38e; box-shadow:0 3px 6px #49653a22,inset 0 1px #fff; color:#4d6c46; }
.rabbit-speech:after { background:#efe9d5; }
.factory .machine-a { filter:drop-shadow(1px 3px 2px #34552e40); }
.factory .machine-light { background:radial-gradient(circle at 35% 25%,#ffec9b,#d29c47 75%); }
.factory .spring-garden i { background:linear-gradient(90deg,#4f783e,#b9d18a,#66884b); filter:drop-shadow(1px 2px 1px #34562c30); }
.factory .spring-garden i::before,.factory .spring-garden i::after { background:linear-gradient(140deg,#d0dd97,#799f55 55%,#456b3e); border-color:#759257; box-shadow:inset 0 1px 1px #f1f8be7a; }
.factory .crate-back { background:radial-gradient(ellipse at 50% 10%,#d2df9d,#739356); border-color:#5e7d4a; }
.factory .crate-front,.factory .crate-lid { background:linear-gradient(150deg,#e0e9b7,#99b978 45%,#66884a); border-color:#77945b; box-shadow:inset 0 2px 2px #faffc580; }
.bottom-panel { border-color:#cbd3b5; }
.rescue-track,.lobby-progress-track { background:#d9dfc7; box-shadow:inset 0 2px 4px #52644530; }
.rescue-track i,.lobby-progress-track i { background:linear-gradient(#c6e191,#91b86c 55%,#67904e); box-shadow:inset 0 1px 1px #f7ffd7; }
.legend { color:#546c50; }
.overlay { background:#233c3550; backdrop-filter:blur(5px); }
.sheet-backdrop {position:absolute;inset:0;z-index:39;background:#233c3550;backdrop-filter:blur(5px);}
.sheet-backdrop[hidden] {display:none;}
.nickname-overlay {background:#233c3550;backdrop-filter:blur(5px);}
.modal,.tutorial-coach,.campaign-sheet { background:linear-gradient(125deg,#fffdf3,#f2ead7); border:1px solid #c6cdb2; box-shadow:inset 0 2px 1px #fff,0 7px 0 #b1b99a,0 20px 40px #233d3d4d; }
.modal::before { border:1px solid #dfd7bf; }
.modal h2,.tutorial-coach h2,.sheet-header h2 { color:#355b43; }
.modal p:not(.modal-kicker),.modal .level-details,.tutorial-coach p { color:#66765a; }
.collection-guide>div { background:radial-gradient(ellipse at 50% 35%,#fffdf4,#efe1c1); border-color:#d4bd90; box-shadow:inset 0 2px 4px #fff9,0 3px 6px #8b785117; }
.collection-guide .sample-keep { background:radial-gradient(ellipse at 50% 35%,#fbfff2,#dfe9c7); border-color:#b8c99c; }
.collection-guide img { filter:drop-shadow(0 4px 3px #52633c25); }
.collection-guide b { color:#455b3e; }
#startBtn,.lobby-primary,.tutorial-next { border:1px solid #6f8f50; background:linear-gradient(#b3d58b,#91b66c 50%,#789f57); color:#fffef0; text-shadow:0 1px 2px #4b703d80; box-shadow:inset 0 2px 1px #e5f4bfa8,0 5px 0 #54773e,0 8px 12px #4a603a24; }
#startBtn:active,.lobby-primary:active,.tutorial-next:active { box-shadow:inset 0 2px 3px #52633c40,0 2px 0 #54773e; }
.best-score { background:#e7ebd3; box-shadow:inset 0 1px 3px #70835218; }
.text-btn,.campaign-level,.help-details { color:#607e4b; }
.lobby { background:linear-gradient(#f8f4e7ee,#f1efddee),url('assets/art/qreal/garden.webp') center/cover; }
.rescue-preview { min-height:160px; border:1px solid #c4caa5; box-shadow:inset 0 1px white,0 6px 10px #64764b25; }
.rescue-preview::before { background:linear-gradient(90deg,#eef1d9f5 4%,#eef1d9c9 42%,#eef1d915 80%),url('assets/art/qreal/garden.webp') center 40%/cover; }
.rescue-preview[data-stage]::before { filter:none; }
.preview-art { top:3px; right:0; width:43%; height:134px; }
#previewSpirit { width:125px; height:136px; right:-5px; top:0; transform:rotate(3deg); filter:drop-shadow(0 6px 4px #3f57392e); }
#previewSeed { width:44px; height:44px; left:-4px; bottom:2px; filter:drop-shadow(0 3px 2px #42553033); }
.preview-art i { background:radial-gradient(#fff9c788,transparent 70%); }
.preview-copy { padding-top:20px; width:64%; }
.preview-copy h2 { color:#365c40; }
.preview-copy p { color:#5c7352; }
.preview-controls>button { box-shadow:inset 0 1px #fff,0 2px 3px #355a3220; background:#fffae9d9; }
.lobby-progress { border-color:#cad0b1; background:linear-gradient(145deg,#fffdf4,#f2eddb); box-shadow:inset 0 2px 1px #fff,0 4px 10px #63734c16; }
.traveler-avatar { background:radial-gradient(#fffef3,#d6e4bc); box-shadow:inset 0 2px 3px #faffed,0 2px 3px #4f653c22; }
.traveler-avatar img { width:100%; height:100%; object-fit:contain; }
.lobby-current { background:linear-gradient(120deg,#eef2dd,#e1e9cd); border:1px solid #c8d3ac; }
.lobby-milestones i { background:radial-gradient(circle at 35% 25%,#fff9d2,#d6b96b); box-shadow:inset 0 1px #fff,0 2px 3px #7b734133; border-color:#c4b77e; color:#7d7741; }
.difficulty-picker { background:linear-gradient(#fcfaef,#eeecd9); border-color:#c7d1ad; box-shadow:inset 0 1px #fff; }
.difficulty-picker button { background:linear-gradient(#fffef5,#e8e5cf); border-color:#c4c9aa; box-shadow:inset 0 1px #fff,0 2px 2px #5b704320; color:#5b7150; }
.difficulty-picker button[aria-pressed=true] { background:linear-gradient(#d9eac0,#bcd59a); border-color:#8cab68; box-shadow:inset 0 1px #efffdc,0 2px 0 #89a66d; color:#3e6038; }
.difficulty-picker>span,#difficultyHint { color:#657d53; }
.lobby-retry,.lobby-shortcuts button { background:linear-gradient(#fffdf4,#e9e4cf); border-color:#c5c9ab; box-shadow:inset 0 1px white,0 3px 3px #4f65351c; color:#5a744d; }
.lobby-shortcuts span { text-shadow:0 1px #fff9; }
.stage-card,.level-tile,.title-medal { background:linear-gradient(135deg,#fffdf4,#e8e8d0); box-shadow:inset 0 1px #fff,0 2px 3px #506d3a14; }
.level-tile.completed { background:linear-gradient(#eaf4d7,#c8dfa9); }
.level-tile img { width:34px; height:34px; filter:drop-shadow(0 2px 1px #5864472a); }
.level-tile:disabled { opacity:.65; }
.modal-art { object-fit:contain; filter:drop-shadow(0 5px 3px #4e633526); }
.packed-cake { object-fit:contain; }
.toast,.outcome-banner { background:linear-gradient(#fffef5,#efe8ce); box-shadow:inset 0 1px #fff,0 4px 9px #485c3025; }
@media(max-height:700px) { .rescue-preview {min-height:145px;} .preview-art {height:119px;} #previewSpirit {width:114px;height:124px;} .preview-copy {padding-top:12px;} }
@media(prefers-reduced-motion:reduce) { .factory .qc-rabbit {animation:none;} }

/* Matching raised badges, inspired by a compact podium-style game menu. */
.lobby-shortcuts { gap:18px; justify-items:center; padding:2px 10px; }
.lobby .lobby-shortcuts button { position:relative; width:78px; height:78px; padding:0; border:0; border-radius:18px; background:none; box-shadow:none; gap:0; }
.lobby-shortcuts img { display:block; width:100%; height:100%; filter:drop-shadow(0 3px 2px #4d543d35); }
.lobby-shortcuts .shortcut-caption { position:absolute; bottom:9px; left:0; right:0; font-size:13px; line-height:1; font-weight:900; color:#fff9df; text-shadow:0 2px #523d28,1px 0 #523d28,-1px 0 #523d28; }
.lobby-shortcuts button:hover { transform:translateY(-2px); }
.lobby-shortcuts button:active { transform:translateY(2px); }
.lobby-shortcuts button:focus-visible { outline:3px solid #7b9d55; outline-offset:3px; }

/* Timber frame, tabbed top and fixed personal ranking panel. */
.campaign-sheet.ranking-sheet { inset:24px 12px 20px; padding:8px; border:3px solid #a77347; border-radius:22px; background:repeating-linear-gradient(90deg,#d4ad7a 0 19px,#d0a674 20px 21px,#dab987 22px 35px); box-shadow:inset 0 0 0 3px #efd8a6,0 7px 0 #725138,0 16px 50px #23372f70; }
.ranking-sheet .sheet-header { flex-shrink:0; height:32px; padding:0 8px; border:0; }
.ranking-sheet .sheet-header h2 { color:#69472b; font-size:15px; text-shadow:0 1px #ffe8bc; }
.ranking-sheet #sheetClose { position:absolute; top:-13px; right:-7px; width:40px; height:40px; border:3px solid #fff1c9; border-radius:13px; background:linear-gradient(#e4a071,#c67b51); box-shadow:0 3px 0 #8b5739; color:#853b2b; font-size:31px; font-weight:900; line-height:29px; padding:0; z-index:2; }
.ranking-sheet #sheetBody { display:flex; flex-direction:column; gap:0; padding:0; overflow:hidden; min-height:0; }
.ranking-tabs { display:flex; gap:7px; padding:0 12px; flex-shrink:0; }
.ranking-tabs button { flex:1; max-width:145px; border:1px solid #b87b45; border-bottom:0; border-radius:11px 11px 0 0; background:linear-gradient(#c88e61,#b9774c); color:#fff9e7; min-height:43px; font:inherit; font-weight:900; font-size:18px; box-shadow:inset 0 2px #ffe0ae66; cursor:pointer; }
.ranking-tabs button.active { background:linear-gradient(#ffe997,#f7ce64); color:#8b602b; border-color:#e4b452; text-shadow:0 1px #fff2bb; }
.ranking-board { flex:1; min-height:160px; display:flex; flex-direction:column; padding:8px; border:3px solid #f8e7b8; border-radius:10px; background:#fff4d3; box-shadow:0 0 0 1px #b88e56,inset 0 0 0 1px #dfc68a; }
.ranking-columns { display:grid; grid-template-columns:38px 1fr 68px; align-items:center; gap:6px; flex-shrink:0; padding:10px 4px; border-radius:6px 6px 0 0; background:linear-gradient(#efb86a,#e7a548); color:#fffdf0; font-size:13px; font-weight:900; text-align:center; }
.ranking-columns span:nth-child(2) { text-align:left; padding-left:6px; }
.ranking-list { flex:1; min-height:60px; overflow-y:auto; display:flex; flex-direction:column; gap:7px; padding:9px 0; scrollbar-width:thin; scrollbar-color:#9fc9b7 #e7f1d7; }
.ranking-entry { flex-shrink:0; display:grid; grid-template-columns:27px 35px minmax(0,1fr) 78px; gap:5px; align-items:center; min-height:66px; padding:7px 5px; border:3px solid #a3d0c3; border-radius:5px; background:linear-gradient(120deg,#e6f4d9,#d0eae0); box-shadow:inset 0 1px #fff9; }
.ranking-entry.is-me { border-color:#81b29b; }
.ranking-position { text-align:center; color:#fbfff3; font-size:23px; font-weight:900; -webkit-text-stroke:1px #526b59; text-shadow:0 2px #526b59; }
.ranking-entry[data-rank="1"] .ranking-position { color:#ffe58a; -webkit-text-stroke:1px #a57930; text-shadow:0 2px #a57930; }
.ranking-entry[data-rank="2"] .ranking-position { color:#edf4f5; -webkit-text-stroke:1px #778c90; }
.ranking-entry[data-rank="3"] .ranking-position { color:#efc5a0; -webkit-text-stroke:1px #986c4b; }
.ranking-avatar { width:39px; height:43px; background:radial-gradient(#fffce4,#d2dfad); border:3px solid #fffef5; box-shadow:0 1px 2px #546b4828; overflow:hidden; }
.ranking-avatar img { width:100%; height:100%; object-fit:contain; }
.ranking-player { min-width:0; }
.ranking-player strong { display:block; color:#9a6339; font-size:13px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ranking-player small { display:block; font-size:8px; color:#63856b; margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ranking-metric { text-align:center; }
.ranking-metric b { display:block; color:#fffdf0; -webkit-text-stroke:.5px #50674e; text-shadow:0 2px #50674e; font-size:22px; font-weight:900; line-height:1.1; }
.ranking-metric small { color:#65816b; font-size:8px; }
.ranking-own { flex-shrink:0; padding:0 6px 6px; background:linear-gradient(#eec369,#e2ad4f); border-radius:5px; }
.ranking-own h3 { color:#fffbee; font-size:13px; margin:0; padding:7px; text-align:center; text-shadow:0 1px #b88734; }
.ranking-own .personal { background:linear-gradient(#fff1b3,#ffe396); border-color:#f9db86; }
.ranking-unranked { text-align:center; color:#8b672c; font-size:10px; margin:5px 0 0; }
.ranking-status { color:#7b8d66; text-align:center; font-size:12px; line-height:1.8; padding:18px 10px; }
.ranking-empty { margin:auto; }
.ranking-footer { display:flex; align-items:center; flex-wrap:wrap; gap:5px 9px; padding:9px 3px 2px; flex-shrink:0; color:#6b583a; font-size:9px; }
.ranking-footer .secondary-btn { margin-left:auto; padding:5px 10px; font-size:10px; background:#fff0c9; border-color:#b88e52; color:#725b35; }
.ranking-rules { flex:1; font-size:9px; }
.ranking-rules summary { cursor:pointer; }
.ranking-rules p { margin:4px 0; line-height:1.6; }
.ranking-sheet .profile-editor { flex-shrink:0; margin:5px 2px 0; padding:5px 6px; border-top:1px solid #ae86556b; color:#725d3d; font-size:10px; max-height:155px; overflow-y:auto; }
.ranking-sheet .profile-editor input,.ranking-sheet .profile-editor select { padding:6px; font-size:11px; }
@media(max-height:650px) { .lobby .lobby-shortcuts button {width:66px;height:66px;} .lobby-shortcuts .shortcut-caption {font-size:11px;bottom:8px;} .campaign-sheet.ranking-sheet {inset:16px 10px 14px;} .ranking-sheet .sheet-header {height:25px;} .ranking-tabs button {min-height:34px;font-size:16px;} .ranking-entry {min-height:56px;padding:4px;} .ranking-columns {padding:7px 3px;} .ranking-avatar {height:36px;} .ranking-player strong {font-size:12px;} .ranking-board {padding:5px;} }

/* Challenge poster layout: banner, milestone route, vertically stacked actions. */
.challenge-lobby { --shortcut-size:42px;--shortcut-step:58px;--shortcut-top:18px;--shortcut-left:10px; padding:18px 20px 15px; gap:0; color:#fffbe7; background:linear-gradient(#172b20b8,#12241dd4),url('assets/art/qreal/garden.webp') center/cover; }
.challenge-lobby .lobby-header { justify-content:center; min-height:40px; text-align:center; margin-bottom:8px; }
.challenge-lobby .lobby-header h1 { color:#fff9df; font-size:19px; text-shadow:0 2px 2px #18291c; }
.game-logo {display:block;width:144px;height:auto;object-fit:contain;margin:0 auto;}
.challenge-lobby .lobby-header h1 {margin:0;line-height:0;}
.challenge-lobby .game-logo {width:160px;height:48px;scale:1.3;transform-origin:center;}
.phone .title-wrap h1 {margin-top:0;}
.phone .title-wrap .game-logo {width:116px;height:38px;}
@media(max-height:700px) {.challenge-lobby .game-logo {width:136px;height:35px;}}
.challenge-lobby .lobby-header span { display:none; }
.challenge-lobby #lobbySound { position:absolute; left:auto; right:14px; top:18px;width:var(--shortcut-size);height:var(--shortcut-size);padding:0;border:0;border-radius:12px;background:none;box-shadow:none;cursor:pointer; }
.menu-sound img {display:block;width:100%;height:100%;filter:drop-shadow(0 3px 2px #4d543d35);}
.challenge-lobby .menu-sound span {display:block;position:absolute;bottom:6px;left:0;right:0;font-size:9px;line-height:1;font-weight:900;color:#fff9df;text-shadow:0 2px #523d28,1px 0 #523d28,-1px 0 #523d28;}
.menu-sound:hover {transform:translateY(-2px);}
.menu-sound:active {transform:translateY(2px);}
.challenge-lobby .rescue-preview { width:76%; min-height:104px; margin:0 auto; border:3px solid #ffe5a3; border-radius:12px; box-shadow:0 4px 0 #8d683d,0 8px 20px #061c1955; }
.challenge-lobby .preview-copy { width:67%; padding:9px 9px 29px; }
.challenge-lobby .preview-copy>span { font-size:7px; letter-spacing:0; }
.challenge-lobby .preview-copy h2 { font-size:13px; margin:5px 0; }
.challenge-lobby .preview-copy p { display:none; }
.challenge-lobby .preview-art { height:86px; top:0; }
.challenge-lobby #previewSpirit { width:80px; height:85px; }
.challenge-lobby #previewSeed { width:29px;height:29px; }
.challenge-lobby .preview-controls { bottom:3px; gap:3px; left:7px; right:7px; }
.challenge-lobby .preview-dots button { width:15px;padding:8px 4px; }
.challenge-lobby .lobby-progress { position:relative; flex:1 0 250px; max-height:clamp(280px,39dvh,350px); padding:25px 4px 0; margin:15px -4px 0; border:0; border-radius:28px; background:linear-gradient(#10261cb3,#10261c36); box-shadow:inset 0 1px 0 #afc3a72b; display:flex; flex-direction:column; justify-content:center; }
.challenge-heading { text-align:center; font-size:22px; font-weight:900; margin:0 0 9px; color:#fffef1; text-shadow:0 3px 2px #0d1f1b; }
.challenge-lobby .traveler { position:absolute; left:12px; top:10px; right:12px; border:0; padding:0; opacity:.9; }
.challenge-lobby .traveler-avatar,.challenge-lobby .traveler h2,.challenge-lobby #lobbyTitle { display:none; }
.challenge-lobby #lobbyMode { color:#c4d0ae; background:none; font-size:8px; }
.challenge-lobby .journey-heading { order:2; margin:9px 0 0; align-items:center; justify-content:center; gap:16px; }
.challenge-lobby .journey-heading span { display:none; }
.challenge-lobby .journey-heading strong { font-size:20px;color:#fff9d5; }
.challenge-lobby .journey-heading small { color:#d4dfb7;font-size:12px; }
.challenge-lobby .lobby-stars { padding:0;font-size:17px; color:#ffe48b; }
.challenge-lobby .lobby-stars small {display:inline; font-size:11px;}
.challenge-route { position:relative; height:118px; margin:7px 9px 0; flex-shrink:0; }
.challenge-lobby .lobby-progress-track { position:absolute; left:0;right:0;bottom:0; height:29px; border-radius:7px; border:2px solid #78a940; background:linear-gradient(#97bc47,#6f9b2e); box-shadow:inset 0 2px #d4ee7a99,0 4px 0 #3c6029; }
.challenge-lobby .lobby-progress-track i { background:linear-gradient(#c5ec4d,#9ad125 55%,#77b61e); border-radius:4px; box-shadow:inset 0 2px #eeffa7; }
.challenge-lobby .lobby-milestones { position:absolute; inset:0 2% 25px 10%; display:flex; gap:0; margin:0; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; touch-action:pan-x pan-y; overscroll-behavior-x:contain; cursor:grab; user-select:none; }
.challenge-lobby .lobby-milestones::-webkit-scrollbar {display:none;}
.challenge-lobby .lobby-milestones.is-dragging,.challenge-lobby .lobby-milestones.is-dragging button {cursor:grabbing;}
.challenge-lobby .lobby-milestones button { position:relative; left:auto; transform:none; flex:0 0 calc(100% / 5.5); width:auto; min-width:0; gap:2px; color:#f4f4d9; font-size:8px; padding-top:4px; cursor:inherit; }
.challenge-lobby .lobby-milestones:focus-visible {outline:2px solid #f5dd8b;outline-offset:2px;border-radius:6px;}
.challenge-lobby .lobby-milestones button:focus-visible {outline-offset:-3px;}
.challenge-lobby .lobby-milestones button::after { content:''; position:absolute; width:2px; height:38px; top:39px; background:linear-gradient(#d4c797,#8b8c57); z-index:0; }
.challenge-lobby .lobby-milestones i { position:relative; z-index:1;width:27px;height:27px;font-size:17px;border:2px solid #e6d395;background:radial-gradient(#f6e1a1,#b18d3d); box-shadow:0 2px 0 #805e28; color:#6b5727; }
.challenge-lobby .lobby-milestones small { font-size:11px; font-weight:800; line-height:1.3; white-space:nowrap; z-index:1; order:-1; }
.challenge-lobby .lobby-milestones .earned::before { content:'✓'; position:absolute;z-index:2;top:25px;right:calc(50% - 19px);font-size:18px;font-weight:900;color:#c9f45c;text-shadow:1px 2px #345929; }
.challenge-marker { position:absolute; bottom:3px; transform:translateX(-50%); z-index:3; width:38px; text-align:center; pointer-events:none; }
.challenge-marker b { color:#fff; font-size:15px;text-shadow:0 2px #243b29; }
.challenge-marker img { display:block; width:38px;height:38px;object-fit:contain; border:3px solid #fff9dc;border-radius:50%;background:#dce9bc;box-shadow:0 3px 0 #5c7e35; }
.challenge-spirit { position:absolute;right:-8px;bottom:1px;width:32px;height:40px;object-fit:contain;filter:drop-shadow(0 3px 2px #071b1244); }
.challenge-lobby .lobby-next-title { order:3;color:#ecdea5;font-size:13px;line-height:1.5;text-align:center;margin:9px 0; }
.challenge-lobby .lobby-current { order:4; justify-content:center; gap:5px;background:none;border:0;padding:2px 12px; }
.challenge-lobby #lobbyCurrentIcon img { width:25px;height:25px; }
.challenge-lobby .lobby-current div { flex:0 1 auto; }
.challenge-lobby .lobby-current small { display:none; }
.challenge-lobby .lobby-current strong {color:#fff2b6;font-size:14px;line-height:1.5;}
.challenge-lobby .lobby-current button {color:#d6dfb3;font-size:12px;flex-shrink:0;}
.challenge-lobby .difficulty-picker { flex-shrink:0; margin:12px auto 10px; width:210px; padding:0; border:0;background:none;box-shadow:none;display:block; }
.challenge-lobby .difficulty-picker>span {display:none;}
.challenge-lobby .difficulty-picker>div { gap:6px; }
.challenge-lobby .difficulty-picker button {min-height:40px;font-size:13px;font-weight:800;background:#2f4935;border-color:#789164;color:#c9dab3;box-shadow:none;}
.challenge-lobby .difficulty-picker button small {display:none;}
.challenge-lobby .difficulty-picker button[aria-pressed=true] {background:#dce9a5;color:#46622d;border-color:#f1f3ba;}
.challenge-lobby #difficultyHint {font-size:8px;color:#d1dfb1;text-align:center;margin-top:4px;min-height:10px;}
.challenge-lobby .lobby-actions {gap:20px;align-items:center;}
.challenge-lobby .lobby-retry,.challenge-lobby .lobby-primary {width:185px;min-height:51px;border-radius:10px;font-size:23px;font-weight:900;color:#fff;text-shadow:0 2px 1px #15544c;letter-spacing:2px;}
.challenge-lobby .lobby-retry {background:linear-gradient(#35d3ff,#0ca7e0);border:2px solid #7de2ff;box-shadow:inset 0 2px #b1eeff77,0 5px 0 #197b9c;}
.challenge-lobby .lobby-retry {scale:1.15;transform-origin:center top;}
.challenge-lobby :is(.lobby-retry,.lobby-primary) {font-family:inherit;line-height:1.2;padding:8px 6px;}
.challenge-lobby .lobby-primary {background:linear-gradient(#21d66f,#06b954);border:2px solid #78e895;box-shadow:inset 0 2px #b7f7b966,0 5px 0 #278b44;scale:1.15;transform-origin:center top;margin-top:18px;margin-bottom:12px;}
.challenge-lobby .lobby-retry:active,.challenge-lobby .lobby-primary:active {transform:translateY(2px);}
.challenge-lobby .lobby-shortcuts {height:62px; padding:0; margin-top:-55px; margin-bottom:15px; display:flex;justify-content:flex-end;gap:0;pointer-events:none;}
.challenge-lobby .lobby-shortcuts button {width:51px;height:51px;pointer-events:auto;}
.challenge-lobby .lobby-shortcuts button:is([data-campaign-tab=help],[data-campaign-tab=titles],[data-campaign-tab=ranking]) {position:absolute;left:var(--shortcut-left);right:auto;width:var(--shortcut-size);height:var(--shortcut-size);}
.challenge-lobby .lobby-shortcuts button[data-campaign-tab=help] {top:var(--shortcut-top);}
.challenge-lobby .lobby-shortcuts button[data-campaign-tab=titles] {top:calc(var(--shortcut-top) + var(--shortcut-step));}
.challenge-lobby .lobby-shortcuts button[data-campaign-tab=ranking] {top:calc(var(--shortcut-top) + var(--shortcut-step) * 2);}
.challenge-lobby .lobby-shortcuts button[hidden] {display:none;}
.challenge-lobby[data-has-title=false] .lobby-shortcuts button[data-campaign-tab=ranking] {top:calc(var(--shortcut-top) + var(--shortcut-step));}
.challenge-lobby .lobby-shortcuts button[data-campaign-tab=share] {position:absolute;right:14px;top:calc(var(--shortcut-top) + var(--shortcut-step));width:var(--shortcut-size);height:var(--shortcut-size);}
.challenge-lobby .lobby-shortcuts .shortcut-caption {font-size:9px;bottom:6px;}
.challenge-lobby .lobby-footer {display:block;padding:11px 7px;margin:12px 0 0;border-radius:10px;background:linear-gradient(90deg,#4f5b2755,#9b733fcc,#4f5b2755);color:#fff0ae;font-size:10px;text-align:center;letter-spacing:0;}
.challenge-lobby .lobby-status {color:#f8d88b;font-size:10px;}
.challenge-lobby > :is(.lobby-progress,.difficulty-picker,.lobby-actions,.lobby-status) {position:relative;top:clamp(24px,5dvh,48px);}
@media(max-height:700px) {
 .challenge-lobby > :is(.lobby-progress,.difficulty-picker,.lobby-actions,.lobby-status) {top:18px;}
 .challenge-lobby {--shortcut-size:38px;--shortcut-step:52px;--shortcut-top:10px;--shortcut-left:13px;padding:10px 16px 12px;}
 .challenge-lobby .lobby-header {min-height:29px;margin-bottom:6px;}
 .challenge-lobby .lobby-header h1 {font-size:16px;}
 .challenge-lobby #lobbySound {top:10px;left:auto;right:12px;}
 .challenge-lobby .menu-sound span {font-size:8px;bottom:5px;}
 .challenge-lobby .rescue-preview {min-height:86px;width:73%;}
 .challenge-lobby .preview-copy {padding-top:5px;}
 .challenge-lobby .preview-copy h2 {font-size:11px;}
 .challenge-lobby .preview-art,.challenge-lobby #previewSpirit {height:68px;}
 .challenge-lobby .lobby-progress {flex-basis:208px;margin-top:12px;padding-top:18px;}
 .challenge-heading {font-size:19px;margin-bottom:3px;}
 .challenge-route {height:100px;margin-top:3px;}
 .challenge-lobby .lobby-milestones button::after {height:22px;}
 .challenge-lobby .lobby-next-title {margin:5px 0;font-size:12px;}
 .challenge-lobby .journey-heading {margin-top:6px;}
 .challenge-lobby .difficulty-picker {margin:7px auto;width:210px;}
 .challenge-lobby .lobby-actions {gap:16px;}
 .challenge-lobby .lobby-retry,.challenge-lobby .lobby-primary {min-height:44px;width:160px;font-size:21px;}
 .challenge-lobby .lobby-primary {margin-top:12px;margin-bottom:10px;}
 .challenge-lobby .lobby-shortcuts {margin-top:-47px;height:51px;margin-bottom:8px;}
 .challenge-lobby .lobby-shortcuts button {width:43px;height:43px;}
 .challenge-lobby .lobby-shortcuts button[data-campaign-tab=share] {right:12px;}
 .challenge-lobby .lobby-shortcuts .shortcut-caption {font-size:8px;bottom:5px;}
 .challenge-lobby .lobby-footer {margin-top:7px;padding:7px;font-size:9px;}
}
/* Move the marked lobby groups together without changing their spacing or size. */
.challenge-lobby {--hall-content-offset:clamp(18px,3dvh,28px);}
.challenge-lobby > :is(.rescue-preview,.lobby-progress,.difficulty-picker,.lobby-actions,.lobby-status),
.challenge-lobby .lobby-shortcuts button,
.challenge-lobby #lobbySound {translate:0 var(--hall-content-offset);}
@media(max-height:700px) {.challenge-lobby {--hall-content-offset:8px;}}
@media(max-height:600px) {
 .challenge-lobby .lobby-progress {max-height:256px;}
 .challenge-lobby .lobby-primary {margin-top:4px;}
 .challenge-lobby .lobby-actions:has(.lobby-retry:not([hidden])) {flex-direction:row;justify-content:center;gap:12px;}
 .challenge-lobby .lobby-actions:has(.lobby-retry:not([hidden])) button {width:calc((100% - 12px)/2);min-height:46px;scale:1;margin:4px 0 10px;font-size:19px;letter-spacing:1px;}
}
/* Shared challenge UI skin: all game surfaces use the lobby's forest palette. */
.phone {background:#173628;color:var(--ui-text);}
.phone>.topbar {background:linear-gradient(#203f2f,#173628);}
.phone>.topbar h1 {color:var(--ui-text);text-shadow:0 2px #10281c;}
.phone>.topbar .eyebrow {color:var(--ui-gold);}
.phone>.topbar .icon-btn {background:linear-gradient(#456044,#293e2b);border-color:#839464;color:#fff1bd;box-shadow:inset 0 1px #c9d3a833,0 3px #11251d;}
.phone>.hud {background:linear-gradient(130deg,#2b4a34,#193628);border:1px solid #899365;box-shadow:inset 0 1px #b8c58b44,0 3px #10281b;}
.phone>.hud {height:68px;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr) minmax(0,1.3fr);gap:8px;padding:8px 10px;}
.hud .stat,.hud .speed-meter {min-width:0;}
.hud .stat strong,.hud .speed-meter>strong {font-size:25px;white-space:nowrap;}
.hud .stat>span,.hud .speed-meter>span {font-size:12px;font-weight:800;}
.hud .stat.right {text-align:center;align-items:center;}
.hud .stat small,.hud .stat small span {margin-left:1px;font-size:12px;}
.hud .campaign-toolbar {height:auto;min-width:0;margin:0;align-self:stretch;}
.hud .campaign-toolbar #journeyBtn {flex:1;min-width:0;padding:5px 3px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;background:linear-gradient(#405d3d,#29422c);border:1px solid #8d9b69;color:#f7efd3;box-shadow:inset 0 1px #ccdf9a33;white-space:nowrap;}
.hud #journeyBtn strong {font-size:15px;line-height:1.3;}
.hud #journeyBtn span {font-size:12px;color:#d4dfb4;line-height:1.2;}
@media(max-width:350px) {
 .phone>.hud {gap:5px;padding:7px 8px;}
 .hud .stat strong,.hud .speed-meter>strong {font-size:22px;}
 .hud .stat>span,.hud .speed-meter>span {font-size:11px;}
 .hud #journeyBtn strong {font-size:14px;}
 .hud #journeyBtn span {font-size:11px;}
}
.hud .stat strong,.hud .stat small,.hud .stat span {color:var(--ui-text);}
.hud .stat span,.hud .stat small {color:var(--ui-muted);}
.speed-meter {color:#f5d886;}
.speed-track {background:#10271c;box-shadow:inset 0 2px #0a1c1755;}
.speed-track i {background:linear-gradient(#f9df88,#cea449);}
.phone>.campaign-toolbar button {background:linear-gradient(#405d3d,#29422c);border-color:#8d9b69;box-shadow:inset 0 1px #ccdf9a33;color:#f7efd3;}
.phone>.notice {background:#274831;border-color:#718650;box-shadow:inset 0 1px #afc38322;}
.phone>.notice div span {color:#f3efd0;}
.phone>.notice .notice-dot {background:#c4e76d;box-shadow:0 0 0 4px #486733;}
.phone>.bottom-panel {color:var(--ui-text);border-color:#5a7149;}
.bottom-panel .rescue-progress em,.bottom-panel #timeLeft {color:#ffe18b;}
.bottom-panel .legend {color:#e7eacb;}
.bottom-panel .rescue-track {background:#112b20;box-shadow:inset 0 2px #081b1444;}
.bottom-panel .rescue-track i {background:linear-gradient(#c5ec4d,#77b61e);}
.overlay,.sheet-backdrop,.nickname-overlay {background:#071b16a8;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);}
.modal,.tutorial-coach {background:linear-gradient(150deg,#2b4933f5,#123427f8);border:2px solid var(--ui-gold);box-shadow:inset 0 0 0 3px #0e291d88,0 6px 0 #10271b,0 18px 45px #051c1780;color:var(--ui-text);}
.modal::before {border-color:#b4b77855;}
.modal h2,.tutorial-coach h2 {color:var(--ui-text);text-shadow:0 2px #102c20;}
.modal p:not(.modal-kicker),.modal .level-details,.tutorial-coach p {color:#d4dfbd;}
.modal .campaign-level,.tutorial-top {color:#e6cb87;}
.modal .text-btn,.tutorial-coach .text-btn,.modal .help-details {color:#e4d39a;}
.modal .collection-guide>div {background:radial-gradient(ellipse at 50% 35%,#f5e7bb,#bca16c);border:2px solid #e4c88b;box-shadow:inset 0 2px #fff4d188,0 3px #132a1f;}
.modal .collection-guide .sample-keep {background:radial-gradient(ellipse at 50% 35%,#eaf2c9,#9cba78);border-color:#d3df9e;}
.modal .collection-guide b {color:#38482c;}
.modal .collection-guide span {color:#77562c;}
.modal .collection-guide .sample-keep span {color:#416238;}
.modal .collection-guide p {color:#dbe2bc;}
.modal .best-score {background:#102b1e;border:1px solid #6d7d4e;color:#c8d6ae;}
.modal .best-score b {color:#ffe5a1;}
.modal .result-stats {color:#ffdf83;}
.modal .save-status {color:#e5d198;}
.modal .title-award {background:linear-gradient(#b28d48,#826230);color:#fff4c4;border-color:#e5c476;}
.modal-nav button {background:linear-gradient(#455d3b,#2b432d);border-color:#8b9b62;color:#fff1c4;box-shadow:inset 0 1px #dfedab44;}
#startBtn,.tutorial-next {background:var(--ui-green);border:2px solid #78e895;box-shadow:inset 0 2px #b7f7b966,0 5px #278b44;color:#fff;font-weight:900;text-shadow:0 2px #165c3d;}
.phone[data-outcome=failure] #startBtn {background:var(--ui-blue);border:2px solid #7de2ff;box-shadow:inset 0 2px #b1eeff77,0 5px #197b9c;color:#fff;font-weight:900;text-shadow:0 2px #12576d;}
.phone #startBtn:active,.tutorial-next:active {transform:translateY(2px);}
.factory .toast,.factory .outcome-banner {background:linear-gradient(#31553a,#173d2c);border-color:#cfba75;color:#fff1b4;box-shadow:inset 0 1px #e0d18c44,0 4px #10291d;}
.factory .toast.toast-bad,.factory.rescue-failure .outcome-banner {color:#ffcb9d;border-color:#d99f6b;}
.factory .rabbit-speech,.factory .rabbit-speech::after {background:#254831;border-color:#aac17a;color:#fff4c7;}
.factory[data-mood=hopeful] .rabbit-speech {color:#ecffbd;border-color:#c0db8b;}
.factory .brake-spark {color:#e6ff9d;text-shadow:0 2px #34572b;}
.campaign-sheet,.campaign-sheet.ranking-sheet {background:linear-gradient(#193b2be8,#102d22f5),url('assets/art/qreal/garden.webp') center/cover;border:2px solid var(--ui-gold);box-shadow:inset 0 0 0 3px #3c563033,0 6px #10271c,0 15px 45px #061c1680;color:var(--ui-text);}
.campaign-sheet .sheet-header {border-color:#82915b55;}
.campaign-sheet .sheet-header h2 {color:#fff6d4;text-shadow:0 2px #10291d;}
.campaign-sheet #sheetClose {background:linear-gradient(#50683d,#304c30);color:#fff2ba;border:1px solid #b5b77b;box-shadow:0 3px #10271d;}
.sheet-note,.empty-state {color:#cad7b1;}
.stage-card {background:linear-gradient(#314b32,#213e2b);border-color:#687e4c;box-shadow:inset 0 1px #afc48322;}
.stage-card h3,.title-card h3,.profile-editor h3 {color:#ffedb1;}
.stage-card p,.title-card p {color:#c4d2a6;}
.level-tile {background:linear-gradient(#445a37,#293e2a);border-color:#718852;color:#fff1bd;box-shadow:inset 0 1px #c7d59b33;}
.level-tile.completed {background:linear-gradient(#779747,#466d33);border-color:#b7cf71;}
.level-tile.selected {box-shadow:0 0 0 2px #fce28d inset;}
.level-tile small {color:#ffe28e;}
.level-tile:disabled {opacity:.6;}
.title-card {border-color:#61774a;opacity:.7;}
.title-card.earned {opacity:1;}
.title-medal {background:radial-gradient(circle at 35% 25%,#ffe9a0,#af8139);border-color:#f0d68d;color:#72532b!important;box-shadow:inset 0 1px #fff8cf,0 3px #5a482b;}
.campaign-sheet .secondary-btn {background:var(--ui-blue);border:1px solid #7de2ff;color:#fff;text-shadow:0 1px #155a6d;box-shadow:0 3px #197b9c;}
.profile-editor {border-color:#798b57;color:#d4deb5;}
.profile-editor small {color:#c8d2ad;}
.profile-editor input,.profile-editor select {background:#183527;color:#fff4d2;border-color:#8fa06c;}
.profile-editor input::placeholder {color:#a9bb98;}
.share-card {background:linear-gradient(#193c2da8,#102d22eb),url('assets/art/qreal/garden.webp') center/cover;border:2px solid #d8bd79;box-shadow:inset 0 0 0 3px #10271d44;}
.share-card h3 {color:#fff7dc;}
.share-card strong {color:#fff0ad;}
.share-card p {color:#d6dfb8;}
.share-copy {background:#102d22;color:#e4ebce;border-color:#6d895a;}
/* Temporarily hide every share entry; retain its assets for later restoration. */
.phone [data-campaign-tab=share] {display:none !important;}
.ranking-sheet #sheetClose {background:linear-gradient(#d89969,#ac6544);border-color:#f3d69a;color:#fff2c8;box-shadow:0 3px #79492f;}
.ranking-tabs button {background:linear-gradient(#416344,#294a32);border-color:#80945d;color:#d4e2b8;}
.ranking-tabs button.active {background:linear-gradient(#d9ed91,#aaca60);color:#344e2a;border-color:#e3edab;text-shadow:0 1px #f0fac8;}
.ranking-board {background:#123325;border-color:#c1bc7b;box-shadow:inset 0 0 0 1px #718154;}
.ranking-columns {background:linear-gradient(#6b8744,#476533);color:#fff1c4;}
.ranking-entry {background:linear-gradient(120deg,#3c5c3a,#284d35);border-color:#738d57;box-shadow:inset 0 1px #c7d59a33;}
.ranking-entry.is-me {border-color:#b1cc73;}
.ranking-player strong {color:#fff1bf;}
.ranking-player small,.ranking-metric small {color:#d0dfb4;}
.ranking-own {background:linear-gradient(#789347,#4e6a32);}
.ranking-own .personal {background:linear-gradient(#506d38,#39592f);border-color:#c4d97e;}
.ranking-status,.ranking-unranked {color:#d2dfb8;}
.ranking-footer,.ranking-sheet .profile-editor {color:#ddd9af;border-color:#8fa46766;}
.ranking-own h3 {color:#fff2be;text-shadow:0 1px #36512b;}
.ranking-avatar {background:radial-gradient(#f4f2c5,#a9bf79);border-color:#e7dbac;}
#sheetBody {scrollbar-width:thin;scrollbar-color:#849b59 #183527;}
/* Compact secondary panels keep the lobby visible above and below. */
.campaign-sheet:is([data-tab=help],[data-tab=titles],[data-tab=ranking],[data-tab=share]) {
  inset:50% 12px auto;
  transform:translateY(-50%);
  height:min(76%,640px);
  max-height:calc(100% - 48px);
}
.campaign-sheet[data-tab=titles] {height:min(74%,560px);}
.campaign-sheet[data-tab=titles] .title-card {padding:11px 9px;}
.campaign-sheet[data-tab=ranking] {height:min(76%,580px);}
.campaign-sheet[data-tab=share] {height:min(74%,580px);}
.campaign-sheet:is([data-tab=help],[data-tab=titles],[data-tab=share]) .sheet-header {flex-shrink:0;padding:12px 14px;}
.campaign-sheet[data-tab=share] .share-card {padding:14px;margin-bottom:10px;}
.campaign-sheet[data-tab=share] .share-card img {height:84px;width:90px;}
.campaign-sheet[data-tab=share] .share-buttons {margin:10px 0;}
.help-guide {display:grid;gap:10px;color:#e2e7c7;font-size:13px;line-height:1.5;}
.help-guide p {margin:5px 0 0;}
.help-intro {display:flex;align-items:center;gap:12px;padding:2px 5px;}
.help-intro img {width:64px;height:74px;object-fit:contain;flex-shrink:0;}
.help-intro strong {font-size:17px;color:#fff1bc;}
.help-intro p {font-size:12px;}
.help-section {padding:11px;border:1px solid #7a8c55;border-radius:16px;background:linear-gradient(130deg,#355436c9,#183a2bd9);}
.help-section h3 {display:flex;align-items:center;gap:8px;margin:0;color:#fff0b6;font-size:14px;line-height:1.5;}
.help-number {display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;border:1px solid #e0c57d;border-radius:50%;background:#687d3e;color:#fff5c8;font-size:12px;}
.help-examples,.help-endings {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;}
.help-example {margin:0;padding:10px 5px;border:2px solid #ddc387;border-radius:12px;background:radial-gradient(#f9eac5,#bca16c);color:#4a482b;text-align:center;}
.help-example.keep {background:radial-gradient(#eff4d4,#a5bf80);border-color:#d3dfa2;}
.help-example b {font-size:17px;}
.help-example img {display:block;width:64px;height:64px;object-fit:contain;margin:3px auto;}
.help-example figcaption {font-weight:900;font-size:13px;}
.help-example small {display:block;font-size:10px;margin-top:4px;}
.help-rules {list-style:none;margin:12px 0 0;padding:0;display:grid;gap:12px;}
.help-rules li {padding-left:11px;border-left:3px solid #a8bf69;}
.help-rules strong {color:#ffe4a3;}
.help-rules p {margin-top:2px;}
.help-caption {font-size:11px;color:#c4d1a9;}
.help-quick-rules {gap:9px;margin-top:10px;}
.help-quick-rules li {display:flex;align-items:center;gap:8px;}
.help-quick-rules strong {flex:0 0 66px;font-size:13px;}
.help-quick-rules p {margin:0;font-size:13px;}
.help-ending {text-align:center;}
.help-ending img {display:block;width:64px;height:65px;object-fit:contain;margin:0 auto 4px;}
.help-ending b {color:#ffedb4;}
.help-ending p {font-size:12px;text-align:center;}
.help-guide .help-tip {margin-top:14px;color:#d2dcae;font-size:12px;}
.help-more {padding:12px 13px;border:1px solid #7a8c55;border-radius:12px;background:#18382bd9;}
.help-more summary {cursor:pointer;color:#f4dea6;font-weight:800;min-height:24px;}
.help-done {min-height:46px;margin:2px 0 8px;border:2px solid #78e895;border-radius:12px;background:var(--ui-green);box-shadow:inset 0 2px #b7f7b966,0 4px #278b44;color:white;font:inherit;font-size:16px;font-weight:900;cursor:pointer;}
button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible {outline:3px solid #f5dd8b;outline-offset:3px;}
@media(prefers-reduced-motion:reduce) {#startBtn:active,.tutorial-next:active {transform:none;}}

/* Compact failure card and a single row of matching, accessible icon actions. */
.phone[data-outcome=success] .modal :is(#levelLabel,#modalTitle) {display:none;}
.phone[data-outcome=success] .modal #modalCopy {font-size:24px;font-weight:900;line-height:1.4;color:#fff8dc;margin:10px 0 14px;text-shadow:0 2px #102c20;}
.phone[data-outcome=success] .modal #resultStats {font-size:23px;font-weight:900;line-height:1.45;color:#ffe28c;margin:0 0 16px;text-shadow:0 2px #172f20;}
@media(max-width:350px), (max-height:650px) {
 .phone[data-outcome=success] .modal #modalCopy {font-size:21px;margin:7px 0 10px;}
 .phone[data-outcome=success] .modal #resultStats {font-size:20px;margin-bottom:12px;}
}
.phone[data-outcome=failure] .modal :is(.level-context,#modalTitle,#modalCopy,#resultStats) {display:none;}
.phone[data-outcome=failure] .modal .campaign-level {font-size:20px;line-height:1.4;margin-bottom:20px;}
.modal .modal-icon-nav {display:flex;justify-content:center;gap:22px;margin:22px 0 4px;}
.modal .modal-icon-nav .modal-icon-btn {flex:0 0 56px;width:56px;height:56px;padding:10px;border:2px solid #d8bf7b;border-radius:16px;background:linear-gradient(145deg,#526e43,#294c32);box-shadow:inset 0 2px #dce3a844,0 4px #102a20,0 5px 10px #071d1544;cursor:pointer;}
.modal-icon-btn svg {display:block;width:100%;height:100%;fill:#f5dfa0;stroke:#8f733d;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 2px 1px #10291c80);}
.modal-icon-btn .icon-detail {fill:none;stroke:#637143;stroke-width:2;}
.modal-icon-btn .icon-route {fill:none;stroke:#78954e;stroke-width:2.5;stroke-dasharray:3 4;}
.modal .modal-icon-nav .modal-icon-btn:active {transform:translateY(2px);box-shadow:inset 0 2px #dce3a822,0 2px #102a20;}
.modal .modal-icon-nav .modal-icon-btn:disabled {opacity:.45;cursor:default;}
@media(max-height:650px) {.modal .modal-icon-nav {gap:18px;margin-top:16px;}.modal .modal-icon-nav .modal-icon-btn {flex-basis:48px;width:48px;height:48px;padding:8px;border-radius:13px;}}