/* Hanzi clarity pass: one primary action, grouped entry points, distinct workspaces. */
:root{--ink:#14213a;--muted:#647086;--line:#e0e7f1;--accent:#0b5aff;--accent-dark:#0848d6;--accent-soft:#edf3ff;--surface:#f5f7fb;--radius:20px}
html,body,.app-shell,.layout-main,.main-content{background:#fff}body{color:var(--ink);font-size:14px}.layout-main{min-width:0}.main-content{max-width:1280px;padding:32px clamp(24px,3.5vw,48px) 64px;min-width:0}.main-content> :first-child{margin-top:0}.sidebar{background:#f7f9fc;border-right:1px solid #e4eaf3;width:224px;flex-basis:224px;padding-top:29px}.brand{margin-bottom:46px}.brand-symbol{width:46px;height:46px;flex-shrink:0;box-shadow:0 4px 12px #0b5aff18}.brand-name{font-size:23px;letter-spacing:1.2px}.brand-name small{font-size:9px;letter-spacing:.4px}.nav-caption{font-size:9px;color:#7a879c;letter-spacing:1.8px;margin-bottom:12px}.nav-items{gap:8px}.nav-link{min-height:55px;border-radius:12px;padding:10px 14px;font-size:13px;line-height:1.5;text-align:left;color:#59677c;position:relative}.nav-link.active{background:#e8efff;color:#0b5aff;font-weight:750;box-shadow:inset 3px 0 #0b5aff}.nav-link:hover{background:#edf2fa}.nav-link>span:first-child{flex-shrink:0}.small-quote{background:#fff;border:1px solid #e3e9f3;border-radius:14px;padding:15px}.sidebar-foot{font-size:9px}.topbar{height:68px;padding:0 clamp(24px,3.5vw,48px);border-color:#e8edf5;background:#fff}.topbar-intro{gap:13px;font-size:12px;font-weight:550;color:#68758a}.topbar-brand{font-weight:850;letter-spacing:2px;font-size:12px;color:#17233a}.topbar-separator{color:#bec8d8}.interface-language{font-size:9px;font-weight:700;letter-spacing:1px;color:#7a879b;white-space:nowrap}.interface-language span{margin:0 7px;color:#b3bfd2}.footer{background:#fff;border-color:#e8edf5;padding:24px 48px;line-height:1.8;color:#8390a3}.footer a{color:#52627c;text-decoration:underline;text-underline-offset:3px}.layout-icon{width:25px;height:25px;display:block;flex-shrink:0}.button-primary,.outline-button,.button-secondary{border-radius:10px;min-height:44px;font-size:13px;font-weight:700;padding:11px 18px}.button-primary:hover{transform:none;box-shadow:0 4px 12px #0b5aff1a}.outline-button{border-color:#d8e0ec;background:#fff;color:#33435c}.text-button{font-size:12px;font-weight:650}.page-head{margin-bottom:28px;padding-bottom:23px;border-bottom:1px solid #e6ebf3}.page-title{font-size:clamp(28px,3vw,37px);line-height:1.25;letter-spacing:-.8px;color:#15213a}.eyebrow{font-size:9px;letter-spacing:1.7px;color:#0b5aff;font-weight:750;line-height:1.6;margin-bottom:9px}.page-desc{font-size:14px;line-height:1.8;color:#68758a;max-width:640px}.back-btn{font-size:12px;margin-bottom:20px}.page-head p:empty{display:none}
/* Homepage: writing is primary, exploration is secondary, the library is a workspace. */
.learning-hero{display:grid;grid-template-columns:minmax(0,1fr) 255px;gap:30px;align-items:center;padding:38px 42px;background:#0b5aff;border-radius:23px;position:relative;overflow:hidden;min-height:334px}.learning-hero-copy{position:relative;z-index:1;min-width:0}.learning-hero .eyebrow{color:#c5d9ff;letter-spacing:2px;font-size:10px}.learning-hero h1{font-size:clamp(31px,3.2vw,44px);line-height:1.2;letter-spacing:-1.3px;color:#fff;margin:14px 0 16px;font-weight:780}.learning-hero h1 span{color:#e1eaff}.learning-hero-copy>p{font-size:13px;line-height:1.85;color:#d8e5ff;max-width:405px;margin:0 0 24px}.learning-hero-actions{display:flex;align-items:center;gap:23px;flex-wrap:wrap}.learning-hero-actions .button-primary{background:#fff;border:1px solid #fff;color:#0848d6;padding:13px 20px;min-height:47px;box-shadow:0 6px 16px #00298b22;gap:18px}.learning-hero-actions .button-primary:hover{background:#edf3ff;border-color:#edf3ff}.hero-library-link{font-size:12px;font-weight:650;color:#fff;display:inline-flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #79a5ff}.learning-hero-meta{display:flex;gap:18px;margin-top:28px;font-size:10px;color:#c5d9ff;flex-wrap:wrap;line-height:1.6}.learning-hero-meta span+span{position:relative}.learning-hero-meta span+span:before{content:'';position:absolute;width:3px;height:3px;border-radius:50%;background:#9cbeff;left:-11px;top:.65em}.learning-hero-art{position:relative;display:flex;align-items:center;justify-content:center;padding:5px 0 25px;min-width:0}.learning-hero-art:before{content:'';position:absolute;width:270px;height:270px;border-radius:50%;border:1px solid #ffffff20;transform:translate(7px,0)}.hero-character-paper{position:relative;z-index:1;background:#fff;border-radius:15px;width:206px;padding:17px 21px 16px;box-shadow:10px 12px 0 #ffffff14;transform:rotate(5deg)}.hero-paper-label{font-size:8px;letter-spacing:1.6px;color:#8391a8;font-weight:750;margin-bottom:11px}.hero-character-grid{height:150px;display:grid;place-items:center;position:relative;border:1px solid #dbe6fa;background:linear-gradient(to right,transparent calc(50% - .5px),#e4ecfb 50%,transparent calc(50% + .5px)),linear-gradient(to bottom,transparent calc(50% - .5px),#e4ecfb 50%,transparent calc(50% + .5px));border-radius:5px}.hero-character-grid:before,.hero-character-grid:after{content:'';position:absolute;top:50%;left:-20%;right:-20%;border-top:1px dashed #e0e8f7;transform:rotate(43deg);pointer-events:none}.hero-character-grid:after{transform:rotate(-43deg)}.hero-character-grid{overflow:hidden}.hero-character-grid span{font:400 112px/1 QilinHanzi,sans-serif;color:#0b5aff;z-index:1}.hero-paper-caption{display:flex;gap:7px;justify-content:space-between;font-size:11px;margin-top:12px;line-height:1.5;align-items:center;color:#8490a4}.hero-paper-caption strong{color:#14213a;font-weight:700;font-size:15px}.hero-art-note{font-size:10px;position:absolute;bottom:0;right:15px;color:#d5e3ff;letter-spacing:1px}.layout-section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 20px}.layout-section-heading .eyebrow{font-size:8px;margin-bottom:5px;letter-spacing:1.6px}.layout-section-heading h2{font-size:23px;font-weight:750;letter-spacing:-.5px;line-height:1.35;margin:0;color:#17233a}.layout-section-heading p{font-size:12px;color:#778298;line-height:1.7;margin:6px 0 0}.section-caption{font-size:10px;color:#8a95a7;line-height:1.7;text-align:right}.home-paths{margin:34px 0 22px}.home-path-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.home-path-card,.home-path-card.adventure-home{display:flex;flex-direction:column;align-items:flex-start;position:relative;gap:0;margin:0;padding:22px;background:#f5f8ff;border:1px solid #e2eaf9;border-radius:16px;min-width:0;overflow:hidden;transition:border-color .16s,background .16s;box-shadow:none}.home-path-card:hover{background:#edf3ff;border-color:#aec8ff}.home-path-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#fff;color:#0b5aff;border:1px solid #e1eaff;margin-bottom:20px}.home-path-meta{font-size:8px;letter-spacing:1px;color:#7a8aa4;font-weight:700;line-height:1.7}.home-path-card h3{font-size:18px;letter-spacing:-.3px;line-height:1.4;margin:7px 0 9px;color:#19263d}.home-path-card p,.home-path-card.adventure-home p{font-size:12px;line-height:1.8;color:#6c7a90;margin:0 0 20px;max-width:220px}.home-path-bottom{border-top:1px solid #e1e9f8;padding-top:14px;margin-top:auto;font-size:11px;font-weight:650;color:#0b5aff;display:flex;justify-content:space-between;width:100%;align-items:center}.home-path-bottom b{font-size:17px;font-weight:400}.home-tools{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:36px}.home-tool,.home-tool.placement-home{display:flex;align-items:center;justify-content:flex-start;gap:14px;padding:19px 21px;border:1px solid #e4e9f1;border-radius:14px;background:white;text-align:left;margin:0;min-width:0;box-shadow:none;color:inherit;width:100%;font-family:inherit}.home-tool:hover{border-color:#b7cdf5;background:#fcfdff}.home-tool-icon{color:#7b92b8;flex-shrink:0}.home-tool-icon .layout-icon{width:23px;height:23px}.home-tool h2,.home-tool strong{font-size:14px;font-weight:700;letter-spacing:0;line-height:1.6;margin:0;color:#25344d;display:block}.home-tool p,.home-tool-copy>span{font-size:11px;color:#7b879a;line-height:1.7;margin:4px 0 0;display:block}.home-tool small,.home-tool.placement-home small{display:block;font-size:9px;color:#8b96a7;line-height:1.7;margin-top:3px}.home-tool-arrow{margin-left:auto;color:#8096bb;font-size:18px;flex-shrink:0}.home-unfinished{margin:20px 0;padding:16px 20px;background:#f7faff;border-color:#ccddfc;font-size:12px}.home-unfinished strong{font-size:12px}.character-library{padding:27px;background:#f5f7fb;border:1px solid #e9edf5;border-radius:22px;scroll-margin-top:24px}.library-total{font-size:18px;font-weight:750;color:#0b5aff;white-space:nowrap}.library-total>span{display:block;color:#8590a3;font-size:10px;font-weight:500;margin-top:5px;text-align:right}.library-search-panel{padding:18px;background:#fff;border:1px solid #e3e9f3;border-radius:14px;margin-bottom:20px}.library-search-panel .simple-search{max-width:none;margin:0 0 17px;background:#f8fafd;border-color:#e3e9f3;padding:3px 13px;border-radius:9px;min-width:0}.library-search-panel .simple-search>span{font-size:24px;color:#8192ae}.library-search-panel .simple-search input{height:39px;font-size:12px}.library-search-panel .character-filters{padding:0;background:transparent;border:0;margin:0;gap:12px}.library-search-panel .character-filters label{font-size:10px;color:#7a879c;gap:6px}.library-search-panel .character-filters select{font-size:11px;min-height:39px;border:1px solid #dfe6f1;border-radius:8px;background:#fff;padding:8px 10px}.library-search-panel .character-results-meta{margin:14px 0 0;align-items:center;font-size:10px;border-top:1px solid #eef1f7;padding-top:12px;gap:12px}.character-results-meta>span{font-size:9px;color:#98a2b3}.character-results-meta p{margin:0;color:#6c7b92}.library-search-panel .text-button{font-size:10px;min-height:39px;padding:8px 0}.character-library .lesson-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.character-library .lesson-card{min-height:215px;padding:19px;background:#fff;border:1px solid #e1e7f1;border-radius:13px;box-shadow:0 2px 3px #14213a02;transform:none}.character-library .lesson-card:hover{border-color:#90b4ff;box-shadow:0 6px 16px #0b5aff08;transform:none}.character-library .lesson-card .tiny-label{font-size:8px;color:#9aa5b7;letter-spacing:1px}.character-library .lesson-card .lesson-icon{opacity:.8}.character-library .lesson-card .lesson-characters{display:block;font-family:QilinHanzi,sans-serif;font-size:39px;line-height:1.35;letter-spacing:1px;margin:15px 0 12px;color:#1c2d4c}.character-library .lesson-card h2{font-size:14px;font-weight:700;line-height:1.5;letter-spacing:0;margin:0 0 7px}.character-library .lesson-card p{font-size:11px;color:#7d899e;line-height:1.7;margin:0}.character-library .lesson-bottom{font-size:10px;color:#0b5aff;padding-top:17px;border-top:1px solid #f0f3f8;margin-top:16px}.character-empty{background:#fff;border-radius:13px}
/* Writing workspace. */
.main-content[data-view="group"] .page-head{padding-bottom:15px;margin-bottom:0}.group-tools{padding:15px 0;margin:0;border-bottom:1px solid #e8edf5}.group-character{width:67px;min-height:77px;background:#fff;border-color:#dce4f1;border-radius:12px}.group-character.active{background:#eaf1ff;box-shadow:none;border:2px solid #0b5aff}.group-character.active strong{color:#0b5aff}.group-character span{font-size:11px}.word-intro{padding:19px 23px;margin:20px 0 22px;background:#f2f6ff;border:1px solid #e2eafb;border-radius:15px;gap:19px}.word-intro>strong{color:#0b5aff;font-size:60px}.word-intro h2{font-size:22px;color:#20314d}.word-intro>div>span{font-size:16px;color:#7988a2}.word-intro .study-audio button{background:white;border-color:#d7e3fa}.practice-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:20px}.practice-layout .detail-left{border:1px solid #c5d8ff;border-top:3px solid #0b5aff;border-radius:17px;background:#fff;padding:24px}.practice-layout .detail-right{background:#f6f8fc;border-color:#e4eaf4;border-radius:17px;padding:23px}.detail-heading h2{font-size:18px}.writer-controls{padding:5px;border:1px solid #e3e9f4;background:#f5f7fb;border-radius:12px;gap:4px}.writer-controls .writer-mode{border:0;background:transparent;font-size:12px;min-height:41px;border-radius:8px;padding:9px 5px;color:#697890}.writer-controls .writer-mode[aria-pressed="true"]{background:#0b5aff;color:white;box-shadow:0 2px 7px #0b5aff20}.writer-info{font-size:12px;color:#718099;background:transparent;padding:8px 3px;margin:8px 0}.writer-area{border:1px solid #cddaf0;border-radius:9px;background-color:#fff}.writing-summary{border-top:1px solid #edf1f8;padding-top:12px}.writing-summary p{color:#8591a5;font-size:10px}.memory-details>summary{font-size:13px;color:#526580}.practice-layout .visual-mnemonic{border:0;background:#fff;border-radius:13px;padding:15px}.visual-mnemonic .tiny-label{font-size:8px;line-height:1.6;color:#92a0b5}.practice-layout .example-row{background:#fff;padding:16px;border:1px solid #e8edf6;border-radius:13px;margin-top:18px}.practice-layout .example-row strong{font-size:25px}.practice-layout .note-box{background:transparent;border:0;padding:0;font-size:12px;line-height:1.8;color:#7a879c}.practice-layout .nextprev a{font-size:11px;background:#fff;min-height:40px;padding:9px 10px}.group-footer{border-top:1px solid #e9eef5;margin-top:22px;padding-top:22px}.group-footer p{font-size:11px;color:#8390a4}.group-footer .outline-button{font-size:11px}.character-sentence{background:#f6f8fc;border-color:#e4eaf4;border-radius:17px;padding:24px}.character-sentence h2{font-size:19px}.character-example-zh mark{color:#0b5aff;background:#e3edff}.adventure-return{border-left:4px solid #0b5aff;border-radius:12px}
/* Reading: level selection, article cards, then a distinct reader surface. */
.reading-filters{padding:7px;gap:5px;margin:22px 0;background:#f1f5fc;border:1px solid #e4ebf6;border-radius:12px;width:max-content;max-width:100%}.reading-filter{padding:10px 20px;border:0;background:transparent;color:#79879c;border-radius:8px;font-size:12px;min-height:40px}.reading-filter.active{background:#0b5aff;color:#fff;box-shadow:0 3px 8px #0b5aff15}.reading-grid{gap:17px}.reading-card{padding:23px;border-radius:15px;border-color:#e2e8f3;min-height:245px;background:linear-gradient(#f5f8ff 0 76px,#fff 76px);box-shadow:0 3px 6px #14213a02}.reading-card-top{margin-bottom:24px;min-height:30px}.reading-card h2{font-size:26px;color:#203451}.reading-card p{font-size:13px;color:#7c899f}.reading-card-icon .scene-svg{width:62px;height:39px}.reading-level{background:white;border:1px solid #d9e6ff;color:#0b5aff;font-size:9px;padding:5px 8px}.reading-card-bottom{border-top:1px solid #edf1f7;font-size:10px;padding-top:16px}.reading-about{padding:18px 20px;background:#f8fafd;border-radius:12px;border:1px solid #edf1f6;font-size:11px}.reader-heading{margin:8px 0 24px;padding:24px 27px;background:#f1f6ff;border:1px solid #e3ebfb;border-radius:18px}.reader-title{font-size:34px;color:#1c304e}.reader-subtitle{font-size:13px;color:#71829a}.reader-paper{border-color:#dbe5f5;border-radius:17px;box-shadow:0 4px 18px #14213a04}.reader-toolbar{background:#f7f9fd;padding:20px 23px 12px}.reader-toggles{background:#f7f9fd;padding:3px 23px 16px}.reader-progress{background:#f7f9fd;padding:0 23px 15px}.reader-speed-label select{border-color:#dde5f3;border-radius:8px}.reader-sentences{border-color:#dde7f5}.reader-sentence{padding:26px 25px;border-bottom-color:#edf1f7}.reading-text{color:#172d4b;font-size:26px}.reading-translation{color:#7d8aa1;font-size:13px;margin-top:13px}.reader-guide{background:#edf3ff;border-color:#dfe9fb;border-radius:15px;padding:23px 20px}.reader-guide h2{color:#23446f}.reader-guide p{color:#74839c}.reader-guide small{border-color:#d7e3f9}.reader-next a{font-size:15px;background:#fff;border-color:#dfe7f4}.reader-sentence.is-speaking{background:#eaf1ff}
/* Games and tests share a clear play surface; choices stay white for contrast. */
.games-intro{padding:30px 33px;background:#102c5a;color:#fff;border-radius:21px;border:0;margin-bottom:0}.games-intro .page-title{color:#fff;font-size:36px}.games-intro .eyebrow{color:#9cbfff}.games-intro .page-desc{color:#b6cae9;font-size:13px}.game-controller{color:#79a7ff;width:125px;opacity:.9}.main-content[data-view="games"]>.game-stat-row{background:#f2f6ff;border-color:#e0e9fa;margin:14px 0 28px;padding:16px 23px;gap:14px 30px;font-size:11px}.game-stat-row strong{font-size:20px}.game-catalog{gap:18px}.game-card{background:#f7f9fd;border-color:#e2e9f5;border-radius:17px;padding:25px}.game-card-symbol{background:#e8f0ff;color:#0b5aff;width:59px;height:59px;border-radius:14px;margin:20px 0 17px}.game-card-number{font-size:9px;color:#8493aa;letter-spacing:1px}.game-card h2{font-size:21px;color:#23334c}.game-card p{font-size:13px;color:#78869c;max-width:330px}.game-card-foot{font-size:11px;border-top:1px solid #e1e8f4;padding-top:16px}.game-setup,.game-round,.game-result,.game-paused,.placement-intro,.placement-question,.placement-result,.placement-paused{border:1px solid #dce5f3;border-top:3px solid #0b5aff;border-radius:18px;padding:30px;box-shadow:0 7px 30px #17376406}.game-setup h2{font-size:22px}.game-rules{padding:17px 19px;background:#f4f7fc;border-radius:11px;font-size:12px}.game-field{font-size:12px;color:#526680}.game-check{font-size:13px;color:#64738b}.game-round-head,.placement-top{font-size:11px;color:#7b8aa0;padding-bottom:4px}.game-round h2,.placement-question h1{font-size:23px;letter-spacing:-.4px;color:#253854}.game-choice,.placement-option{border-color:#dbe5f5;background:#fff;border-radius:12px}.game-picture{background:#f1f6ff}.game-meter,.placement-track{height:5px}.placement-intro>.page-title{font-size:31px}.placement-tags span{font-size:11px;background:#eef3fc;border-radius:6px;color:#58729a}.placement-notice{background:#f6f8fc;border-color:#e5eaf3;color:#7b879a;font-size:11px}.placement-notice strong{color:#465c7c;font-size:13px}.placement-recommendation{background:#edf3ff;border-color:#dbe7fd}.placement-review{background:#f8fafd;border-color:#e5ebf5}.placement-stimulus.is-character{color:#0b5aff}.placement-resume{background:#f1f6ff}
/* Journey and records use the same section hierarchy. */
.adventure-heading{padding-bottom:23px;border-bottom:1px solid #e5ebf5}.adventure-guide{width:110px}.adventure-map-progress{border:1px solid #dce8fc;background:#edf3ff;font-size:13px}.adventure-map-progress strong{font-weight:650}.adventure-save-note{font-size:11px;color:#8390a5}.adventure-place{border-radius:18px;padding:23px 26px;box-shadow:none}.adventure-place.is-open{border:1px solid #99baff;background:#f6f9ff;box-shadow:0 4px 18px #0b5aff06}.adventure-place.is-locked{background:#f8fafd;border-color:#e7ecf5}.adventure-place-art{width:155px}.adventure-place h2{font-size:23px}.adventure-place p{font-size:12px}.adventure-place .eyebrow{font-size:8px}.adventure-place .adventure-zh-title{font-size:17px}.adventure-steps{padding:6px;background:#f4f7fc;border-radius:13px;gap:5px;border:1px solid #e3eaf5}.adventure-steps a{background:transparent;border:0;font-size:12px;border-radius:8px;min-height:43px;padding:11px 6px}.adventure-steps a[aria-disabled]{background:transparent;color:#9aa7ba}.adventure-panel{border-color:#dce6f5;border-radius:17px;padding:28px}.adventure-panel h2{font-size:24px}.adventure-panel>p{font-size:13px;color:#7b879c}.adventure-word{background:#f6f9ff;border-color:#e2eafb}.adventure-phrases{padding:0 18px;border:1px solid #e6ecf6;background:#f9fbfe;border-radius:12px}.adventure-phrases>div:last-child{border:0}.adventure-return strong{font-size:13px}.adventure-station-head .page-title{font-size:34px}.main-content[data-view="progress"]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-content:start;align-items:start}.main-content[data-view="progress"]>.page-head,.main-content[data-view="progress"]>.stats,.main-content[data-view="progress"]>.continue-row,.main-content[data-view="progress"]>.backup-panel,.main-content[data-view="progress"]>.reader-local-note,.main-content[data-view="progress"]>.note-box,.main-content[data-view="progress"]>.progress-panel:has(.record-table){grid-column:1/-1}.main-content[data-view="progress"]>.page-head{margin:0}.main-content[data-view="progress"]>.continue-row{margin:0;background:#edf3ff;border-color:#dce7fb;padding:17px 22px;font-size:12px}.main-content[data-view="progress"]>.stats{margin:0;gap:14px}.stats .stat{background:#f3f6fc;border:1px solid #e2e9f5;border-radius:14px;text-align:left;min-height:100px;padding:21px 23px}.stats .stat h3{color:#0b5aff;font-size:28px;font-weight:750;letter-spacing:-1px}.stats .stat p{font-size:11px;color:#7a8ba3;margin:8px 0 0}.main-content[data-view="progress"]>.progress-panel{margin:0;padding:24px;border-radius:16px;border-color:#dfe7f4;min-width:0;background:#fff}.main-content[data-view="progress"]>.progress-panel>h2,.main-content[data-view="progress"]>.progress-panel>div:first-child>h2{font-size:18px;margin-bottom:18px;color:#20334f}.main-content[data-view="progress"]>.progress-panel>p{font-size:12px;line-height:1.8;color:#8090a7}.reader-local-note{font-size:11px;margin:0}.record-table{border-radius:10px;border:1px solid #edf1f7;overflow:auto}.record-table th{background:#f3f6fc;color:#70829d;font-size:11px;font-weight:650}.record-table td{border-color:#edf1f7;font-size:13px}.record-table td a{font-size:15px;color:#0b5aff}.backup-panel{background:#f7f9fd;border-color:#e3e9f3;border-radius:13px;font-size:12px;margin:0}.backup-panel summary{color:#637590}.reader-saved-card{background:#f6f9fe;border-color:#e2e9f7}.reader-saved-list,.reader-saved-grid{min-width:0}.reader-saved-meaning{font-size:14px}.group-record{border-color:#edf1f7;font-size:13px}.group-record strong{color:#0b5aff}.placement-record-row{border-color:#edf1f7}.adventure-record-stamps a{font-size:10px}.main-content[data-view="practice"] .quiz-card{border-top:3px solid #0b5aff;background:#fff;border-radius:18px;box-shadow:0 4px 20px #17376405}.main-content[data-view="practice"] .quiz-symbol{color:#0b5aff}.worksheet-selection,.worksheet-preview{background:#f3f7ff}.worksheet-filters{background:#f8fafd;padding:15px;border-radius:12px}
/* Tablet and mobile keep the primary action first and secondary tools compact. */
@media(max-width:1100px){.learning-hero{padding:32px;grid-template-columns:minmax(0,1fr) 205px;gap:15px}.learning-hero h1{font-size:36px}.hero-character-paper{width:174px;padding:15px}.hero-character-grid{height:137px}.hero-character-grid span{font-size:100px}.learning-hero-art:before{height:225px;width:225px}.learning-hero-actions{gap:17px}.learning-hero-actions .button-primary{font-size:12px;padding:12px 15px}.home-path-card,.home-path-card.adventure-home{padding:20px}.home-path-card h3{font-size:17px}.section-caption{max-width:160px}.practice-layout{grid-template-columns:1fr}.reader-layout{grid-template-columns:1fr}.reader-guide{display:none}.character-library .lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.main-content[data-view="progress"]{grid-template-columns:1fr}.main-content[data-view="progress"]>*{grid-column:1}.home-tool,.home-tool.placement-home{padding:17px;gap:11px}.adventure-place-art{width:135px}}
@media(min-width:651px) and (max-width:900px){.sidebar{width:78px;flex-basis:78px;padding:26px 10px}.brand{margin:0 auto 40px}.nav-link{padding:10px;justify-content:center}.nav-link>span:first-child{font-size:22px;width:auto}.nav-link.active{box-shadow:inset 0 -3px #0b5aff}.main-content{padding:27px}.topbar{padding:0 27px}.learning-hero{grid-template-columns:minmax(0,1fr) 175px;padding:28px}.learning-hero h1{font-size:31px}.hero-character-paper{width:155px}.hero-character-grid{height:120px}.hero-character-grid span{font-size:89px}.hero-paper-label{font-size:6px}.learning-hero-meta{gap:14px;font-size:9px}.home-path-grid{gap:10px}.home-path-card,.home-path-card.adventure-home{padding:17px}.home-path-card h3{font-size:16px}.home-path-card p,.home-path-card.adventure-home p{font-size:11px}.home-path-meta{font-size:7px}.home-tool-icon{display:none}.home-tool h2,.home-tool strong{font-size:13px}.character-library{padding:22px}}
@media(max-width:650px){body{font-size:14px}.sidebar{display:none}.topbar{height:57px;padding:0 18px}.topbar-intro{font-size:10px;gap:10px;min-width:0}.topbar-brand{font-size:12px;letter-spacing:1.7px}.topbar-intro #current-section{max-width:145px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.interface-language{font-size:7px;letter-spacing:.4px}.interface-language span{margin:0 3px}.main-content{padding:20px 16px 112px}.page-head{padding-bottom:20px;margin-bottom:22px}.page-title{font-size:28px}.page-desc{font-size:13px;line-height:1.8}.eyebrow{font-size:8px;letter-spacing:1.4px}.learning-hero{padding:26px 23px;display:block;border-radius:19px;min-height:0}.learning-hero h1{font-size:33px;letter-spacing:-1px;margin:11px 0 15px}.learning-hero .eyebrow{font-size:8px;letter-spacing:1.6px}.learning-hero-copy>p{font-size:12px;max-width:100%;line-height:1.9;margin-bottom:23px}.learning-hero-actions{gap:18px;justify-content:space-between}.learning-hero-actions .button-primary{font-size:12px;min-height:46px;padding:12px 17px;gap:15px}.hero-library-link{font-size:11px;gap:6px;min-height:44px}.learning-hero-meta{margin-top:24px;font-size:8px;gap:16px}.learning-hero-art{display:none}.home-paths{margin:27px 0 15px}.layout-section-heading{margin-bottom:16px;gap:12px}.layout-section-heading h2{font-size:21px}.layout-section-heading .eyebrow{font-size:7px;letter-spacing:1.3px}.section-caption{display:none}.home-path-grid{grid-template-columns:1fr;gap:9px}.home-path-card,.home-path-card.adventure-home{display:grid;grid-template-columns:42px minmax(0,1fr) 20px;gap:0 13px;padding:17px 16px;border-radius:13px;align-items:center}.home-path-icon{grid-row:1/4;grid-column:1;width:42px;height:45px;margin:0;border-radius:11px}.home-path-icon .layout-icon{width:24px;height:24px}.home-path-meta{grid-column:2;font-size:7px;letter-spacing:.8px;line-height:1.6}.home-path-card h3{grid-column:2;font-size:16px;margin:3px 0 4px}.home-path-card p,.home-path-card.adventure-home p{grid-column:2;font-size:10px;line-height:1.7;max-width:none;margin:0}.home-path-bottom{display:contents;font-size:0;color:transparent}.home-path-bottom b{grid-column:3;grid-row:1/4;font-size:19px;color:#0b5aff}.home-tools{grid-template-columns:1fr;gap:0;border:1px solid #e5ebf4;border-radius:13px;overflow:hidden;margin-bottom:27px}.home-tool,.home-tool.placement-home{padding:16px;border:0;border-bottom:1px solid #edf1f7;border-radius:0;gap:13px;background:#fff}.home-tool:last-child{border-bottom:0}.home-tool h2,.home-tool strong{font-size:13px;line-height:1.5}.home-tool p,.home-tool-copy>span{font-size:10px;margin-top:3px}.home-tool small,.home-tool.placement-home small{font-size:8px;margin-top:2px}.home-tool-icon .layout-icon{width:21px;height:21px}.home-unfinished{padding:16px;font-size:11px;gap:10px}.character-library{padding:18px 13px;border-radius:17px;scroll-margin-top:15px}.character-library .layout-section-heading{padding:0 3px;margin-bottom:16px}.character-library .layout-section-heading h2{font-size:21px}.character-library .layout-section-heading p{font-size:11px;max-width:230px;line-height:1.8}.library-total{font-size:15px}.library-total>span{font-size:9px}.library-search-panel{padding:13px;border-radius:11px;margin-bottom:14px}.library-search-panel .simple-search{padding:2px 9px;margin-bottom:14px}.library-search-panel .simple-search input{font-size:11px;height:40px}.library-search-panel .character-filters{gap:11px 9px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.library-search-panel .character-filters label{min-width:0;font-size:9px}.library-search-panel .character-filters select{width:100%;font-size:10px;padding:8px;min-height:42px}.library-search-panel .character-filters .text-button{grid-column:1/-1;min-height:34px;justify-self:start;font-size:10px;padding:4px 0}.library-search-panel .character-results-meta{display:block;font-size:10px;margin-top:11px;padding-top:11px}.character-results-meta>span{display:block;font-size:8px;line-height:1.8;margin-top:3px}.character-library .lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.character-library .lesson-card{padding:14px 12px;min-height:206px;border-radius:11px}.character-library .lesson-card .tiny-label{font-size:7px;letter-spacing:.6px}.character-library .lesson-icon{width:35px;height:27px}.character-library .lesson-icon .scene-svg{width:35px;height:27px}.character-library .lesson-card .lesson-characters{font-size:31px;letter-spacing:0;line-height:1.4;margin:13px 0 12px;overflow-wrap:anywhere}.character-library .lesson-card h2{font-size:12px;line-height:1.5;margin:0 0 6px}.character-library .lesson-card p{font-size:10px;line-height:1.8}.character-library .lesson-bottom{font-size:8px;padding-top:12px;margin-top:auto}.character-library .lesson-card p{margin-bottom:13px}.group-heading .page-head{padding-bottom:12px}.group-heading .page-title{font-size:23px}.group-tools{padding:13px 0;gap:10px}.group-character{width:53px;min-height:61px;border-radius:9px}.group-character strong{font-size:26px}.group-character span{font-size:10px}.word-intro{padding:15px 13px;margin:15px 0 17px;grid-template-columns:39px minmax(0,1fr) auto;gap:10px;border-radius:12px}.word-intro>strong{font-size:39px}.word-intro h2{font-size:16px}.word-intro>div>span{font-size:12px}.word-intro .study-audio{gap:5px;flex-wrap:nowrap}.word-intro .study-audio button{font-size:10px;min-height:40px;padding:8px}.practice-layout .detail-left{padding:16px;border-radius:14px}.practice-layout .detail-right{padding:17px;border-radius:14px}.writer-controls{padding:4px;gap:3px;margin-top:13px}.writer-controls .writer-mode{font-size:11px;min-height:42px;padding:7px 2px}.detail-heading h2{font-size:16px}.writer-info{font-size:11px;min-height:29px}.writer-area{width:min(100%,300px)}.group-footer{padding-top:18px}.group-footer .outline-button{font-size:11px}.character-sentence{padding:18px;border-radius:14px}.character-sentence h2{font-size:18px}.character-example-zh{font-size:23px}.reading-filters{width:100%;display:grid;grid-template-columns:repeat(3,1fr);padding:5px;gap:3px;margin:18px 0}.reading-filter{text-align:center;padding:10px;font-size:11px;min-height:41px}.reading-grid{grid-template-columns:1fr;gap:12px}.reading-card{padding:20px;min-height:217px;border-radius:13px;background:linear-gradient(#f5f8ff 0 70px,#fff 70px)}.reading-card h2{font-size:26px}.reading-card-top{margin-bottom:20px}.reading-card p{font-size:12px}.reading-about{padding:16px;font-size:10px}.reader-heading{padding:19px 17px;border-radius:14px;margin:7px 0 20px}.reader-title{font-size:29px}.reader-subtitle{font-size:12px}.reader-heading-icon .scene-svg{width:65px;height:58px}.reader-paper{border-radius:13px}.reader-toolbar{padding:16px 14px 11px}.reader-toggles{padding:0 14px 13px;gap:6px}.reader-progress{padding:0 14px 12px}.reader-toggles button{min-height:42px;font-size:11px;padding:8px 10px}.reader-toggles>span{font-size:8px}.reader-sentence{padding:23px 15px;gap:8px}.reading-text{font-size:25px;line-height:2.45}.reading-translation{font-size:12px;line-height:1.9;margin-top:14px}.reader-next a{font-size:14px}.games-intro{padding:26px 22px;border-radius:18px;gap:13px}.games-intro .page-title{font-size:30px}.games-intro .page-desc{font-size:12px}.game-controller{width:65px}.main-content[data-view="games"]>.game-stat-row{padding:14px 16px;gap:9px 17px;font-size:9px;margin:11px 0 20px}.game-stat-row strong{font-size:18px}.game-catalog{grid-template-columns:1fr;gap:13px}.game-card{padding:21px;border-radius:15px}.game-card h2{font-size:21px}.game-card p{font-size:12px}.game-card-symbol{width:52px;height:52px;font-size:29px;margin:17px 0 14px}.game-setup,.game-round,.game-result,.game-paused,.placement-intro,.placement-question,.placement-result,.placement-paused{padding:22px 17px;border-radius:15px;margin:18px auto}.game-rules{padding:15px;font-size:11px}.game-check{font-size:12px;line-height:1.8}.game-round h2,.placement-question h1{font-size:21px}.placement-intro>.page-title{font-size:27px}.placement-notice{padding:16px;font-size:10px}.placement-notice strong{font-size:12px}.placement-instructions{font-size:12px}.adventure-heading{padding-bottom:20px}.adventure-heading .page-title{font-size:28px}.adventure-guide{width:74px}.adventure-map-progress{font-size:12px;padding:15px;border-radius:12px;margin:20px 0 11px}.adventure-map{padding-left:33px}.adventure-place{padding:19px 14px;grid-template-columns:57px minmax(0,1fr);gap:11px;border-radius:15px}.adventure-place-art{width:60px}.adventure-place h2{font-size:19px}.adventure-place p{font-size:11px}.adventure-place .eyebrow{font-size:7px}.adventure-place .adventure-zh-title{font-size:15px}.adventure-save-note{font-size:10px;line-height:1.9}.adventure-station-head .page-title{font-size:28px}.adventure-steps{padding:5px;border-radius:11px;gap:3px}.adventure-steps a{font-size:12px;padding:9px 3px;min-height:52px}.adventure-steps a span{font-size:9px}.adventure-panel{padding:21px 16px;border-radius:14px}.adventure-panel h2{font-size:22px}.adventure-panel>p{font-size:12px;line-height:1.9}.adventure-return{padding:15px}.adventure-phrases{padding:0 13px}.main-content[data-view="progress"]{display:grid;gap:16px}.main-content[data-view="progress"]>.stats{gap:7px}.stats .stat{padding:16px 10px;min-height:97px;text-align:left;border-radius:12px}.stats .stat h3{font-size:23px}.stats .stat p{font-size:9px;line-height:1.6;margin-top:7px}.main-content[data-view="progress"]>.progress-panel{padding:20px 17px;border-radius:14px}.main-content[data-view="progress"]>.progress-panel>h2,.main-content[data-view="progress"]>.progress-panel>div:first-child>h2{font-size:18px}.main-content[data-view="progress"]>.continue-row{padding:15px;font-size:11px}.record-table th{font-size:9px}.record-table td a{font-size:14px}.backup-panel{padding:19px 17px}.mobile-nav{height:calc(72px + env(safe-area-inset-bottom));background:#fff;border-color:#e1e8f5;box-shadow:0 -5px 20px #17345c06;padding:5px 8px env(safe-area-inset-bottom);gap:2px}.mobile-nav button{border-radius:10px;flex:1;max-width:none;min-width:0;gap:5px;padding:5px 2px;color:#8b97aa;font-weight:650;position:relative}.mobile-nav button.active{background:#edf3ff;color:#0b5aff}.mobile-nav button.active:before{content:'';position:absolute;top:0;width:19px;height:2px;border-radius:2px;background:#0b5aff}.mobile-nav button>span{font-size:21px;line-height:1.1;min-height:22px;display:grid;place-items:center}.mobile-nav button>span svg{display:block;width:21px;height:21px}.mobile-nav small{font-size:8px;line-height:1.35;max-width:88px}.toast{bottom:calc(86px + env(safe-area-inset-bottom));font-size:12px}.worksheet-filters{padding:12px}}
@media(max-width:380px){.learning-hero{padding:24px 20px}.learning-hero h1{font-size:29px}.learning-hero-actions{gap:10px}.learning-hero-actions .button-primary{padding:11px 14px;font-size:11px}.hero-library-link{font-size:10px}.learning-hero-meta{font-size:7px;gap:14px}.character-library .lesson-grid{grid-template-columns:1fr}.character-library .lesson-card{min-height:0;padding:18px}.character-library .lesson-card .lesson-characters{font-size:39px}.character-library .lesson-card h2{font-size:15px}.character-library .lesson-card p{font-size:11px}.character-library .lesson-bottom{font-size:10px}.library-total{font-size:13px}.interface-language{display:none}.word-intro{padding:13px 10px;gap:8px}.word-intro .study-audio button{font-size:9px;padding:7px}.adventure-place{grid-template-columns:44px minmax(0,1fr)}.adventure-place-art{width:48px}}
@media(prefers-reduced-motion:reduce){.learning-hero *, .home-path-card{transition:none!important}}
/* Keep teaching text readable while small labels remain secondary. */
.home-path-meta{font-size:9px}.home-path-card p,.home-path-card.adventure-home p{font-size:13px}.home-tool p,.home-tool-copy>span{font-size:12px}.home-tool small,.home-tool.placement-home small{font-size:10px}.character-library .lesson-card .tiny-label{font-size:9px}.character-library .lesson-card h2{font-size:15px}.character-library .lesson-card p{font-size:12px}.character-library .lesson-bottom{font-size:11px}.character-results-meta>span{font-size:10px}.library-search-panel .character-filters label{font-size:11px}.library-search-panel .character-filters select{font-size:12px}.reading-card-bottom{font-size:11px}.reading-level{font-size:10px}.reader-guide p{font-size:12px}
@media(max-width:650px){.learning-hero-copy>p{font-size:13px}.home-path-meta{font-size:9px}.home-path-card p,.home-path-card.adventure-home p{font-size:12px}.home-tool h2,.home-tool strong{font-size:14px}.home-tool p,.home-tool-copy>span{font-size:12px}.home-tool small,.home-tool.placement-home small{font-size:10px}.character-library .lesson-card .tiny-label{font-size:8px}.character-library .lesson-card h2{font-size:13px}.character-library .lesson-card p{font-size:11px}.character-library .lesson-bottom{font-size:10px}.library-search-panel .character-filters label{font-size:10px}.library-search-panel .character-filters select{font-size:11px}.character-results-meta>span{font-size:9px}.main-content[data-view="progress"]>.progress-panel>p{font-size:12px}.adventure-save-note{font-size:11px}.adventure-place p{font-size:12px}.adventure-place .eyebrow{font-size:8px}.hero-paper-caption span{max-width:98px;text-align:right}}
/* Status messages should not consume empty cells in the records grid. */
.main-content[data-view="progress"]>.reader-status{grid-column:1/-1;margin:0;padding:0}.main-content[data-view="progress"]>.reader-status:empty{display:none}.main-content[data-view="progress"] #reader-saved-list{grid-template-columns:1fr}
@media(max-width:650px){.learning-hero{padding:25px 22px}.learning-hero h1{font-size:30px;line-height:1.23}.learning-hero-copy>p{margin-bottom:20px}.learning-hero-actions{gap:10px}.learning-hero-actions .button-primary{font-size:11px;padding:11px 13px;gap:11px}.hero-library-link{font-size:11px}.learning-hero-meta{margin-top:21px}.home-path-label{display:none}.home-path-bottom b{grid-row:1/4}.home-path-card,.home-path-card.adventure-home{grid-template-rows:auto auto auto}}
@media(max-width:380px){.learning-hero{padding:24px 19px}.learning-hero h1{font-size:28px}.hero-library-link{font-size:10px}}
/* Text contrast: explanations and meanings stay readable on pale surfaces. */
.home-path-card p,.home-path-card.adventure-home p,.home-tool p,.home-tool-copy>span,.home-tool small,.home-tool.placement-home small,.character-library .lesson-card p,.reading-card p,.reading-translation,.reader-guide p,.adventure-save-note,.library-search-panel .character-filters label,.character-results-meta>span,.main-content[data-view="progress"]>.progress-panel>p{color:#647086}.home-path-meta,.game-card-number,.reading-card-bottom,.writer-info,.stats .stat p{color:#647086}
@media(max-width:650px){.mobile-nav small{font-size:9px}.mobile-nav button{color:#69798f}}

/* HSK character reference, kept behind a concise explanation. */
.hsk-filter-info{margin:12px 0 0;padding-top:11px;border-top:1px solid #eef1f7;font-size:11px;color:#647086;line-height:1.8}.hsk-filter-info summary{cursor:pointer;font-size:10px;color:#6b7b94}.hsk-filter-info p{margin:10px 0 7px;max-width:760px}.hsk-filter-info a{color:#0b5aff;text-decoration:underline;text-underline-offset:3px}.hsk-filter-info summary:focus-visible{outline:3px solid #0b5aff;outline-offset:3px}@media(max-width:650px){.hsk-filter-info{font-size:11px}.hsk-filter-info summary{font-size:10px}}
