@import"https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;600;700&family=Fredoka:wght@400;500;700&display=swap";:root{color-scheme:light;--bg-1: #f7f3e9;--bg-2: #d8efe3;--bg-radial-1: #ffc898;--bg-radial-2: #bde7d4;--ink: #1d2b2a;--ink-soft: #4f5f5d;--accent: #ef6c36;--accent-strong: #d9511f;--surface-0: #ffffff;--surface-1: rgba(255, 255, 255, .84);--surface-2: rgba(255, 255, 255, .78);--surface-3: rgba(255, 255, 255, .92);--surface-soft: rgba(255, 253, 249, .8);--card: rgba(255, 255, 255, .84);--border: rgba(29, 43, 42, .18);--success: #1e9e63;--danger: #d93d2f;--pending: #86938f;--shadow: 0 14px 40px rgba(39, 48, 46, .14)}.theme-dark{color-scheme:dark;--bg-1: #121823;--bg-2: #102328;--bg-radial-1: #2f3d5f;--bg-radial-2: #143944;--ink: #eaf3ff;--ink-soft: #b0c2db;--accent: #ff8c59;--accent-strong: #ffa97b;--surface-0: #151f31;--surface-1: rgba(21, 31, 49, .86);--surface-2: rgba(18, 27, 42, .85);--surface-3: rgba(24, 36, 57, .92);--surface-soft: rgba(24, 37, 59, .72);--card: rgba(21, 31, 49, .86);--border: rgba(178, 201, 236, .23);--success: #42c98d;--danger: #ff7d7d;--pending: #95a8c5;--shadow: 0 18px 44px rgba(7, 11, 19, .45)}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:"Baloo 2",Segoe UI,sans-serif;color:var(--ink);background:radial-gradient(circle at top right,var(--bg-radial-1) 0%,transparent 44%),radial-gradient(circle at bottom left,var(--bg-radial-2) 0%,transparent 46%),linear-gradient(165deg,var(--bg-1),var(--bg-2));min-height:100vh}a{color:inherit}.app-shell{min-height:100dvh;display:flex;flex-direction:column}.topbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;background:var(--surface-2);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}.topbar-main{display:flex;align-items:center;gap:.8rem;flex:0 0 auto}.brand{display:inline-flex;align-items:center;gap:.52rem;text-decoration:none;color:inherit;min-width:0}.brand-logo-slot{width:36px;height:36px;border-radius:10px;border:1px solid rgba(56,86,160,.26);background:var(--surface-3);display:inline-grid;place-items:center;box-shadow:0 8px 14px #4961b024;flex:0 0 auto;overflow:hidden;padding:2px}.brand-logo-img{width:100%;height:100%;display:block;border-radius:8px;object-fit:cover}.brand-copy{display:grid;line-height:1.05;min-width:0}.brand-copy strong{font-family:Fredoka,sans-serif;font-size:1.12rem;font-weight:700;white-space:nowrap}.brand-copy small{margin-top:.08rem;color:var(--ink-soft);font-size:.7rem;letter-spacing:.02em}.topbar-course{display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;min-width:0}.topbar-course-pill{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;border:1px solid var(--border);background:var(--surface-3);padding:.26rem .52rem;min-width:0;text-decoration:none}.topbar-course-pill em{font-style:normal;font-size:.75rem;color:var(--ink-soft)}.topbar-course-pill strong{font-family:Fredoka,sans-serif;font-size:.9rem;line-height:1;color:var(--ink)}.topbar-course-pill.chapter strong{max-width:min(22vw,280px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-course-link{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(20vw,260px)}.topbar-course-pill.textbook:hover{border-color:#d9511f59}.topbar-course-pill.textbook:hover .topbar-course-link{color:var(--accent-strong);text-decoration:underline;text-decoration-thickness:1px}.nav-links{display:flex;gap:.4rem}.topbar-actions{display:flex;align-items:center;gap:.55rem;min-width:0}.topbar-practice-btn{margin:0;min-width:72px;justify-content:center;color:#fff;font-weight:700}.topbar-practice-btn:hover:not(:disabled){filter:brightness(1.03);box-shadow:0 8px 16px #40528438}.topbar-practice-btn:disabled{opacity:.45;box-shadow:none}.topbar-practice-btn.paused{background:linear-gradient(180deg,#2fa86a,#1f8f57);border-color:#1f8f57}.topbar-practice-btn.running{background:linear-gradient(180deg,var(--accent),var(--accent-strong));border-color:var(--accent-strong)}.topbar-chapter-select{display:inline-flex;align-items:center;gap:.45rem;padding:.28rem .45rem;border-radius:999px;border:1px solid var(--border);background:var(--surface-3)}.topbar-chapter-select span{font-size:.78rem;color:var(--ink-soft);white-space:nowrap}.topbar-chapter-select select{min-width:180px;width:auto;padding:.28rem .5rem;border-radius:10px;background:var(--surface-0)}.nav-link{text-decoration:none;padding:.45rem .75rem;border-radius:999px;border:1px solid transparent}.nav-link.router-link-active{border-color:var(--border);background:var(--surface-3)}.nav-link-dev{border-style:dashed}.theme-toggle-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:var(--surface-3);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .12s ease,box-shadow .18s ease,border-color .12s ease}.theme-toggle-btn svg{width:18px;height:18px}.theme-toggle-btn:hover{transform:translateY(-1px);border-color:#7494d19e;box-shadow:0 8px 18px #3a4f7c38}.theme-toggle-btn:active{transform:translateY(0)}.topbar-settings-btn{margin:0;padding:.4rem .68rem;border-radius:999px;font-size:.86rem}.page-wrap{width:min(1320px,calc(100% - 1.8rem));margin:1rem auto 2rem;flex:1 1 auto;min-height:0}.page-wrap-practice{margin:.55rem auto .65rem;display:flex}.page-wrap-practice>.practice-layout{flex:1 1 auto;min-height:0}.hero-card,.panel{border:1px solid var(--border);border-radius:20px;padding:1rem;background:var(--card);box-shadow:var(--shadow)}.hero-card h1{margin:.4rem 0;font-family:Fredoka,sans-serif;font-size:clamp(1.9rem,3vw,2.5rem)}.hint-text{margin:0;color:var(--ink-soft);font-size:.92rem}.control-grid{margin-top:1rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:.9rem}.library-hero h1{margin-top:.2rem}.library-mode-panel{margin-top:1rem}.library-layout{margin-top:1rem;display:grid;gap:.9rem;grid-template-columns:minmax(260px,.88fr) minmax(0,1.35fr)}.library-filter-panel h2,.library-books-panel h2{margin:0;font-size:1.04rem}.library-filter-grid{margin-top:.7rem;display:grid;gap:.45rem}.library-filter-grid label{font-size:.88rem;color:var(--ink-soft);font-weight:700}.library-book-grid{margin-top:.65rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.55rem}.library-book-card{cursor:pointer;text-align:left;font:inherit;width:100%;border-radius:14px;border:1px solid var(--border);background:var(--surface-2);color:var(--ink);padding:.6rem .65rem;display:grid;gap:.35rem;transition:transform .12s ease,box-shadow .15s ease,border-color .12s ease}.library-book-card:hover{transform:translateY(-1px);box-shadow:0 9px 16px #40528421}.library-book-card.active{border-color:#5c76d09e;box-shadow:0 10px 18px #4a62bd33}.library-book-card.locked{opacity:.72}.library-book-title{margin:0;font-family:Fredoka,sans-serif;font-size:1.03rem}.library-book-meta{margin:0;display:flex;flex-wrap:wrap;gap:.4rem;color:var(--ink-soft);font-size:.82rem}.library-book-desc{margin:0;color:var(--ink-soft);font-size:.82rem;line-height:1.35}.library-book-state{justify-self:start;border-radius:999px;border:1px solid var(--border);background:var(--surface-3);font-size:.76rem;padding:.14rem .42rem}.library-footer-panel{margin-top:.95rem;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.9rem;align-items:end}.library-footer-main h2{margin:0;font-size:1rem}.library-chapter-list{list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.3rem}.library-chapter-list li{border:1px solid var(--border);border-radius:10px;background:var(--surface-2);padding:.35rem .5rem;display:flex;justify-content:space-between;gap:.4rem}.library-chapter-list strong{font-size:.9rem}.library-chapter-list span{color:var(--ink-soft);font-size:.82rem;text-transform:capitalize}.library-start-btn{margin-top:0;min-width:220px;align-self:end}.dev-importer-layout{display:grid;gap:.9rem}.dev-importer-hero h1{margin:0;font-family:Fredoka,sans-serif;font-size:clamp(1.35rem,2.7vw,1.85rem)}.dev-importer-warning{margin:.5rem 0 0;display:inline-flex;padding:.24rem .55rem;border-radius:999px;border:1px solid rgba(201,103,44,.35);background:#ffe1c5a3;color:#9a4e23;font-size:.82rem;font-weight:700}.dev-importer-endpoint{margin:.65rem 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.dev-importer-endpoint span{color:var(--ink-soft);font-size:.86rem}.dev-importer-endpoint code{border:1px solid var(--border);border-radius:10px;padding:.2rem .45rem;background:var(--surface-3);font-size:.82rem}.dev-importer-form-panel{display:grid;gap:.65rem}.dev-importer-field{display:grid;gap:.32rem}.dev-importer-field span{color:var(--ink-soft);font-size:.85rem;font-weight:700}.dev-importer-textarea{min-height:260px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:.85rem;line-height:1.45}.dev-importer-action-row{margin-top:.1rem}.dev-importer-btn{margin-top:0}.dev-importer-btn-write{min-width:152px}.dev-importer-result-panel h2{margin:0;font-size:1rem}.dev-importer-result-status{margin:.5rem 0 0;font-size:.9rem}.dev-importer-result-status.success{color:var(--success);font-weight:700}.dev-importer-result-status.error{color:var(--danger);font-weight:700}.dev-importer-result-log{margin:.5rem 0 0;min-height:170px;max-height:340px;overflow:auto;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);padding:.65rem;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:.82rem;line-height:1.45;white-space:pre-wrap}.dev-library-layout{display:grid;gap:.9rem}.dev-library-hero h1{margin:0;font-family:Fredoka,sans-serif;font-size:clamp(1.35rem,2.7vw,1.85rem)}.dev-library-warning{margin:.55rem 0 0;display:inline-flex;padding:.24rem .55rem;border-radius:999px;border:1px solid rgba(201,103,44,.35);background:#ffe1c5a3;color:#9a4e23;font-size:.82rem;font-weight:700}.dev-library-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;align-items:end}.dev-library-main{display:grid;grid-template-columns:minmax(260px,.95fr) minmax(0,1.2fr);gap:.8rem}.dev-library-list-panel{min-height:420px}.dev-library-batch-head{display:flex;justify-content:space-between;align-items:center;gap:.45rem}.dev-library-batch-head p{margin:0;color:var(--ink-soft);font-size:.84rem;font-weight:700}.dev-library-batch-grid{margin-top:.55rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem .55rem}.dev-library-batch-actions{margin-top:0}.dev-library-list{margin-top:.75rem;list-style:none;padding:0;display:grid;gap:.4rem}.dev-library-list-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.35rem;align-items:start}.dev-library-checkbox-inline{margin-top:.48rem}.dev-library-list-item{width:100%;text-align:left;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);color:var(--ink);padding:.5rem .6rem;display:grid;gap:.18rem;cursor:pointer;font:inherit}.dev-library-list-item strong{font-size:.95rem}.dev-library-list-item span{color:var(--ink-soft);font-size:.8rem}.dev-library-list-item.active{border-color:#5f75e899;box-shadow:0 10px 18px #4a62bd33}.dev-library-editor-panel h2{margin:0 0 .45rem;font-size:1rem}.dev-library-field{display:grid;gap:.3rem}.dev-library-field span{color:var(--ink-soft);font-size:.84rem;font-weight:700}.dev-library-checkbox{margin-top:.2rem;display:inline-flex;align-items:center;gap:.4rem}.dev-library-file-path{margin:.45rem 0 0;color:var(--ink-soft);font-size:.82rem}.dev-library-file-path code{border:1px solid var(--border);border-radius:8px;padding:.14rem .35rem;background:var(--surface-3)}.dev-library-save-btn,.dev-library-delete-btn,.dev-library-refresh-btn{margin-top:0}.dev-library-log-panel h2{margin:0;font-size:1rem}.dev-library-log{margin:.5rem 0 0;min-height:150px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);padding:.65rem;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:.82rem;line-height:1.45;white-space:pre-wrap}.dev-grade-rules-layout{display:grid;gap:.9rem}.dev-grade-rules-hero h1{margin:0;font-family:Fredoka,sans-serif;font-size:clamp(1.35rem,2.7vw,1.85rem)}.dev-grade-rules-warning{margin:.55rem 0 0;display:inline-flex;padding:.24rem .55rem;border-radius:999px;border:1px solid rgba(201,103,44,.35);background:#ffe1c5a3;color:#9a4e23;font-size:.82rem;font-weight:700}.dev-grade-rules-endpoint{margin:.65rem 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.dev-grade-rules-endpoint span{color:var(--ink-soft);font-size:.86rem}.dev-grade-rules-endpoint code{border:1px solid var(--border);border-radius:10px;padding:.2rem .45rem;background:var(--surface-3);font-size:.82rem}.dev-grade-rules-control-grid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(0,1.8fr);gap:.6rem;align-items:end}.dev-grade-rules-action-row{margin-top:0}.dev-grade-rules-field{display:grid;gap:.32rem}.dev-grade-rules-field span{color:var(--ink-soft);font-size:.84rem;font-weight:700}.dev-grade-rules-summary{margin-top:.5rem}.dev-grade-rules-main{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(240px,1fr);gap:.8rem}.dev-grade-rules-editor h2,.dev-grade-rules-preview h2,.dev-grade-rules-log-panel h2{margin:0;font-size:1rem}.dev-grade-rules-list{margin-top:.6rem;display:grid;gap:.55rem}.dev-grade-rules-item{border:1px solid var(--border);border-radius:12px;background:var(--surface-2);padding:.55rem;display:grid;gap:.45rem}.dev-grade-rules-item .danger-btn{margin-top:0;justify-self:start}.dev-grade-rules-preview-list{margin:.6rem 0 0;list-style:none;padding:0;display:grid;gap:.48rem}.dev-grade-rules-preview-list li{border:1px solid var(--border);border-radius:10px;background:var(--surface-2);padding:.45rem .55rem;display:grid;gap:.15rem}.dev-grade-rules-preview-list strong{font-family:Fredoka,sans-serif;font-size:.95rem}.dev-grade-rules-preview-list span{color:var(--ink-soft);font-size:.8rem}.dev-grade-rules-preview-list p{margin:0;font-size:.86rem;word-break:break-word}.dev-grade-rules-log{margin:.5rem 0 0;min-height:150px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);padding:.65rem;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:.82rem;line-height:1.45;white-space:pre-wrap}.latest-records-panel{grid-column:1 / -1}.chip-row{display:flex;flex-wrap:wrap;gap:.55rem}.chip,.primary-btn,.ghost-btn{cursor:pointer;font:inherit;border-radius:14px;border:1px solid var(--border);transition:all .14s ease}.chip{background:var(--surface-3);padding:.45rem .8rem}.chip.active{color:#fff;background:var(--accent);border-color:var(--accent)}.lesson-select-wrap{display:grid;gap:.35rem;margin-top:.8rem}.lesson-select-grid label{font-size:.88rem;color:var(--ink-soft);font-weight:600}select,textarea{width:100%;border:1px solid var(--border);border-radius:14px;font:inherit;padding:.6rem .75rem;background:var(--surface-soft);color:var(--ink)}.primary-btn{margin-top:.8rem;background:var(--accent);color:#fff;padding:.6rem 1rem}.primary-btn:hover{background:var(--accent-strong)}.ghost-btn{background:var(--surface-3);padding:.5rem .8rem;text-decoration:none;display:inline-flex;align-items:center}.lesson-switch-btn{padding-inline:.62rem}.ghost-btn:disabled{opacity:.5;cursor:not-allowed}.record-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.record-item{display:grid;grid-template-columns:1.2fr .75fr .75fr .85fr 1fr;gap:.35rem;font-size:.95rem;align-items:center;padding:.5rem .65rem;border-radius:12px;background:var(--surface-2)}.records-grid{margin-top:1rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.8rem}.stat-panel h2{margin:0;font-size:.95rem;color:var(--ink-soft)}.metric{margin:.4rem 0 0;font-family:Fredoka,sans-serif;font-size:1.7rem}.records-filter-panel{margin-top:1rem}.records-toolbar{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.6rem}.toolbar-actions{display:flex;flex-wrap:wrap;gap:.4rem}.danger-btn{border-color:#d93d2f4d;color:#a93428}.records-filter-panel h2{margin:0;font-size:1rem}.records-filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.45rem .65rem;align-items:center}.records-filter-grid label{font-size:.88rem;color:var(--ink-soft);font-weight:600}.chart-list{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}.chart-item{display:grid;grid-template-columns:1fr minmax(120px,2fr) 40px;align-items:center;gap:.5rem}.chart-label{font-size:.95rem}.chart-track{border:1px solid var(--border);border-radius:999px;height:12px;overflow:hidden;background:var(--surface-2)}.chart-bar{height:100%;background:linear-gradient(90deg,var(--accent),#f2b55b)}.chart-value{text-align:right;font-family:Fredoka,sans-serif}.trend-panel{display:grid;gap:.55rem}.trend-svg{width:100%;height:180px;border-radius:12px;border:1px solid var(--border);background:linear-gradient(to bottom,#ef6c3614,#fff0),var(--surface-3)}.trend-axis{stroke:#1d2b2a47;stroke-width:.4}.trend-line{fill:none;stroke:var(--accent);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}.trend-dot{fill:var(--accent-strong)}.trend-label-row{display:flex;justify-content:space-between;color:var(--ink-soft);font-size:.86rem}.rank-list{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}.rank-item{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:.45rem;align-items:center;font-size:.92rem;background:var(--surface-2);border-radius:10px;padding:.45rem .55rem}.rank-item span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.practice-layout{display:block}.practice-focus-layout{min-height:0;height:100%;position:relative}.stage-main{background:radial-gradient(circle at top,rgba(157,181,255,.16),transparent 52%),#ffffffc7;padding:1.15rem;position:relative;overflow:hidden;height:100%;display:flex;flex-direction:column}.practice-stage-content{position:relative;z-index:1;transition:filter .17s ease;display:flex;flex-direction:column;gap:.45rem;min-height:0;height:100%}.practice-stage-content.paused{filter:blur(2px) saturate(.9)}.practice-pause-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:grid;place-items:center;background:#ffffff59;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:inherit}.practice-pause-overlay p{margin:0;padding:.7rem 1rem;border-radius:999px;border:1px solid var(--border);background:var(--surface-3);color:var(--ink);font-family:Fredoka,sans-serif;font-size:clamp(1rem,2.2vw,1.25rem);letter-spacing:.02em}.blurred{filter:blur(1px);pointer-events:none}.onboarding-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#1218225c;display:grid;place-items:center;padding:1rem}.onboarding-modal{width:min(560px,95vw);padding:1.1rem;background:var(--surface-0)}.onboarding-modal-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.onboarding-modal h2{margin:0;font-family:Fredoka,sans-serif}.onboarding-close-btn{margin:0;width:34px;height:34px;padding:0;border-radius:50%;display:grid;place-items:center;font-size:1.1rem;line-height:1}.onboarding-modal p{margin:.3rem 0 0;color:var(--ink-soft)}.onboarding-start-btn{width:100%}.practice-toolbar{display:flex;justify-content:space-between;align-items:start;gap:.8rem}.practice-course-meta h1{margin:0;font-family:Fredoka,sans-serif;font-size:clamp(1.35rem,2.6vw,1.8rem)}.practice-course-meta p{margin:.2rem 0 0;color:var(--ink-soft)}.practice-toolbar-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.4rem}.word-context-row{margin-top:.9rem;display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.word-context-card{border:1px solid var(--border);border-radius:14px;background:var(--surface-2);padding:.5rem .6rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.word-context-card:disabled{opacity:.55}.word-arrow{color:var(--ink-soft);font-size:1.2rem}.word-context-text{display:grid;justify-items:start}.word-context-text strong{font-family:Fredoka,sans-serif;font-size:1.18rem}.word-context-text small{color:var(--ink-soft)}.focus-word-card{margin-top:.25rem;text-align:center}.pinyin-meaning-card h2{font-size:clamp(1.35rem,3vw,1.95rem);letter-spacing:.01em}.focus-word-head{display:inline-flex;align-items:center;gap:.6rem}.speak-icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid rgba(86,106,150,.35);background:linear-gradient(180deg,var(--surface-3),var(--surface-1));color:#3f5a91;display:grid;place-items:center;cursor:pointer;transition:transform .12s ease,box-shadow .15s ease,background .15s ease}.speak-icon-btn svg{width:21px;height:21px;fill:currentColor;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.speak-icon-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 16px #4e66ad40}.speak-icon-btn:active:not(:disabled){transform:translateY(0)}.speak-icon-btn:disabled{opacity:.45;cursor:not-allowed}.speak-icon-btn.speaking{background:linear-gradient(180deg,#7a97ef47,#5d7bd740);box-shadow:0 0 #5370cc73;animation:speak-pulse 1.2s ease-out infinite}@keyframes speak-pulse{0%{box-shadow:0 0 #5370cc73}70%{box-shadow:0 0 0 10px #5370cc00}to{box-shadow:0 0 #5370cc00}}.focus-word-head h2{margin:0;font-family:Fredoka,sans-serif;font-size:clamp(1.55rem,4.2vw,2.35rem);letter-spacing:.04em;color:var(--ink)}.focus-word-ipa{margin:.15rem 0 0;color:var(--ink-soft);font-size:.92rem}.focus-word-translation{margin:.1rem 0 0;font-size:.98rem}.sentence-translation-card{margin-top:.2rem;text-align:center}.sentence-translation-card p{margin:0;font-size:.92rem;color:var(--ink)}.sentence-translation-card span{color:var(--ink-soft)}.target-text{margin-top:.1rem;padding:.42rem .55rem;border-radius:14px;background:var(--surface-soft);border:1px dashed var(--border);font-family:Fredoka,sans-serif;font-size:clamp(.94rem,1.75vw,1.24rem);line-height:1.34;word-break:break-word;text-align:center}.target-text span{padding:0 .03rem;border-radius:4px}.target-text span.is-space{opacity:.78;font-size:.9em}.target-text .correct{color:var(--success);background:#1e9e6324}.target-text .wrong{color:var(--danger);background:#d93d2f24}.target-text .pending{color:var(--pending)}.typing-input{margin-top:.8rem;min-height:110px;font-size:1.05rem}.typing-progress{margin-top:.18rem;border-radius:999px;background:#798ddc33;height:8px;overflow:hidden}.typing-progress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#7f92f5,#8ea4ff);transition:width .16s ease}.keyboard-guide-panel{margin-top:auto;border:1px solid var(--border);border-radius:14px;padding:.88rem .95rem .95rem;background:var(--surface-soft)}.keyboard-guide-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.4rem}.keyboard-guide-head h3{margin:0;font-size:.98rem}.keyboard-next-info{display:grid;justify-items:end;gap:.14rem}.keyboard-next-key{margin:0;color:var(--ink-soft);font-size:.9rem}.keyboard-finger-hint{margin:0;color:var(--ink);font-size:.9rem;font-weight:600}.keyboard-combo-hint{margin:0;color:#526d9f;font-size:.84rem;font-weight:600}.keyboard-grid{margin-top:.5rem;display:grid;gap:.4rem;width:fit-content;max-width:100%;margin-inline:auto;transform:translate(clamp(8px,1.2vw,14px))}.keyboard-legend{margin-top:.45rem;display:flex;flex-wrap:wrap;gap:.35rem}.legend-item{border-radius:999px;padding:.16rem .5rem;font-size:.78rem;border:1px solid var(--border)}.legend-item.left{background:#4f95ff2e;color:#2d4f8e}.legend-item.right{background:#f6a15c38;color:#8b4e20}.legend-item.current{background:#6b82f73d;color:#3448a9}.keyboard-row{display:flex;justify-content:flex-start;gap:.4rem;width:fit-content}.keyboard-row:nth-child(2){padding-left:clamp(6px,1vw,12px);transform:translate(clamp(-34px,-3.4vw,-24px))}.keyboard-row:nth-child(3){padding-left:clamp(14px,2vw,24px);transform:translate(clamp(-42px,-4.2vw,-30px))}.keyboard-row:nth-child(4){width:100%;padding-left:0;transform:none;justify-content:center}.keyboard-key{border:1px solid rgba(60,74,98,.26);border-radius:10px;min-width:clamp(40px,2.85vw,52px);height:clamp(40px,2.85vw,52px);color:var(--ink);font-family:Fredoka,sans-serif;font-size:clamp(.96rem,1.65vw,1.15rem);display:grid;place-items:center;background:linear-gradient(180deg,var(--surface-3),var(--surface-1));box-shadow:0 2px #6176a342}.keyboard-key.hand-left{background:linear-gradient(180deg,#e8f2ff,#d8e9ff);border-color:#4f95ff54;color:#2d4f8e}.keyboard-key.hand-right{background:linear-gradient(180deg,#fff1e3,#ffe6cc);border-color:#f6a15c54;color:#7f4b1f}.keyboard-key.hand-both{background:linear-gradient(180deg,#eef2f9,#dee5f1);border-color:#788cbd52}.keyboard-key.wide{min-width:clamp(260px,36vw,340px)}.keyboard-key.shift{min-width:clamp(88px,5.5vw,108px);font-size:clamp(.86rem,1.4vw,.98rem)}.keyboard-key.caps{min-width:clamp(76px,5.1vw,96px);font-size:clamp(.86rem,1.4vw,.98rem)}.keyboard-key.active{background:#6b82f7;color:#fff;border-color:#5f75e8;box-shadow:0 4px 14px #5d72dc61}.analysis-filter-panel{margin-top:1rem}.analysis-filter-panel h2{margin:0}.analysis-filter-grid{margin-top:.6rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.45rem .65rem;align-items:center}.analysis-filter-grid label{font-size:.88rem;color:var(--ink-soft);font-weight:600}.notebook-list{margin-top:1rem;display:grid;gap:.8rem}.notebook-card{padding:.95rem}.notebook-head{display:flex;justify-content:space-between;align-items:start;gap:.65rem}.notebook-head h3{margin:0;font-family:Fredoka,sans-serif;font-size:1.24rem}.notebook-head p{margin:.2rem 0 0;color:var(--ink-soft)}.notebook-meta{display:grid;justify-items:end;color:var(--ink-soft);font-size:.88rem}.notebook-stats{margin-top:.6rem;display:flex;flex-wrap:wrap;gap:.45rem}.notebook-stats span{border-radius:999px;border:1px solid var(--border);background:var(--surface-3);padding:.2rem .5rem;font-size:.84rem}.notebook-grid{margin-top:.6rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.55rem}.notebook-grid h4{margin:0 0 .3rem;font-size:.9rem;color:var(--ink-soft)}.stat-row{margin-top:.9rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.6rem}.stat-box{border:1px solid var(--border);border-radius:12px;padding:.5rem .7rem;background:var(--surface-3);display:flex;align-items:baseline;justify-content:space-between;gap:.65rem}.stat-box h3{margin:0;color:var(--ink-soft);font-size:.86rem;font-weight:600}.stat-box p{margin:0;font-family:Fredoka,sans-serif;font-size:1.35rem;font-weight:700;white-space:nowrap}.action-row{margin-top:.8rem;display:flex;flex-wrap:wrap;gap:.55rem}.stage-stat-row{margin-top:.36rem;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(96px,1fr);overflow-x:auto;padding-bottom:.15rem;gap:.45rem;scrollbar-width:thin}.stage-stat-row .stat-box{padding:.34rem .5rem}.stage-stat-row .stat-box h3{font-size:.76rem}.stage-stat-row .stat-box p{font-size:1.05rem}.stage-main .ad-banner{min-height:78px;margin-top:.35rem;padding:.4rem .58rem;font-size:.8rem}.stage-main .ad-banner .ad-meta{font-size:.69rem}.heat-panel{margin-top:.75rem;border:1px solid var(--border);border-radius:12px;padding:.65rem .75rem;background:var(--surface-2)}.heat-panel h3{margin:0 0 .45rem;font-size:.95rem}.hotspot-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:.4rem}.hotspot-item{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--border);border-radius:999px;padding:.25rem .5rem;background:var(--surface-3);font-size:.87rem}.hotspot-char{font-family:Fredoka,sans-serif;font-weight:600}.keyrank-panel{margin-top:.8rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.65rem}.insight-drawer{margin-top:.9rem;border:1px solid var(--border);border-radius:12px;background:#ffffffb3;padding:.5rem .7rem}.insight-drawer summary{cursor:pointer;font-weight:600}.insight-grid{display:grid;gap:.75rem;margin-top:.7rem}.keyrank-card{padding:.7rem}.keyrank-card h3{margin:0 0 .45rem;font-size:.94rem}.keyrank-card .rank-item{grid-template-columns:minmax(0,1fr) auto}.analysis-panel{margin-top:.8rem;border:1px solid var(--border);border-radius:12px;padding:.65rem .75rem;background:var(--surface-soft)}.analysis-panel h3{margin:0 0 .45rem;font-size:.95rem}.analysis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.45rem}.analysis-item{border:1px solid var(--border);border-radius:10px;padding:.45rem .5rem;background:var(--surface-3);display:grid;gap:.2rem}.analysis-item span{color:var(--ink-soft);font-size:.82rem}.analysis-item strong{font-family:Fredoka,sans-serif;font-size:1.1rem}.result-card{margin-top:.9rem;border-radius:14px;background:var(--surface-3);border:1px solid var(--border);padding:.8rem}.result-card h2{margin:0;font-family:Fredoka,sans-serif}.ad-block{border:1px dashed #c57142;border-radius:14px;background:linear-gradient(135deg,#ffe5cc,#fff5e8);color:#8f3f18;display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.55rem .7rem;margin-top:.95rem;font-size:.9rem;min-height:136px}.ad-meta{color:inherit;opacity:.78;font-size:.76rem}.ad-layout{margin-top:.95rem}.ad-layout-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,300px);gap:.7rem;align-items:stretch}.ad-block.secondary{border-style:dotted}.ad-square{min-height:250px;height:100%;flex-direction:column;justify-content:space-between;text-align:left;margin-top:.95rem}.ad-layout-two .ad-square{margin-top:0}.theme-dark .stage-main{background:radial-gradient(circle at top,rgba(116,143,224,.22),transparent 54%),#0f1826b8}.theme-dark .onboarding-mask{background:#0408109e}.theme-dark .practice-pause-overlay{background:#0d142175}.theme-dark .theme-toggle-btn:hover{border-color:#b7cef8b3;box-shadow:0 10px 20px #0000005c}.theme-dark .legend-item.left{background:#4f95ff3d;color:#bcd6ff}.theme-dark .legend-item.right{background:#f6a15c3d;color:#ffd7ba}.theme-dark .legend-item.current{background:#6b82f757;color:#d4dcff}.theme-dark .keyboard-combo-hint{color:#b9cbef}.theme-dark .keyboard-key.hand-left{background:linear-gradient(180deg,#274d88,#1f3f72);border-color:#81b1ff8c;color:#e5f0ff}.theme-dark .keyboard-key.hand-right{background:linear-gradient(180deg,#7f512c,#6b4222);border-color:#ffc79a8c;color:#fff0e2}.theme-dark .keyboard-key.hand-both{background:linear-gradient(180deg,#30455f,#25384f);border-color:#a0b8d773;color:#e0ebfa}.theme-dark .keyboard-key.active{background:#88a0ff;border-color:#a2b6ff;color:#0f1830}.theme-dark .ad-block{border-color:#ffab7680;background:linear-gradient(135deg,#7f4f2b61,#462e1a47);color:#ffdaba}.theme-dark .dev-importer-warning,.theme-dark .dev-library-warning,.theme-dark .dev-grade-rules-warning{border-color:#ffb5806b;background:#7c4e306b;color:#ffd9b5}@media (max-width: 900px){.page-wrap-practice{display:block;margin:.45rem auto .6rem}.practice-focus-layout,.stage-main,.practice-stage-content{height:auto}.keyboard-guide-panel{margin-top:.45rem}.keyboard-grid{transform:translate(0)}.topbar{flex-wrap:wrap;gap:.6rem}.topbar-main{flex:0 0 auto}.topbar-actions{width:100%;justify-content:space-between;gap:.35rem;overflow-x:auto;white-space:nowrap;scrollbar-width:thin}.topbar-course{flex-wrap:nowrap;max-width:100%}.topbar-course-link,.topbar-course-pill.chapter strong{max-width:32vw}.topbar-chapter-select{flex:1 1 auto;min-width:0}.topbar-chapter-select select{min-width:0;width:100%}.library-layout,.dev-library-filter-grid,.dev-library-main,.dev-grade-rules-control-grid,.dev-grade-rules-main{grid-template-columns:1fr}.dev-library-batch-head{flex-direction:column;align-items:flex-start}.dev-library-batch-grid,.library-footer-panel{grid-template-columns:1fr}.library-start-btn{width:100%;min-width:0}.ad-layout-two{grid-template-columns:1fr}.ad-square{min-height:160px}.word-context-row{grid-template-columns:1fr}.record-item{grid-template-columns:1fr 1fr}.stat-box{flex-direction:column;align-items:flex-start;gap:.15rem}.stage-stat-row{grid-auto-columns:minmax(88px,1fr)}.rank-item{grid-template-columns:1fr;gap:.2rem}.records-toolbar{flex-direction:column;align-items:start}.notebook-head{flex-direction:column}.notebook-meta{justify-items:start}}
