/* Shared illustrated family, static artwork while the lobby is idle. */
:root{--paper:#fff;--cream:#f2f8fa;--ink:#24404a;--ink-2:#5b747e;--line:#d6e5ea;--coral:#c65342;--sun:#f0c75d;--mint:#78bbaa;--sky:#81c7df;--good:#198367;--bad:#c74746;--radius:8px;--shadow:0 6px 20px #284e6012}
*{letter-spacing:0!important}
html{scroll-behavior:auto}body{background:var(--cream)}
button,a,select,input{outline-offset:4px}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #2685ad}
.ui-icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:middle}
.topbar{height:78px;padding:10px max(24px,calc((100% - 1220px)/2));gap:20px;background:#fff;border-color:var(--line);backdrop-filter:none}
.brand{flex:none;gap:10px}.brand strong{font-size:22px}.brand small{font-size:12px;margin-top:4px}
.reader-mascot{display:block;width:62px;height:52px;flex:none;border-radius:8px;background:url("art-v2/covers-4.webp") 14% 100%/400% 400% no-repeat}
.top-actions{gap:8px;min-width:0}.quiet-btn,.icon-btn{border:1px solid var(--line);background:#f8fbfc;border-radius:8px;flex:none;height:42px;text-decoration:none}
.quiet-btn{padding:0 12px;font-size:13px}.quiet-btn b{background:#def1ec;color:#1c7665;border-radius:5px;font-size:12px;padding:0 5px}
.icon-btn{display:grid;place-items:center}.quiet-btn:hover,.icon-btn:hover,.soft-btn:hover{transform:none}
.hero{display:block;max-width:none;min-height:268px;margin:0;padding:0;position:relative;isolation:isolate;overflow:hidden;background:#e0f3fc;border-bottom:1px solid #cbe5ed}
.story-scene{position:absolute;z-index:-1;right:0;top:-22%;width:min(66%,1000px);height:148%;object-fit:cover;object-position:72% 62%;mask-image:linear-gradient(to right,transparent,#000 27%);-webkit-mask-image:linear-gradient(to right,transparent,#000 27%);pointer-events:none}
.hero-copy{max-width:1280px;margin:auto;padding:31px 32px;min-height:268px;text-align:left}
.eyebrow{font-size:12px;color:#387c88}
.hero h1{font:800 42px/1.25 "PingFang SC","Microsoft YaHei",sans-serif;max-width:55%;margin:0}
.hero-note{font-size:17px;margin:13px 0 23px;line-height:1.5;color:#476b77;max-width:52%}
.hero-actions{gap:12px;justify-content:flex-start}
.primary-btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;background:#177f72;border-radius:8px;box-shadow:0 3px 0 #126358;min-height:46px;padding:12px 20px}
.primary-btn:hover{background:#116e63;transform:none;box-shadow:0 3px 0 #126358}.primary-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #126358}.primary-btn span{margin-left:9px;color:inherit}
.text-btn{display:inline-flex;align-items:center;gap:7px;padding:12px 15px;min-height:46px;border:1px solid #bbd8e0;background:#f8fcff;text-decoration:none;border-radius:8px;font-size:14px}
.game-section{max-width:1280px;margin:0 auto;padding:28px 32px 50px}
.section-heading{align-items:center;gap:20px;margin-bottom:20px}.section-heading h2{font:800 25px/1.4 "PingFang SC","Microsoft YaHei",sans-serif;margin:0}.section-heading .eyebrow{font-size:11px;margin-bottom:4px;color:var(--ink-2)}
.filter-row{gap:7px;flex-wrap:wrap}.filter-chip{border:1px solid var(--line);border-radius:7px;box-shadow:none;background:#fff;color:#47636b;padding:10px 14px;font-size:13px}.filter-chip.active{background:#177f72;color:#fff;border-color:#177f72}
.game-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.game-card{min-width:0;min-height:0;padding:0 0 14px;display:flex;flex-direction:column;position:relative;background:#fff;border:1px solid #d5e5e9;border-radius:8px;box-shadow:0 3px 0 #deeaee;overflow:hidden;transition:border-color .15s,box-shadow .15s;text-align:left}
.game-card::before{content:"";position:static;display:block;width:100%;height:auto;aspect-ratio:2;background-image:var(--cover);background-size:200% 400%;background-position:var(--cover-position);background-repeat:no-repeat;flex:none}
.game-card:hover,.game-card:nth-child(even):hover{transform:none;border-color:#75b7ad;box-shadow:0 4px 15px #284e601c;background:#fff}
.game-icon{display:none}.game-number{position:static;align-self:flex-start;margin:13px 16px 5px;font:700 11px/1.2 system-ui;color:#718890;opacity:1}
.game-card h3{margin:0 16px 7px;font:750 19px/1.4 "PingFang SC","Microsoft YaHei",sans-serif}
.game-card p{margin:0 16px;color:#5f7781;font-size:12px;line-height:1.65;flex:1}
.game-meta{margin:14px 16px 0;padding-top:10px;border-top:1px solid #edf2f4;gap:6px;font-size:11px;flex-wrap:wrap}.game-meta b{color:#167e70}.game-meta>span{color:#73858b}
.game-stage{background:#f2f8fa}.stage-bar{background:#fff;border-color:var(--line);padding:12px 28px;gap:16px;grid-template-columns:minmax(120px,1fr) minmax(0,auto) minmax(120px,1fr)}
.stage-title{min-width:0}.stage-title b{font-size:20px}.stage-title small{font-size:12px;line-height:1.5}.stage-title span{display:none}
.back-btn{display:inline-flex;gap:7px;align-items:center;font-size:13px;border-color:var(--line);border-radius:8px;box-shadow:none;white-space:nowrap;background:#f8fbfc}
.stage-stats{gap:8px}.stat-pill{min-width:72px;min-height:58px;background:#eaf3f7;color:#2e5e70;border:0;border-radius:7px;padding:7px 10px;box-shadow:none}.stat-pill small{color:#527582;font-size:10px}.stat-pill b{font:750 23px/1.3 system-ui}
.stat-pill[data-stat="得分"]{background:#def3ea;color:#146d59;box-shadow:none}.stat-pill[data-stat="得分"] small{color:#2b7865}.stat-pill[data-stat="连击"]{background:#fff3ca;color:#775819;box-shadow:none}.stat-pill[data-stat="连击"] small{color:#775819}
.stage-body{padding:24px 28px 40px;min-width:0}
.setup-panel{max-width:850px;border:0;border-radius:0;box-shadow:none;background:transparent;margin:0 auto;padding:4px 0 24px}
.setup-icon{width:256px;aspect-ratio:2;margin:0 auto 14px;background-image:var(--cover);background-size:200% 400%;background-position:var(--cover-position);border-radius:8px;font-size:0}
.setup-panel h2{font:800 30px/1.4 "PingFang SC","Microsoft YaHei",sans-serif}.setup-panel>p{font-size:15px}.setup-options{gap:9px;margin:20px 0 26px}.setup-options .seg-btn{font-size:13px;padding:8px 12px;border:1px solid var(--line);border-radius:6px;font-weight:500;background:#fff;cursor:default;box-shadow:none}.setup-options .seg-btn.selected{color:#176b5a;border-color:#9bcbbe;background:#e6f5ef}
.question-card{border:1px solid var(--line);box-shadow:0 3px 0 #deeaee;border-radius:8px;background:#fff;padding:32px;margin:12px auto 24px}.question-main{font-size:64px;line-height:1.3}.question-main[style]{font-size:32px!important}.question-label{color:#277d73}.question-sub{line-height:1.6;overflow-wrap:anywhere}
.answer-btn{font-size:24px;line-height:1.45;min-height:80px;border:1px solid #c9dfe5;border-radius:8px;box-shadow:0 3px 0 #d5e5ea;background:#fff;overflow-wrap:anywhere}.answer-btn:hover{background:#f4fbfd;transform:none}.answer-btn.correct{background:#def4e8;border-color:#62ae85;box-shadow:0 3px 0 #83bc9a}.answer-btn.wrong{background:#ffede8;border-color:#d58478;box-shadow:0 3px 0 #dc9a8c;animation:none}
.progress-track{height:8px;border:0;background:#dcebec}.progress-track span{background:#239e85}.feedback-line{font-size:16px;line-height:1.6;margin:18px 0;overflow-wrap:anywhere}
.memory-card{border:1px solid #b8d7df;border-radius:8px;background:#277f8f;font-size:25px}.memory-card.open{background:white}.memory-card.done{background:#dff3e9;opacity:.9}
.seg-btn,.soft-btn,.upload-btn,.letter-btn,.token-btn,.speak-btn{border-radius:7px}.letter-btn,.token-btn{box-shadow:0 3px 0 #d5e5ea}
.result-card{max-width:650px;margin:20px auto;padding:20px;border:0;border-radius:0;background:transparent;box-shadow:none}.result-card .result-emoji{font-size:0;width:280px;aspect-ratio:2;margin:0 auto 20px;background:url("art-v2/covers-4.webp") 100% 100%/200% 400%;border-radius:8px}.result-card h2{font:800 30px/1.4 "PingFang SC","Microsoft YaHei",sans-serif}.result-number{font:800 64px/1.5 system-ui;color:#188570}
.modal{max-width:calc(100vw - 24px);padding:0}.modal::backdrop{background:#203e4677;backdrop-filter:none}.modal-card{border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);background:#fff;padding:24px;max-height:90vh}.modal-head{gap:12px}.modal-head h2{font:750 26px/1.4 "PingFang SC","Microsoft YaHei",sans-serif}.modal-head p{font-size:13px;line-height:1.6}.close-btn{min-width:32px;line-height:1}.summary-tile{background:#eef7f9;border-radius:7px}
.bank-target-bar{border:0;border-radius:0;background:transparent;padding:0 0 18px;border-bottom:1px solid var(--line)}.bank-target-bar select{border-radius:7px;background:#f7fbfc}.preset-section{padding:0 0 18px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}.preset-heading h3{font-size:20px}.preset-heading>span{border-radius:6px;background:#edf6f8}.preset-card{border-radius:7px;background:#fff;box-shadow:none}.preset-card.active{border:1px solid #7bbbad;background:#e7f5ef;box-shadow:0 2px 0 #b7dace}.preset-card:hover{transform:none;box-shadow:none}.preset-card span{color:#247f70}.preset-tip{line-height:1.65}.bank-table th{background:#e8f2f5;color:#345d6b}.bank-editor-wrap{border-radius:7px}.bank-toolbar .soft-btn,.bank-toolbar .upload-btn{font-size:12px;padding:9px 10px}.bank-table input:focus{outline:2px solid #75bcae}
.voice-settings-panel{box-shadow:none;border:0;border-radius:0;background:transparent;padding:12px 0}.voice-range-grid label{border-radius:7px;background:#f1f8fa;border-color:var(--line)}.voice-preview-btn{box-shadow:none;border-radius:7px;background:#e5f4ef;border-color:#b4d8cb}.voice-range-grid input{min-width:0}.voice-toggle-row{border-radius:7px}
.hunt-clue,.auction-panel,.translation-case,.rhythm-console,.snapshot-board,.scanner-panel,.ladder-panel,.echo-console,.cinema-screen,.hotseat-card{border:1px solid var(--line);border-radius:8px;box-shadow:0 3px 0 #deeaee}
.hunt-card,.truth-btn,.match-card,.sort-bin,.scan-option,.snapshot-card,.repair-token,.bid-row button{border-width:1px;border-color:#bcd7e0;border-radius:8px;box-shadow:0 3px 0 #d5e5ea}
.match-card{font-size:24px}.match-card.selected{background:#dff3f8;border-color:#6bafc2;transform:none}.match-card.matched{background:#dff4e8;opacity:.85}.match-card.wrong{background:#ffede8}
.home-link{color:#345f6c}.territory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.territory-cell{min-width:0;overflow-wrap:anywhere;border-width:1px;border-color:#bcd7e0;border-radius:8px;box-shadow:0 3px 0 #d5e5ea;font-size:25px}
.bingo-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.bingo-cell{min-width:0;overflow-wrap:anywhere;border-width:1px;border-color:#bdd7df;border-radius:7px;font-size:18px}.odd-card{min-width:0;overflow-wrap:anywhere;border-width:1px;border-radius:8px;box-shadow:0 3px 0 #d5e5ea;font-size:26px}
.sort-conveyor,.snapshot-head,.scanner-screen,.clue-ladder,.echo-code-console,.repair-board,.wordsearch-clue,.letter-map,.maze-grid,.tower-scene,.fishing-pond,.meteor-field{border-width:1px;border-radius:8px;box-shadow:0 3px 0 #d5e5ea}.repair-toolbox{border-color:#bad4db;border-radius:8px;background:#eaf4f7}.repair-token{background:#edf5f7}.sort-conveyor{background:#e2f1f5}.conveyor-belt{border-radius:7px;background:#f6fbfc;border-color:#bed6de}.clue-step{border-radius:7px;background:#eef5f7}.clue-step.revealed{background:#e6f5ef;border-color:#91c7b5;box-shadow:none}.hotseat-card{background:#e6f4f8}
.truth-btn{font-size:26px}.hunt-clue strong,.compact-question .question-main{font-size:42px}.hunt-card b{font-size:20px}.bridge-sentence{font-size:34px}.translation-case strong,.translation-case b{font-size:48px}.word-wheel span{font-size:34px}
.access-gate{background:#e9f5fa}.access-card{border-radius:8px;background:#fff;border-color:var(--line);box-shadow:0 15px 40px #2a62701a}.access-brand>span.reader-mascot{width:72px;height:60px;display:block;border:0;border-radius:8px;background:url("art-v2/covers-4.webp") 14% 100%/400% 400% no-repeat}.access-brand{border-color:var(--line)}.access-form h1,.access-checking h1{font-size:28px}.access-form input{border-radius:7px}.access-help{border-radius:7px;background:#edf7f4}.classroom-trial-banner{border-radius:8px;box-shadow:none}
@media(min-width:1600px){.game-section,.hero-copy{max-width:1440px}.game-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1050px){.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.topbar{padding:10px 22px}.story-scene{width:75%}}
@media(max-width:760px){
 .topbar{height:auto;min-height:112px;flex-wrap:wrap;gap:8px;padding:10px 16px;position:relative}.brand strong{font-size:20px}.brand small{font-size:11px}.reader-mascot{width:55px;height:46px}
 .top-actions{width:100%;justify-content:flex-end;gap:8px}.top-actions .home-link{display:none}.top-actions .guide-link{margin-right:auto}.quiet-btn span{display:block}.quiet-btn{padding:0 10px}
 .hero,.hero-copy{min-height:230px}.hero-copy{padding:25px 20px}.hero h1{font-size:32px;max-width:80%}.hero-note{font-size:14px;margin:10px 0 23px;max-width:75%}
 .story-scene{width:110%;height:100%;top:0;right:-18%;object-position:74% 66%;mask-image:linear-gradient(to right,transparent 15%,#000 75%);-webkit-mask-image:linear-gradient(to right,transparent 15%,#000 75%)}
 .hero-actions{gap:8px}.hero-actions button{font-size:13px;padding:10px 13px;min-height:42px}.hero-actions .ui-icon{width:18px;height:18px}
 .game-section{padding:22px 16px 36px}.section-heading{align-items:flex-start;flex-direction:column;gap:14px;margin-bottom:16px}.section-heading h2{font-size:23px}.filter-row{gap:6px}.filter-chip{font-size:12px;padding:8px 12px}
 .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.game-card{padding-bottom:11px;min-height:0}.game-number{margin:10px 11px 5px;font-size:10px}.game-card h3{font-size:16px;margin:0 11px 5px}.game-card p{margin:0 11px;font-size:11px}.game-meta{margin:10px 11px 0;font-size:10px;padding-top:8px;gap:5px}.game-meta>span{display:none}
 .stage-bar{padding:10px 12px;grid-template-columns:1fr auto;gap:9px;min-height:90px}.stage-title{grid-row:2;grid-column:1/-1;text-align:left}.stage-title b{font-size:18px}.stage-title small{display:none}.stage-stats{grid-column:2;grid-row:1;gap:5px}.stage-stats .stat-pill:nth-child(n){min-width:50px;min-height:48px;padding:4px 7px;box-shadow:none}.stat-pill b{font-size:18px}.stat-pill small{font-size:9px}.back-btn{font-size:12px;padding:8px}.back-btn:first-letter{font-size:inherit}
 .stage-body{padding:18px 16px 28px}.setup-panel{padding:0 0 16px}.setup-icon{width:230px}.setup-panel h2{font-size:26px}.setup-panel>p{font-size:14px}.setup-options .seg-btn{font-size:12px;padding:7px 9px}.setup-panel #launchGameBtn{width:100%;min-height:48px;font-size:16px}
 .question-card{padding:23px 18px;margin:0 auto 18px}.question-main{font-size:44px}.question-main[style]{font-size:24px!important}.answers{gap:11px;grid-template-columns:1fr}.answer-btn{font-size:20px;min-height:65px;padding:13px}.memory-card{font-size:20px}
 .match-card{font-size:15px;line-height:1.5}.truth-btn{font-size:21px}.hunt-clue strong,.compact-question .question-main{font-size:30px}.hunt-card b{font-size:16px}.bridge-sentence{font-size:25px}.translation-case strong,.translation-case b{font-size:34px}.word-wheel span{font-size:27px}
 .territory-cell{font-size:14px;padding:5px;line-height:1.3}
 .bingo-cell{font-size:12px;padding:5px;line-height:1.4}.odd-card{font-size:22px}
 .result-card .result-emoji{width:240px}.result-card{padding:12px 0}.record-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.summary-tile{padding:12px 5px}.summary-tile b{font-size:24px}
 .modal-card,.wide-modal .modal-card{width:100%;max-height:90vh;padding:20px 16px}.modal-head h2{font-size:22px}.modal-head p{font-size:12px}.bank-target-bar{grid-template-columns:1fr}.bank-target-bar select{width:100%;min-width:0}.preset-card{min-width:0}.modal-foot>div{flex-wrap:wrap}.modal-foot .primary-btn{flex:none}.voice-grid{grid-template-columns:1fr}
}
@media(max-width:360px){.game-section{padding:18px 12px 36px}.game-grid{gap:9px}.game-card h3{font-size:15px}.hero,.hero-copy{min-height:196px}.hero-copy{padding:20px 16px}.hero h1{font-size:30px}.hero-note{font-size:13px;margin-bottom:17px}.section-heading .eyebrow{display:none}.section-heading h2{font-size:21px}.stage-bar{padding-inline:9px}.stage-stats{gap:4px}.stage-stats .stat-pill:nth-child(n){min-width:45px;padding:4px 5px}.back-btn{font-size:11px;padding:7px;gap:4px}}
@media(hover:none),(pointer:coarse){.game-card:hover,.game-card:nth-child(even):hover{transform:none;border-color:#d5e5e9;box-shadow:0 3px 0 #deeaee}.game-card:active{border-color:#65a998}}
@media(prefers-reduced-motion:reduce){button{transition:none!important}}
