/* Static illustrations; no looping decoration or animation on idle pages. */
:root{--paper:#fff;--rice:#f2f8fa;--ink:#203e46;--ink-2:#617b81;--line:#d8e6e9;--cinnabar:#bb4f40;--cinnabar-dark:#973b30;--bamboo:#157e70;--jade:#9bd4c7;--gold:#e8b552;--sky:#a6d6e8;--shadow:0 6px 18px #284e6010}
*{letter-spacing:0!important}
button,a,select,input{outline-offset:4px}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #278bb8}
.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-image:url("art-v2/covers-4.webp");background-size:400% 400%;background-position:89% 100%;background-repeat:no-repeat}
.top-actions{gap:8px;min-width:0}
.home-link,.icon-btn,.stage-picker{border-color:var(--line);background:#f8fbfc;border-radius:8px}
.icon-btn{display:grid;place-items:center;flex:none}
.stage-picker select{max-width:160px;font-size:13px}
.stage-picker span{white-space:nowrap;flex:none}
.hero{display:block;max-width:none;min-height:280px;margin:0;padding:0;position:relative;isolation:isolate;overflow:hidden;background:#dff2fb;border-bottom:1px solid #c8e5ec}
.story-scene{position:absolute;z-index:-1;right:0;top:-22%;width:66%;height:148%;object-fit:cover;object-position:70% 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:34px 32px;min-height:280px;text-align:left}
.eyebrow{font-size:12px;color:#3f7e87}
.hero h1{font:800 42px/1.25 "PingFang SC","Microsoft YaHei",sans-serif;max-width:55%}
.hero-note{font-size:17px;margin:13px 0 24px;line-height:1.5;color:#476d77;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:#168370;border-radius:8px;box-shadow:0 3px 0 #116454;min-height:46px;padding:12px 20px}
.primary-btn:hover{background:#117564;transform:none;box-shadow:0 3px 0 #116454}
.primary-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #116454}
.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 #bad7df;background:#f7fcff;text-decoration:none;border-radius:8px;font-size:14px}
.game-section{max-width:1280px;margin:0 auto;padding:30px 32px 50px}
.section-heading{align-items:center;gap:20px;margin-bottom:22px}
.section-heading h2{font:800 25px/1.4 "PingFang SC","Microsoft YaHei",sans-serif;margin:0}
.section-heading .eyebrow{font-size:12px;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:#167d6b;color:#fff;border-color:#167d6b;box-shadow:none}
.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;inset:auto;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{transform:none;border-color:#70b7a8;box-shadow:0 4px 15px #284e601c;background:#fff}
.game-icon{display:none}
.game-number{position:static;order:0;align-self:flex-start;margin:13px 16px 5px;font:700 11px/1.2 system-ui;color:#758f96;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:#617b81;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:#19816f}.game-meta>span{color:#73858b}
.game-card[data-game="pinyin-choice"]{--cover:url("art-v2/covers-1.webp");--cover-position:0% 0%}
.game-card[data-game="hanzi-choice"]{--cover:url("art-v2/covers-1.webp");--cover-position:100% 0%}
.game-card[data-game="radical-choice"]{--cover:url("art-v2/covers-1.webp");--cover-position:0% 33.333333333333336%}
.game-card[data-game="stroke-choice"]{--cover:url("art-v2/covers-1.webp");--cover-position:100% 33.333333333333336%}
.game-card[data-game="typo-lens"]{--cover:url("art-v2/covers-1.webp");--cover-position:0% 66.66666666666667%}
.game-card[data-game="homophone-fill"]{--cover:url("art-v2/covers-1.webp");--cover-position:100% 66.66666666666667%}
.game-card[data-game="synonym"]{--cover:url("art-v2/covers-1.webp");--cover-position:0% 100%}
.game-card[data-game="antonym"]{--cover:url("art-v2/covers-1.webp");--cover-position:100% 100%}
.game-card[data-game="measure"]{--cover:url("art-v2/covers-2.webp");--cover-position:0% 0%}
.game-card[data-game="word-sort"]{--cover:url("art-v2/covers-2.webp");--cover-position:100% 0%}
.game-card[data-game="meaning-guess"]{--cover:url("art-v2/covers-2.webp");--cover-position:0% 33.333333333333336%}
.game-card[data-game="word-match"]{--cover:url("art-v2/covers-2.webp");--cover-position:100% 33.333333333333336%}
.game-card[data-game="idiom-hunt"]{--cover:url("art-v2/covers-2.webp");--cover-position:0% 66.66666666666667%}
.game-card[data-game="idiom-decode"]{--cover:url("art-v2/covers-2.webp");--cover-position:100% 66.66666666666667%}
.game-card[data-game="idiom-fill"]{--cover:url("art-v2/covers-2.webp");--cover-position:0% 100%}
.game-card[data-game="idiom-judge"]{--cover:url("art-v2/covers-2.webp");--cover-position:100% 100%}
.game-card[data-game="sentence-order"]{--cover:url("art-v2/covers-3.webp");--cover-position:0% 0%}
.game-card[data-game="punctuation"]{--cover:url("art-v2/covers-3.webp");--cover-position:100% 0%}
.game-card[data-game="wrong-character"]{--cover:url("art-v2/covers-3.webp");--cover-position:0% 33.333333333333336%}
.game-card[data-game="sentence-fix"]{--cover:url("art-v2/covers-3.webp");--cover-position:100% 33.333333333333336%}
.game-card[data-game="connector"]{--cover:url("art-v2/covers-3.webp");--cover-position:0% 66.66666666666667%}
.game-card[data-game="expand"]{--cover:url("art-v2/covers-3.webp");--cover-position:100% 66.66666666666667%}
.game-card[data-game="poem-fill"]{--cover:url("art-v2/covers-3.webp");--cover-position:0% 100%}
.game-card[data-game="poem-author"]{--cover:url("art-v2/covers-3.webp");--cover-position:100% 100%}
.game-card[data-game="poem-match"]{--cover:url("art-v2/covers-4.webp");--cover-position:0% 0%}
.game-card[data-game="flying-flower"]{--cover:url("art-v2/covers-4.webp");--cover-position:100% 0%}
.game-card[data-game="reading-evidence"]{--cover:url("art-v2/covers-4.webp");--cover-position:0% 33.333333333333336%}
.game-card[data-game="reading-judge"]{--cover:url("art-v2/covers-4.webp");--cover-position:100% 33.333333333333336%}
.game-card[data-game="riddle"]{--cover:url("art-v2/covers-4.webp");--cover-position:0% 66.66666666666667%}
.game-card[data-game="hotseat"]{--cover:url("art-v2/covers-4.webp");--cover-position:100% 66.66666666666667%}
.game-stage{background:#f2f8fa}
.stage-bar{background:#fff;backdrop-filter:none;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}
.back-btn{border-color:var(--line);border-radius:8px;box-shadow:none;white-space:nowrap}
.stat-pill{min-width:70px;background:#e9f3f5;color:#2d606e;border-radius:7px;padding:7px 10px}
.stat-pill small{color:#587a84;font-size:10px}.stat-pill b{font:750 18px/1.5 system-ui}
.stat-pill[data-stat="得分"]{background:#e2f3ed;color:#17765e}
.stat-pill[data-stat="学段"] b{font-size:12px}
.stage-body{padding:24px 28px 40px;min-width:0}
.setup-panel{max-width:900px;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}
.rule-list{max-width:840px;margin:22px auto;gap:0;border-block:1px solid var(--line);text-align:left}
.rule-list li{padding:18px;border-radius:0;background:transparent;font-size:14px}
.rule-list li+li{border-left:1px solid var(--line)}
.rule-list b{color:#187967;font-size:12px;margin-bottom:7px}
.round-btn{border:1px solid #c6dce0;border-radius:7px;min-width:64px}
.round-btn.selected{background:#dff3eb;color:#176a57;border-color:#77b6a5;box-shadow:none}
.question-card,.reading-card,.poem-card,.order-board{border:1px solid var(--line);box-shadow:0 3px 0 #deeaee;border-radius:8px;background:#fff}
.question-card{padding:32px;margin:12px auto 24px}
.question-main{font-size:64px;line-height:1.4}
.question-main[style]{font-size:32px!important}
.question-label{color:#277d73}
.answer-btn,.truth-btn,.match-card,.token-btn{border:1px solid #c9dfe5;border-radius:8px;box-shadow:0 3px 0 #d5e5ea;background:#fff;overflow-wrap:anywhere}
.answer-btn{font-size:24px;line-height:1.5;min-height:80px}
.answer-btn:hover{background:#f4fbfd;transform:none}
.answer-btn.correct,.truth-btn.correct{background:#e0f4e8;border-color:#62ae85;box-shadow:0 3px 0 #83bc9a}
.answer-btn.wrong,.truth-btn.wrong{background:#ffede8;border-color:#d58478;box-shadow:0 3px 0 #dc9a8c;animation:none}
.match-card.selected{background:#e2f4fa;border-color:#75afc3}
.match-card.done{background:#e3f4eb;opacity:.85}
.match-center{color:#2a8777;font-size:27px}
.speak-btn,.soft-btn{border-radius:7px}
.progress-track{height:8px;border:0;background:#dcebec}.progress-track span{background:#22a081}
.feedback-line{color:#2c7566;font-size:16px;line-height:1.6;margin:18px 0;overflow-wrap:anywhere}
.reading-card h3,.poem-card strong{font-family:"STKaiti","KaiTi","Songti SC",serif}
.poem-card strong{font-size:36px;line-height:1.6;overflow-wrap:anywhere}
.hotseat-card{border:1px solid var(--line);border-radius:8px;background:#e4f4f7;box-shadow:0 3px 0 #ccdee5;color:var(--ink)}
.hotseat-card strong{font-size:56px}.hotseat-card p,.hotseat-card small{color:#4d6d76}
.result-card{max-width:650px;margin:20px auto;padding:20px;border:0;border-radius:0;background:transparent;box-shadow:none}
.result-emoji{font-size:0;width:280px;aspect-ratio:2;margin:0 auto 20px;background:url("art-v2/covers-4.webp") 0 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:#198570}
.modal::backdrop{background:#203e4677;backdrop-filter:none}.modal-card{border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);background:#fff}
.modal-head h2{font:750 26px/1.4 "PingFang SC","Microsoft YaHei",sans-serif}
.summary-tile{background:#f1f8f9;border-radius:7px}
.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;border:0;border-radius:8px;background-color:transparent}
.access-brand{border-color:var(--line)}.access-form h1,.access-checking h1{font-size:28px}
.access-form input{border-radius:7px;letter-spacing:0;text-transform:uppercase}
.access-help{border-radius:7px;background:#edf7f4}
.classroom-trial-banner{border-radius:8px;box-shadow:none}
@media(min-width:1600px){.game-section{max-width:1440px}.game-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.hero-copy{max-width:1440px}}
@media(max-width:1050px){.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.section-heading{align-items:flex-start;flex-direction:column;gap:15px}.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{display:block;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}.stage-picker{margin-right:auto;flex:1}.stage-picker span{display:block}.stage-picker select{max-width:none;width:100%}
 .hero,.hero-copy{min-height:244px}
 .hero-copy{padding:26px 20px}.hero h1{font-size:33px;max-width:70%}
 .hero-note{font-size:14px;margin:10px 0 24px;max-width:68%}
 .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{margin-bottom:18px}.section-heading h2{font-size:23px}
 .filter-row{gap:6px}.filter-chip{font-size:12px;padding:8px 10px}
 .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{font-size:11px;white-space:normal;overflow:visible}
 .stage-title span{display:none}
 .stage-stats{grid-column:2;grid-row:1}.stage-stats .stat-pill:nth-child(n){display:block;min-width:53px;padding:4px 7px}.stat-pill b{font-size:14px}
 .stage-stats .stat-pill[data-stat="学段"]{display:none}
 .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}
 .rule-list{grid-template-columns:1fr;margin:18px 0}
 .rule-list li{padding:12px 2px}.rule-list li+li{border-left:0;border-top:1px solid var(--line)}
 .setup-panel #launchGameBtn{position:static;width:100%;min-height:48px;margin-top:4px;border:0;box-shadow:0 3px 0 #116454;font-size:16px}
 .question-card{padding:23px 18px;margin:0 auto 18px}
 .question-main{font-size:48px}.question-main[style]{font-size:24px!important}
 .poem-card strong{font-size:27px}.hotseat-card strong{font-size:38px}
 .answers{gap:11px;grid-template-columns:1fr}.answer-btn{font-size:20px;min-height:65px;padding:13px}
 .true-false{grid-template-columns:1fr 1fr;gap:12px}.truth-btn{font-size:20px;min-height:85px}
 .match-board{grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:6px}
 .match-center{font-size:17px}.match-card{font-size:15px;line-height:1.5}
 .order-board{padding:18px 12px}.token-btn{font-size:19px}.order-line{font-size:20px}
 .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{width:100%;max-height:90vh}
}
@media(max-width:360px){.game-section{padding-inline:12px}.game-grid{gap:9px}.game-card h3{font-size:15px}.hero-copy{padding-inline:16px}.hero-note{font-size:13px}.game-card p{font-size:11px}.stage-bar{padding-inline:9px}.back-btn{font-size:11px;padding:8px}.stat-pill b{font-size:13px}}
@media(hover:none),(pointer:coarse){.game-card: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}}