:root{font-family:'DM Sans','Noto Sans SC',sans-serif;color:var(--ink);background:var(--canvas);font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:244px;padding:27px 17px 16px;background:#fff;border-right:1px solid #edf0f2;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:11px;padding:0 11px;margin-bottom:48px;font-family:Manrope,sans-serif;font-size:20px;font-weight:800;letter-spacing:-.8px}.brand-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:12px;background:var(--teal);color:#fff;font-size:18px;box-shadow:0 5px 12px #087e7830}.brand-dot{color:var(--coral)}.side-label{color:#a2abb2;font-size:10px;font-weight:700;letter-spacing:1.55px;text-transform:uppercase;padding:0 13px;margin-bottom:10px}.main-nav{display:grid;gap:4px}.nav-link{height:44px;border-radius:10px;display:flex;align-items:center;gap:12px;padding:0 12px;font-size:13px;color:#697780;font-weight:500;transition:.15s}.nav-link:hover{background:#f5f8f8;color:var(--ink)}.nav-link.active{background:var(--teal-pale);color:var(--teal);font-weight:700}.nav-icon{display:grid;place-items:center;width:19px;font-size:17px}.nav-count{margin-left:auto;background:#f0f2f4;border-radius:20px;padding:2px 7px;font-size:10px;color:#74808a}.side-bottom{margin-top:auto}.daily-card{display:flex;align-items:center;gap:11px;padding:13px 11px;margin:0 2px 14px;background:#f7f8f7;border-radius:12px}.daily-spark{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#edf4d6;color:#68832c;font-size:18px}.daily-card strong,.daily-card span:not(.daily-spark){display:block}.daily-card strong{font-size:12px}.daily-card div span{color:var(--muted);font-size:10px;margin-top:3px}.sidebar-foot{border-top:1px solid #edf0f2;padding:17px 7px 2px;display:flex;align-items:center;gap:9px;margin-top:14px}.avatar{width:31px;height:31px;display:grid;place-items:center;border:0;border-radius:50%;background:#dceeea;color:var(--teal);font-size:12px;font-weight:700}.sidebar-foot strong,.sidebar-foot div span{display:block}.sidebar-foot strong{font-size:11px}.sidebar-foot div span{font-size:9px;color:var(--muted);margin-top:3px}.local-dot{width:7px;height:7px;border-radius:50%;background:var(--surface-quiet);margin-left:auto}.main-area{margin-left:244px;min-height:100vh}.topbar{height:68px;padding:0 42px;border-bottom:1px solid #eceff2;display:flex;align-items:center;justify-content:space-between;background:#ffffffa8}.breadcrumb{font-size:12px;color:#89949b}.breadcrumb span{padding:0 9px;color:#bdc5ca}.breadcrumb strong{font-weight:600;color:#37454d}.top-actions{display:flex;align-items:center;gap:15px}.local-badge{font-size:10px;color:var(--muted);background:var(--accent-soft);border-radius:20px;padding:7px 10px}.local-badge i{display:inline-block;width:6px;height:6px;background:var(--accent-soft);border-radius:50%;margin-right:5px}.avatar-small{width:30px;height:30px}.menu-toggle{display:none}.page-content{margin:0 auto}.eyebrow{font-size:10px;color:var(--teal);font-weight:700;letter-spacing:1.4px;text-transform:uppercase}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:28px}.page-heading h1{margin:7px 0 7px;font:800 29px/1.25 Manrope,'Noto Sans SC',sans-serif;letter-spacing:-.9px}.page-heading p{margin:0;color:var(--muted);font-size:13px}.button{border:0;border-radius:9px;padding:11px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:700;transition:transform .15s,background .15s}.button:hover{transform:translateY(-1px)}.button-primary{background:var(--teal);color:white;box-shadow:0 5px 12px #087e7825}.button-primary:hover{background:var(--teal-dark)}.button-secondary{background:var(--surface-raised);color:var(--muted)}.button-ghost{background:transparent;color:var(--muted);border:1px solid var(--line)}.button-danger{background:#fff1ed;color:#bb5c48}.button-small{padding:8px 11px;font-size:11px}.hero-card{position:relative;overflow:hidden;background:var(--surface-raised);border-radius:16px;padding:31px 34px;min-height:222px;display:flex;align-items:center;margin-bottom:21px}.hero-copy{position:relative;z-index:1;max-width:530px}.hero-copy .eyebrow{color:var(--muted)}.hero-copy h2{font:700 25px/1.4 Manrope,'Noto Sans SC',sans-serif;letter-spacing:-.6px;margin:12px 0 7px}.hero-copy p{color:var(--muted);font-size:12px;margin:0 0 20px}.hero-decoration{position:absolute;right:72px;top:23px;width:214px;height:174px}.hero-circle{position:absolute;inset:9px 18px 0 17px;border-radius:50%;background:#d7ebdd}.hero-book{position:absolute;top:20px;left:60px;width:92px;height:118px;background:#fcfff8;border-radius:6px 14px 14px 6px;box-shadow:13px 8px 0 #afd4c0,0 12px 22px #799c8740;transform:rotate(7deg);display:grid;place-items:center;color:var(--teal);font:800 44px Manrope}.hero-book:after{content:'WORDS TO GROW';font:700 6px Manrope;letter-spacing:1.5px;position:absolute;bottom:16px;color:#87a894}.float-word{position:absolute;padding:7px 10px;background:white;border-radius:8px;font-size:10px;font-weight:700;box-shadow:var(--shadow)}.float-one{top:13px;right:5px;transform:rotate(6deg)}.float-two{bottom:5px;left:2px;color:var(--teal);transform:rotate(-8deg)}.float-star{position:absolute;right:14px;bottom:11px;color:#efaa61;font-size:22px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:21px}.metric-card,.panel{background:white;border:1px solid var(--line);border-radius:13px;box-shadow:0 3px 15px #22313b04}.metric-card{padding:16px 17px;min-height:105px}.metric-top{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:11px}.metric-icon{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;color:var(--teal);background:var(--accent-soft)}.metric-value{font:800 24px Manrope,sans-serif;letter-spacing:-1px;margin-top:13px}.metric-value small{font:500 11px 'DM Sans',sans-serif;color:var(--muted);letter-spacing:0}.home-lower{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(255px,.8fr);gap:15px}.panel{padding:20px 21px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.panel-head h3{font-size:13px;margin:0;font-weight:700}.text-link{border:0;background:transparent;padding:0;color:var(--teal);font-size:11px;font-weight:700}.progress-track{height:6px;background:var(--surface-raised);border-radius:8px;overflow:hidden}.progress-fill{height:100%;background:var(--teal);border-radius:8px;transition:width .25s}.week-row{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-top:19px}.week-day{text-align:center;color:var(--muted);font-size:9px}.week-bar-wrap{height:55px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:6px}.week-bar{width:18px;max-height:50px;border-radius:5px 5px 3px 3px;background:var(--surface-quiet);min-height:4px}.week-bar.today{background:var(--teal)}.empty-note{padding:20px;text-align:center;color:var(--muted);font-size:12px}.quick-actions{display:grid;gap:9px}.quick-action{display:flex;align-items:center;gap:11px;background:var(--surface-raised);border:1px solid var(--line);border-radius:10px;padding:11px;text-align:left}.quick-action:hover{border-color:var(--border-strong);background:var(--surface-hover)}.quick-action-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:var(--accent-soft);color:var(--teal);font-size:16px}.quick-action strong,.quick-action span{display:block}.quick-action strong{font-size:11px}.quick-action span{font-size:9px;color:var(--muted);margin-top:3px}.study-layout{max-width:810px;margin:0 auto}.study-topline{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px;color:var(--muted);font-size:11px}.study-topline strong{color:var(--ink)}.study-progress{height:5px;background:var(--surface-raised);border-radius:6px;margin-bottom:20px}.study-progress .progress-fill{background:var(--surface-quiet)}.study-card{background:var(--surface-raised);border:1px solid var(--line);border-radius:16px;padding:34px 42px 28px;box-shadow:var(--shadow)}.study-settings{display:flex;gap:8px;justify-content:center;margin-bottom:25px}.pill{padding:7px 11px;border-radius:20px;background:var(--surface-inset);color:var(--muted);font-size:10px}.pill select{border:0;outline:0;color:var(--muted);background:transparent;font-size:10px}.study-prompt-label{text-align:center;color:var(--muted);font-size:10px;letter-spacing:.5px}.study-meaning{text-align:center;font:700 29px 'Noto Sans SC',sans-serif;margin:13px 0 6px}.study-phonetic{text-align:center;color:var(--muted);font-size:12px;min-height:18px}.sentence-box{max-width:510px;margin:18px auto 0;padding:11px 15px;border-left:2px solid var(--line);background:var(--surface-raised);color:var(--muted);font-size:12px;line-height:1.7}.sentence-translation{font-size:10px;color:var(--muted);margin-top:3px}.study-listen{display:flex;justify-content:center;margin:22px 0 16px}.listen-button{display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--surface-raised);color:var(--teal);padding:9px 15px;border-radius:25px;font-size:11px;font-weight:700}.listen-button:hover{background:var(--surface-hover)}.sound-icon{font-size:17px}.answer-input{display:block;width:min(100%,430px);margin:0 auto;border:1.5px solid var(--line);outline:none;border-radius:10px;padding:14px 17px;text-align:center;color:var(--ink);font:600 18px Manrope,sans-serif;letter-spacing:1px;transition:.15s}.answer-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #087e7812}.answer-input::placeholder{font:400 12px 'DM Sans','Noto Sans SC',sans-serif;letter-spacing:0;color:var(--muted)}.study-controls{display:flex;justify-content:center;gap:9px;margin-top:13px;flex-wrap:wrap}.study-status{text-align:center;min-height:28px;margin:17px 0 0;font-size:13px;font-weight:700}.study-status.correct{color:#21865d}.study-status.wrong{color:#cf614d}.study-status.neutral{color:#708078;font-size:11px;font-weight:500}.hint-area{text-align:center;color:var(--muted);font:600 17px Manrope,sans-serif;letter-spacing:7px;margin-top:10px}.answer-reveal{text-align:center;margin:10px 0 0;color:var(--muted);font-size:12px}.answer-reveal strong{color:var(--teal);font:700 15px Manrope,sans-serif;margin-left:7px}.study-footnote{text-align:center;color:var(--muted);font-size:10px;margin-top:17px}.kbd{display:inline-grid;place-items:center;min-width:20px;padding:2px 5px;margin:0 2px;border:1px solid var(--line);border-radius:4px;background:var(--surface-inset);color:var(--muted);font-size:9px}.study-below{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:13px}.study-stat{padding:12px 13px;background:white;border:1px solid var(--line);border-radius:10px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.study-stat strong{color:var(--ink);font-size:11px}.filter-row{display:flex;align-items:center;gap:9px;margin-bottom:16px;flex-wrap:wrap}.search-box{position:relative;flex:1;min-width:180px}.search-box input{width:100%;height:37px;padding:0 12px 0 34px;border:1px solid var(--line);border-radius:8px;outline:0;background:white;font-size:11px}.search-box:before{content:'⌕';position:absolute;left:12px;top:8px;color:var(--muted);font-size:17px}.select-control{height:37px;padding:0 11px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--muted);font-size:11px;outline:0}.table-wrap{overflow-x:auto}.word-table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}.word-table th{padding:11px 13px;background:var(--surface-raised);color:var(--muted);font-size:10px;font-weight:600}.word-table td{padding:13px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.word-table tr:last-child td{border-bottom:0}.word-name{font:700 13px Manrope,sans-serif;color:var(--ink)!important}.word-tag{display:inline-block;padding:4px 7px;border-radius:6px;background:var(--accent-soft);color:var(--muted);font-size:9px}.row-actions{display:flex;gap:5px}.row-action{border:0;background:transparent;color:var(--muted);font-size:11px;padding:5px}.row-action:hover{color:var(--teal)}.empty-state{text-align:center;padding:45px 15px;color:var(--muted)}.empty-state-icon{font-size:28px;color:var(--muted);margin-bottom:9px}.empty-state strong{display:block;color:var(--muted);font-size:13px;margin-bottom:5px}.empty-state span{font-size:11px}.record-list{display:grid;gap:9px}.record-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:22px;padding:14px 15px;border:1px solid var(--line);border-radius:10px;background:white}.record-item strong{font:700 13px Manrope}.record-item span{font-size:10px;color:var(--muted)}.record-result{font-size:10px;font-weight:700}.record-result.good{color:#26815f}.record-result.bad{color:#cd6b57}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-bottom:16px}.stat-large{padding:19px}.stat-large .metric-value{font-size:29px}.stat-hint{font-size:10px;color:var(--muted);margin-top:5px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.settings-section{padding:20px}.settings-section h3{font-size:13px;margin:0 0 5px}.settings-section>p{font-size:10px;color:var(--muted);margin:0 0 16px}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);gap:12px}.setting-row:last-child{border:0}.setting-row strong,.setting-row span{display:block}.setting-row strong{font-size:11px}.setting-row span{font-size:9px;color:var(--muted);margin-top:3px}.setting-row select,.setting-row input[type=range]{width:120px}.setting-row select{padding:7px;border:1px solid var(--line);border-radius:7px;background:var(--surface-inset);color:var(--muted);font-size:10px}.switch{appearance:none;width:34px;height:19px;border-radius:20px;background:var(--surface-quiet);position:relative;transition:.2s}.switch:checked{background:var(--teal)}.switch:after{content:'';position:absolute;width:13px;height:13px;top:3px;left:3px;background:white;border-radius:50%;transition:.2s}.switch:checked:after{left:18px}.modal-backdrop{position:fixed;inset:0;z-index:30;display:grid;place-items:center;background:#1221266e;padding:20px}.modal{width:min(100%,540px);max-height:90vh;overflow:auto;background:white;border-radius:15px;padding:25px;box-shadow:0 25px 80px #101d2555}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.modal-head h2{margin:0;font-size:17px}.modal-close{border:0;background:var(--surface-raised);border-radius:50%;width:29px;height:29px;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-field{display:grid;gap:6px}.form-field.full{grid-column:1/-1}.form-field label{font-size:10px;color:var(--muted);font-weight:600}.form-field input,.form-field textarea,.form-field select{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 11px;outline:none;font-size:11px;color:var(--ink)}.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:var(--accent-primary)}.form-field textarea{min-height:66px;resize:vertical}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.toast-root{position:fixed;right:25px;bottom:24px;z-index:50;display:grid;gap:8px}.toast{padding:11px 15px;border-radius:9px;color:white;background:var(--surface-quiet);box-shadow:var(--shadow);font-size:11px;animation:toast-in .2s ease}@keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.mobile-scrim{display:none}
@media(max-width:1050px){.sidebar{width:215px}.main-area{margin-left:215px}.metric-grid{grid-template-columns:repeat(2,1fr)}.hero-decoration{right:30px}}@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:transform .22s;width:250px;box-shadow:12px 0 30px #1d30300d}.sidebar.open{transform:translateX(0)}.mobile-scrim.visible{display:block;position:fixed;inset:0;background:#1b29294d;z-index:9}.main-area{margin-left:0}.topbar{height:58px;padding:0 18px}.menu-toggle{display:block;border:0;background:transparent;color:#617078;font-size:16px}.breadcrumb{margin-right:auto;margin-left:12px;font-size:10px}.top-actions{gap:8px}.local-badge{font-size:0;padding:8px}.local-badge i{margin:0}.page-heading{align-items:flex-start;margin-bottom:19px}.page-heading h1{font-size:25px}.page-heading p{font-size:11px;line-height:1.6}.page-heading>.button{padding:10px 11px;font-size:10px;white-space:nowrap}.hero-card{min-height:190px;padding:25px 21px}.hero-copy{max-width:65%}.hero-copy h2{font-size:21px}.hero-copy p{font-size:10px;line-height:1.6}.hero-decoration{right:-46px;transform:scale(.8)}.home-lower{grid-template-columns:1fr}.metric-card{min-height:95px;padding:13px}.metric-value{font-size:21px}.study-card{padding:25px 17px 20px}.study-meaning{font-size:25px}.study-layout{margin:0}.study-below{gap:6px}.study-stat{padding:10px 8px;display:grid;gap:6px}.settings-grid{grid-template-columns:1fr}.record-item{gap:9px;grid-template-columns:1fr auto}.record-item>span:nth-child(2){display:none}.stat-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:420px){.metric-grid{gap:8px}.metric-card{padding:11px}.metric-top{font-size:9px}.metric-icon{width:23px;height:23px}.hero-decoration{right:-67px;opacity:.75}.hero-copy{max-width:76%}.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:auto}.study-settings{flex-wrap:wrap}.study-controls .button{padding:9px 11px}.stat-grid{grid-template-columns:1fr 1fr}}

:root{transition:background-color .2s ease,color .2s ease}
html[data-theme="dark"]{color-scheme:dark;background:var(--canvas);color:var(--ink)}
html[data-theme="dark"] body,html[data-theme="dark"] .main-area{background:var(--canvas);color:var(--ink)}
html[data-theme="dark"] .sidebar,html[data-theme="dark"] .topbar,html[data-theme="dark"] .panel,html[data-theme="dark"] .metric-card,html[data-theme="dark"] .study-card,html[data-theme="dark"] .study-stat,html[data-theme="dark"] .record-item,html[data-theme="dark"] .modal{background:#252c30;border-color:#343e42;color:#e3e8e8}
html[data-theme="dark"] .sidebar,html[data-theme="dark"] .topbar{border-color:#333d41}
html[data-theme="dark"] .topbar{background:#20272a}
html[data-theme="dark"] .nav-link{color:#aab5b7}html[data-theme="dark"] .nav-link:hover{background:#2b3438;color:#e7eeee}html[data-theme="dark"] .nav-link.active{background:#293b3a;color:#82cfc2}html[data-theme="dark"] .nav-count{background:#343e42;color:#bdc7c9}
html[data-theme="dark"] .daily-card{background:#2d3536}html[data-theme="dark"] .daily-spark{background:#394333;color:#c2d889}html[data-theme="dark"] .sidebar-foot{border-color:#394246}
html[data-theme="dark"] .breadcrumb,html[data-theme="dark"] .breadcrumb strong,html[data-theme="dark"] .page-heading h1,html[data-theme="dark"] .panel-head h3,html[data-theme="dark"] .settings-section h3,html[data-theme="dark"] .metric-value,html[data-theme="dark"] .study-meaning,html[data-theme="dark"] .word-name,html[data-theme="dark"] .record-item strong,html[data-theme="dark"] .empty-state strong,html[data-theme="dark"] .setting-row strong{color:#e3e8e8!important}
html[data-theme="dark"] .page-heading p,html[data-theme="dark"] .settings-section>p,html[data-theme="dark"] .setting-row span,html[data-theme="dark"] .metric-top,html[data-theme="dark"] .stat-hint,html[data-theme="dark"] .study-topline,html[data-theme="dark"] .study-prompt-label,html[data-theme="dark"] .study-footnote,html[data-theme="dark"] .empty-state,html[data-theme="dark"] .record-item span{color:var(--muted)}
html[data-theme="dark"] .hero-card{background:var(--surface-quiet)}html[data-theme="dark"] .hero-copy h2{color:var(--ink)}html[data-theme="dark"] .hero-copy p{color:var(--muted)}html[data-theme="dark"] .hero-circle{background:#34483d}html[data-theme="dark"] .hero-book{background:#d6e2d6;color:#276b66}html[data-theme="dark"] .float-word{background:#303a38;color:#d6e2dd}
html[data-theme="dark"] .quick-action,html[data-theme="dark"] .search-box input,html[data-theme="dark"] .select-control,html[data-theme="dark"] .setting-row select,html[data-theme="dark"] .form-field input,html[data-theme="dark"] .form-field textarea,html[data-theme="dark"] .form-field select,html[data-theme="dark"] .answer-input{background:var(--surface-inset);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:var(--muted)}
html[data-theme="dark"] .word-table th{background:var(--surface-raised);color:var(--muted)}html[data-theme="dark"] .word-table td{color:var(--muted);border-color:var(--line)}html[data-theme="dark"] .word-table tr:last-child td{border-color:transparent}html[data-theme="dark"] .word-tag{background:var(--accent-soft);color:var(--accent-primary)}
html[data-theme="dark"] .quick-action:hover{background:var(--surface-hover);border-color:var(--border-strong)}html[data-theme="dark"] .quick-action-icon,html[data-theme="dark"] .metric-icon{background:var(--accent-soft);color:var(--accent-primary)}
html[data-theme="dark"] .pill{background:var(--surface-inset);color:var(--muted)}html[data-theme="dark"] .listen-button{background:var(--surface-raised);border-color:var(--line);color:var(--accent-primary)}html[data-theme="dark"] .listen-button:hover{background:var(--surface-hover)}html[data-theme="dark"] .sentence-box{background:var(--surface-raised);color:var(--muted)}html[data-theme="dark"] .sentence-translation{color:var(--muted)}
html[data-theme="dark"] .answer-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px #69bdb122}html[data-theme="dark"] .kbd{background:var(--surface-inset);border-color:var(--line);color:var(--muted)}
html[data-theme="dark"] .button-secondary{background:var(--surface-quiet);color:var(--ink)}html[data-theme="dark"] .button-ghost{color:var(--muted);border-color:var(--line)}html[data-theme="dark"] .button-danger{background:#49332f;color:#f0aa98}
html[data-theme="dark"] .modal-backdrop{background:#0e1315bb}html[data-theme="dark"] .modal-close{background:var(--surface-quiet);color:var(--ink)}html[data-theme="dark"] .form-field label{color:var(--muted)}html[data-theme="dark"] .setting-row{border-color:var(--line)}html[data-theme="dark"] .progress-track,html[data-theme="dark"] .study-progress{background:var(--surface-quiet)}
html[data-theme="dark"] .local-badge{background:var(--accent-soft);color:var(--muted)}html[data-theme="dark"] .avatar{background:#304541;color:#92d5c9}html[data-theme="dark"] .theme-toggle{color:#e7cf86}
html[data-theme="dark"] .bulk-preview,html[data-theme="dark"] .bulk-table-wrap{border-color:var(--line)}html[data-theme="dark"] .bulk-table th{background:var(--surface-raised);color:var(--muted)}html[data-theme="dark"] .bulk-table td{border-color:var(--line)}html[data-theme="dark"] .bulk-table input{background:var(--surface-inset);color:var(--ink);border-color:var(--line)}html[data-theme="dark"] .bulk-subtitle,html[data-theme="dark"] .bulk-note,html[data-theme="dark"] .bulk-placeholder,html[data-theme="dark"] .bulk-summary,html[data-theme="dark"] .bulk-raw{color:var(--muted)}html[data-theme="dark"] .bulk-status.is-found{color:#85c9a3}html[data-theme="dark"] .bulk-status.is-warning{color:#e5bb7d}
html[data-theme="dark"] .study-status.correct{color:#83d3a8}html[data-theme="dark"] .study-status.wrong{color:#ec9b89}html[data-theme="dark"] .answer-reveal,html[data-theme="dark"] .hint-area{color:var(--muted)}
html[data-theme="dark"] .mobile-scrim.visible{background:#0e13158c}
html[data-theme="dark"] *,html[data-theme="dark"] *::before,html[data-theme="dark"] *::after{transition-property:background-color,color,border-color,box-shadow}
.theme-toggle{width:32px;height:32px;border:1px solid var(--line);border-radius:9px;background:transparent;color:#52645a;font-size:17px;display:grid;place-items:center}

/* P4 course center */
.course-center{display:grid;gap:18px}.course-center-heading{align-items:flex-end}.course-center-actions{display:flex;gap:8px;flex-wrap:wrap}.course-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.course-overview>div{display:grid;gap:6px;padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:var(--white)}.course-overview span,.course-count{color:var(--muted);font-size:10px}.course-overview strong{font:700 22px Manrope,sans-serif}.course-workspace{display:grid;gap:12px}.course-workspace-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.course-workspace-heading h2{margin:0 0 4px;font-size:16px}.course-workspace-heading span{font-size:10px;color:var(--muted)}.course-package-list{display:grid;gap:10px}.course-package,.course-unit,.course-chapter{min-width:0;border:1px solid var(--line);border-radius:12px;background:var(--white);overflow:hidden}.course-package>summary,.course-unit>summary,.course-chapter>summary{display:flex;align-items:center;gap:10px;min-height:54px;padding:11px 14px;cursor:pointer;list-style:none}.course-package>summary::-webkit-details-marker,.course-unit>summary::-webkit-details-marker,.course-chapter>summary::-webkit-details-marker{display:none}.course-package>summary::after,.course-unit>summary::after,.course-chapter>summary::after{content:'⌄';margin-left:auto;color:var(--muted);font-size:14px}.course-package[open]>summary::after,.course-unit[open]>summary::after,.course-chapter[open]>summary::after{content:'⌃'}.course-package-icon{display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;border-radius:9px;background:var(--teal-pale);color:var(--teal)}.course-package>summary>strong,.course-unit-title,.course-chapter-title{min-width:0;font-size:13px}.course-package-actions,.course-unit-actions,.course-chapter-actions{display:flex;align-items:center;gap:5px;margin-left:auto}.course-package-actions button,.course-unit-actions button,.course-chapter-actions button{border:0;background:transparent;color:var(--muted);padding:5px 7px;font-size:10px}.course-package-body,.course-unit-body,.course-chapter-body{display:grid;gap:9px;padding:0 13px 13px}.course-package-body{border-top:1px solid var(--line);padding-top:12px}.course-unit{border-radius:10px;background:var(--canvas)}.course-unit>summary{min-height:47px;padding:9px 11px}.course-unit-progress{color:var(--muted);font-size:10px}.course-unit-body{padding:0 10px 10px}.course-chapter{border-radius:9px}.course-chapter>summary{min-height:42px;padding:8px 10px}.course-chapter-body{padding:0 9px 9px}.course-count{white-space:nowrap}.course-chapter-toolbar{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:6px 0;color:var(--muted);font-size:10px}.course-chapter-toolbar>div{display:flex;justify-content:flex-end;align-items:center;gap:5px;flex-wrap:wrap}.course-chapter-toolbar .button{min-height:31px;padding:6px 9px;font-size:9px}.course-audio-picker{position:relative;overflow:hidden;cursor:pointer}.course-audio-picker input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.course-sentence-list{display:grid;gap:6px}.course-sentence-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:var(--white)}.course-sentence-copy{display:grid;gap:3px;min-width:0}.course-sentence-copy strong{font:650 12px/1.45 Manrope,sans-serif;overflow-wrap:anywhere}.course-sentence-copy>span{font-size:11px;color:var(--muted);overflow-wrap:anywhere}.course-sentence-copy small{font-size:9px;color:var(--muted)}.course-sentence-actions{display:flex;align-items:center;justify-content:flex-end;gap:4px;flex:0 0 auto}.course-sentence-actions .button{min-height:31px;padding:6px 8px;font-size:9px}.course-empty,.course-empty-line{display:grid;justify-items:start;gap:9px;padding:20px;border:1px dashed var(--line);border-radius:11px;color:var(--muted)}.course-empty strong{color:var(--ink);font-size:14px}.course-empty span{font-size:11px}.course-empty-line{padding:13px;font-size:10px}.course-modal{width:min(100%,840px);max-height:94dvh}.course-sentence-modal{width:min(100%,680px)}.course-modal .form-grid{gap:12px}.course-import-intro,.course-import-errors{font-size:11px;line-height:1.65;color:var(--muted);margin-bottom:12px}.course-import-errors{color:#c86f5b}.course-import-preview-head,.course-import-preview-row{display:grid;grid-template-columns:34px minmax(170px,1.2fr) minmax(150px,1fr) 105px 105px;align-items:center;gap:7px}.course-import-preview-head{padding:7px 5px;color:var(--muted);font-size:9px}.course-import-preview{max-height:min(53dvh,480px);overflow:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.course-import-preview-row{padding:7px 5px;border-bottom:1px solid var(--line)}.course-import-preview-row:last-child{border-bottom:0}.course-import-preview-row textarea{width:100%;min-height:38px;padding:7px;border:1px solid var(--line);border-radius:7px;background:var(--canvas);color:var(--ink);font-size:10px;resize:vertical}.course-import-preview-row input{accent-color:var(--teal)}.course-import-time,.course-import-status{font-size:9px;color:var(--muted)}.course-import-preview-row.has-error .course-import-status{color:#cf715e}.course-import-preview-row.is-duplicate .course-import-status{color:var(--accent-primary)}.course-import-summary{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0;padding:9px 10px;border-radius:8px;background:var(--canvas);color:var(--muted);font-size:9px}.course-import-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
[data-theme="dark"] .course-overview>div,[data-theme="dark"] .course-package,[data-theme="dark"] .course-unit,[data-theme="dark"] .course-chapter,[data-theme="dark"] .course-sentence-row{background:var(--white);border-color:var(--line)}[data-theme="dark"] .course-unit{background:var(--surface-raised)}[data-theme="dark"] .course-package-body{border-color:var(--line)}[data-theme="dark"] .course-import-summary{background:var(--surface-inset)}[data-theme="dark"] .course-import-preview-row textarea{background:var(--surface-inset);color:var(--ink);border-color:var(--line)}[data-theme="dark"] .course-empty strong{color:var(--ink)}
@media(max-width:760px){.course-center{gap:12px}.course-center-heading{display:grid;gap:12px}.course-center-actions{display:grid;grid-template-columns:1fr 1fr}.course-center-actions .button{justify-content:center;min-height:41px;padding:8px 9px;font-size:10px}.course-overview{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.course-overview>div{padding:10px 11px}.course-overview strong{font-size:19px}.course-workspace-heading h2{font-size:14px}.course-package>summary,.course-unit>summary,.course-chapter>summary{gap:6px;padding:9px}.course-package>summary{flex-wrap:wrap}.course-package-actions,.course-unit-actions,.course-chapter-actions{gap:1px}.course-package-actions button,.course-unit-actions button,.course-chapter-actions button{padding:4px;font-size:9px}.course-unit-progress{display:none}.course-chapter-toolbar{align-items:flex-start;flex-direction:column}.course-chapter-toolbar>div{justify-content:flex-start;width:100%}.course-chapter-toolbar .button,.course-audio-picker{min-height:35px;padding:7px 8px}.course-sentence-row{align-items:flex-start;flex-direction:column;gap:8px}.course-sentence-copy strong{font-size:12px}.course-sentence-actions{width:100%;justify-content:flex-end}.course-sentence-actions .button{min-height:36px;padding:7px 10px}.course-modal{width:100%;max-height:96dvh;padding:15px 12px}.course-import-preview-head{display:none}.course-import-preview-row{grid-template-columns:26px minmax(0,1fr) minmax(0,1fr);gap:5px;padding:8px 3px}.course-import-preview-row>label{grid-row:1/3}.course-import-preview-row textarea{min-height:47px;font-size:10px}.course-import-time{display:none}.course-import-status{grid-column:2/-1}.course-import-footer{position:sticky;bottom:0;padding-top:9px;background:var(--white)}.course-import-footer .button{min-height:42px}.course-import-summary{gap:6px}.course-import-summary span{flex:1 1 40%}}

html[data-theme="dark"] *,html[data-theme="dark"] *::before,html[data-theme="dark"] *::after{transition-duration:.2s}

.bulk-modal{width:min(100%,980px);max-height:94vh;padding:23px 25px}
.bulk-modal .modal-head{align-items:flex-start;margin-bottom:15px}
.bulk-subtitle{margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.6}
#bulk-source{min-height:96px;max-height:170px;line-height:1.55}
.bulk-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0}
.bulk-summary{margin-left:auto;color:var(--muted);font-size:10px}
.bulk-preview{max-height:42vh;overflow:auto;border:1px solid var(--line);border-radius:9px}
.bulk-placeholder{padding:20px;text-align:center;color:var(--muted);font-size:11px}
.bulk-table{width:100%;min-width:740px;border-collapse:collapse;text-align:left}
.bulk-table th{position:sticky;top:0;z-index:1;padding:9px 10px;background:var(--surface-raised);color:var(--muted);font-size:10px;font-weight:600}
.bulk-table td{padding:7px 8px;border-top:1px solid var(--line);vertical-align:middle}
.bulk-table td:first-child,.bulk-table th:first-child{width:44px;text-align:center}
.bulk-table input:not([type=checkbox]){width:100%;min-width:100px;border:1px solid var(--line);border-radius:6px;padding:7px 8px;background:var(--surface-inset);color:var(--ink);font-size:11px;outline:0}
.bulk-table .bulk-word{min-width:130px}.bulk-table .bulk-phonetic{min-width:145px}
.bulk-table input:focus{border-color:var(--accent-primary)}
.bulk-table tr.is-duplicate{background:var(--surface-raised)}
.bulk-status{white-space:nowrap;font-size:10px;color:var(--muted)}.bulk-status.is-found{color:#398665}.bulk-status.is-warning{color:#ad7a2e}
.bulk-raw{margin-top:4px;color:var(--accent-primary);font-size:9px;white-space:normal}
.bulk-footer{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin-top:13px}
.bulk-note{max-width:60%;color:var(--muted);font-size:9px;line-height:1.6}.bulk-note a{color:var(--teal);text-decoration:underline;text-underline-offset:2px}
.bulk-footer .modal-actions{margin:0;white-space:nowrap}
.bulk-select{accent-color:var(--teal)}
@media(max-width:760px){.bulk-modal{padding:18px 15px}.bulk-footer{align-items:stretch;flex-direction:column;gap:8px}.bulk-note{max-width:none}.bulk-footer .modal-actions{justify-content:flex-end}.bulk-preview{max-height:38vh}}

html[data-theme="dark"] .bulk-table tr.is-duplicate{background:var(--surface-raised)}

.bulk-table{min-width:680px;table-layout:fixed}
.bulk-table th:first-child,.bulk-table td:first-child{width:24%;text-align:left}
.bulk-table th:nth-child(2),.bulk-table td:nth-child(2){width:31%}
.bulk-table th:nth-child(3),.bulk-table td:nth-child(3){width:25%}
.bulk-table th:last-child,.bulk-table td:last-child{width:20%}

/* Category-aware bulk import and vocabulary groups */
.study-launch{display:flex;gap:10px;align-items:center;justify-content:center;margin-top:20px;flex-wrap:wrap}.study-launch .select-control{min-width:220px;width:auto}
.word-group-row td{background:var(--surface-muted,var(--surface-raised));padding:12px 16px!important;border-top:1px solid var(--border,var(--line));color:var(--text,var(--ink))}.word-group-row span{margin-left:10px;color:var(--muted,var(--muted));font-size:12px}.word-group-row .row-action{float:right}
.word-note{margin-top:4px;color:var(--muted,var(--muted));font-size:12px;line-height:1.45;white-space:pre-wrap}
.bulk-modal{width:min(100%,1180px)}.bulk-preview{max-height:50vh;overflow:auto}.bulk-group{margin:0 0 12px;border:1px solid var(--border,var(--line));border-radius:12px;overflow:hidden}.bulk-group>summary{position:sticky;top:0;z-index:1;cursor:pointer;list-style:none;padding:12px 15px;background:var(--surface-muted,var(--surface-inset));font-weight:650;color:var(--text,var(--ink))}.bulk-group>summary::-webkit-details-marker{display:none}.bulk-group[open]>summary{border-bottom:1px solid var(--border,var(--line))}.bulk-table-wrap{overflow:auto}.bulk-table{width:100%;min-width:930px;table-layout:fixed;border-collapse:collapse}.bulk-table th,.bulk-table td{padding:8px;border-bottom:1px solid var(--border,var(--line));text-align:left;vertical-align:middle}.bulk-table th{font-size:11px;color:var(--muted,var(--muted))}.bulk-table th:first-child,.bulk-table td:first-child{width:42px;text-align:center}.bulk-table th:nth-child(2){width:24%}.bulk-table th:nth-child(3){width:17%}.bulk-table th:nth-child(4){width:15%}.bulk-table th:nth-child(5){width:15%}.bulk-table th:nth-child(6){width:25%}.bulk-table input:not([type=checkbox]),.bulk-table select{width:100%;min-width:0;padding:8px 9px;font-size:12px}.bulk-table select{margin-bottom:5px}.bulk-table .bulk-note-input{margin-bottom:5px}.bulk-table .bulk-status{display:block;font-size:11px}.bulk-table .bulk-raw{font-size:10px;color:var(--muted,var(--muted));margin-top:3px}.bulk-table tr.is-duplicate{opacity:.63}.bulk-select{accent-color:var(--accent,#4b8e7a)}.bulk-other{border-style:dashed}
html[data-theme=dark] .word-group-row td,html[data-theme=dark] .bulk-group>summary{background:var(--surface-muted,var(--surface-inset));color:var(--text,var(--ink))}html[data-theme=dark] .word-note{color:var(--muted,var(--muted))}html[data-theme=dark] .bulk-group{border-color:var(--border,var(--line))}html[data-theme=dark] .bulk-group>summary,html[data-theme=dark] .bulk-table th,html[data-theme=dark] .bulk-table td{border-color:var(--border,var(--line))}
@media(max-width:760px){.study-launch{flex-direction:column;align-items:stretch}.study-launch .select-control{width:100%}.bulk-modal{padding:18px 14px}.bulk-preview{max-height:46vh}.bulk-table{min-width:860px}.bulk-footer{align-items:flex-start;gap:12px}}

/* Directory management */
.word-page-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.directory-modal{width:min(100%,620px)}.directory-create{display:flex;gap:9px;margin-bottom:16px}.directory-create input,.directory-delete-modal select,.inline-directory-create input{min-width:0;flex:1;border:1px solid #e2e7e9;border-radius:8px;padding:10px 11px;background:#fff;color:#283941;font-size:12px}.directory-list{max-height:52vh;overflow:auto;display:grid;gap:8px}.directory-item{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:13px 14px;border:1px solid var(--line);border-radius:10px}.directory-item>div:first-child{display:flex;align-items:center;gap:12px;min-width:0}.directory-item strong{font-size:13px;overflow-wrap:anywhere}.directory-item span{font-size:11px;color:var(--muted);white-space:nowrap}.directory-item .row-actions{flex-shrink:0}.danger-action{color:#b85d4c}.directory-delete-modal{width:min(100%,480px)}.directory-delete-modal>p{color:#738088;font-size:13px;line-height:1.7}.directory-move-label{display:block;font-size:11px;color:var(--muted);font-weight:600;margin:14px 0 6px}.directory-delete-modal select{width:100%;flex:auto}.directory-delete-actions{display:grid;gap:9px;margin-top:18px}.inline-directory-create{display:flex;gap:8px;margin-top:8px}.inline-directory-create[hidden]{display:none}
html[data-theme=dark] .directory-item{border-color:var(--line)}html[data-theme=dark] .directory-item span,html[data-theme=dark] .directory-delete-modal>p,html[data-theme=dark] .directory-move-label{color:#a4afae}html[data-theme=dark] .directory-create input,html[data-theme=dark] .directory-delete-modal select,html[data-theme=dark] .inline-directory-create input{background:#262c2f;border-color:#3d474a;color:#e3e8e8}
@media(max-width:760px){.page-heading:has(.word-page-actions){display:block}.word-page-actions{margin-top:13px}.word-page-actions .button{padding:9px 10px;font-size:10px}.directory-create{flex-direction:column}.directory-item{align-items:flex-start;flex-direction:column}.directory-item>div:first-child{justify-content:space-between;width:100%}}
.word-name{display:flex;align-items:center;gap:9px}.word-cell-copy{display:grid;gap:3px;min-width:0}.word-cell-copy small{font:400 9px 'DM Sans',sans-serif;color:var(--muted)}.word-select{flex:0 0 auto;width:16px;height:16px;accent-color:var(--teal)}.word-more-button{width:36px;height:36px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--muted);font-size:20px;line-height:1;font-weight:700;letter-spacing:1px}.word-more-button:hover{background:var(--surface-hover);color:var(--teal)}.word-action-sheet{width:min(100%,420px);padding:17px;background:var(--white);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 60px #111d2550}.word-action-title{display:flex;justify-content:space-between;align-items:center;padding:0 2px 12px;border-bottom:1px solid var(--line);margin-bottom:8px}.word-action-title strong{font-size:14px}.word-action-sheet>[data-word-menu-action]{display:block;width:100%;min-height:48px;padding:12px 10px;border:0;border-radius:9px;background:transparent;color:var(--ink);text-align:left;font-size:13px}.word-action-sheet>[data-word-menu-action]:hover{background:var(--surface-hover)}.word-action-sheet>[data-word-menu-action].word-action-delete{color:#b85d4c}.bulk-selection-bar{position:sticky;top:8px;z-index:5;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-12px 0 15px;padding:10px 12px;border:1px solid var(--line);border-radius:11px;background:var(--white);box-shadow:var(--shadow)}.bulk-selection-bar>span{margin-right:auto;font-size:12px;color:var(--muted)}.bulk-selection-bar>span strong{color:var(--ink)}.bulk-selection-bar .button:disabled{opacity:.48;cursor:not-allowed;transform:none}.move-words-modal>select{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 11px;background:var(--surface-inset);color:var(--ink);font-size:12px}
html[data-theme=dark] .word-more-button{border-color:var(--line);color:var(--muted)}html[data-theme=dark] .word-more-button:hover,html[data-theme=dark] .word-action-sheet>[data-word-menu-action]:hover{background:var(--surface-hover)}html[data-theme=dark] .word-action-sheet{background:var(--surface-raised);border-color:var(--line)}html[data-theme=dark] .word-action-title{border-color:var(--line)}html[data-theme=dark] .word-action-sheet>[data-word-menu-action]{color:var(--ink)}html[data-theme=dark] .word-action-sheet>[data-word-menu-action].word-action-delete{color:#f0a08e}html[data-theme=dark] .bulk-selection-bar{background:var(--surface-inset);border-color:var(--line)}html[data-theme=dark] .bulk-selection-bar>span strong{color:var(--ink)}html[data-theme=dark] .move-words-modal>select{background:var(--surface-inset);border-color:var(--line);color:var(--ink)}
@media(max-width:760px){.bulk-selection-bar{top:4px;gap:6px;padding:9px}.bulk-selection-bar .button{min-height:38px;padding:8px 9px;font-size:10px}.bulk-selection-bar>span{width:100%;margin:0}.word-more-button{width:40px;height:40px;font-size:21px}.word-menu-backdrop{align-items:end;padding:12px}.word-action-sheet{width:100%;max-width:none;padding:14px;border-radius:18px 18px 12px 12px}.word-action-sheet>[data-word-menu-action]{min-height:52px;font-size:15px}.word-page-actions{gap:6px}.word-page-actions .button{padding:9px 10px;font-size:10px}}

/* Two-level vocabulary browser */
.library-search-row{display:flex;align-items:center;gap:12px;margin:0 0 16px}.library-search-row .search-box{flex:1;max-width:none}.library-result-count{font-size:11px;color:var(--muted);white-space:nowrap}.directory-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.directory-card{min-width:0;padding:18px;background:var(--white);border:1px solid var(--line);border-radius:13px;box-shadow:0 3px 15px #22313b04;transition:transform .15s,border-color .15s}.directory-card:hover{transform:translateY(-2px);border-color:var(--border-strong)}.directory-card-top{display:flex;justify-content:space-between;align-items:center}.directory-card-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--teal-pale);color:var(--teal);font-size:17px}.directory-count{font-size:10px;color:var(--muted)}.directory-card h2{margin:14px 0 6px;font-size:16px}.directory-preview{min-height:20px;margin:0 0 14px;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.directory-card .button{min-height:38px}.directory-breadcrumb{display:flex;align-items:center;gap:9px;margin:-12px 0 15px;color:var(--muted);font-size:11px}.directory-breadcrumb .text-link{font-size:11px}.directory-word-list{display:grid;gap:8px}.directory-word-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(90px,180px) 42px;align-items:center;gap:13px;padding:12px 14px;background:var(--white);border:1px solid var(--line);border-radius:11px;transition:border-color .15s}.directory-word-item:hover{border-color:var(--border-strong)}.directory-word-main{display:flex;align-items:center;gap:11px;min-width:0}.directory-word-copy{display:grid;grid-template-columns:minmax(95px,.7fr) minmax(100px,1fr);align-items:center;gap:13px;min-width:0;width:100%}.directory-word-copy strong{font-size:14px;overflow-wrap:anywhere}.directory-word-copy span{font-size:12px;color:var(--muted);overflow-wrap:anywhere}.directory-word-phonetic{font-size:12px;color:var(--muted);text-align:right;overflow-wrap:anywhere}.directory-word-item[hidden],.directory-card[hidden]{display:none!important}.library-empty{grid-column:1/-1;padding:35px;text-align:center}.library-empty strong,.library-empty span{display:block}.library-empty strong{font-size:14px}.library-empty span{margin-top:7px;color:var(--muted);font-size:12px}
html[data-theme=dark] .directory-card,html[data-theme=dark] .directory-word-item{background:var(--surface-raised);border-color:var(--line)}html[data-theme=dark] .directory-card:hover,html[data-theme=dark] .directory-word-item:hover{border-color:var(--border-strong)}html[data-theme=dark] .directory-card h2,html[data-theme=dark] .directory-word-copy strong{color:var(--ink)}html[data-theme=dark] .directory-preview,html[data-theme=dark] .directory-count,html[data-theme=dark] .directory-word-copy span,html[data-theme=dark] .directory-word-phonetic,html[data-theme=dark] .library-empty span{color:var(--muted)}
@media(max-width:1000px){.directory-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.directory-card-grid{grid-template-columns:1fr;gap:9px}.directory-card{padding:15px}.directory-card h2{margin-top:10px}.directory-word-item{grid-template-columns:minmax(0,1fr) 40px;gap:8px;padding:11px 10px}.directory-word-main{grid-column:1;grid-row:1}.directory-word-copy{grid-template-columns:1fr;gap:3px}.directory-word-copy strong{font-size:13px}.directory-word-copy span{font-size:11px}.directory-word-phonetic{grid-column:1;grid-row:2;text-align:left;padding-left:27px;font-size:11px}.directory-word-item>.word-more-button{grid-column:2;grid-row:1/3}.directory-word-item .word-select{width:17px;height:17px}.directory-breadcrumb{margin-top:-5px}.library-search-row{gap:8px}}

/* Compact, full-card directory entry */
.directory-card{padding:11px 13px;cursor:pointer}.directory-card-heading{display:flex;align-items:center;gap:9px;min-width:0}.directory-card-icon{width:29px;height:29px;flex:0 0 29px;border-radius:8px;font-size:14px}.directory-card .directory-card-heading h2{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:1.3}.directory-card .directory-count{margin-left:auto;white-space:nowrap;font-size:10px}.directory-card-arrow{margin-left:2px;color:var(--muted);font-size:17px;line-height:1}.directory-preview{min-height:0;margin:5px 0 0;padding-left:38px;font-size:10px;line-height:1.4}.directory-card:focus-visible{outline:2px solid var(--teal);outline-offset:2px}.directory-card:hover .directory-card-arrow{color:var(--teal);transform:translateX(2px)}
@media(max-width:760px){.directory-card-grid{gap:7px}.directory-card{padding:9px 11px;border-radius:11px}.directory-card-heading{gap:8px}.directory-card-icon{width:25px;height:25px;flex-basis:25px;border-radius:7px;font-size:12px}.directory-card .directory-card-heading h2{font-size:13px}.directory-card .directory-count{font-size:10px}.directory-card-arrow{font-size:16px}.directory-preview{padding-left:33px;margin-top:4px;font-size:10px;line-height:1.3}}
.startup-setting{grid-column:1/-1}.startup-setting>p{margin-bottom:12px}.startup-options{display:flex;gap:10px;flex-wrap:wrap}.startup-option{display:flex;align-items:center;gap:9px;min-height:42px;padding:9px 13px;border:1px solid var(--line);border-radius:9px;color:var(--ink);font-size:12px;cursor:pointer}.startup-option input{margin:0;accent-color:var(--teal)}.startup-option:has(input:checked){border-color:var(--border-strong);background:var(--teal-pale)}
html[data-theme=dark] .startup-option{border-color:var(--line);color:var(--ink)}html[data-theme=dark] .startup-option:has(input:checked){border-color:var(--border-strong);background:var(--accent-soft)}
@media(max-width:760px){.startup-options{display:grid;grid-template-columns:1fr}.startup-option{min-height:46px}}
.record-item,.directory-word-item{content-visibility:auto;contain-intrinsic-size:auto 58px}
.page-transition{animation:page-enter .2s cubic-bezier(.22,.61,.36,1) both;backface-visibility:hidden}
@keyframes page-enter{from{opacity:0;transform:translate3d(0,6px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(max-width:760px){.page-transition{animation-duration:.18s}}
@media(prefers-reduced-motion:reduce){.page-transition{animation:none}}

/* P0 sentence spelling */
.sentence-page{display:grid;gap:16px}.sentence-heading{align-items:center}.sentence-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.sentence-summary-grid>div,.sentence-linked-grid>div{display:flex;justify-content:space-between;align-items:center;gap:8px;min-width:0;padding:13px 15px;border:1px solid var(--line);border-radius:11px;background:var(--white)}.sentence-summary-grid span,.sentence-linked-grid span{color:var(--muted);font-size:11px}.sentence-summary-grid strong,.sentence-linked-grid strong{font:700 18px Manrope,sans-serif;color:var(--ink)}.sentence-launch{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px}.sentence-launch h2{margin:7px 0;font-size:17px}.sentence-launch p,.sentence-local-note{margin:0;color:var(--muted);font-size:12px;line-height:1.7}.sentence-samples{display:grid;gap:9px}.sentence-samples>.panel-head{margin:0 2px}.sentence-samples>.panel-head span,.sentence-history-panel .panel-head>span{color:var(--muted);font-size:11px}.sentence-sample{display:grid;grid-template-columns:130px minmax(0,1fr) auto;align-items:center;gap:13px;padding:13px 15px;background:var(--white);border:1px solid var(--line);border-radius:10px}.sentence-sample>span,.sentence-sample>small{font-size:11px;color:var(--muted)}.sentence-sample strong{font-size:13px}.sentence-local-note{padding:0 3px}.sentence-practice-card{max-width:850px;width:100%;margin:0 auto;padding:clamp(18px,4vw,34px)}.sentence-practice-top{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:11px;flex-wrap:wrap}.sentence-progress{height:5px;margin:13px 0 29px;border-radius:10px;background:var(--line);overflow:hidden}.sentence-progress span{display:block;height:100%;border-radius:inherit;background:var(--teal);transition:width .2s ease}.sentence-prompt-label,.sentence-step-label{text-align:center;color:var(--muted);font-size:11px}.sentence-chinese{text-align:center;margin:9px 0 23px;font-size:clamp(20px,4vw,28px);line-height:1.45}.sentence-step-label{color:var(--teal);font-weight:650}.sentence-answer-slots{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:3px;min-height:44px;margin:15px auto 16px;font:600 clamp(19px,4vw,24px) Manrope,sans-serif;letter-spacing:1px;color:var(--muted)}.sentence-slot{display:inline-grid;place-items:center;min-width:14px;height:30px;border-bottom:1.5px solid var(--line)}.sentence-slot.revealed{color:var(--teal);border-color:var(--teal)}.sentence-slot.punctuation{color:var(--muted);border-color:var(--line)}.sentence-audio-row{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 12px}.sentence-audio-row>span{color:var(--muted);font-size:10px}.sentence-answer-input{display:block;width:min(100%,560px);height:54px;margin:0 auto;padding:12px 16px;border:1px solid var(--line);border-radius:10px;outline:0;background:var(--white);color:var(--ink);text-align:center;font:600 18px Manrope,'Noto Sans SC',sans-serif;transition:border-color .15s,box-shadow .15s}.sentence-answer-input:focus{border-color:var(--teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 14%,transparent)}.sentence-answer-input:disabled{opacity:.8}.sentence-answer-input::placeholder{color:var(--muted);font:400 12px 'DM Sans','Noto Sans SC',sans-serif}.sentence-status{min-height:27px;padding:8px 3px 0;text-align:center;color:var(--muted);font-size:12px}.sentence-status.correct{color:#26815f;font-weight:700}.sentence-status.wrong,.sentence-status.error{color:#d47763;font-weight:650}.sentence-controls{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:8px}.sentence-controls button:disabled{opacity:.5;cursor:not-allowed;transform:none}.sentence-key-help{text-align:center;margin-top:18px;color:var(--muted);font-size:10px}.sentence-key-help kbd{display:inline-block;margin:0 3px;padding:3px 5px;border:1px solid var(--line);border-radius:5px;background:var(--canvas);font:inherit}.sentence-session-foot{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:11px}.sentence-complete{text-align:center;padding:clamp(25px,5vw,52px) 20px}.sentence-complete-mark{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 14px;border-radius:50%;background:var(--teal-pale);color:var(--teal);font-size:24px}.sentence-complete h2{margin:0 0 8px;font-size:21px}.sentence-complete p{margin:0 0 20px;color:var(--muted);font:500 16px Manrope,sans-serif}.sentence-linked-stats{margin-bottom:16px;padding:18px}.sentence-linked-stats .panel-head a{color:var(--teal);font-size:11px;font-weight:650}.sentence-linked-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.sentence-linked-grid>div{padding:10px 12px}.sentence-linked-grid strong{font-size:15px}.sentence-history-panel{margin-bottom:18px;padding:18px}.sentence-history-panel .record-result{white-space:nowrap}.sentence-screen{animation:page-enter .18s ease both}
html[data-theme="dark"] .sentence-sample,html[data-theme="dark"] .sentence-summary-grid>div,html[data-theme="dark"] .sentence-linked-grid>div,html[data-theme="dark"] .sentence-answer-input{background:var(--surface-inset);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .sentence-practice-card,html[data-theme="dark"] .sentence-launch,html[data-theme="dark"] .sentence-complete,html[data-theme="dark"] .sentence-history-panel,html[data-theme="dark"] .sentence-linked-stats{background:var(--white);border-color:var(--line)}
@media(max-width:760px){.sentence-page{gap:11px}.sentence-heading{display:flex;align-items:flex-start}.sentence-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.sentence-summary-grid>div{padding:10px 11px}.sentence-summary-grid strong{font-size:16px}.sentence-launch{align-items:stretch;flex-direction:column;padding:17px}.sentence-launch .button{width:100%}.sentence-sample{grid-template-columns:1fr auto;gap:4px 10px;padding:11px 12px}.sentence-sample>span{grid-column:1/-1}.sentence-sample strong{font-size:12px}.sentence-sample>small{grid-column:2;grid-row:2;text-align:right;white-space:nowrap}.sentence-practice-card{padding:17px 13px}.sentence-practice-top{font-size:10px}.sentence-practice-top span:last-child{width:100%;text-align:center}.sentence-progress{margin:11px 0 23px}.sentence-answer-slots{min-height:38px;gap:2px;font-size:19px}.sentence-slot{min-width:11px;height:26px}.sentence-answer-input{height:50px;font-size:17px}.sentence-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.sentence-controls .button{min-height:43px;padding:9px 10px;font-size:11px}.sentence-controls .button-primary{grid-column:1/-1;grid-row:1}.sentence-session-foot{gap:7px 14px;font-size:10px}.sentence-key-help{line-height:2}.sentence-linked-stats,.sentence-history-panel{padding:14px}.sentence-linked-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sentence-history-panel .record-item{grid-template-columns:1fr auto;gap:5px 8px;padding:11px}.sentence-history-panel .record-item>span:nth-child(2){display:block;grid-column:1;font-size:9px}.sentence-history-panel .record-result{grid-column:2;grid-row:1/3;white-space:normal;text-align:right}.sentence-complete p{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.sentence-screen,.sentence-progress span{animation:none;transition:none}}

/* P2 FSRS spaced review */
.review-home-panel{margin:0 0 21px;padding:18px 20px}.review-home-panel .panel-head{margin-bottom:13px}.review-home-panel .panel-head a,.review-linked-panel .panel-head a{font-size:11px;color:var(--teal);font-weight:650}.review-home-subtitle{display:block;margin-top:4px;color:var(--muted);font-size:10px}.review-home-numbers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.review-home-numbers>div{display:grid;gap:4px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--canvas)}.review-home-numbers strong{font:750 20px Manrope,sans-serif;color:var(--ink)}.review-home-numbers span{font-size:10px;color:var(--muted)}.review-home-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;color:var(--muted);font-size:11px}.review-home-footer .button:disabled,.review-plan-actions .button:disabled{opacity:.48;cursor:not-allowed;transform:none}.review-page{display:grid;gap:15px}.review-dashboard-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.review-stat{display:grid;gap:9px;padding:14px 16px;border:1px solid var(--line);border-radius:11px;background:var(--white)}.review-stat span{font-size:10px;color:var(--muted)}.review-stat strong{font:750 22px Manrope,sans-serif;color:var(--ink)}.review-plan-panel{padding:19px 20px}.review-plan-panel .panel-head>div:first-child{display:grid;gap:4px}.review-plan-panel .panel-head h2{margin:0;font-size:15px}.review-plan-panel .panel-head span{font-size:10px;color:var(--muted)}.review-scope{display:flex;gap:4px;padding:3px;border:1px solid var(--line);border-radius:9px;background:var(--canvas)}.review-scope button{border:0;border-radius:6px;background:transparent;color:var(--muted);padding:7px 10px;font-size:10px}.review-scope button.active{background:var(--white);color:var(--teal);font-weight:700;box-shadow:0 1px 4px #15252b12}.review-queue-list{display:grid;gap:7px}.review-queue-item{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--white)}.review-queue-item>div{display:grid;gap:4px;min-width:0}.review-queue-item strong{font-size:12px;overflow-wrap:anywhere}.review-queue-item span,.review-queue-item small{font-size:10px;color:var(--muted)}.review-queue-item small{text-align:right;white-space:nowrap}.review-more-note{padding:8px;text-align:center;color:var(--muted);font-size:10px}.review-empty{display:grid;justify-items:center;gap:7px;padding:28px 15px;text-align:center}.review-empty-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:var(--teal-pale);color:var(--teal);font-size:16px}.review-empty strong{font-size:13px}.review-empty span{max-width:480px;color:var(--muted);font-size:11px;line-height:1.6}.review-plan-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;padding-top:13px;border-top:1px solid var(--line)}.review-scope-note,.review-method-note{color:var(--muted);font-size:10px;line-height:1.7}.review-method-note{margin:0;padding:0 3px}.review-session-heading{align-items:center}.review-session-card{max-width:780px;width:100%;margin:0 auto;padding:clamp(18px,4vw,33px)}.review-session-top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:10px}.review-control-row{display:flex;align-items:center;justify-content:center;gap:10px;min-height:40px;margin-bottom:10px}.review-audio-error{font-size:10px;color:#d47763}.review-prompt-label{text-align:center;color:var(--muted);font-size:10px}.review-translation{text-align:center;margin:10px 0 20px;font-size:clamp(21px,4vw,28px);line-height:1.5}.review-audio-prompt{display:grid;justify-items:center;gap:8px;margin:14px auto 20px;color:var(--muted);text-align:center}.review-audio-prompt>span{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--teal-pale);color:var(--teal);font-size:21px}.review-audio-prompt p{margin:0;font-size:12px}.review-phonetic{text-align:center;margin:-12px 0 18px;color:var(--muted);font-size:12px}.review-hint{max-width:620px;margin:0 auto 13px;text-align:center;overflow-wrap:anywhere;color:var(--muted);font:600 16px/1.8 Manrope,sans-serif;letter-spacing:3px}.review-hint strong{color:var(--teal)}.review-hint i{font-style:normal}.review-answer-input{display:block;width:min(100%,600px);height:52px;margin:0 auto;padding:12px 15px;border:1px solid var(--line);border-radius:10px;outline:0;background:var(--white);color:var(--ink);text-align:center;font:600 17px Manrope,'Noto Sans SC',sans-serif;transition:border-color .15s,box-shadow .15s}.review-answer-input:focus{border-color:var(--teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 14%,transparent)}.review-answer-input.has-errors{border-color:#d47763;box-shadow:0 0 0 3px color-mix(in srgb,#d47763 12%,transparent)}.review-answer-input:disabled{opacity:.8}.review-answer-input::placeholder{color:var(--muted);font:400 12px 'DM Sans','Noto Sans SC',sans-serif}.review-error-echo{text-align:center;margin-top:8px;overflow-wrap:anywhere;color:var(--muted);font:500 13px/1.7 Manrope,'Noto Sans SC',sans-serif}.review-error-echo .is-error{color:#d35f50;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.review-answer-reveal{display:flex;justify-content:center;align-items:center;gap:9px;margin:12px 0;color:var(--muted);font-size:11px}.review-answer-reveal strong{color:var(--teal);font:700 14px Manrope,sans-serif}.review-status{min-height:28px;padding-top:9px;text-align:center;color:var(--muted);font-size:11px}.review-status.correct{color:#26815f;font-weight:700}.review-status.wrong{color:#d47763;font-weight:700}.review-status.revealed,.review-status.skipped{color:var(--muted)}.review-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:7px}.review-scheduling-note{text-align:center;margin-top:17px;color:var(--muted);font-size:10px;line-height:1.6}.review-linked-panel{margin-bottom:16px;padding:18px}.review-linked-panel .panel-head h3{margin:0;font-size:13px}.review-linked-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.review-linked-metrics>div{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--canvas)}.review-linked-metrics span{color:var(--muted);font-size:10px}.review-linked-metrics strong{color:var(--ink);font:700 15px Manrope,sans-serif}
html[data-theme="dark"] .review-home-numbers>div,html[data-theme="dark"] .review-queue-item,html[data-theme="dark"] .review-stat,html[data-theme="dark"] .review-linked-metrics>div{background:var(--surface-inset);border-color:var(--line)}html[data-theme="dark"] .review-scope button.active{background:var(--accent-soft);color:var(--accent-primary);box-shadow:none}html[data-theme="dark"] .review-audio-prompt>span{background:var(--surface-quiet);color:var(--accent-primary)}html[data-theme="dark"] .review-error-echo .is-error{color:#ff9b88}
@media(max-width:760px){.review-home-panel{padding:15px}.review-home-numbers{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.review-home-footer{align-items:flex-start;flex-direction:column}.review-dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.review-stat{padding:11px 12px;gap:6px}.review-stat strong{font-size:19px}.review-plan-panel{padding:14px}.review-plan-panel>.panel-head{align-items:flex-start;flex-direction:column;gap:10px}.review-scope{width:100%;justify-content:space-between}.review-scope button{flex:1}.review-queue-item{align-items:flex-start;padding:9px}.review-queue-item strong{font-size:11px}.review-queue-item small{font-size:9px;white-space:normal;max-width:100px}.review-plan-actions{align-items:stretch;flex-direction:column}.review-plan-actions .button{width:100%;min-height:43px}.review-session-heading{align-items:flex-start}.review-session-heading>.button{white-space:nowrap}.review-session-card{padding:17px 13px}.review-session-top{font-size:9px}.review-session-top span:last-child{width:100%;text-align:center}.review-translation{font-size:22px;margin:8px 0 17px}.review-answer-input{height:49px;font-size:16px}.review-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.review-actions .button{min-height:42px;padding:9px 8px;font-size:10px}.review-actions .button-primary{grid-column:1/-1;grid-row:1}.review-linked-panel{padding:14px}.review-linked-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.review-linked-metrics>div{padding:9px}.review-linked-metrics strong{font-size:13px}}
.study-picker{width:min(100%,560px);margin:18px auto 0;text-align:left}.study-scope-options{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}.study-scope-option{display:flex;align-items:center;gap:7px;min-height:38px;padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:var(--white);color:var(--muted);font-size:11px;cursor:pointer}.study-scope-option input,.study-category-option input{margin:0;accent-color:var(--teal)}.study-scope-option:has(input:checked){border-color:var(--teal);background:var(--teal-pale);color:var(--teal);font-weight:650}.study-category-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:180px;overflow:auto;margin-top:10px;padding:1px}.study-category-options[hidden]{display:none}.study-category-option{display:flex;align-items:center;gap:8px;min-width:0;min-height:39px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--white);color:var(--ink);font-size:11px;cursor:pointer}.study-category-option span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.study-category-option small{margin-left:auto;color:var(--muted);font-size:10px}.study-category-empty{grid-column:1/-1;padding:10px;color:var(--muted);font-size:11px}.study-launch-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding-top:11px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.study-launch-summary strong{color:var(--ink);font-size:15px}.study-launch-summary .button:disabled{opacity:.48;cursor:not-allowed;transform:none}
@media(max-width:760px){.study-picker{margin-top:15px}.study-scope-options{justify-content:flex-start;display:grid;grid-template-columns:1fr 1fr}.study-scope-option{min-height:42px;padding:8px 9px}.study-scope-option:last-child{grid-column:1/-1}.study-category-options{grid-template-columns:1fr;max-height:210px}.study-category-option{min-height:43px}.study-launch-summary{align-items:center}}

/* Word spelling: clear round sizing, compact study stats, and keyboard-safe touch targets. */
.study-round-control{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;color:var(--muted);font-size:11px}
.study-round-control select{width:min(220px,55%);min-height:39px;border:1px solid var(--line);border-radius:9px;padding:7px 10px;background:var(--surface-raised);color:var(--ink)}
.study-launch-summary>div{display:grid;gap:4px}
.study-launch-summary>div>span{font-size:10px;color:var(--muted)}
.study-launch-summary>div>strong{font-size:13px;color:var(--ink)}
.study-topline{align-items:center;gap:12px;flex-wrap:wrap}
.study-topline>span:last-child{text-align:right}
.study-topline-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}
.study-topline-actions>span{text-align:right}
.study-end-round{white-space:nowrap}
.study-round-summary{padding:32px 22px}
.study-round-summary .study-summary-actions{display:flex;justify-content:center;gap:8px;margin-top:17px;flex-wrap:wrap}
.study-below{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.study-stat{min-width:0;padding:13px 15px}
.study-stat span{font-size:10px}
.study-stat strong{font-size:15px;overflow-wrap:anywhere}
.study-controls{flex-wrap:wrap}
.study-controls .button{min-height:42px}
.answer-input{width:100%;min-width:0}
@media(max-width:760px){
  .study-topline{align-items:stretch;flex-direction:column;gap:8px}
  .study-topline-actions{justify-content:space-between;gap:8px}
  .study-topline-actions>span{text-align:left}
  .study-below{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .study-stat{padding:11px 10px}
  .study-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .study-controls .button{width:100%;min-height:43px;padding-inline:8px;font-size:10px}
  .study-controls .button-primary{grid-column:1/-1}
  .study-round-summary .study-summary-actions{display:grid;grid-template-columns:1fr;width:100%}
  .study-round-summary .study-summary-actions .button{width:100%;min-height:43px}
}
@media(max-width:380px){.study-round-control{align-items:flex-start;flex-direction:column}.study-round-control select{width:100%}.study-launch-summary{align-items:stretch;flex-direction:column}.study-launch-summary .button{width:100%}}
html[data-theme="dark"] .study-round-control select{background:var(--surface-inset);color:var(--ink);border-color:var(--line)}

/* P0 sentence practice mode selection and verified sentence completion */
.sentence-mode-picker{display:grid;gap:7px;margin-top:15px}.sentence-mode-picker>span{font-size:10px;font-weight:650;color:var(--muted)}.sentence-mode-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.sentence-mode-option{display:grid;gap:3px;min-width:0;padding:8px 9px;border:1px solid var(--line);border-radius:9px;background:var(--white);color:var(--ink);text-align:left}.sentence-mode-option strong{font-size:10px;white-space:nowrap}.sentence-mode-option small{color:var(--muted);font-size:9px;white-space:nowrap}.sentence-mode-option.active{border-color:color-mix(in srgb,var(--teal) 50%,var(--line));background:var(--teal-pale);color:var(--teal)}.sentence-mode-option.active small{color:var(--teal)}.sentence-practice-card>.sentence-mode-picker{margin:0 0 16px}.sentence-error-echo{width:min(100%,560px);margin:8px auto 0;text-align:center;overflow-wrap:anywhere;color:var(--muted);font:500 13px/1.7 Manrope,'Noto Sans SC',sans-serif}.sentence-char-error{color:#d35f50;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.sentence-answer-input.has-errors{border-color:#d47763;box-shadow:0 0 0 3px color-mix(in srgb,#d47763 13%,transparent)}.sentence-incomplete-note{color:var(--muted)!important;font:400 13px/1.7 'DM Sans','Noto Sans SC',sans-serif!important}.sentence-complete.incomplete .sentence-complete-mark{background:color-mix(in srgb,var(--muted) 14%,var(--white));color:var(--muted)}.sentence-linked-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
html[data-theme="dark"] .sentence-mode-option{background:var(--accent-soft);border-color:var(--line);color:var(--ink)}html[data-theme="dark"] .sentence-mode-option.active{background:color-mix(in srgb,var(--teal) 18%,var(--accent-soft));border-color:color-mix(in srgb,var(--teal) 60%,var(--border-strong));color:var(--accent-primary)}html[data-theme="dark"] .sentence-mode-option.active small{color:var(--accent-primary)}html[data-theme="dark"] .sentence-char-error{color:#ff9b88}
@media(max-width:760px){.sentence-mode-picker{margin-top:11px}.sentence-mode-options{gap:5px}.sentence-mode-option{padding:8px 6px}.sentence-mode-option strong{font-size:9px}.sentence-mode-option small{font-size:8px}.sentence-practice-card>.sentence-mode-picker{margin-bottom:12px}.sentence-linked-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* New Concept English course import and study picker */
.nce-import-modal{width:min(100%,1120px);max-height:94dvh;display:flex;flex-direction:column;padding:20px 22px}
.nce-import-summary{display:grid;gap:5px;margin:2px 0 13px;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--teal-pale);color:var(--muted);font-size:11px;line-height:1.55}
.nce-import-summary strong{color:var(--ink);font-size:13px}
.nce-import-summary .nce-source-fallback{color:var(--accent-primary)}
.nce-import-preview{min-height:0;max-height:49vh;overflow:auto;padding-right:3px}
.nce-book-quick-select{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:0 0 5px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface-muted)}
.nce-book-quick-select>span{margin-right:3px;color:var(--muted);font-size:11px;font-weight:600}
.nce-book-quick-select .is-selected{border-color:var(--teal);background:var(--teal-pale);color:var(--teal);box-shadow:0 0 0 1px color-mix(in srgb,var(--teal) 18%,transparent)}
.nce-book-quick-select button:disabled{opacity:.5;cursor:not-allowed}
.nce-preview-columns,.nce-word-preview-row{display:grid;grid-template-columns:minmax(100px,1.1fr) minmax(85px,.9fr) minmax(70px,.65fr) minmax(130px,1.45fr) minmax(135px,1.3fr);align-items:center;gap:10px}
.nce-preview-columns{position:sticky;top:0;z-index:3;padding:8px 11px;background:var(--surface-muted);color:var(--muted);font-size:10px}
.nce-book-preview,.nce-lesson-preview{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.nce-book-preview{margin:8px 0;background:var(--white)}
.nce-book-preview>summary,.nce-lesson-preview>summary{display:flex;align-items:center;gap:10px;min-height:39px;padding:9px 11px;cursor:pointer;list-style:none;color:var(--ink);font-size:11px}
.nce-book-preview>summary::-webkit-details-marker,.nce-lesson-preview>summary::-webkit-details-marker{display:none}
.nce-book-preview>summary::before,.nce-lesson-preview>summary::before{content:'›';color:var(--teal);font-size:17px;line-height:1;transition:transform .15s}
.nce-book-preview[open]>summary::before,.nce-lesson-preview[open]>summary::before{transform:rotate(90deg)}
.nce-book-preview>summary span,.nce-lesson-preview>summary span{margin-left:auto;color:var(--muted);font-weight:400}
.nce-book-select-row{padding:0 9px 8px}
.nce-book-select,.nce-lesson-select{display:flex;align-items:center;gap:9px;min-height:37px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface-muted);color:var(--ink);font-size:11px;cursor:pointer}
.nce-book-select input,.nce-lesson-select input{flex:0 0 auto;margin:0;accent-color:var(--teal);width:16px;height:16px}
.nce-book-select small,.nce-lesson-select small{margin-left:auto;color:var(--muted);font-size:10px;white-space:nowrap}
.nce-book-select.is-imported,.nce-lesson-select.is-imported{color:var(--muted);cursor:default}
.nce-book-select input:disabled,.nce-lesson-select input:disabled{opacity:.5}
.nce-lessons-preview{padding:0 8px 8px}
.nce-lesson-preview{margin-top:6px;background:var(--surface-muted)}
.nce-lesson-preview>summary{min-height:35px;padding:7px 10px;font-size:10px}
.nce-lesson-option{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(125px,.35fr);align-items:center;gap:7px;margin-top:6px}
.nce-lesson-option .nce-lesson-select{min-width:0}
.nce-lesson-option .nce-lesson-preview{margin:0}
.nce-lesson-option .nce-lesson-preview>summary{min-height:37px;justify-content:center;padding:6px 9px;white-space:nowrap}
.nce-import-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-shrink:0;padding-top:12px;border-top:1px solid var(--line)}
.nce-word-preview-list{padding:2px 9px 7px;background:var(--white)}
.nce-word-preview-row{min-height:34px;padding:6px 2px;border-bottom:1px solid var(--line);font-size:10px;color:var(--muted)}
.nce-word-preview-row:last-child{border-bottom:0}
.nce-word-preview-row strong{color:var(--ink);font-size:11px;overflow-wrap:anywhere}
.nce-word-preview-row span{overflow-wrap:anywhere}
.nce-word-preview-row small{font-size:9px;line-height:1.35}
.nce-import-note{padding-top:9px;color:var(--muted);font-size:10px;line-height:1.55}
.nce-import-note a{color:var(--teal)}
.nce-import-message{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:140px;color:var(--muted);font-size:13px}
.nce-import-message.is-error{color:#b85d4c}
.nce-import-modal .modal-actions{flex-shrink:0;padding-top:13px}
.study-newconcept-options{display:grid;gap:9px;margin-top:10px;padding:11px;border:1px solid var(--line);border-radius:10px;background:var(--white)}
.study-newconcept-options[hidden]{display:none}
.study-course-book-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;color:var(--muted);font-size:11px}
.study-course-book-row .select-control{width:100%;min-width:0}
.study-course-all{display:flex;align-items:center;gap:8px;min-height:36px;color:var(--ink);font-size:11px}
.study-course-all input{margin:0;accent-color:var(--teal)}
.study-course-lessons{max-height:230px;margin-top:0}
.nce-other-words{margin-top:22px}
.nce-other-words h3{margin:0 0 10px;color:var(--ink);font-size:13px}
html[data-theme=dark] .nce-import-summary{background:var(--surface-inset);border-color:var(--line)}
html[data-theme=dark] .nce-book-preview,html[data-theme=dark] .nce-word-preview-list,html[data-theme=dark] .study-newconcept-options{background:var(--surface-raised)}
html[data-theme=dark] .nce-book-preview>summary,html[data-theme=dark] .nce-lesson-preview>summary{color:var(--ink)}
html[data-theme=dark] .nce-lesson-preview{background:var(--surface-raised)}
html[data-theme=dark] .nce-book-select,html[data-theme=dark] .nce-lesson-select{background:var(--surface-inset);border-color:var(--line);color:var(--ink)}
html[data-theme=dark] .nce-book-select.is-imported,html[data-theme=dark] .nce-lesson-select.is-imported{color:var(--muted)}
html[data-theme=dark] .nce-word-preview-row{border-color:var(--line)}
html[data-theme=dark] .nce-word-preview-row strong,html[data-theme=dark] .nce-import-summary strong,html[data-theme=dark] .nce-other-words h3{color:var(--ink)}
html[data-theme=dark] .nce-import-summary .nce-source-fallback{color:var(--accent-primary)}
html[data-theme=dark] .nce-preview-columns{background:var(--surface-raised)}
@media(max-width:760px){.nce-import-modal{width:100%;max-height:96dvh;padding:14px 12px}.nce-import-summary{padding:10px;font-size:10px}.nce-import-preview{max-height:48dvh}.nce-preview-columns{display:none}.nce-word-preview-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 9px;padding:8px 3px}.nce-word-preview-row strong{font-size:11px}.nce-word-preview-row span:nth-of-type(1){text-align:right}.nce-word-preview-row span:nth-of-type(2){display:none}.nce-word-preview-row small{grid-column:1/-1}.nce-import-note{font-size:9px}.nce-import-footer{position:sticky;bottom:0;align-items:center;gap:8px;background:var(--white);padding-top:10px}.nce-import-footer .modal-actions{padding-top:0}.nce-lesson-option{grid-template-columns:minmax(0,1fr) auto;gap:6px}.nce-lesson-select{min-height:42px;padding:6px 8px;gap:7px;font-size:10px}.nce-lesson-select small{font-size:9px}.nce-lesson-option .nce-lesson-preview>summary{min-height:42px;padding:6px 8px;font-size:9px}.nce-book-select{min-height:40px}.study-course-book-row{grid-template-columns:1fr}.study-course-lessons{max-height:190px}.nce-import-message{align-items:flex-start;flex-direction:column;justify-content:center}}

/* P1 sentence dictation */
.dictation-page{max-width:960px;margin:0 auto}
.dictation-launch{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:18px;padding:22px 24px}
.dictation-launch>div{flex:1;min-width:0}
.dictation-launch h2{margin:4px 0 5px;color:var(--ink);font:700 20px Manrope,'Noto Sans SC',sans-serif}
.dictation-launch p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}
.dictation-mode-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}
.dictation-mode-option{display:grid;gap:5px;min-height:63px;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--white);color:var(--ink);text-align:left;cursor:pointer}
.dictation-mode-option strong{font-size:12px}
.dictation-mode-option small{color:var(--muted);font-size:10px}
.dictation-mode-option.active{border-color:color-mix(in srgb,var(--teal) 55%,var(--line));background:var(--teal-pale);color:var(--teal)}
.dictation-mode-option.active small{color:var(--teal)}
.dictation-launch>.button{flex:0 0 auto}
.dictation-preferences{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:12px;padding:13px 16px}
.dictation-preferences>div{display:grid;gap:3px}
.dictation-preferences strong{font-size:11px;color:var(--ink)}
.dictation-preferences span{font-size:10px;color:var(--muted)}
.dictation-preferences select,.dictation-controls select{min-height:36px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--white);color:var(--ink);font:600 11px 'DM Sans','Noto Sans SC',sans-serif}
.dictation-card{max-width:780px;margin:18px auto 0;padding:22px 24px}
.dictation-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:11px}
.dictation-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:17px 0 19px}
.dictation-controls label{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:10px}
.dictation-controls select{min-height:34px;padding:6px 8px}
.dictation-audio-error{flex:1;min-width:140px;color:#ba6657;font-size:10px}
.dictation-prompt-label{margin:4px 0 8px;color:var(--muted);font-size:10px;font-weight:650}
.dictation-translation{margin:0 0 19px;color:var(--ink);font:650 22px/1.65 Manrope,'Noto Sans SC',sans-serif;overflow-wrap:anywhere}
.dictation-listen-prompt{display:flex;align-items:center;gap:13px;min-height:73px;margin:4px 0 19px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface-muted)}
.dictation-listen-prompt p{margin:0;color:var(--muted);font-size:12px;line-height:1.7}
.dictation-sound-mark{display:grid;flex:0 0 40px;width:40px;height:40px;place-items:center;border-radius:12px;background:var(--teal-pale);color:var(--teal);font-size:20px}
.dictation-hint-mask{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin:-4px 0 13px;color:var(--muted);font:600 15px/1.7 'DM Sans',sans-serif;overflow-wrap:anywhere}
.dictation-slot{min-width:11px;text-align:center;color:var(--muted)}
.dictation-slot.revealed{color:var(--teal)}
.dictation-slot.punctuation{opacity:.55}
.dictation-answer{display:block;width:100%;min-height:54px;padding:14px 15px;border:1px solid var(--line);border-radius:11px;background:var(--surface-muted);color:var(--ink);font:500 16px/1.55 'DM Sans','Noto Sans SC',sans-serif;outline:none;transition:border-color .15s,box-shadow .15s}
.dictation-answer:focus{border-color:var(--teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 14%,transparent)}
.dictation-answer:disabled{opacity:.8}
.dictation-answer.has-errors{border-color:#d47763;box-shadow:0 0 0 3px color-mix(in srgb,#d47763 12%,transparent)}
.dictation-error-echo{margin-top:9px;color:var(--muted);text-align:center;font:500 13px/1.7 'DM Sans','Noto Sans SC',sans-serif;overflow-wrap:anywhere}
.dictation-char-error{color:#d35f50;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.dictation-revealed-answer{display:grid;gap:5px;margin-top:11px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--surface-muted)}
.dictation-revealed-answer span{color:var(--muted);font-size:10px}
.dictation-revealed-answer strong{color:var(--ink);font:600 14px/1.6 'DM Sans',sans-serif;overflow-wrap:anywhere}
.dictation-status{min-height:22px;margin-top:8px;color:var(--muted);font-size:11px;line-height:1.65}
.dictation-status.wrong{color:#bd5d4d}
.dictation-status.correct{color:var(--teal);font-weight:650}
.dictation-status.revealed,.dictation-status.skipped{color:var(--muted)}
.dictation-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:13px}
.dictation-actions .button-primary{margin-left:auto}
.dictation-tolerance-note{margin:10px 0 0;color:var(--muted);font-size:9px;line-height:1.5}
.dictation-key-help{display:flex;align-items:center;gap:7px;margin-top:14px;color:var(--muted);font-size:9px}
.dictation-key-help kbd{padding:3px 6px;border:1px solid var(--line);border-radius:5px;background:var(--surface-muted);font:600 9px 'DM Sans',sans-serif}
html[data-theme="dark"] .dictation-mode-option{background:var(--accent-soft);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .dictation-mode-option.active{background:color-mix(in srgb,var(--teal) 18%,var(--accent-soft));border-color:color-mix(in srgb,var(--teal) 60%,var(--border-strong));color:var(--accent-primary)}
html[data-theme="dark"] .dictation-mode-option.active small{color:var(--accent-primary)}
html[data-theme="dark"] .dictation-preferences select,html[data-theme="dark"] .dictation-controls select{color-scheme:dark;background:var(--surface-inset);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .dictation-listen-prompt,html[data-theme="dark"] .dictation-answer,html[data-theme="dark"] .dictation-revealed-answer{background:var(--surface-raised);border-color:var(--line)}
html[data-theme="dark"] .dictation-char-error{color:#ff9b88}
html[data-theme="dark"] .dictation-status.wrong,html[data-theme="dark"] .dictation-audio-error{color:#f0a08e}
@media(max-width:760px){.dictation-launch{align-items:stretch;flex-direction:column;gap:16px;margin-top:14px;padding:17px 15px}.dictation-launch h2{font-size:18px}.dictation-launch>.button{width:100%;justify-content:center}.dictation-mode-picker{gap:7px;margin-top:13px}.dictation-mode-option{min-height:58px;padding:10px}.dictation-card{margin-top:13px;padding:16px 13px}.dictation-topline{font-size:10px}.dictation-controls{gap:8px;margin:13px 0 15px}.dictation-controls>.button{min-height:39px;padding:8px 10px}.dictation-audio-error{flex-basis:100%}.dictation-translation{font-size:19px;margin-bottom:15px}.dictation-listen-prompt{min-height:68px;margin-bottom:15px;padding:12px}.dictation-answer{min-height:52px;font-size:15px}.dictation-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.dictation-actions .button{min-height:42px;padding:8px 7px;font-size:10px}.dictation-actions .button-primary{grid-column:1/-1;margin:0}.dictation-key-help{flex-wrap:wrap;margin-top:12px}.dictation-preferences{padding:11px 12px}}
@media(prefers-reduced-motion:reduce){.dictation-answer{transition:none}}

/* Home quick actions: compact, readable and theme-aware */
.quick-actions{gap:8px}
.quick-action{min-height:60px;gap:11px;padding:9px 11px;border-radius:11px;transition:background-color .16s ease,border-color .16s ease,transform .16s ease}
.quick-action-icon,.quick-action .quick-action-icon{display:grid;flex:0 0 36px;width:36px;height:36px;place-items:center;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:inherit;font-size:18px;line-height:1}
.quick-action:nth-child(1) .quick-action-icon{font-size:18px}
.quick-action:nth-child(2) .quick-action-icon{font-size:15px}
.quick-action:nth-child(3) .quick-action-icon{font-size:14px}
.quick-action .quick-action-emoji{display:grid;width:26px;height:26px;place-items:center;margin:0;font-size:18px;line-height:1;transform:translateY(-.5px)}
.quick-action:nth-child(1) .quick-action-emoji{font-size:18px}
.quick-action:nth-child(2) .quick-action-emoji{font-size:15px}
.quick-action:nth-child(3) .quick-action-emoji{font-size:14px}
.quick-action .quick-action-copy{display:grid;flex:1;min-width:0;gap:3px}
.quick-action .quick-action-copy strong{display:block;overflow:hidden;color:var(--ink);font-size:11px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.quick-action .quick-action-copy>span{display:block;margin:0;overflow:hidden;color:var(--muted);font-size:9px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}
.quick-action .quick-action-arrow{display:grid;flex:0 0 20px;place-items:center;margin:0;color:var(--muted);font-size:15px;transition:transform .16s ease,color .16s ease}
.quick-action:hover{background:var(--surface-hover);border-color:var(--border-strong)}
.quick-action:hover .quick-action-arrow{color:var(--teal);transform:translateX(2px)}
.quick-action:active{transform:scale(.99)}
.quick-action:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
html[data-theme=dark] .quick-action-icon{background:transparent;box-shadow:none;color:inherit}
html[data-theme=dark] .quick-action{background:var(--surface-raised)}
html[data-theme=dark] .quick-action:hover{background:var(--surface-hover);border-color:var(--border-strong)}
@media(max-width:760px){.quick-actions{gap:7px}.quick-action{min-height:56px;gap:10px;padding:8px 10px}.quick-action-icon,.quick-action .quick-action-icon{flex-basis:36px;width:36px;height:36px}.quick-action .quick-action-emoji{width:25px;height:25px}}
@media(prefers-reduced-motion:reduce){.quick-action,.quick-action .quick-action-arrow{transition:none}}

.notebook-tabs{display:flex;gap:7px;margin:0 0 14px;padding:5px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--white) 82%,var(--canvas));width:max-content;max-width:100%}
.notebook-tab{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:7px 12px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:12px;font-weight:650}
.notebook-tab span{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:12px;background:color-mix(in srgb,var(--line) 62%,var(--white));font-size:10px}
.notebook-tab.active{background:var(--white);color:var(--teal);box-shadow:0 2px 7px rgba(30,45,50,.07)}
.notebook-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.notebook-toolbar .search-box{flex:1 1 220px;min-width:160px}
.notebook-toolbar .search-box input{width:100%}
.notebook-filter-label{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px}
.notebook-filter-label .select-control{min-width:130px}
.notebook-history-toggle{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px}
.notebook-hint{color:var(--muted);font-size:11px}
.notebook-practice-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.notebook-list{display:grid;gap:9px}
.notebook-entry{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 16px;border:1px solid var(--line);border-radius:12px;background:var(--white);box-shadow:0 3px 15px rgba(34,49,59,.025)}
.notebook-entry.is-resolved{opacity:.78}
.notebook-entry-main{min-width:0;flex:1}
.notebook-entry-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.notebook-entry-title strong{font:700 14px/1.4 Manrope,'Noto Sans SC',sans-serif;overflow-wrap:anywhere}
.notebook-type-tag{padding:3px 7px;border-radius:20px;background:var(--teal-pale);color:var(--teal);font-size:9px;font-weight:700}
.notebook-entry-main p{margin:5px 0 7px;color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.notebook-entry-meta{display:flex;gap:6px 14px;flex-wrap:wrap;color:var(--muted);font-size:10px;line-height:1.6}
.notebook-entry-actions{display:flex;justify-content:flex-end;align-items:center;gap:6px;flex-wrap:wrap;flex:0 0 auto}
.sentence-favorite-button{grid-column:3;grid-row:2;justify-self:end;padding:4px 8px;border:1px solid var(--line);border-radius:7px;background:transparent;color:var(--teal);font-size:10px}
[data-theme="dark"] .notebook-tabs{background:var(--surface-raised);border-color:var(--line)}
[data-theme="dark"] .notebook-tab.active{background:var(--accent-soft);color:var(--accent-primary);box-shadow:none}
[data-theme="dark"] .notebook-tab span{background:var(--surface-quiet);color:var(--ink)}
[data-theme="dark"] .notebook-entry{background:var(--white);border-color:var(--line);color:var(--ink)}
[data-theme="dark"] .notebook-entry-title strong{color:var(--ink)}
[data-theme="dark"] .notebook-type-tag{background:var(--accent-soft);color:var(--accent-primary)}
[data-theme="dark"] .sentence-favorite-button{border-color:var(--line);background:transparent;color:#83cfc2}
@media(max-width:760px){
  .notebook-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:3px;margin-bottom:10px;padding:4px}
  .notebook-tab{justify-content:center;gap:5px;min-width:0;min-height:40px;padding:6px 4px;font-size:10px;white-space:nowrap}
  .notebook-toolbar{align-items:stretch;gap:8px;margin-bottom:10px}
  .notebook-toolbar .search-box{flex:1 1 100%;min-width:0}
  .notebook-filter-label{flex:1 1 100%;justify-content:space-between}
  .notebook-filter-label .select-control{flex:0 1 65%;min-height:40px}
  .notebook-history-toggle{width:100%;min-height:34px}
  .notebook-hint{width:100%;line-height:1.5}
  .notebook-practice-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .notebook-practice-actions .button{min-height:42px;padding:8px 6px;font-size:10px}
  .notebook-entry{align-items:stretch;flex-direction:column;gap:10px;padding:12px}
  .notebook-entry-title strong{font-size:13px}
  .notebook-entry-main p{font-size:11px}
  .notebook-entry-meta{display:grid;gap:2px;font-size:9px}
  .notebook-entry-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-content:stretch}
  .notebook-entry-actions .button{min-height:39px;padding:7px 6px;font-size:10px}
  .sentence-favorite-button{grid-column:1/-1;grid-row:3;justify-self:start}
}
/* Closed beta authentication gate */
#auth-gate[hidden]{display:none!important}
body.auth-pending .app-shell,body.auth-locked .app-shell{display:none}
.auth-gate{position:relative;isolation:isolate;display:grid;place-items:center;min-height:100vh;min-height:100svh;overflow:hidden;padding:28px 18px;background:#1b2023;color:#e4e9e8;color-scheme:dark}
.auth-layout{position:relative;isolation:isolate;display:grid;place-items:center;width:100%;min-height:calc(100vh - 56px);min-height:calc(100svh - 56px)}
.auth-glow{position:absolute;z-index:-1;width:390px;height:390px;border-radius:50%;filter:blur(100px);opacity:.11;pointer-events:none}
.auth-glow-one{top:-110px;left:calc(50% - 365px);background:#5cb6a6}
.auth-glow-two{right:calc(50% - 380px);bottom:-150px;background:#7394a4}
.auth-card{width:min(100%,430px);padding:clamp(25px,5vw,42px);border:1px solid #354043;border-radius:22px;background:rgba(35,42,45,.94);box-shadow:0 24px 80px rgba(0,0,0,.22);backdrop-filter:blur(14px)}
.auth-brand{display:flex;align-items:center;gap:10px;margin-bottom:39px;color:#e7efed;font:800 21px/1 Manrope,'DM Sans',sans-serif;letter-spacing:-.8px}
.auth-brand>span:last-child>span{color:#e58c73}
.auth-brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:#397d72;color:#f1f7f5;font:800 18px Manrope,sans-serif;box-shadow:0 5px 18px rgba(32,126,111,.18)}
.auth-eyebrow{color:#7cb8ad;font-size:9px;font-weight:700;letter-spacing:1.55px}
.auth-card h1{margin:11px 0 7px;color:#e8edeb;font:700 27px/1.3 Manrope,'Noto Sans SC',sans-serif;letter-spacing:-.6px}
.auth-intro{margin:0 0 25px;color:#a4afae;font-size:13px;line-height:1.7}
.auth-form{display:grid;gap:17px}
.auth-field{display:grid;gap:8px;color:#c7d0ce;font-size:11px;font-weight:600}
.auth-field input{width:100%;height:47px;border:1px solid #414d50;border-radius:10px;outline:none;padding:0 13px;background:#1e2528;color:#e8edeb;font-size:13px;transition:border-color .16s,box-shadow .16s,background .16s}
.auth-field input::placeholder{color:#778482}
.auth-field input:focus{border-color:#6bb7aa;box-shadow:0 0 0 3px rgba(92,182,166,.13);background:#20292b}
.auth-field input:disabled{opacity:.55;cursor:not-allowed}
.auth-password-wrap{position:relative;display:block}
.auth-password-wrap input{padding-right:68px}
.auth-password-toggle{position:absolute;top:50%;right:9px;transform:translateY(-50%);border:0;border-radius:7px;padding:6px 8px;background:transparent;color:#8bc8bc;font-size:10px;font-weight:700}
.auth-password-toggle:hover{background:#2a3838;color:#b0e0d6}
.auth-message{border-radius:9px;padding:10px 12px;font-size:11px;line-height:1.65}
.auth-message[hidden]{display:none}
.auth-message.error{border:1px solid #66443f;background:#342926;color:#f0aa98}
.auth-message.success{border:1px solid #3d6158;background:#243630;color:#9bd5c4}
.auth-checking{display:flex;align-items:center;gap:9px;margin:-9px 0 16px;color:#9baaa6;font-size:11px}
.auth-retry{justify-self:start;border:0;padding:2px 0;background:transparent;color:#8bc8bc;font-size:11px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.auth-retry:hover{color:#b0e0d6}
.auth-config-notice{display:grid;gap:5px;margin:-7px 0 20px;border:1px solid #66583e;border-radius:10px;padding:11px 12px;background:#302e27;color:#e5d8ae;font-size:10px;line-height:1.6}
.auth-config-notice strong{font-size:11px}
.auth-config-notice code{color:#efdfa9;font-size:10px;overflow-wrap:anywhere}
.auth-submit{display:flex;align-items:center;justify-content:space-between;min-height:48px;margin-top:2px;border:0;border-radius:10px;padding:0 15px;background:#56ad9f;color:#f2f8f6;font-size:12px;font-weight:700;transition:background .16s,transform .16s,opacity .16s}
.auth-submit:hover:not(:disabled){transform:translateY(-1px);background:#65bcae}
.auth-submit:disabled{cursor:not-allowed;opacity:.55}
.auth-submit>span:last-child{font-size:18px;font-weight:400}
.auth-spinner{width:15px;height:15px;border:2px solid rgba(230,245,240,.3);border-top-color:#e6f5f0;border-radius:50%;animation:auth-spin .75s linear infinite}
@keyframes auth-spin{to{transform:rotate(360deg)}}
.auth-footnote{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:22px;color:#889592;font-size:10px}
.auth-lock{display:grid;place-items:center;width:17px;height:17px;border:1px solid #53605d;border-radius:50%;color:#9bc7bb;font-size:11px}
.auth-caption{position:absolute;bottom:3px;color:#63706d;font-size:8px;font-weight:600;letter-spacing:1.5px}
.auth-caption span{padding:0 5px;color:#588b80}
.auth-loading{display:flex;align-items:center;gap:10px;color:#b6c2bf;font-size:12px}
body.is-authenticated #auth-gate{display:none}
#auth-logout{min-height:31px;padding:7px 10px;font-size:10px}
@media(max-width:520px){.auth-gate{padding:18px 16px}.auth-layout{min-height:calc(100svh - 36px)}.auth-card{padding:27px 22px;border-radius:19px}.auth-brand{margin-bottom:32px}.auth-card h1{font-size:25px}.auth-caption{bottom:0;font-size:7px;letter-spacing:1.1px}#auth-logout{padding:6px 8px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.auth-gate *{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.sync-setup-card{max-width:510px}
.sync-setup-card .auth-brand{margin-bottom:28px}
.sync-setup-card .auth-intro{line-height:1.8}
.auth-sync-summary{margin:15px 0;border:1px solid #3e5754;border-radius:10px;padding:10px 12px;background:#202c2d;color:#b8d5ce;font-size:11px;line-height:1.65}
.auth-sync-actions{display:grid;gap:10px;margin-top:20px}
.auth-sync-actions .auth-submit{width:100%;margin:0}
.auth-secondary{min-height:42px;border:1px solid #414d50;border-radius:10px;padding:0 14px;background:#222a2c;color:#c6cfcc;font-size:11px;font-weight:650;transition:background .16s,border-color .16s,opacity .16s}
.auth-secondary:hover:not(:disabled){border-color:#55746e;background:#2a3435;color:#e3ece8}
.auth-secondary:disabled{cursor:not-allowed;opacity:.55}
.sync-setup-card .auth-footnote{line-height:1.6;text-align:center}
.cloud-conflict-backdrop{z-index:120;overflow:auto;padding:18px}
.cloud-conflict-modal{width:min(640px,100%);max-height:min(84vh,720px);overflow:auto;border:1px solid #39474a;background:#232b2e;color:#e4ebe8}
.cloud-conflict-modal .modal-head{position:sticky;top:0;z-index:1;background:#232b2e}
.cloud-conflict-note{margin:0 0 14px;color:#aebbb7;font-size:12px;line-height:1.7}
.cloud-conflict-list{display:grid;gap:10px}
.cloud-conflict-row{display:grid;gap:8px;border:1px solid #3b494b;border-radius:12px;padding:13px;background:#1f2729}
.cloud-conflict-row strong{color:#b9ddd3;font-size:12px}
.cloud-conflict-row>span{color:#a7b3b0;font-size:11px;line-height:1.65;overflow-wrap:anywhere}
.cloud-conflict-row>div{display:flex;flex-wrap:wrap;gap:7px}
.cloud-conflict-row .button{min-height:34px}
@media(max-width:520px){.cloud-conflict-backdrop{padding:10px}.cloud-conflict-modal{max-height:90vh}.cloud-conflict-row>div{display:grid;grid-template-columns:1fr 1fr}.cloud-conflict-row>div .button:last-child{grid-column:1/-1}}

/* Wordwise App Shell: persistent navigation, shared header, and theme surfaces. */


html{scrollbar-gutter:stable}
body{background:var(--canvas);color:var(--ink)}
.app-shell{min-height:100vh;background:var(--canvas)}
.sidebar{
  width:var(--shell-expanded-width);
  padding:17px 12px 12px;
  background:var(--shell-sidebar-surface);
  border-right:1px solid var(--shell-border);
  overflow:hidden;
  transition:width .22s cubic-bezier(.2,.75,.25,1),padding .22s cubic-bezier(.2,.75,.25,1),background-color .18s ease,border-color .18s ease;
}
.brand{min-height:38px;gap:10px;padding:0 8px;margin:0 0 20px;font-size:19px}
.brand-mark{flex:0 0 34px;width:34px;height:34px;border-radius:10px}
.brand-wordmark{overflow:hidden;white-space:nowrap;transition:opacity .16s ease,transform .2s ease,max-width .2s ease;max-width:170px}
.main-nav{display:flex;flex:1;min-height:0;flex-direction:column;gap:15px;overflow-x:hidden;overflow-y:auto;padding:0 2px 8px;scrollbar-width:thin;scrollbar-color:transparent transparent}
.main-nav:hover{scrollbar-color:var(--line) transparent}
.nav-group{display:grid;gap:2px}
.side-label{margin:0 0 4px;padding:0 10px;color:#8c989e;font-size:10px;letter-spacing:.09em;line-height:20px}
.nav-link{
  position:relative;
  width:100%;
  height:39px;
  min-height:39px;
  gap:10px;
  border-radius:7px;
  padding:0 10px;
  color:var(--shell-muted);
  font-size:12px;
  line-height:1;
  transition:color .16s ease,background-color .16s ease,transform .12s ease;
}
.nav-link::before{position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:0 2px 2px 0;background:var(--shell-nav-marker);content:"";opacity:0;transform:scaleY(.55);transition:opacity .16s ease,transform .18s ease}
.nav-link.active{background:var(--shell-active);color:var(--shell-active-text);font-weight:650}
.nav-link.active::before{opacity:1;transform:scaleY(1)}
.nav-icon{flex:0 0 20px;width:20px;height:20px;font-size:16px;color:currentColor}
.nav-icon svg,.icon-button svg,.daily-spark svg{display:block;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.nav-icon svg{width:20px;height:20px}
.icon-button svg,.daily-spark svg{width:18px;height:18px}
.nav-label{display:block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:1;transform:translateX(0);transition:opacity .14s ease,transform .18s ease,max-width .2s ease}
.nav-count{min-width:20px;margin-left:auto;padding:3px 6px;background:#f0f2f4;color:#74808a;font-size:10px;text-align:center;transition:opacity .14s ease,transform .18s ease}
.side-bottom{flex:0 0 auto;margin-top:7px}
.daily-card{min-height:48px;gap:10px;margin:0 2px 8px;padding:7px 9px;background:#f7f8f7;border-radius:9px;transition:background-color .18s ease}
.daily-spark{flex:0 0 30px;width:30px;height:30px;border-radius:8px;font-size:16px}
.daily-spark svg{width:16px;height:16px}
.daily-copy{min-width:0;overflow:hidden;white-space:nowrap;transition:opacity .14s ease,transform .18s ease,max-width .2s ease;max-width:160px}
.daily-card strong{font-size:11px}
.daily-card div span{font-size:9px}
.sidebar .settings-link{margin-top:4px}
.sidebar-foot{min-height:53px;gap:9px;margin-top:9px;padding:9px 5px 1px;border-color:var(--shell-border);transition:border-color .18s ease}
.avatar{flex:0 0 30px;width:30px;height:30px;background:#dceeea;color:var(--teal);font-size:11px}
.sidebar-foot-copy{min-width:0;overflow:hidden;white-space:nowrap;max-width:155px;transition:opacity .14s ease,transform .18s ease,max-width .2s ease}
.sidebar-foot strong{font-size:10px}
.sidebar-foot div span{font-size:9px}
.local-dot{flex:0 0 7px}
.main-area{min-width:0;margin-left:var(--shell-expanded-width);transition:margin-left .22s cubic-bezier(.2,.75,.25,1);}
.topbar{
  position:sticky;
  top:0;
  z-index:8;
  height:var(--shell-topbar-height);
  gap:16px;
  padding:0 30px;
  border-bottom:1px solid var(--shell-border);
  background:var(--shell-topbar-surface);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  transition:background-color .18s ease,border-color .18s ease,color .18s ease;
}
.topbar-start{display:flex;min-width:0;align-items:center;gap:14px}
.sidebar-collapse-toggle,.menu-toggle,.theme-toggle{
  display:grid;
  flex:0 0 34px;
  width:34px;
  height:34px;
  place-items:center;
  border:1px solid transparent;
  border-radius:7px;
  background:transparent;
  color:#738087;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .12s ease;
}
.sidebar-collapse-toggle svg,.menu-toggle svg,.theme-toggle svg{width:17px;height:17px}
.menu-toggle{display:none}
.breadcrumb{display:flex;min-width:0;align-items:center;gap:9px;color:var(--shell-muted);font-size:12px;white-space:nowrap}
.breadcrumb-root{overflow:hidden;text-overflow:ellipsis}
.breadcrumb-separator{color:#b3bdc2}
.breadcrumb strong{overflow:hidden;color:var(--shell-text);font-size:12px;font-weight:650;text-overflow:ellipsis}
.top-actions{flex:0 0 auto;gap:10px}
.local-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;background:var(--accent-soft);color:var(--muted);font-size:10px;white-space:nowrap}
.local-badge i{flex:0 0 6px;margin:0}
.theme-toggle{border-color:var(--shell-border);color:var(--shell-muted)}
.theme-toggle svg{width:17px;height:17px}
.account-menu{position:relative;flex:0 0 auto}
.account-menu-toggle{display:flex;min-height:36px;align-items:center;gap:8px;border:1px solid transparent;border-radius:8px;padding:3px 8px 3px 4px;background:transparent;color:var(--shell-text);font-size:11px;font-weight:600;transition:background-color .16s ease,border-color .16s ease,color .16s ease,transform .12s ease}
.account-avatar{display:grid;flex:0 0 28px;width:28px;height:28px;place-items:center;border:1px solid color-mix(in srgb,var(--teal) 18%,transparent);border-radius:50%;background:color-mix(in srgb,var(--teal) 10%,transparent);color:var(--teal);font-size:10px;font-weight:750}
.account-menu-toggle>svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--shell-muted)}
.account-menu-popover{position:absolute;top:calc(100% + 8px);right:0;z-index:30;width:216px;padding:8px;border:1px solid var(--shell-border);border-radius:10px;background:var(--shell-sidebar-surface);box-shadow:0 12px 32px rgba(22,35,40,.14);transform-origin:top right;animation:account-menu-in .14s cubic-bezier(.2,.75,.25,1) both}
.account-menu-popover[hidden]{display:none}
.account-menu-heading{display:flex;align-items:center;gap:10px;padding:8px 7px 11px;border-bottom:1px solid var(--shell-border)}
.account-menu-heading .account-avatar{flex-basis:32px;width:32px;height:32px}
.account-menu-heading strong,.account-menu-heading span:not(.account-avatar){display:block}
.account-menu-heading strong{color:var(--shell-text);font-size:11px}
.account-menu-heading div span{margin-top:3px;color:var(--shell-muted);font-size:9px}
.account-menu-popover #auth-logout{display:flex;width:100%;justify-content:flex-start;gap:8px;margin-top:7px;padding:8px 9px;border-color:transparent;font-size:11px}
.account-menu-popover #auth-logout svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@keyframes account-menu-in{from{opacity:0;transform:translateY(-3px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.topbar #auth-logout{min-height:34px;padding:7px 10px;border-radius:7px;font-size:10px}

.nav-link:focus-visible,.sidebar-collapse-toggle:focus-visible,.menu-toggle:focus-visible,.theme-toggle:focus-visible,.account-menu-toggle:focus-visible,#auth-logout:focus-visible{outline:2px solid color-mix(in srgb,var(--teal) 65%,transparent);outline-offset:2px}
.nav-link:active,.sidebar-collapse-toggle:active,.menu-toggle:active,.theme-toggle:active,.account-menu-toggle:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){
  .nav-link:hover{background:var(--shell-hover);color:var(--shell-text)}
  .nav-link.active:hover{background:var(--shell-active);color:var(--shell-active-text)}
  .sidebar-collapse-toggle:hover,.menu-toggle:hover,.theme-toggle:hover{border-color:var(--shell-border);background:var(--shell-hover);color:var(--shell-text)}
  .account-menu-toggle:hover{border-color:var(--shell-border);background:var(--shell-hover)}
}
html[data-theme="dark"] .sidebar,html[data-theme="dark"] .main-area{background:var(--canvas);color:var(--ink)}
html[data-theme="dark"] .sidebar{background:var(--shell-sidebar-surface);border-color:var(--shell-border)}
html[data-theme="dark"] .topbar{background:var(--shell-topbar-surface);border-color:var(--shell-border);color:var(--shell-text)}
html[data-theme="dark"] .side-label{color:#8f9b9e}
html[data-theme="dark"] .nav-link{color:var(--shell-muted)}
html[data-theme="dark"] .nav-link.active,html[data-theme="dark"] .nav-link.active:hover{background:var(--shell-active);color:var(--shell-active-text)}
html[data-theme="dark"] .nav-count{background:#343e42;color:#bdc7c9}
html[data-theme="dark"] .daily-card{background:#2d3536}
html[data-theme="dark"] .daily-spark{background:#394333;color:#c2d889}
html[data-theme="dark"] .sidebar-foot{border-color:var(--shell-border)}
html[data-theme="dark"] .breadcrumb strong{color:var(--shell-text)}
html[data-theme="dark"] .breadcrumb-separator{color:#69777b}
html[data-theme="dark"] .local-badge{background:var(--accent-soft);color:var(--muted)}
html[data-theme="dark"] .sidebar-collapse-toggle,html[data-theme="dark"] .menu-toggle,html[data-theme="dark"] .theme-toggle{color:#aab5b7}
html[data-theme="dark"] .theme-toggle{border-color:var(--shell-border);color:#e7cf86}
html[data-theme="dark"] .account-menu-toggle{color:var(--shell-text)}
html[data-theme="dark"] .account-menu-popover{border-color:var(--shell-border);background:var(--shell-sidebar-surface)}
html[data-theme="dark"] .account-menu-heading{border-color:var(--shell-border)}
html.theme-transitions-ready body,html.theme-transitions-ready .app-shell,html.theme-transitions-ready .sidebar,html.theme-transitions-ready .topbar,html.theme-transitions-ready .nav-link,html.theme-transitions-ready .daily-card,html.theme-transitions-ready .sidebar-foot,html.theme-transitions-ready .local-badge,html.theme-transitions-ready .button,html.theme-transitions-ready input,html.theme-transitions-ready textarea,html.theme-transitions-ready select,html.theme-transitions-ready .panel,html.theme-transitions-ready .metric-card,html.theme-transitions-ready .study-card,html.theme-transitions-ready .record-item,html.theme-transitions-ready .modal{transition-property:background-color,border-color,color,box-shadow;transition-duration:160ms;transition-timing-function:ease}
@media(min-width:761px){
body.sidebar-collapsed .sidebar{width:var(--shell-rail-width);padding-right:10px;padding-left:10px}
body.sidebar-collapsed .main-area{margin-left:var(--shell-rail-width)}
body.sidebar-collapsed .brand{justify-content:center;gap:0;padding-right:0;padding-left:0}
body.sidebar-collapsed .brand-wordmark{max-width:0;opacity:0;transform:translateX(-4px)}
body.sidebar-collapsed .main-nav{padding-right:0;padding-left:0}
body.sidebar-collapsed .side-label{height:0;margin:0;padding:0;overflow:hidden;opacity:0}
body.sidebar-collapsed .nav-link{width:44px;justify-content:center;gap:0;margin-right:auto;margin-left:auto;padding:0}
body.sidebar-collapsed .nav-link::before{left:-1px}
body.sidebar-collapsed .nav-label{max-width:0;opacity:0;transform:translateX(-5px);visibility:hidden}
body.sidebar-collapsed .nav-count{position:absolute;top:2px;right:0;min-width:14px;height:14px;padding:2px 3px;font-size:8px;line-height:10px}
body.sidebar-collapsed .daily-card{width:44px;min-height:44px;justify-content:center;margin-right:auto;margin-left:auto;padding:6px}
body.sidebar-collapsed .daily-copy{max-width:0;opacity:0;transform:translateX(-4px)}
body.sidebar-collapsed .sidebar-foot{justify-content:center;gap:0;padding-right:0;padding-left:0}
body.sidebar-collapsed .sidebar-foot-copy,body.sidebar-collapsed .sidebar-foot .local-dot{display:none}
}
@media(max-width:1050px) and (min-width:761px){
  
  .topbar{padding-right:24px;padding-left:24px}
}
@media(max-width:760px){
  .sidebar{z-index:20;width:min(280px,calc(100vw - 48px));padding:17px 12px 12px;box-shadow:14px 0 40px rgba(16,29,34,.15);transform:translateX(-102%);transition:transform .22s cubic-bezier(.2,.75,.25,1),background-color .18s ease,border-color .18s ease}
  .sidebar.open{transform:translateX(0)}
  .main-area{margin-left:0}
  .topbar{height:58px;padding-right:14px;padding-left:14px}
  .topbar-start{gap:9px}
  .sidebar-collapse-toggle{display:none}
  .menu-toggle{display:grid;flex:0 0 34px}
  .breadcrumb{gap:6px;margin:0;white-space:nowrap}
  .breadcrumb-root,.breadcrumb-separator{display:none}
  .top-actions{gap:7px}
  .account-menu-toggle{width:34px;min-height:34px;justify-content:center;padding:2px;border-color:var(--shell-border)}
  .account-menu-label,.account-menu-toggle>svg{display:none}
  .account-avatar{width:27px;height:27px;flex-basis:27px}
  .theme-toggle{flex-basis:32px;width:32px;height:32px}
  .topbar #auth-logout{padding:6px 8px;font-size:9px}
  
  .mobile-scrim.visible{z-index:19;background:rgba(15,23,26,.46);backdrop-filter:blur(1px)}
}
@media(max-width:390px){
  .topbar{padding-right:10px;padding-left:10px}
  .top-actions{gap:5px}
  .topbar #auth-logout{padding-right:7px;padding-left:7px}
  .breadcrumb strong{max-width:118px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .sidebar,.main-area,.sidebar *,.topbar *{scroll-behavior:auto;transition-duration:.01ms!important}
  .nav-link:active,.sidebar-collapse-toggle:active,.menu-toggle:active,.theme-toggle:active,.account-menu-toggle:active{transform:none}
  .account-menu-popover{animation:none}
}

/* Homepage refinement: keep the shared shell intact and make the dashboard denser. */

.home-dashboard{display:grid;gap:14px}
.home-heading{align-items:center;margin:0}
.home-heading .eyebrow{font-size:9px;letter-spacing:1.25px}
.home-heading h1{margin:5px 0 4px;font-size:25px;line-height:1.25;letter-spacing:-.45px}
.home-heading p{font-size:12px;line-height:1.5}
.home-dashboard .hero-card.home-hero{min-height:0;margin:0;padding:18px 22px;border:1px solid var(--line);border-radius:11px;background:var(--surface-raised);box-shadow:none}
.home-hero .hero-copy{max-width:620px}
.home-hero .hero-copy .eyebrow{color:var(--muted);font-size:9px;letter-spacing:.9px}
.home-hero .hero-copy h2{margin:6px 0 4px;color:var(--ink);font-size:20px;line-height:1.35;letter-spacing:-.3px}
.home-hero .hero-copy p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}
.home-hero .hero-copy .button{min-height:35px;margin-top:12px;padding:8px 12px;border-radius:7px;font-size:11px;box-shadow:none}
.home-hero .hero-decoration{display:none}
.home-dashboard .home-metrics{gap:9px;margin:0}
.home-dashboard .metric-card,.home-dashboard .home-panel,.home-dashboard .review-home-panel{border:1px solid var(--line);border-radius:11px;box-shadow:none}
.home-dashboard .metric-card{min-height:82px;padding:12px 14px}
.home-dashboard .metric-top{font-size:11px}
.home-dashboard .metric-icon{width:25px;height:25px;border-radius:7px;font-size:12px}
.home-dashboard .metric-value{margin-top:7px;font-size:23px;line-height:1.15}
.home-dashboard .metric-value small{font-size:10px}
.home-dashboard .metric-card.is-priority{border-color:var(--line);background:var(--surface-raised)}
.home-bottom{grid-template-columns:minmax(0,1fr) minmax(0,.94fr);gap:11px}
.home-dashboard .home-panel{min-width:0;padding:15px 16px;background:var(--white)}
.home-dashboard .home-panel .panel-head{margin-bottom:10px}
.home-dashboard .home-panel .panel-head h3,.home-dashboard .review-home-panel .panel-head h3{font-size:13px}
.home-section-meta{color:var(--muted);font-size:10px}
.home-dashboard .quick-actions{gap:6px}
.home-dashboard .quick-action{min-height:53px;gap:10px;padding:8px 10px;border-radius:8px}
.home-dashboard .quick-action-copy strong{font-size:11px}
.home-dashboard .quick-action-copy>span{margin-top:2px;font-size:10px;line-height:1.35}
.home-dashboard .quick-action-arrow{font-size:16px}
.home-dashboard .week-row{gap:7px;margin-top:8px}
.home-dashboard .week-day{font-size:10px}
.home-dashboard .week-bar-wrap{height:43px;margin-bottom:5px}
.home-dashboard .week-bar{width:16px;max-height:38px}
.home-mastery{margin-top:13px}
.home-mastery .panel-head{margin-bottom:7px!important}
.home-dashboard .review-home-panel{margin:0;padding:14px 16px;background:var(--white)}
.home-dashboard .review-home-panel .panel-head{margin-bottom:10px}
.home-dashboard .review-home-subtitle{margin-top:3px;font-size:10px}
.home-dashboard .review-home-panel .panel-head a{font-size:10px}
.review-home-active{display:flex;min-height:46px;align-items:center;justify-content:space-between;gap:14px;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:var(--canvas)}
.review-home-active>div{display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:7px;row-gap:2px}
.review-home-active strong{color:var(--ink);font:750 19px Manrope,sans-serif}
.review-home-active>div>span{color:var(--muted);font-size:10px}
.review-home-active small{grid-column:1/-1;color:var(--muted);font-size:10px}
.review-home-active .button{min-height:34px;padding:7px 10px;font-size:10px}
.review-home-empty{display:flex;min-height:48px;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--canvas)}
.review-home-empty .review-empty-mark{flex:0 0 29px;width:29px;height:29px;font-size:13px}
.review-home-empty>div{display:grid;gap:3px;min-width:0}
.review-home-empty strong{color:var(--ink);font-size:11px}
.review-home-empty>div>span{color:var(--muted);font-size:10px;line-height:1.4}
html[data-theme="dark"] .home-dashboard .hero-card.home-hero{border-color:var(--line);background:var(--surface-raised)}
html[data-theme="dark"] .home-hero .hero-copy .eyebrow{color:var(--muted)}
html[data-theme="dark"] .home-hero .hero-copy h2{color:var(--ink)}
html[data-theme="dark"] .home-hero .hero-copy p{color:var(--muted)}
html[data-theme="dark"] .home-dashboard .metric-card.is-priority{border-color:var(--line);background:var(--surface-raised)}
html[data-theme="dark"] .home-dashboard .home-panel,html[data-theme="dark"] .home-dashboard .review-home-panel{border-color:var(--shell-border);background:var(--surface-raised)}
html[data-theme="dark"] .review-home-active,html[data-theme="dark"] .review-home-empty{border-color:var(--border-strong);background:var(--accent-soft)}
html[data-theme="dark"] .review-home-active strong,html[data-theme="dark"] .review-home-empty strong{color:var(--ink)}
@media(max-width:1050px) and (min-width:761px){
  .home-dashboard{gap:12px}
  .home-bottom{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .home-dashboard .home-panel{padding:13px}
}
@media(max-width:760px){
  
  .home-dashboard{gap:11px}
  .home-heading h1{font-size:22px}
  .home-heading p{font-size:11px}
  .home-dashboard .hero-card.home-hero{padding:15px 16px}
  .home-hero .hero-copy h2{font-size:18px}
  .home-hero .hero-copy p{font-size:10px}
  .home-hero .hero-copy .button{margin-top:10px}
  .home-dashboard .home-metrics{gap:7px}
  .home-dashboard .metric-card{min-height:76px;padding:10px 11px}
  .home-dashboard .metric-top{font-size:10px}
  .home-dashboard .metric-value{font-size:21px}
  .home-bottom{grid-template-columns:minmax(0,1fr);gap:9px}
  .home-dashboard .home-panel{padding:13px}
  .home-dashboard .quick-action{min-height:50px}
  .home-dashboard .review-home-panel{padding:12px}
  .review-home-active{padding:8px}
  .review-home-active .button{white-space:nowrap}
}
@media(max-width:360px){
  .home-dashboard .metric-card{padding:9px}
  .home-dashboard .metric-top{font-size:9px}
  .home-dashboard .metric-icon{width:22px;height:22px}
  .review-home-empty{align-items:flex-start}
}

/* Sentence typing immersion UI: scoped to the P0 practice route only. */
.sentence-practice-page{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;width:100%;min-width:0}
.sentence-practice-card{position:relative;display:flex;flex-direction:column;width:100%;min-width:0;max-width:1040px;min-height:clamp(560px,70vh,740px);margin:0 auto;padding:0;overflow:hidden;background:var(--white);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);animation:sentence-practice-enter .18s ease both}
.sentence-practice-toolbar{display:grid;grid-template-columns:minmax(105px,1fr) minmax(0,2fr) minmax(150px,1fr);align-items:center;gap:14px;min-height:64px;padding:11px 22px;border-bottom:1px solid var(--line)}
.sentence-practice-toolbar .button{min-height:38px}
.sentence-exit-button{justify-self:start;white-space:nowrap}
.sentence-practice-breadcrumb{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sentence-practice-breadcrumb strong{color:var(--ink);font-weight:650;overflow:hidden;text-overflow:ellipsis}
.sentence-practice-toolbar-actions{display:flex;justify-content:flex-end;align-items:center;gap:9px;min-width:0}
.sentence-counter{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:31px;padding:0 10px;border-radius:999px;background:var(--teal-pale);color:var(--teal);font:700 11px Manrope,sans-serif;white-space:nowrap}
.sentence-practice-overview{min-width:0;padding:16px 24px 0}
.sentence-practice-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;color:var(--muted);font-size:11px}
.sentence-practice-top>span:nth-child(2){text-align:center}
.sentence-practice-top>span:last-child{text-align:right}
.sentence-practice-top strong{color:var(--ink);font:700 12px Manrope,sans-serif}
.sentence-practice-card .sentence-progress{height:5px;margin:12px 0 0;background:var(--line)}
.sentence-practice-card .sentence-progress span{transition:width .24s ease}
.sentence-practice-card>.sentence-practice-overview>.sentence-mode-picker{display:flex;grid-template-columns:none;align-items:center;justify-content:flex-end;gap:10px;margin:11px 0 0}
.sentence-practice-card>.sentence-practice-overview>.sentence-mode-picker>span{font-size:10px}
.sentence-practice-card .sentence-mode-options{display:inline-flex;width:auto;gap:2px;padding:3px;border:1px solid var(--line);border-radius:10px;background:var(--canvas)}
.sentence-practice-card .sentence-mode-option{display:flex;align-items:center;justify-content:center;min-height:31px;padding:6px 10px;border-color:transparent;border-radius:7px;background:transparent;text-align:center}
.sentence-practice-card .sentence-mode-option strong{font-size:10px}
.sentence-practice-card .sentence-mode-option small{display:none}
.sentence-practice-card .sentence-mode-option.active{background:var(--white);box-shadow:0 1px 4px rgba(20,35,40,.09)}
.sentence-practice-main{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;padding:clamp(24px,4vh,42px) clamp(18px,5vw,52px) 10px;text-align:center}
.sentence-practice-main .sentence-prompt-label{font-size:11px;font-weight:650;letter-spacing:.04em}
.sentence-practice-main .sentence-chinese{max-width:780px;margin:10px auto 12px;font-size:clamp(22px,3vw,32px);line-height:1.5;letter-spacing:0}
.sentence-practice-main .sentence-step-label{min-height:17px;font-size:11px}
.sentence-typing-stage{position:relative;display:flex;flex-direction:column;justify-content:center;width:min(100%,920px);min-width:0;max-width:100%;min-height:210px;margin:27px auto 0;padding:20px 25px 23px;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--white) 70%,var(--canvas));text-align:left;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease}
.sentence-typing-stage:focus-within{border-color:color-mix(in srgb,var(--teal) 62%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 12%,transparent)}
.sentence-typing-stage.is-wrong{border-color:color-mix(in srgb,#d47763 56%,var(--line));background:color-mix(in srgb,#d47763 4%,var(--white))}
.sentence-typing-stage.is-correct{border-color:color-mix(in srgb,var(--teal) 48%,var(--line));background:color-mix(in srgb,var(--teal) 5%,var(--white))}
.sentence-typing-caption{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;color:var(--muted);font-size:10px}
.sentence-typing-caption>span:first-child{font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.sentence-typing-preview{position:relative;z-index:1;width:100%;min-height:1.8em;color:var(--ink);font:600 clamp(23px,3.2vw,38px)/1.72 Manrope,'Noto Sans SC',sans-serif;letter-spacing:.015em;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;pointer-events:none}
.sentence-keychar{transition:color .12s ease,text-decoration-color .12s ease}
.sentence-keychar.is-empty{color:color-mix(in srgb,var(--muted) 54%,transparent);font-weight:400}
.sentence-keychar.is-space{white-space:pre}
.sentence-keychar.is-hint{color:var(--teal);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--teal) 40%,transparent);text-underline-offset:5px}
.sentence-keychar.is-correct{color:var(--teal)}
.sentence-keychar.is-wrong{color:#d47763;text-decoration:underline wavy;text-decoration-color:#d47763;text-underline-offset:5px}
.sentence-typing-cursor{display:inline-block;width:2px;height:.95em;margin:0 1px -0.12em;background:var(--teal);animation:sentence-caret 1s steps(1,end) infinite}
.sentence-answer-input{position:absolute;z-index:2;inset:0;width:100%;height:100%;min-height:100%;margin:0;padding:10px;border:0;border-radius:inherit;outline:0;resize:none;overflow:hidden;background:transparent;color:transparent;-webkit-text-fill-color:transparent;caret-color:transparent;opacity:.015;text-align:left;font:16px/1.6 Manrope,sans-serif;cursor:text}
.sentence-answer-input::selection{color:transparent;background:transparent}
.sentence-answer-input:disabled{cursor:default}
.sentence-status{display:grid;place-items:center;width:100%;max-width:920px;min-height:42px;padding:10px 4px 0;margin:0 auto;color:var(--muted);font-size:12px;line-height:1.55}
.sentence-status.correct{color:var(--teal-dark);animation:sentence-feedback-in .18s ease both}
.sentence-status.wrong,.sentence-status.error{color:#d47763;animation:sentence-feedback-in .18s ease both}
.sentence-status.assisted{color:var(--muted)}
.sentence-practice-actions{padding:8px 24px 0}
.sentence-practice-action-row{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;max-width:100%}
.sentence-practice-action-row .button{min-height:42px}
.sentence-practice-action-row .button:hover{transform:translateY(-1px)}
.sentence-practice-action-row .button:active{transform:translateY(0)}
.sentence-practice-action-row .button:focus-visible,.sentence-practice-toolbar .button:focus-visible{outline:3px solid color-mix(in srgb,var(--teal) 38%,transparent);outline-offset:2px}
.sentence-practice-action-row .button:disabled{opacity:.5;cursor:not-allowed;transform:none}
.sentence-check-button{min-width:150px}
.sentence-session-foot{display:flex;justify-content:center;gap:clamp(12px,3vw,30px);flex-wrap:wrap;padding:17px 15px 0;margin:18px 24px 0;border-top:1px solid var(--line);font-size:10px}
.sentence-session-foot>span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.sentence-session-foot strong{color:var(--ink);font:700 12px Manrope,sans-serif}
.sentence-key-help{padding:12px 12px 18px;margin:0;color:var(--muted);font-size:10px}
.sentence-key-help kbd{min-width:38px;padding:4px 7px;border-radius:6px;background:var(--canvas);font:600 10px Manrope,sans-serif}
.sentence-complete-card{justify-content:flex-start}
.sentence-complete-content{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;text-align:center;animation:sentence-feedback-in .2s ease both}
.sentence-complete-content .sentence-complete-mark{width:58px;height:58px;margin:0 auto 20px;font-size:26px}
.sentence-complete-card.is-skipped .sentence-complete-mark{background:color-mix(in srgb,var(--surface-quiet) 14%,var(--white));color:var(--accent-primary)}
.sentence-complete-eyebrow{color:var(--teal);font-size:10px;font-weight:750;letter-spacing:1.2px}
.sentence-complete-card.is-skipped .sentence-complete-eyebrow{color:var(--accent-primary)}
.sentence-complete-content h1{margin:9px 0 0;color:var(--ink);font:750 clamp(24px,3vw,34px)/1.3 Manrope,'Noto Sans SC',sans-serif;letter-spacing:-.4px}
.sentence-complete-meaning{max-width:780px;margin:17px 0 8px;color:var(--muted);font-size:18px;line-height:1.6}
.sentence-complete-content>p:not(.sentence-complete-meaning){max-width:820px;margin:7px 0 16px;color:var(--ink);font:600 clamp(20px,2.5vw,29px)/1.6 Manrope,'Noto Sans SC',sans-serif;overflow-wrap:anywhere}
.sentence-complete-content .sentence-incomplete-note{font:400 13px/1.6 'DM Sans','Noto Sans SC',sans-serif!important;color:var(--muted)!important}
.sentence-complete-score{display:flex;justify-content:center;gap:20px;margin:12px 0 24px;color:var(--muted);font-size:11px}
.sentence-complete-score strong{margin-left:5px;color:var(--ink);font:700 13px Manrope,sans-serif}
.sentence-next-button{min-width:150px;min-height:44px}
@keyframes sentence-practice-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes sentence-feedback-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@keyframes sentence-caret{50%{opacity:0}}
@media(max-width:760px){
  .sentence-practice-card{min-height:calc(100dvh - 150px);border-radius:13px}
  .sentence-practice-toolbar{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:6px 8px;min-height:56px;padding:9px 12px}
  .sentence-practice-toolbar .button{min-height:36px}
  .sentence-exit-button{padding:8px 9px;font-size:10px}
  .sentence-practice-breadcrumb{grid-column:1/-1;grid-row:2;justify-content:center;gap:5px;font-size:9px}
  .sentence-exit-button{grid-column:1;grid-row:1}
  .sentence-practice-toolbar-actions{grid-column:2;grid-row:1;gap:5px}
  .sentence-practice-toolbar-actions .button-small{padding:7px 8px;font-size:9px}
  .sentence-counter{min-width:42px;height:29px;padding:0 7px;font-size:10px}
  .sentence-practice-overview{padding:13px 14px 0}
  .sentence-practice-top{grid-template-columns:1fr auto;gap:6px 8px;font-size:10px}
  .sentence-practice-top>span:nth-child(2){grid-column:1;text-align:left}
  .sentence-practice-top>span:last-child{grid-column:2;grid-row:1/3}
  .sentence-practice-card>.sentence-practice-overview>.sentence-mode-picker{align-items:stretch;flex-direction:column;justify-content:flex-start;gap:6px;margin-top:9px}
  .sentence-practice-card .sentence-mode-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:1px;padding:2px}
  .sentence-practice-card .sentence-mode-option{min-width:0;min-height:32px;padding:5px 4px}
  .sentence-practice-card .sentence-mode-option strong{font-size:9px}
  .sentence-practice-main{padding:27px 13px 8px}
  .sentence-practice-main .sentence-chinese{margin:9px auto 10px;font-size:clamp(21px,6vw,27px)}
  .sentence-typing-stage{min-height:190px;margin-top:21px;padding:16px 13px 18px;border-radius:11px}
  .sentence-typing-preview{font-size:clamp(21px,6vw,27px);line-height:1.75}
  .sentence-typing-caption{margin-bottom:10px;font-size:9px}
  .sentence-status{min-height:43px;font-size:11px}
  .sentence-practice-actions{padding:4px 13px 0}
  .sentence-practice-action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .sentence-practice-action-row .button{min-height:44px;padding:9px 8px;font-size:11px}
  .sentence-check-button{grid-column:1/-1;grid-row:1;min-width:0}
  .sentence-session-foot{justify-content:space-around;gap:9px 12px;padding:13px 3px 0;margin:13px 13px 0;font-size:9px}
  .sentence-session-foot>span{gap:4px}
  .sentence-session-foot strong{font-size:11px}
  .sentence-key-help{padding:11px 8px 14px;margin:0;line-height:1.8;font-size:9px}
  .sentence-complete-content{padding:32px 17px}
  .sentence-complete-meaning{font-size:16px}
  .sentence-complete-score{gap:14px;font-size:10px}
}
@media(max-width:380px){
  .sentence-practice-toolbar{gap:5px;padding-inline:8px}
  .sentence-exit-button{gap:4px;padding-inline:7px}
  .sentence-practice-breadcrumb{font-size:8px}
  .sentence-mode-picker>span{font-size:9px}
  .sentence-practice-card .sentence-mode-option{padding-inline:5px}
  .sentence-session-foot{gap:8px 7px}
}
@media(prefers-reduced-motion:reduce){
  .sentence-practice-card,.sentence-complete-content,.sentence-status,.sentence-typing-cursor,.sentence-keychar{animation:none!important;transition:none!important}
}

/* P0 word-level visualization; the hidden input and sentence judgment remain unchanged. */
.sentence-practice-main{padding-top:clamp(18px,3vh,34px);padding-bottom:14px}
.sentence-practice-main .sentence-step-label{margin-bottom:13px}
.sentence-typing-stage{width:min(100%,1040px);min-height:clamp(250px,36vh,360px);margin-top:0;padding:22px clamp(15px,3vw,32px);overflow:visible;background:color-mix(in srgb,var(--canvas) 56%,var(--white))}
.sentence-typing-caption{position:relative;z-index:2;margin-bottom:28px}
.sentence-typing-preview{z-index:1;min-height:100px;font:inherit;letter-spacing:normal;text-align:center;white-space:normal;overflow:visible;pointer-events:auto}
.sentence-word-flow{display:flex;align-items:flex-start;justify-content:center;flex-wrap:wrap;column-gap:clamp(8px,1.4vw,17px);row-gap:38px;width:100%;padding:25px 0 10px}
.sentence-word-unit{position:relative;display:grid;grid-template-rows:17px minmax(42px,auto) 16px minmax(17px,auto);justify-items:center;align-items:center;gap:5px;max-width:100%;min-width:34px;white-space:nowrap;animation:sentence-word-enter .16s ease both}
.sentence-word-grammar{position:relative;display:grid;grid-template-rows:17px minmax(42px,auto) 16px minmax(17px,auto);justify-items:center;align-items:center;gap:5px;max-width:100%;padding:0;border:0;background:transparent;color:inherit;font:inherit;white-space:nowrap}
.sentence-word-unit.has-grammar{display:block}
.sentence-word-unit:nth-child(2){animation-delay:8ms}.sentence-word-unit:nth-child(3){animation-delay:16ms}.sentence-word-unit:nth-child(4){animation-delay:24ms}.sentence-word-unit:nth-child(5){animation-delay:32ms}.sentence-word-unit:nth-child(6){animation-delay:40ms}.sentence-word-unit:nth-child(7){animation-delay:48ms}.sentence-word-unit:nth-child(8){animation-delay:56ms}
.sentence-word-phonetic{min-height:15px;color:var(--muted);font:500 11px/1.2 Manrope,'Noto Sans SC',sans-serif;letter-spacing:.01em}
.sentence-word-phonetic.is-empty,.sentence-word-pos.is-empty,.sentence-word-meaning.is-empty{visibility:hidden}
.sentence-word-token{display:inline-flex;align-items:center;justify-content:center;min-height:42px;max-width:100%;padding:4px 9px;border:1px solid color-mix(in srgb,var(--shell-border) 60%,transparent);border-bottom-width:2px;border-radius:8px;background:color-mix(in srgb,var(--shell-active) 62%,var(--canvas));color:var(--shell-text);font:650 clamp(23px,3.1vw,36px)/1.2 Manrope,'Noto Sans SC',sans-serif;letter-spacing:.005em;transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,transform .14s ease}
.sentence-word-token[data-tone="0"]{--word-fill:#f4dca4;--word-ink:#523a0b;--word-line:#e9bd60}
.sentence-word-token[data-tone="1"]{--word-fill:#efc1ce;--word-ink:#682a3d;--word-line:#dc879f}
.sentence-word-token[data-tone="2"]{--word-fill:#bfd5fc;--word-ink:#203c71;--word-line:#7da6ef}
.sentence-word-token[data-tone="3"]{--word-fill:#b6e4d5;--word-ink:#155047;--word-line:#72c9ad}
.sentence-word-token[data-tone="4"]{--word-fill:#d6c7f2;--word-ink:#493675;--word-line:#aa8cde}
.sentence-word-token[data-tone]{border-color:color-mix(in srgb,var(--word-line) 68%,transparent);border-bottom-color:var(--word-line);background:color-mix(in srgb,var(--word-fill) 92%,var(--white));color:var(--word-ink)}
html[data-theme="dark"] .sentence-word-token[data-tone="0"]{--word-fill:#553f19;--word-ink:#ffdf9a;--word-line:#92702b}
html[data-theme="dark"] .sentence-word-token[data-tone="1"]{--word-fill:#4d303b;--word-ink:#ffc5d2;--word-line:#935369}
html[data-theme="dark"] .sentence-word-token[data-tone="2"]{--word-fill:#263e68;--word-ink:#d5e3ff;--word-line:#5479bc}
html[data-theme="dark"] .sentence-word-token[data-tone="3"]{--word-fill:#205048;--word-ink:#bdf3e1;--word-line:#398875}
html[data-theme="dark"] .sentence-word-token[data-tone="4"]{--word-fill:#42325d;--word-ink:#e4d7ff;--word-line:#755c9f}
.sentence-word-char{display:inline-block;min-width:.23em;text-align:center;transition:color .12s ease,text-decoration-color .12s ease}
.sentence-word-char.is-empty{color:color-mix(in srgb,currentColor 43%,transparent);font-weight:400}
.sentence-word-char.is-correct{color:var(--teal-dark)}
html[data-theme="dark"] .sentence-word-char.is-correct{color:#80d9bd}
.sentence-word-char.is-wrong{color:#cf4f50;text-decoration:underline wavy;text-decoration-color:currentColor;text-decoration-thickness:2px;text-underline-offset:5px}
html[data-theme="dark"] .sentence-word-char.is-wrong{color:#ff9292}
.sentence-word-char.is-hint{color:var(--teal);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--teal) 52%,transparent);text-underline-offset:5px}
.sentence-word-cursor{display:inline-block;flex:0 0 2px;width:2px;height:.95em;margin:0 1px -0.12em;border-radius:2px;background:var(--teal);animation:sentence-caret .9s steps(1,end) infinite}
.sentence-word-gap{width:0;flex:0 0 0}
.sentence-word-unit.is-current .sentence-word-token{border-color:color-mix(in srgb,var(--teal) 70%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 14%,transparent);transform:translateY(-2px)}
.sentence-word-unit.is-completed .sentence-word-token{border-bottom-color:color-mix(in srgb,#53b78f 72%,var(--line))}
.sentence-word-unit.is-wrong .sentence-word-token{border-color:color-mix(in srgb,#d35f50 70%,var(--line));border-bottom-color:#d35f50;box-shadow:0 0 0 2px color-mix(in srgb,#d35f50 10%,transparent);animation:sentence-word-error .18s ease}
.sentence-word-unit:not([data-tone]) .sentence-word-token{background:color-mix(in srgb,var(--white) 72%,var(--canvas))}
.sentence-word-pos{min-height:14px;color:var(--muted);font:600 9px/1.2 'DM Sans','Noto Sans SC',sans-serif}
.sentence-word-meaning{max-width:min(180px,30vw);overflow:hidden;color:var(--shell-text);font:500 11px/1.35 'DM Sans','Noto Sans SC',sans-serif;text-align:center;text-overflow:ellipsis}
.sentence-word-grammar{cursor:help}
.sentence-word-grammar:focus-visible{outline:2px solid var(--teal);outline-offset:5px;border-radius:8px}
.sentence-grammar-tooltip{position:absolute;z-index:5;left:50%;bottom:calc(100% + 11px);display:grid;gap:6px;width:max-content;max-width:min(270px,calc(100vw - 38px));padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);box-shadow:0 12px 34px rgba(0,0,0,.22);text-align:left;white-space:normal;opacity:0;visibility:hidden;transform:translate(-50%,4px);transition:opacity .15s ease,transform .15s ease,visibility .15s ease;pointer-events:none}
.sentence-grammar-tooltip strong{font-size:12px}.sentence-grammar-tooltip em{color:var(--muted);font:italic 10px Manrope,sans-serif}.sentence-grammar-tooltip span{font-size:11px;line-height:1.55}
.sentence-word-grammar:hover .sentence-grammar-tooltip,.sentence-word-grammar:focus-visible .sentence-grammar-tooltip,.sentence-word-grammar[aria-expanded="true"] .sentence-grammar-tooltip{opacity:1;visibility:visible;transform:translate(-50%,0)}
html[data-theme="dark"] .sentence-grammar-tooltip{border-color:#3c4658;background:#252d3c;color:#edf1fb;box-shadow:0 14px 36px rgba(0,0,0,.4)}
.sentence-translation{display:grid;justify-items:center;gap:7px;max-width:800px;margin:clamp(20px,4vh,34px) auto 0;padding:0 12px;text-align:center}
.sentence-translation>span{color:var(--muted);font-size:10px;font-weight:650;letter-spacing:.06em}
.sentence-translation>strong{color:var(--shell-text);font-size:clamp(17px,2vw,22px);font-weight:550;line-height:1.6}
.sentence-answer-input{z-index:0;pointer-events:none}
@keyframes sentence-word-enter{from{opacity:.72;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@keyframes sentence-word-error{25%{transform:translateX(-2px)}75%{transform:translateX(2px)}}
.sentence-display-settings{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
.sentence-display-settings h3,.sentence-display-settings>p{grid-column:1/-1}
.sentence-display-settings .sentence-display-setting-row{margin:0;border-top:1px solid var(--line)}
@media(max-width:760px){
  .sentence-practice-main{padding:23px 12px 10px}
  .sentence-typing-stage{min-height:0;padding:15px 12px 18px;border-radius:12px}
  .sentence-typing-caption{margin-bottom:8px;font-size:9px}
  .sentence-typing-preview{min-height:0}
  .sentence-word-flow{column-gap:8px;row-gap:34px;padding:32px 0 8px}
  .sentence-word-unit,.sentence-word-grammar{grid-template-rows:15px minmax(38px,auto) 14px minmax(16px,auto);gap:4px}
  .sentence-word-phonetic{font-size:9px}
  .sentence-word-token{min-height:38px;padding:4px 6px;border-radius:7px;font-size:clamp(19px,5.5vw,27px)}
  .sentence-word-pos{font-size:8px}
  .sentence-word-meaning{max-width:26vw;font-size:9px}
  .sentence-translation{margin-top:21px}
  .sentence-translation>strong{font-size:17px}
  .sentence-grammar-tooltip{left:50%;width:min(245px,calc(100vw - 30px));padding:10px 12px}
  .sentence-display-settings{grid-template-columns:1fr}
}
@media(max-width:380px){
  .sentence-word-flow{column-gap:5px;row-gap:30px}
  .sentence-word-token{padding-inline:5px;font-size:19px}
  .sentence-word-meaning{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  .sentence-word-unit,.sentence-word-token,.sentence-word-char,.sentence-word-cursor,.sentence-grammar-tooltip{animation:none!important;transition:none!important}
}


/* Reference-matched lamp scene. Every rule is scoped to the login surface. */
.auth-gate:has(.auth-lamp-layout){padding:0;background:#121921;color:#e8ede7;color-scheme:dark}
html:has(.auth-lamp-layout){scrollbar-gutter:auto;background:#121921}
.auth-lamp-layout{--lamp-green:#b6d937;display:flex;align-items:center;justify-content:center;gap:48px;min-height:100svh;width:100%;padding:58px 28px 76px;font-family:'DM Sans','Noto Sans SC',sans-serif}
.login-scene-pair{display:flex;align-items:center;justify-content:center;gap:48px;transform:scale(var(--login-scene-scale,1)) translate(-8px,-12px);transform-origin:center}
.auth-lamp-layout::before{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 35% 38%,rgba(111,143,43,.045),transparent 45%),radial-gradient(ellipse at 50% 100%,#0e131b,transparent 65%);content:'';pointer-events:none}
.login-lamp-ambience{position:absolute;z-index:-1;pointer-events:none;left:calc(50% - 460px);top:calc(50% - 260px);width:560px;height:420px;background:radial-gradient(ellipse,rgba(137,175,36,.13),rgba(114,149,34,.035) 50%,transparent 72%);opacity:1;transition:opacity .45s ease}
.login-lamp-stage{position:relative;flex:0 0 360px;width:360px;height:430px;margin-top:-20px;user-select:none;-webkit-user-select:none}
.login-lamp{display:block;width:100%;height:100%;overflow:visible}
.lamp-light-layer{opacity:1;transition:opacity .45s ease}
.lamp-shade-dim{opacity:0;transition:opacity .45s ease}
.lamp-eyes-open,.lamp-eyes-closed,.lamp-smile,.lamp-shy-smile{transition:opacity .16s ease}
.lamp-eyes-closed,.lamp-shy-smile{opacity:0}
.lamp-is-private .lamp-eyes-open,.lamp-is-private .lamp-smile,.lamp-is-off .lamp-eyes-open{opacity:0}
.lamp-is-private .lamp-eyes-closed,.lamp-is-private .lamp-shy-smile,.lamp-is-off .lamp-eyes-closed{opacity:1}
.lamp-is-off .lamp-light-layer,.lamp-is-off .login-lamp-ambience{opacity:0}
.lamp-is-off .lamp-shade-dim{opacity:.72}
.lamp-cord{transform:translateY(8px)}
.lamp-is-dragging .lamp-pull-switch{cursor:grabbing}
.lamp-is-dragging .lamp-switch-hint{color:#d8e8a2}
.lamp-pull-switch{position:absolute;left:62.5%;top:45%;transform:translateX(-50%);width:44px;height:139px;padding:0;border:0;border-radius:22px;background:transparent;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent}
.lamp-pull-switch:focus-visible{outline:2px solid #c0df55;outline-offset:3px;background:rgba(181,217,55,.04)}
.lamp-pull-switch[data-pointer-focus="true"]:focus-visible{outline:none;background:transparent}
.lamp-switch-hint{position:absolute;left:62.5%;top:76.6%;transform:translateX(-50%);white-space:nowrap;color:#808b72;font-size:10px;line-height:1.5;pointer-events:none}
.auth-lamp-layout .auth-lamp-card{position:relative;flex:0 0 360px;width:360px;padding:31px 29px 22px;border:1px solid #a2b843;border-radius:18px;background:rgba(29,42,35,.9);box-shadow:0 0 35px 8px rgba(162,197,27,.25),0 0 88px 10px rgba(133,164,21,.09);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.auth-lamp-layout .auth-lamp-card{transition:border-color .45s ease,box-shadow .45s ease,background .45s ease}
.login-card-content{opacity:1;transform:translateY(0);visibility:visible;transition:opacity .45s ease,transform .45s ease,visibility 0s}
.lamp-is-off .login-card-content{opacity:0;transform:translateY(10px);visibility:hidden;pointer-events:none;transition:opacity .45s ease,transform .45s ease,visibility 0s linear .45s}
.lamp-is-off .auth-lamp-card{border-color:rgba(118,139,72,.22);background:rgba(20,28,29,.3);box-shadow:0 0 10px rgba(162,197,27,.025)}
.auth-lamp-layout .auth-lamp-card h1{margin:0 0 5px;color:#e7eee7;font-family:inherit;font-size:24px;line-height:1.35;font-weight:700;letter-spacing:-.5px}
.auth-lamp-layout .auth-intro{margin:0 0 24px;color:#8d9a92;font-size:12px;line-height:1.5;letter-spacing:.1px}
.auth-lamp-layout .auth-form{gap:16px}
.auth-lamp-layout .auth-field{gap:7px;color:#aab4a9;font-size:11px;font-weight:400}
.auth-lamp-layout .auth-field input{height:42px;padding:0 13px;border:1px solid #172126;border-radius:7px;background:#0e1423;color:#edf2e7;font-family:inherit;font-size:13px;transition:border-color .18s,box-shadow .18s}
.auth-lamp-layout .auth-field input::placeholder{color:#59636c}
.auth-lamp-layout .auth-field input:focus{border-color:#b6d937;background:#0e1423;box-shadow:0 0 0 3px rgba(182,217,55,.12)}
.auth-lamp-layout .auth-field input:disabled{opacity:.6}
.auth-lamp-layout .auth-password-wrap input{padding-right:58px}
.auth-lamp-layout .auth-password-toggle{right:6px;min-width:42px;min-height:36px;padding:5px 7px;border-radius:5px;color:#a1ac8c;font-family:inherit;font-size:11px}
.auth-lamp-layout .auth-password-toggle:hover{background:rgba(182,217,55,.08);color:#d4e99b}
.auth-lamp-layout .auth-password-toggle:focus-visible,.auth-lamp-layout .auth-forgot:focus-visible,.auth-lamp-layout .auth-submit:focus-visible{outline:2px solid #d9ef94;outline-offset:4px}
.auth-lamp-layout .auth-submit{justify-content:center;min-height:42px;width:100%;margin-top:4px;padding:0 15px;border:1px solid rgba(217,242,119,.2);border-radius:8px;background:linear-gradient(180deg,#c0df55 0%,#b5d635 62%,#a6c92b 100%);box-shadow:0 5px 16px rgba(174,211,35,.22),inset 0 1px 0 rgba(244,255,192,.22);color:#18210e;font-family:inherit;font-size:13px;font-weight:750;letter-spacing:3px;transition:box-shadow .2s,transform .2s,opacity .2s}
.auth-lamp-layout .auth-submit>span:last-child{font-size:inherit;font-weight:inherit}
.auth-lamp-layout .auth-submit:hover:not(:disabled){background:linear-gradient(180deg,#c9e765,#badb3c);box-shadow:0 5px 25px rgba(182,217,55,.4),inset 0 1px 0 rgba(244,255,192,.3);transform:translateY(-1px)}
.auth-lamp-layout .auth-submit:active:not(:disabled){transform:translateY(0)}
.auth-lamp-layout .auth-submit:disabled{opacity:.6;box-shadow:none}
.auth-lamp-layout .auth-submit:has(.auth-spinner){gap:12px;letter-spacing:0}
.auth-lamp-layout .auth-spinner{border-color:rgba(24,33,14,.2);border-top-color:#314414}
.auth-lamp-layout .auth-checking{margin:0 0 16px;color:#a1ad94;font-size:11px}
.auth-lamp-layout .auth-checking .auth-spinner{border-color:rgba(182,217,55,.2);border-top-color:#b6d937}
.auth-lamp-layout .auth-config-notice{margin:0 0 18px}
.auth-lamp-layout .auth-message{font-size:12px;letter-spacing:0}
.auth-lamp-layout .auth-retry{color:#c3dd7d}
.auth-lamp-layout .auth-forgot{display:block;min-height:32px;margin:9px auto 0;padding:4px 12px;border:0;border-radius:6px;background:transparent;color:#9ba78e;font-family:inherit;font-size:11px;cursor:pointer;transition:color .2s,background .2s}
.auth-lamp-layout .auth-forgot:hover{background:rgba(182,217,55,.05);color:#d0e69b}
.auth-lamp-layout .auth-password-help{margin:7px 0 0;color:#b3be9f;font-size:12px;line-height:1.65;text-align:center}
.auth-lamp-layout .auth-password-help[hidden]{display:none}
.auth-lamp-layout .auth-caption{left:20px;right:20px;bottom:18px;display:flex;align-items:center;justify-content:center;gap:13px;color:#69746d;font-family:inherit;font-size:10px;font-weight:400;letter-spacing:.3px}
.auth-lamp-layout .auth-caption i{width:4px;height:4px;border-radius:50%;background:#a1be35;box-shadow:0 0 7px rgba(178,207,69,.3)}
.login-scene-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(min-width:781px) and (max-height:540px){.auth-lamp-layout{min-height:540px}}
@media(max-width:780px){
  .login-scene-pair{flex-direction:column;gap:0;width:100%;transform:none}
  .auth-lamp-layout{flex-direction:column;gap:0;justify-content:center;min-height:100svh;padding:20px 20px 62px}
  .login-lamp-stage{flex:0 0 auto;width:260px;height:310.56px;margin:0 0 -15px}
  .lamp-pull-switch{height:107px;top:44%}
  .lamp-switch-hint{font-size:10px;top:77%}
  .auth-lamp-layout .auth-lamp-card{flex:0 0 auto;width:min(100%,360px);padding:28px 25px 18px;border-radius:18px}
  .auth-lamp-layout .auth-lamp-card h1{font-size:24px}
  .auth-lamp-layout .auth-intro{margin-bottom:22px}
  .auth-lamp-layout .auth-field{font-size:12px}
  .auth-lamp-layout .auth-field input{height:48px;font-size:16px}
  .auth-lamp-layout .auth-password-toggle{min-height:44px}
  .auth-lamp-layout .auth-submit{min-height:48px;font-size:14px}
  .auth-lamp-layout .auth-forgot{min-height:44px;margin-top:7px;font-size:12px}
  .auth-lamp-layout .auth-caption{bottom:18px;font-size:10px}
  .login-lamp-ambience{left:calc(50% - 250px);top:0;width:500px;height:390px}
}
@media(max-width:780px) and (max-height:760px){.auth-lamp-layout{justify-content:flex-start;padding-top:8px}.login-lamp-stage{width:220px;height:262.78px;margin-bottom:-14px}.lamp-pull-switch{height:98px;top:42%}}
@media(prefers-reduced-motion:reduce){.auth-lamp-layout *{animation:none!important;transition:none!important}.auth-lamp-layout .auth-submit:hover:not(:disabled){transform:none}}

/* Wordwise shared design system: canonical tokens for every application route. */
:root{
  --accent-primary:#557dff;
  --accent-strong:#4169e8;
  --accent-violet:#8a67f5;
  --accent-soft:#edf1ff;
  --surface-raised:#fff;
  --surface-inset:#f4f6fb;
  --surface-quiet:#e8edf6;
  --ink:#192238;
  --muted:#78859b;
  --line:#e2e7f0;
  --canvas:#f6f7fb;
  --white:#fff;
  --teal:var(--accent-primary);
  --teal-dark:var(--accent-strong);
  --teal-pale:var(--accent-soft);
  --shadow:0 14px 40px rgba(25,36,62,.08);
  --shell-expanded-width:236px;
  --shell-rail-width:68px;
  --shell-topbar-height:72px;
  --shell-sidebar-surface:#fff;
  --shell-topbar-surface:rgba(255,255,255,.93);
  --shell-border:#e2e7f0;
  --shell-text:#192238;
  --shell-muted:#78859b;
  --shell-hover:#f2f5fc;
  --shell-active:#edf1ff;
  --shell-active-text:#5078f3;
  --shell-nav-marker:#557dff;

  --lime:#d9ef96;--coral:#ee896f;
  --surface-hover:#eef2fc;--surface-muted:var(--surface-inset);
  --border-strong:#b8c7e8;--text-on-accent:#fff;
  --button-surface:var(--surface-raised);--button-text:var(--ink);
  --button-gradient:linear-gradient(135deg,#4f7cff,#775df0);
  --button-gradient-hover:linear-gradient(135deg,#628bff,#866cf5);
  --accent-gradient:linear-gradient(90deg,var(--accent-primary),var(--accent-violet));
  --hero-gradient:linear-gradient(115deg,#edf2ff,#f0edff);--hero-border:#d9e2fa;
  --hero-ink:#192238;--hero-muted:#64718b;--hero-inset:rgba(255,255,255,.55);
  --focus-ring:0 0 0 3px rgba(85,125,255,.16);
  --button-shadow:0 6px 18px rgba(75,111,235,.18);
  --button-shadow-hover:0 8px 22px rgba(75,111,235,.25);
  --card-radius:10px;--control-radius:8px;--card-shadow:none;
  --card-padding:20px;--card-padding-compact:14px;--section-gap:16px;
  --page-max-width:1360px;--page-gutter:22px;--page-padding-top:22px;--page-padding-bottom:32px;
  --page-title-size:23px;--page-subtitle-size:12px;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --accent-primary:#5b83ff;
  --accent-strong:#7897ff;
  --accent-violet:#9a7bff;
  --accent-soft:#202d49;
  --surface-raised:#171f2e;
  --surface-inset:#121a28;
  --surface-quiet:#263249;
  --ink:#e9eef8;
  --muted:#9aa8c0;
  --line:#283449;
  --canvas:#0d1320;
  --white:#151d2b;
  --teal:var(--accent-primary);
  --teal-dark:var(--accent-strong);
  --teal-pale:var(--accent-soft);
  --shadow:0 16px 42px rgba(0,0,0,.24);
  --shell-sidebar-surface:#101725;
  --shell-topbar-surface:rgba(14,21,33,.94);
  --shell-border:#222d41;
  --shell-text:#e7edf8;
  --shell-muted:#9aa8c0;
  --shell-hover:#192338;
  --shell-active:#1b2941;
  --shell-active-text:#8eaeff;
  --shell-nav-marker:#648bff;
  background:var(--canvas);
  color:var(--ink);

  --lime:#c2d889;--coral:#df907a;
  --surface-hover:#1b2840;--border-strong:#445b88;
  --button-surface:#202b40;--button-text:#dbe4f6;
  --button-gradient:linear-gradient(135deg,#4e7cff,#7258ee);
  --button-gradient-hover:linear-gradient(135deg,#628bff,#8068f4);
  --hero-gradient:linear-gradient(115deg,#151e2e 0%,#182036 68%,#1c2340 100%);--hero-border:#283858;
  --hero-ink:#f2f5fc;--hero-muted:#a3aec4;--hero-inset:rgba(15,23,39,.38);
  --focus-ring:0 0 0 3px rgba(91,131,255,.16);
  --button-shadow:0 7px 20px rgba(75,111,235,.24);
  --button-shadow-hover:0 9px 24px rgba(75,111,235,.3);
}
html[data-theme="dark"] body,
html[data-theme="dark"] .main-area,
html[data-theme="dark"] .app-shell{background:var(--canvas);color:var(--ink)}
html[data-theme="dark"] .sidebar{background:var(--shell-sidebar-surface);border-color:var(--shell-border)}
html[data-theme="dark"] .topbar{background:var(--shell-topbar-surface);border-color:var(--shell-border);color:var(--shell-text)}
html[data-theme="dark"] .panel,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .study-card,
html[data-theme="dark"] .study-stat,
html[data-theme="dark"] .record-item,
html[data-theme="dark"] .modal{background:var(--surface-raised);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .nav-link{color:var(--shell-muted)}
html[data-theme="dark"] .nav-link:hover{background:var(--shell-hover);color:var(--shell-text)}
html[data-theme="dark"] .nav-link.active,
html[data-theme="dark"] .nav-link.active:hover{background:var(--shell-active);color:var(--shell-active-text)}
html[data-theme="dark"] .nav-count{background:#263249;color:#b6c5e1}
html[data-theme="dark"] .daily-card{background:#172238;border:1px solid #253451}
html[data-theme="dark"] .daily-spark{background:#263657;color:#9fb7ff}
html[data-theme="dark"] .sidebar-foot{border-color:var(--shell-border)}
html[data-theme="dark"] .breadcrumb strong{color:var(--shell-text)}
html[data-theme="dark"] .breadcrumb-separator{color:#5f6d84}
html[data-theme="dark"] .local-badge{background:#1c2941;color:#a9bfff}
html[data-theme="dark"] .sidebar-collapse-toggle,
html[data-theme="dark"] .menu-toggle,
html[data-theme="dark"] .theme-toggle{color:#aab8d1}
html[data-theme="dark"] .theme-toggle{border-color:var(--shell-border)}
html[data-theme="dark"] .account-menu-toggle{color:var(--shell-text)}
html[data-theme="dark"] .account-menu-popover{border-color:var(--shell-border);background:var(--shell-sidebar-surface)}
html[data-theme="dark"] .account-menu-heading{border-color:var(--shell-border)}
html[data-theme="dark"] .account-avatar{border-color:#34466a;background:#1d2c48;color:#9bb5ff}
html[data-theme="dark"] .button-primary{border-color:#6c8fff;background:var(--button-gradient);color:var(--text-on-accent);box-shadow:var(--button-shadow)}
html[data-theme="dark"] .button-primary:hover:not(:disabled){background:var(--button-gradient-hover);box-shadow:var(--button-shadow-hover)}
html[data-theme="dark"] .button-secondary{border-color:#33415b;background:#202b40;color:#dbe4f6}
html[data-theme="dark"] .button-ghost{border-color:#33415b;color:#bdc9df}
html[data-theme="dark"] .button-ghost:hover{background:#1c2941;color:#e7edf8}
html[data-theme="dark"] .quick-action,
html[data-theme="dark"] .search-box input,
html[data-theme="dark"] .select-control,
html[data-theme="dark"] .setting-row select,
html[data-theme="dark"] .form-field input,
html[data-theme="dark"] .form-field textarea,
html[data-theme="dark"] .form-field select,
html[data-theme="dark"] .answer-input{background:var(--surface-inset);color:var(--ink);border-color:#34415a}
html[data-theme="dark"] .quick-action-icon,
html[data-theme="dark"] .metric-icon{background:#202e4a;color:#99b4ff}
html[data-theme="dark"] .quick-action:hover{background:#1b2840;border-color:#445b88}
html[data-theme="dark"] .word-tag{background:#202d49;color:#a9bcff}
html[data-theme="dark"] .pill{background:#232e43;color:#c3cee1}
html[data-theme="dark"] .listen-button{background:#202d49;border-color:#394a70;color:#9fb8ff}
html[data-theme="dark"] .listen-button:hover{background:#273657}
html[data-theme="dark"] .sentence-box{background:#1a2538;color:#d8e2f4}
html[data-theme="dark"] .sentence-translation{color:#aab8cf}
html[data-theme="dark"] .answer-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px rgba(91,131,255,.16)}
html[data-theme="dark"] .kbd{background:#202b40;border-color:#3a4963;color:#c0cce0}
html[data-theme="dark"] .modal-backdrop{background:rgba(3,8,18,.76)}
html[data-theme="dark"] .modal-close{background:#263249;color:#c7d2e5}
html[data-theme="dark"] .form-field label{color:#bdc9dc}
html[data-theme="dark"] .setting-row{border-color:#2a364c}
html[data-theme="dark"] .progress-track,
html[data-theme="dark"] .study-progress{background:#27334a}
html[data-theme="dark"] .progress-fill{background:linear-gradient(90deg,var(--accent-primary),var(--accent-violet))}
html[data-theme="dark"] .study-status.correct{color:#7ed6a2}
html[data-theme="dark"] .study-status.wrong{color:#f0908c}
html[data-theme="dark"] .answer-reveal,
html[data-theme="dark"] .hint-area{color:#c6d1e3}
html[data-theme="dark"] .bulk-preview,
html[data-theme="dark"] .bulk-table-wrap{border-color:#2f3b52}
html[data-theme="dark"] .bulk-table th{background:#182233;color:#bdc8dc}
html[data-theme="dark"] .bulk-table td{border-color:#2b374c}
html[data-theme="dark"] .bulk-table input{background:#121a28;color:#e4eaf5;border-color:#34415a}
html[data-theme="dark"] .bulk-subtitle,
html[data-theme="dark"] .bulk-note,
html[data-theme="dark"] .bulk-placeholder,
html[data-theme="dark"] .bulk-summary,
html[data-theme="dark"] .bulk-raw{color:#aab7cc}
html[data-theme="dark"] .bulk-status.is-found{color:#81d5a1}
html[data-theme="dark"] .bulk-status.is-warning{color:#e9c17d}
html[data-theme="dark"] .course-overview>div,
html[data-theme="dark"] .course-package,
html[data-theme="dark"] .course-unit,
html[data-theme="dark"] .course-chapter,
html[data-theme="dark"] .course-sentence-row{background:var(--surface-raised);border-color:var(--line)}
html[data-theme="dark"] .course-unit,
html[data-theme="dark"] .course-import-summary{background:var(--surface-inset)}
html[data-theme="dark"] .course-package-body{border-color:var(--line)}
html[data-theme="dark"] .course-import-preview-row textarea{background:var(--surface-inset);color:var(--ink);border-color:#34415a}
html[data-theme="dark"] .course-empty strong{color:var(--ink)}
html[data-theme="dark"] .mobile-scrim.visible{background:rgba(3,8,18,.68)}

html{scrollbar-gutter:stable}
body{background:var(--canvas);color:var(--ink)}
.app-shell{min-height:100vh;background:var(--canvas)}
.sidebar{width:var(--shell-expanded-width);padding:18px 12px 12px;background:var(--shell-sidebar-surface);border-color:var(--shell-border)}
.main-area{margin-left:var(--shell-expanded-width);background:var(--canvas)}
.topbar{height:var(--shell-topbar-height);padding:0 27px;background:var(--shell-topbar-surface);border-color:var(--shell-border);color:var(--shell-text)}

.brand-mark{background:linear-gradient(135deg,#6b9bff,#8e6bfa);box-shadow:0 4px 14px rgba(74,113,235,.22)}
.brand-wordmark{color:var(--shell-text)}
.brand-dot{color:var(--accent-primary)}
.side-label{color:var(--shell-muted);font-size:10px;letter-spacing:.04em}
.nav-link{border-radius:8px;color:var(--shell-muted)}
.nav-link.active{background:var(--shell-active);color:var(--shell-active-text)}
.nav-link:focus-visible,.sidebar-collapse-toggle:focus-visible,.menu-toggle:focus-visible,.theme-toggle:focus-visible,.account-menu-toggle:focus-visible,#auth-logout:focus-visible{outline:2px solid color-mix(in srgb,var(--accent-primary) 72%,transparent);outline-offset:2px}
.sidebar-collapse-toggle,.menu-toggle,.theme-toggle{border-radius:8px;color:var(--shell-muted)}
.account-avatar,.avatar{border-color:color-mix(in srgb,var(--accent-primary) 24%,transparent);background:color-mix(in srgb,var(--accent-primary) 13%,var(--surface-raised));color:var(--accent-primary)}
.account-menu-popover{border-color:var(--shell-border);background:var(--shell-sidebar-surface);box-shadow:var(--shadow)}
.button-primary{border-color:#4c75ec;background:var(--button-gradient);color:var(--text-on-accent);box-shadow:var(--button-shadow)}
.button-primary:hover:not(:disabled){background:var(--button-gradient-hover);box-shadow:var(--button-shadow-hover)}
.button-secondary{border-color:var(--line);background:var(--surface-raised);color:var(--ink)}
.button-ghost{border-color:var(--line);color:var(--muted)}
.button-ghost:hover{background:var(--surface-inset);color:var(--ink)}
.metric-card,.panel,.study-card,.study-stat,.record-item{border-color:var(--line);border-radius:10px;background:var(--surface-raised);box-shadow:none}
.metric-icon{background:var(--accent-soft);color:var(--accent-primary)}
.progress-track,.study-progress{background:var(--surface-quiet)}
.progress-fill{background:linear-gradient(90deg,var(--accent-primary),var(--accent-violet))}
.home-dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 304px;align-items:start;gap:16px}
.home-primary-column,.home-insight-rail{display:grid;min-width:0;align-content:start;gap:14px}
.home-insight-rail{gap:12px}

.home-heading{align-items:center;margin:0 0 1px}
.home-heading .eyebrow{margin-bottom:5px;color:var(--accent-primary);font-size:9px;letter-spacing:1.2px}
.home-heading h1{margin:0;font-size:23px;line-height:1.3;letter-spacing:-.45px;color:var(--ink)}
.home-heading p{margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
.home-hero{display:flex;min-height:166px;align-items:center;justify-content:space-between;gap:24px;overflow:hidden;padding:21px 23px;border:1px solid var(--hero-border);border-radius:11px;background:var(--hero-gradient);box-shadow:0 12px 32px rgba(7,13,29,.18)}
.home-hero-copy{min-width:0}
.home-hero-kicker{display:inline-flex;align-items:center;gap:7px;color:#a9baff;font-size:10px;font-weight:650;letter-spacing:.3px}
.home-hero-kicker i{width:6px;height:6px;border-radius:50%;background:var(--accent-primary);box-shadow:0 0 10px rgba(91,131,255,.55)}
.home-hero h2{margin:10px 0 5px;color:#f2f5fc;font-size:20px;line-height:1.35;letter-spacing:-.35px;font-weight:680}
.home-hero p{margin:0;color:#a3aec4;font-size:11px;line-height:1.55}
.home-hero-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.home-hero-actions .button{min-height:34px;padding:8px 12px;border-radius:7px;font-size:10px}
.home-hero .button-secondary{border-color:#34415b;background:#202a3d;color:#d6def0}
.home-hero-side{flex:0 0 174px;display:grid;gap:6px;padding:13px 14px;border:1px solid rgba(139,160,212,.16);border-radius:9px;background:rgba(15,23,39,.38)}
.home-hero-side>span{color:#8f9cb3;font-size:9px}
.home-hero-side strong{color:#e7edfa;font-size:20px;line-height:1.2;font-weight:700}
.home-hero-side strong small{font-size:10px;color:#acb8ce;font-weight:500}
.home-hero-side>small{color:#7f8ba1;font-size:9px}
.home-week-panel,.home-quick-panel,.home-progress-panel,.home-today-panel,.home-recent-panel{margin:0;padding:15px 16px;border:1px solid var(--line);border-radius:10px;background:var(--surface-raised);box-shadow:0 5px 18px rgba(10,18,35,.035)}
.home-dashboard .panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 11px}
.home-dashboard .panel-head h3{margin:0;color:var(--ink);font-size:12px;font-weight:680;letter-spacing:-.1px}
.home-section-meta{display:block;margin-top:4px;color:var(--muted);font-size:9px}
.home-panel-link{color:var(--muted);font-size:9px;text-decoration:none;white-space:nowrap}
.home-panel-link:hover{color:var(--accent-primary)}
.home-week-chart{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;align-items:end;padding-top:3px}
.home-week-day{display:grid;grid-template-rows:70px auto;justify-items:center;gap:6px;min-width:0}
.home-week-bar-area{width:100%;height:70px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px}
.home-week-value{min-height:11px;color:var(--muted);font-size:8px;line-height:11px}
.home-week-bar{display:block;width:min(22px,48%);min-height:3px;border-radius:4px 4px 2px 2px;background:#35435c;transition:height .2s ease,background .2s ease}
.home-week-bar.has-activity{background:linear-gradient(180deg,#8b76f6,#5d82ff)}
.home-week-bar.is-today{background:linear-gradient(180deg,#ae9aff,#628aff);box-shadow:0 0 12px rgba(107,125,255,.2)}
.home-week-label{color:var(--muted);font-size:9px}
.home-week-label.is-today{color:var(--accent-primary);font-weight:700}
.home-quick-list{display:grid;gap:6px}
.home-quick-item{width:100%;min-height:54px;display:flex;align-items:center;gap:11px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface-inset);text-align:left;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,transform .16s ease}
.home-quick-item:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent-primary) 35%,var(--line));background:color-mix(in srgb,var(--accent-soft) 45%,var(--surface-inset))}
.home-quick-icon{flex:0 0 31px;width:31px;height:31px;display:grid;place-items:center;border-radius:7px;background:color-mix(in srgb,var(--accent-primary) 12%,var(--surface-raised));color:var(--accent-primary)}
.home-quick-icon.is-violet{background:color-mix(in srgb,var(--accent-violet) 13%,var(--surface-raised));color:var(--accent-violet)}
.home-quick-icon.is-amber{background:rgba(225,170,75,.12);color:#d8a653}
.home-quick-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.home-quick-copy{display:grid;min-width:0;gap:3px}
.home-quick-copy strong{color:var(--ink);font-size:10px;font-weight:650}
.home-quick-copy small{overflow:hidden;color:var(--muted);font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.home-quick-arrow{margin-left:auto;color:#8494b3;font-size:16px;line-height:1}
.home-progress-panel .panel-head,.home-today-panel .panel-head,.home-recent-panel .panel-head{margin-bottom:12px}
.home-progress-body{display:flex;align-items:center;gap:14px;padding:1px 2px 2px}
.home-progress-ring{position:relative;flex:0 0 84px;width:84px;height:84px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--accent-primary) 0 var(--progress),var(--surface-quiet) var(--progress) 100%)}
.home-progress-ring::before{position:absolute;inset:7px;border:1px solid color-mix(in srgb,var(--line) 72%,transparent);border-radius:50%;background:var(--surface-raised);content:""}
.home-progress-ring span{position:relative;color:var(--ink);font-size:18px;font-weight:700;letter-spacing:-.3px}
.home-progress-ring span small{margin-left:1px;color:var(--muted);font-size:9px;font-weight:600}
.home-progress-copy{display:grid;min-width:0;gap:5px}
.home-progress-copy>span{color:var(--muted);font-size:9px}
.home-progress-copy>strong{color:var(--ink);font-size:16px;font-weight:700}
.home-progress-copy>strong small{color:var(--muted);font-size:9px;font-weight:500}
.home-progress-copy>small{color:var(--muted);font-size:8px;line-height:1.4}
.home-today-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.home-today-stat{min-width:0;display:grid;gap:7px;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--surface-inset)}
.home-today-stat>span{overflow:hidden;color:var(--muted);font-size:8px;text-overflow:ellipsis;white-space:nowrap}
.home-today-stat>strong{color:var(--ink);font-size:16px;line-height:1.1;font-weight:700}
.home-today-stat>strong small{margin-left:3px;color:var(--muted);font-size:8px;font-weight:500}
.home-insight-rail .review-home-panel{margin:0;padding:14px 15px;border:1px solid var(--line);border-radius:10px;background:var(--surface-raised);box-shadow:0 5px 18px rgba(10,18,35,.035)}
.home-insight-rail .review-home-panel .panel-head{margin-bottom:10px}
.home-insight-rail .review-home-panel .panel-head h3{font-size:12px}
.home-insight-rail .review-home-subtitle{margin-top:4px;color:var(--muted);font-size:9px}
.home-insight-rail .review-home-panel .panel-head a{color:var(--muted);font-size:9px;text-decoration:none}
.home-insight-rail .review-home-active,.home-insight-rail .review-home-empty{min-height:52px;gap:8px;padding:9px;border:1px solid var(--line);border-radius:8px;background:var(--surface-inset)}
.home-insight-rail .review-home-active strong{color:var(--ink);font:700 17px Manrope,sans-serif}
.home-insight-rail .review-home-active>div>span,.home-insight-rail .review-home-active small,.home-insight-rail .review-home-empty>div>span{color:var(--muted);font-size:9px}
.home-insight-rail .review-home-active .button{min-height:31px;padding:6px 8px;border-radius:7px;font-size:9px}
.home-insight-rail .review-home-empty .review-empty-mark{flex-basis:25px;width:25px;height:25px;background:#1d2b46;color:#91adff}
.home-insight-rail .review-home-empty strong{color:var(--ink);font-size:10px}
.home-recent-list{display:grid;gap:3px}
.home-recent-row{min-height:39px;display:flex;align-items:center;gap:8px;padding:5px 1px;border-bottom:1px solid var(--line)}
.home-recent-row:last-child{border-bottom:0}
.home-recent-mark{flex:0 0 20px;width:20px;height:20px;display:grid;place-items:center;border-radius:6px;background:#202e49;color:#8cabff;font-size:10px;font-weight:700}
.home-recent-mark.is-wrong{background:rgba(214,139,91,.12);color:#d89a66}
.home-recent-copy{display:grid;min-width:0;gap:3px}
.home-recent-copy strong{overflow:hidden;color:var(--ink);font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.home-recent-copy small{overflow:hidden;color:var(--muted);font-size:8px;text-overflow:ellipsis;white-space:nowrap}
.home-recent-result{margin-left:auto;color:#55b97b;font-size:8px;white-space:nowrap}
.home-recent-result.is-wrong{color:#d89a66}
.home-recent-empty{padding:7px 1px;color:var(--muted);font-size:9px;line-height:1.55}
.sync-settings-section{grid-column:1/-1}
.cloud-conflict-modal{border-color:var(--line);background:var(--surface-raised);color:var(--ink)}
.cloud-conflict-modal .modal-head{background:var(--surface-raised)}
.cloud-conflict-note{color:var(--muted)}
.cloud-conflict-row{border-color:var(--line);background:var(--surface-inset)}
.cloud-conflict-row strong{color:var(--accent-primary)}
.cloud-conflict-row>span{color:var(--muted)}
#sync-panel-live{margin-top:14px}
.sync-live{display:grid;gap:13px}
.sync-live-top{display:flex;align-items:center;justify-content:space-between;gap:18px}
.sync-live-copy{min-width:0}
.sync-state-line{display:flex;align-items:center;gap:8px;color:var(--ink);font-size:12px}
.sync-state-dot{flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:#59b780;box-shadow:0 0 0 3px rgba(89,183,128,.12)}
.sync-live-message{margin:6px 0 0 16px;color:var(--muted);font-size:10px;line-height:1.6;overflow-wrap:anywhere}
.sync-conflict-count{border:1px solid color-mix(in srgb,#e45858 25%,var(--line));border-radius:999px;padding:3px 7px;color:#d34c56;background:color-mix(in srgb,#e45858 8%,var(--surface-raised));font-size:9px;font-weight:600}
.sync-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.sync-metric{display:grid;min-width:0;gap:7px;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--surface-inset)}
.sync-metric>span{color:var(--muted);font-size:9px}
.sync-metric>strong{overflow:hidden;color:var(--ink);font-size:13px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.sync-metric>small{min-height:12px;color:var(--muted);font-size:8px;line-height:1.5}
.sync-action-button{flex:0 0 auto;min-width:120px;min-height:36px;padding:9px 12px;font-size:10px}
.sync-action-button:disabled,.sync-attention button:disabled{cursor:wait;opacity:.68;transform:none}
.sync-attention{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 11px;border:1px solid color-mix(in srgb,#d99a36 28%,var(--line));border-radius:8px;background:color-mix(in srgb,#d99a36 8%,var(--surface-inset));color:var(--muted);font-size:10px;line-height:1.6}
.sync-live[data-state="idle"] .sync-state-dot{background:#45ad75;box-shadow:0 0 0 3px rgba(69,173,117,.13)}
.sync-live[data-state="syncing"] .sync-state-dot,.sync-live[data-state="remote-update"] .sync-state-dot{background:#5286f5;box-shadow:0 0 0 3px rgba(82,134,245,.14)}
.sync-live[data-state="pending"] .sync-state-dot,.sync-live[data-state="offline"] .sync-state-dot{background:#dc9b3a;box-shadow:0 0 0 3px rgba(220,155,58,.14)}
.sync-live[data-state="error"] .sync-state-dot,.sync-live[data-state="conflict"] .sync-state-dot,.sync-live[data-state="setup-needed"] .sync-state-dot{background:#df5a60;box-shadow:0 0 0 3px rgba(223,90,96,.14)}
.sync-live[data-state="error"] .sync-attention,.sync-live[data-state="conflict"] .sync-attention,.sync-live[data-state="setup-needed"] .sync-attention{border-color:color-mix(in srgb,#df5a60 30%,var(--line));background:color-mix(in srgb,#df5a60 8%,var(--surface-inset))}
.sync-live[data-state="offline"] .sync-live-message,.sync-live[data-state="error"] .sync-live-message,.sync-live[data-state="conflict"] .sync-live-message,.sync-live[data-state="setup-needed"] .sync-live-message{display:none}
.sync-spinner{width:13px;height:13px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sync-spin .7s linear infinite}
@keyframes sync-spin{to{transform:rotate(360deg)}}
@media(max-width:620px){.sync-live-top{align-items:stretch;flex-direction:column;gap:11px}.sync-action-button{width:100%}.sync-metrics{grid-template-columns:1fr}.sync-metric{grid-template-columns:1fr auto;align-items:center;gap:5px 12px}.sync-metric>strong{grid-column:2;grid-row:1/3;text-align:right}.sync-metric>small{grid-column:1}.sync-attention{align-items:flex-start;flex-direction:column}.sync-attention button{width:100%}}
@media(prefers-reduced-motion:reduce){.sync-spinner{animation:none}}
html[data-theme="dark"] .home-hero{border-color:var(--hero-border);background:var(--hero-gradient)}
html[data-theme="dark"] .home-hero .button-secondary{border-color:#34415b;background:#202a3d;color:#d6def0}
html[data-theme="dark"] .home-week-panel,
html[data-theme="dark"] .home-quick-panel,
html[data-theme="dark"] .home-progress-panel,
html[data-theme="dark"] .home-today-panel,
html[data-theme="dark"] .home-recent-panel,
html[data-theme="dark"] .home-insight-rail .review-home-panel{border-color:var(--line);background:var(--surface-raised)}
html[data-theme="dark"] .home-quick-item{border-color:#27354d;background:#121a28}
html[data-theme="dark"] .home-quick-item:hover{border-color:#455d8c;background:#19243a}
html[data-theme="dark"] .home-today-stat{border-color:#27354d;background:#121a28}
html[data-theme="dark"] .home-insight-rail .review-home-active,
html[data-theme="dark"] .home-insight-rail .review-home-empty{border-color:#27354d;background:#121a28}
html[data-theme="dark"] .home-insight-rail .review-home-empty .review-empty-mark{background:#202e49;color:#91adff}
html[data-theme="dark"] .home-recent-row{border-color:#263248}
@media(max-width:1120px){
  :root{--shell-expanded-width:220px}
  .sidebar{width:var(--shell-expanded-width)}
  .main-area{margin-left:var(--shell-expanded-width)}
  .topbar{padding-right:21px;padding-left:21px}
  
  .home-dashboard-grid{grid-template-columns:minmax(0,1fr) 280px;gap:12px}
  .home-hero{padding-right:17px;padding-left:17px}
  .home-hero-side{flex-basis:150px}
}
@media(max-width:980px) and (min-width:761px){
  .home-dashboard-grid{grid-template-columns:minmax(0,1fr)}
  .home-insight-rail{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .home-insight-rail .review-home-panel,.home-recent-panel{grid-column:span 2}
}
@media(max-width:760px){
  :root{--shell-expanded-width:250px;--shell-topbar-height:58px}
  .sidebar{width:min(280px,calc(100vw - 48px));padding:17px 12px 12px}
  .main-area{margin-left:0}
  .topbar{height:58px;padding-right:14px;padding-left:14px}
  
  .home-dashboard-grid{grid-template-columns:minmax(0,1fr);gap:13px}
  .home-primary-column,.home-insight-rail{gap:11px}
  .home-heading h1{font-size:21px}
  .home-hero{min-height:0;align-items:flex-start;padding:17px 16px}
  .home-hero h2{font-size:17px}
  .home-hero-side{flex:0 0 125px;align-self:center;padding:10px}
  .home-hero-side strong{font-size:17px}
  .home-week-panel,.home-quick-panel,.home-progress-panel,.home-today-panel,.home-recent-panel{padding:13px}
  .home-week-chart{gap:5px}
  .home-week-day{grid-template-rows:61px auto}
  .home-week-bar-area{height:61px}
  .home-week-bar{width:min(20px,54%)}
}
@media(max-width:480px){
  .home-hero{display:grid;gap:13px}
  .home-hero-side{width:100%;grid-template-columns:1fr auto;align-items:center;gap:4px 8px}
  .home-hero-side>span{grid-column:1}
  .home-hero-side strong{grid-column:2;grid-row:1/3}
  .home-hero-side>small{grid-column:1}
  .home-hero-actions .button{flex:1;justify-content:center}
  .home-insight-rail{grid-template-columns:minmax(0,1fr)}
  .home-insight-rail .review-home-panel,.home-recent-panel{grid-column:auto}
  .home-progress-body{gap:12px}
  .home-progress-ring{flex-basis:76px;width:76px;height:76px}
  .home-week-chart{gap:3px}
  .home-week-label{font-size:8px}
  .home-quick-item{min-height:51px}
}
@media(prefers-reduced-motion:reduce){
  .home-quick-item,.home-week-bar{transition:none!important}
  .home-quick-item:hover{transform:none}
}

/* Shared application components. Login and word-level typing keep their own scoped visuals. */
.page-content,.page-content:has(.home-dashboard){width:100%;max-width:var(--page-max-width);margin-inline:auto;padding:var(--page-padding-top) var(--page-gutter) var(--page-padding-bottom)}
.page-heading,.home-heading{align-items:center;gap:var(--section-gap);margin:0 0 20px}
.page-heading h1,.home-heading h1{margin:5px 0 6px;font:800 var(--page-title-size)/1.3 Manrope,'Noto Sans SC',sans-serif;letter-spacing:-.45px;color:var(--ink)}
.page-heading p,.home-heading p{margin:0;color:var(--muted);font-size:var(--page-subtitle-size);line-height:1.6}
.page-heading .eyebrow,.home-heading .eyebrow{margin:0;color:var(--accent-primary);font-size:10px;letter-spacing:1.2px}
.sentence-page>.page-heading,.review-page>.page-heading{margin-bottom:0}
.sentence-page,.review-page{gap:var(--section-gap)}
.panel,.metric-card,.study-card,.study-stat,.record-item,.review-stat,.directory-card,.directory-word-item,.notebook-entry,.sentence-sample,.sentence-summary-grid>div,.sentence-linked-grid>div,.review-linked-metrics>div,.review-home-numbers>div,.review-queue-item,.course-package,.course-unit,.course-chapter,.course-sentence-row{
  border-radius:var(--card-radius);border-color:var(--line);background:var(--surface-raised);color:var(--ink);box-shadow:var(--card-shadow)
}
/* Theme-qualified legacy rules have higher specificity; pair the same recipe explicitly. */
html[data-theme="dark"] :is(.review-stat,.directory-card,.directory-word-item,.notebook-entry,.sentence-sample,.sentence-summary-grid>div,.sentence-linked-grid>div,.review-linked-metrics>div,.review-home-numbers>div,.review-queue-item,.course-package,.course-unit,.course-chapter,.course-sentence-row){background:var(--surface-raised);border-color:var(--line)}
.panel{padding:var(--card-padding)}
.panel:has(>.table-wrap){padding:0}
.metric-card,.review-stat,.directory-card,.notebook-entry,.record-item,.sentence-sample{padding:var(--card-padding-compact)}
.course-overview>div{padding:var(--card-padding-compact);border-radius:var(--card-radius);box-shadow:var(--card-shadow)}
.home-dashboard :is(.home-week-panel,.home-quick-panel,.home-progress-panel,.home-today-panel,.home-recent-panel,.review-home-panel){padding:var(--card-padding-compact);border-radius:var(--card-radius);box-shadow:var(--card-shadow)}
.panel.home-hero{border-color:var(--hero-border);background:var(--hero-gradient)}
.home-hero h2,.home-hero-side strong{color:var(--hero-ink)}
.home-hero p,.home-hero-side>span,.home-hero-side>small,.home-hero-side strong small{color:var(--hero-muted)}
.home-hero-kicker{color:var(--accent-strong)}
.home-hero-side{background:var(--hero-inset);border-color:var(--hero-border)}
.panel.sentence-practice-card{padding:0}
.panel.dictation-card,.panel.review-session-card{padding:var(--card-padding)}
.panel.study-card{padding:28px 32px}
.button{border-radius:var(--control-radius)}
html[data-theme] .button-secondary{border-color:var(--line);background:var(--button-surface);color:var(--button-text)}
html[data-theme] .button-ghost{border-color:var(--line);color:var(--muted)}
html[data-theme] .button-ghost:hover{background:var(--surface-hover);color:var(--ink)}
.button:disabled{cursor:not-allowed;transform:none}
.button:focus-visible,.text-link:focus-visible,.row-action:focus-visible,.word-more-button:focus-visible{outline:2px solid var(--accent-primary);outline-offset:3px}
/* Inputs share a quiet inset surface. Do not target the hidden sentence capture input. */
html[data-theme] :is(.search-box input,.select-control,.setting-row select,.form-field input,.form-field textarea,.form-field select,.answer-input,.review-answer-input,.dictation-answer-input,.dictation-preferences select,.dictation-controls select,.directory-create input,.directory-delete-modal select,.inline-directory-create input,.bulk-table input,.course-import-preview-row textarea){border-color:var(--line);background:var(--surface-inset);color:var(--ink);border-radius:var(--control-radius)}
html[data-theme] :is(.search-box input,.select-control,.setting-row select,.form-field input,.form-field textarea,.form-field select,.answer-input,.review-answer-input,.dictation-answer-input,.dictation-preferences select,.dictation-controls select):focus-visible{outline:0;border-color:var(--accent-primary);box-shadow:var(--focus-ring)}
html[data-theme] :is(.search-box input,.form-field input,.form-field textarea,.answer-input,.review-answer-input,.dictation-answer-input)::placeholder{color:var(--muted);opacity:.8}
html[data-theme] :is(.sentence-mode-option,.review-scope,.notebook-tabs,.startup-option,.study-category-option,.study-course-all,.study-lesson-option){background:var(--surface-inset);border-color:var(--line);color:var(--muted)}
html[data-theme] :is(.sentence-mode-option.active,.review-scope button.active,.notebook-tab.active,.startup-option:has(input:checked),.study-category-option:has(input:checked),.study-lesson-option:has(input:checked)){background:var(--accent-soft);border-color:var(--border-strong);color:var(--accent-strong)}
html[data-theme] .sentence-mode-option.active small{color:var(--accent-strong)}
html[data-theme] .notebook-tab span{background:var(--surface-quiet);color:var(--muted)}
html[data-theme] .notebook-tab.active span{background:var(--surface-raised);color:var(--accent-strong)}
html[data-theme] :is(.word-table th,.word-group-row td,.bulk-table th,.bulk-group>summary){background:var(--surface-inset);color:var(--muted);border-color:var(--line)}
html[data-theme] .word-table td{color:var(--muted);border-color:var(--line)}
html[data-theme] .word-name{color:var(--ink)!important}
html[data-theme] :is(.study-category-option,.study-course-all,.study-lesson-option,.startup-option) input{accent-color:var(--accent-primary)}
html[data-theme] .study-progress .progress-fill{background:var(--accent-gradient)}
html[data-theme] .account-menu-popover{border-radius:var(--card-radius);box-shadow:var(--shadow)}
.course-practice-filter{display:grid;grid-template-columns:minmax(170px,1fr) minmax(140px,1fr) minmax(140px,1fr) auto;align-items:end;gap:12px}
.course-practice-filter>div{display:grid;gap:5px;align-self:center}
.course-practice-filter strong{font-size:12px;color:var(--ink)}
.course-practice-filter :is(div>span,label>span){font-size:11px;color:var(--muted);line-height:1.6}
.course-practice-filter label{display:grid;gap:5px;min-width:0}
.course-practice-filter select{width:100%;min-width:0;min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--control-radius);background:var(--surface-inset);color:var(--ink);font-size:12px;outline:0}
.course-practice-filter select:focus-visible{border-color:var(--accent-primary);box-shadow:var(--focus-ring)}
@media(hover:hover) and (pointer:fine){
  html[data-theme] :is(.directory-card,.directory-word-item,.notebook-entry,.review-queue-item,.course-sentence-row):hover{background:var(--surface-hover);border-color:var(--border-strong)}
  html[data-theme] .button-secondary:hover:not(:disabled){background:var(--surface-hover);border-color:var(--border-strong)}
}
@media(max-width:1120px){:root{--page-gutter:18px}.course-practice-filter{grid-template-columns:repeat(2,minmax(0,1fr))}.course-practice-filter>div{grid-column:1/-1}}
@media(max-width:760px){
  :root{--page-gutter:14px;--page-padding-top:18px;--page-padding-bottom:26px;--page-title-size:21px;--page-subtitle-size:12px;--card-padding:16px;--card-padding-compact:13px;--section-gap:14px}
  .page-heading,.home-heading{align-items:flex-start;margin-bottom:18px}
  .page-heading{flex-wrap:wrap}
  .page-heading>div:first-child{min-width:0}
  .page-heading :is(.button,.select-control),.filter-row :is(.button,.select-control),.notebook-toolbar .select-control{min-height:40px}
  .search-box input,.setting-row select,.form-field input,.form-field textarea,.form-field select,.dictation-answer-input,.review-answer-input{font-size:16px}
  .panel.study-card{padding:22px 16px}
  .account-menu-popover{max-width:calc(100vw - 28px)}
  .course-practice-filter{grid-template-columns:minmax(0,1fr)}
  .course-practice-filter select{min-height:44px;font-size:16px}
}

/* The site reserves a stable scrollbar gutter globally; immersive practice fills the full viewport. */
/* Sentence practice color tokens stay local to its reusable practice surface. */
.sentence-immersive-layout{--sentence-bg:#141619;--sentence-text:#e9edf2;--sentence-muted:#858e9a;--sentence-line:#30353c;--sentence-accent:#a9a4ff;--sentence-good:#87d6b3;--sentence-bad:#ff858a}
.sentence-immersive-layout{position:relative;display:grid;grid-template-rows:auto 2px minmax(0,1fr) auto;min-height:100vh;min-height:100dvh;padding:0 clamp(18px,4vw,64px);overflow-x:hidden;background:#141619;color:#e9edf2}
.sentence-immersive-header{position:relative;z-index:6;min-width:0}
.sentence-immersive-header-content{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:18px;min-height:74px;border-bottom:1px solid rgba(190,198,210,.08)}
.sentence-immersive-back,.sentence-immersive-settings-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 12px;border:1px solid transparent;border-radius:9px;background:transparent;color:#aeb5bf;font-size:12px;font-weight:600;transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.sentence-immersive-back{justify-self:start;margin-left:-12px}
.sentence-immersive-back:hover,.sentence-immersive-settings-button:hover{background:rgba(190,198,210,.08);color:#f2f4f7}
.sentence-immersive-back:focus-visible,.sentence-immersive-settings-button:focus-visible,.sentence-immersive-actions button:focus-visible,.sentence-immersive-primary:focus-visible,.sentence-immersive-settings button:focus-visible{outline:2px solid var(--sentence-accent);outline-offset:3px}
.sentence-immersive-context{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 9px;min-width:0;color:var(--sentence-muted);font-size:11px}
.sentence-immersive-context>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sentence-immersive-context strong{overflow:hidden;color:#d4d9e1;font-size:12px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.sentence-immersive-word-position{color:#8992a0;font-size:10px;font-weight:500}
.sentence-immersive-tools{display:flex;justify-self:end;align-items:center;gap:14px}
.sentence-immersive-counter{color:#aab1bd;font:600 13px Manrope,'DM Sans',sans-serif;white-space:nowrap}
.sentence-immersive-counter i{padding:0 3px;color:#5e6671;font-style:normal}
.sentence-immersive-score{color:#e5b76e;font:800 15px Manrope,'DM Sans',sans-serif;white-space:nowrap}
.sentence-immersive-score small{margin-left:3px;color:#9299a3;font:500 10px 'Noto Sans SC',sans-serif}
.sentence-immersive-progress{width:100%;height:2px;overflow:hidden;background:rgba(165,174,190,.15)}
.sentence-immersive-progress span{display:block;height:100%;border-radius:0 2px 2px 0;background:linear-gradient(90deg,#8c91ee,#63c8a8);transition:width .22s ease-out}
.sentence-immersive-settings{position:absolute;top:calc(100% - 4px);right:0;z-index:10;width:min(360px,calc(100vw - 28px));padding:17px;border:1px solid #343943;border-radius:13px;background:#202329;color:#e8ebf1;box-shadow:0 18px 54px rgba(0,0,0,.32)}
.sentence-immersive-settings[hidden]{display:none!important}
.sentence-immersive-settings-heading,.sentence-immersive-settings-actions{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sentence-immersive-settings-heading{margin-bottom:13px;font-size:13px}
.sentence-immersive-settings button:not(.sentence-mode-option){min-height:36px;padding:7px 10px;border:1px solid #3b4049;border-radius:8px;background:#252a31;color:#c6ccd5;font-size:11px}
.sentence-immersive-settings button:hover:not(:disabled){border-color:#626777;background:#2a3038;color:#fff}
.sentence-immersive-settings-actions{padding-top:13px;margin-top:13px;border-top:1px solid rgba(190,198,210,.1)}
.sentence-immersive-settings .sentence-mode-picker{gap:8px;padding:0;margin:0;border:0;background:transparent}
.sentence-immersive-settings .sentence-mode-picker>span{color:#aab1bd}
.sentence-immersive-settings .sentence-mode-options{display:grid;grid-template-columns:1fr;gap:6px}
.sentence-immersive-settings .sentence-mode-option{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid #393e48;border-radius:8px;background:#252a31;color:#c8ced8;text-align:left}
.sentence-immersive-settings .sentence-mode-option.active{border-color:#716be0;background:#34334b;color:#e9e7ff}
.sentence-immersive-settings .sentence-mode-option strong{font-size:11px}
.sentence-immersive-settings .sentence-mode-option small{color:#9299a5;font-size:10px}
.sentence-immersive-settings .sentence-mode-option.active small{color:#c2beff}
.sentence-immersive-main{display:grid;place-items:center;min-width:0;min-height:0;padding:clamp(22px,5vh,66px) 0}
.sentence-immersive-content{position:relative;width:min(1320px,100%);margin:0 auto;text-align:center;animation:sentence-immersive-enter .18s ease both}
.sentence-immersive-main-position{margin-bottom:clamp(14px,3vh,28px);color:#747d88;font-size:11px;letter-spacing:.015em}
.sentence-immersive-word-preview{width:100%;min-width:0;min-height:120px;text-align:center}
.sentence-immersive-word-preview .sentence-word-flow{align-items:flex-start;justify-content:center;column-gap:clamp(9px,1.55vw,21px);row-gap:clamp(26px,4vh,42px);padding:12px 0 8px}
.sentence-immersive-word-preview .sentence-word-unit{grid-template-rows:19px minmax(52px,auto) 15px minmax(20px,auto);gap:5px;min-width:28px;max-width:100%;break-inside:avoid;animation:none}
.sentence-immersive-word-preview .sentence-word-grammar{grid-template-rows:19px minmax(52px,auto) 15px minmax(20px,auto);gap:5px}
.sentence-immersive-word-preview .sentence-word-phonetic{min-height:15px;color:#777f8a;font:500 11px/1.2 Manrope,'Noto Sans SC',sans-serif}
.sentence-immersive-word-preview .sentence-word-token{min-height:52px;max-width:100%;padding:4px 9px;border:0;border-bottom:2px solid transparent;border-radius:6px;background:transparent;color:#e8ecf2;font:650 clamp(28px,3.35vw,50px)/1.2 Manrope,'Noto Sans SC',sans-serif;letter-spacing:0;box-shadow:none;transform:none;transition:background-color .13s ease,color .13s ease,border-color .13s ease}
.sentence-immersive-word-preview .sentence-word-token[data-tone="0"]{--word-line:#dca64e}
.sentence-immersive-word-preview .sentence-word-token[data-tone="1"]{--word-line:#d4758f}
.sentence-immersive-word-preview .sentence-word-token[data-tone="2"]{--word-line:#759ee8}
.sentence-immersive-word-preview .sentence-word-token[data-tone="3"]{--word-line:#53b899}
.sentence-immersive-word-preview .sentence-word-token[data-tone="4"]{--word-line:#a58bdd}
.sentence-immersive-word-preview .sentence-word-token[data-tone]{border-bottom-color:color-mix(in srgb,var(--word-line) 70%,transparent);background:color-mix(in srgb,var(--word-line) 13%,transparent);color:#f0f2f7}
.sentence-immersive-word-preview .sentence-word-unit.is-current .sentence-word-token{border-bottom-color:var(--sentence-accent);background:color-mix(in srgb,var(--sentence-accent) 12%,transparent);box-shadow:none;transform:none}
.sentence-immersive-word-preview .sentence-word-unit[data-word-index]{cursor:pointer}
.sentence-immersive-word-preview .sentence-word-unit[data-word-index]:hover .sentence-word-token{background:color-mix(in srgb,var(--sentence-accent) 17%,transparent)}
.sentence-immersive-word-preview .sentence-word-unit.is-completed .sentence-word-token{border-bottom-color:color-mix(in srgb,var(--sentence-good) 70%,transparent)}
.sentence-immersive-word-preview .sentence-word-unit.is-wrong .sentence-word-token{border-bottom-color:var(--sentence-bad);background:color-mix(in srgb,var(--sentence-bad) 12%,transparent);box-shadow:none;animation:sentence-word-error .16s ease}
.sentence-immersive-word-preview .sentence-word-char.is-empty{color:rgba(207,214,224,.3)}
.sentence-immersive-word-preview .sentence-word-char.is-correct{color:var(--sentence-good)}
.sentence-immersive-word-preview .sentence-word-char.is-wrong{color:var(--sentence-bad);text-decoration-thickness:1.5px;text-underline-offset:4px}
.sentence-immersive-word-preview .sentence-word-char.is-hint{color:var(--sentence-accent);text-decoration-color:color-mix(in srgb,var(--sentence-accent) 65%,transparent)}
.sentence-immersive-word-preview .sentence-word-cursor{background:var(--sentence-accent)}
.sentence-immersive-word-preview .sentence-word-pos{min-height:13px;color:#9aa2ad;font:600 9px/1.2 'DM Sans','Noto Sans SC',sans-serif}
.sentence-immersive-word-preview .sentence-word-meaning{max-width:min(180px,28vw);color:#c8ced7;font:500 11px/1.35 'DM Sans','Noto Sans SC',sans-serif;text-align:center}
.sentence-immersive-word-preview .sentence-word-grammar:focus-visible{outline:2px solid var(--sentence-accent);outline-offset:4px;border-radius:6px}
.sentence-immersive-word-preview .sentence-grammar-tooltip{border-color:#3b414b;border-radius:9px;background:#252a31;color:#e7ebf1;box-shadow:0 12px 34px rgba(0,0,0,.3)}
.sentence-immersive-translation{display:grid;gap:8px;margin:clamp(28px,5vh,50px) auto 0;color:#7f8894;font-size:10px;letter-spacing:.04em}
.sentence-immersive-translation strong{color:#d7dce4;font:500 clamp(19px,2.1vw,27px)/1.6 'Noto Sans SC',sans-serif;letter-spacing:0}
.sentence-immersive-status{min-height:24px;margin:15px auto 0;color:#929aa5;font-size:12px;line-height:1.5}
.sentence-immersive-status.correct{color:var(--sentence-good)}
.sentence-immersive-status.wrong,.sentence-immersive-status.error{color:var(--sentence-bad)}
.sentence-immersive-input{position:absolute!important;left:50%;bottom:0;width:1px!important;height:1px!important;min-height:1px;padding:0!important;border:0!important;opacity:0;overflow:hidden;pointer-events:none;font-size:16px!important;box-shadow:none!important}
.sentence-immersive-footer{display:grid;justify-items:center;gap:13px;padding:14px 0 max(18px,env(safe-area-inset-bottom));border-top:1px solid rgba(190,198,210,.07)}
.sentence-immersive-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px}
.sentence-immersive-actions button{min-height:38px;padding:8px 12px;border:1px solid transparent;border-radius:8px;background:transparent;color:#a9b0ba;font-size:11px;font-weight:600;transition:background-color .14s ease,color .14s ease,border-color .14s ease}
.sentence-immersive-actions button:hover:not(:disabled){background:rgba(190,198,210,.08);color:#f0f2f6}
.sentence-immersive-actions button:disabled{opacity:.45;cursor:not-allowed}
.sentence-immersive-actions .sentence-immersive-primary{min-height:42px;padding:9px 17px;border:1px solid #817be8;background:#6e68d8;color:#fff;font-size:12px;box-shadow:0 6px 20px rgba(87,82,179,.19)}
.sentence-immersive-actions .sentence-immersive-primary:hover{background:#7a74e5;border-color:#9690f4}
.sentence-immersive-key-help{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 20px;color:#737c88;font-size:10px}
.sentence-immersive-key-help span{display:inline-flex;align-items:center;gap:5px}
.sentence-immersive-key-help kbd{min-width:24px;padding:3px 6px;border:1px solid #363b43;border-radius:5px;background:#1c2025;color:#aeb5be;font:500 9px/1.2 'DM Sans',sans-serif;text-align:center}
.sentence-immersive-complete{width:min(720px,100%);margin:0 auto;text-align:center;animation:sentence-immersive-enter .2s ease both}
.sentence-immersive-complete-mark{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 15px;border-radius:50%;background:rgba(135,214,179,.1);color:var(--sentence-good);font-size:24px}
.sentence-immersive-complete.is-skipped .sentence-immersive-complete-mark{background:rgba(173,180,192,.1);color:#aeb5bf}
.sentence-immersive-eyebrow{margin:0 0 7px;color:#858d99;font:700 10px Manrope,sans-serif;letter-spacing:.14em}
.sentence-immersive-complete h1{margin:0;color:#edf0f4;font:700 clamp(23px,3vw,32px)/1.25 Manrope,'Noto Sans SC',sans-serif}
.sentence-immersive-complete .sentence-immersive-translation{margin-top:15px}
.sentence-immersive-complete>p:not(.sentence-immersive-eyebrow):not(.sentence-immersive-translation){margin:20px 0 0;color:#dfe4eb;font:600 clamp(17px,2vw,24px)/1.55 Manrope,sans-serif}
.sentence-immersive-complete .sentence-incomplete-note{color:#9ba3ae!important;font:400 13px/1.6 'Noto Sans SC',sans-serif!important}
.sentence-immersive-results{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 24px;margin-top:32px;color:#8c95a1;font-size:10px}
.sentence-immersive-results span{display:grid;gap:4px;min-width:50px}
.sentence-immersive-results strong{color:#dce1e8;font:700 15px Manrope,sans-serif}
.sentence-immersive-footer>.sentence-immersive-primary{min-height:44px;padding:10px 18px;border:1px solid #817be8;border-radius:9px;background:#6e68d8;color:white;font-weight:700}
.sentence-immersive-footer>.sentence-immersive-primary:hover{background:#7a74e5}
@keyframes sentence-immersive-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){
  .sentence-immersive-layout{padding:0 16px}
  .sentence-immersive-header-content{grid-template-columns:auto minmax(0,1fr) auto;gap:7px;min-height:62px}
  .sentence-immersive-back{width:38px;min-width:38px;margin-left:-7px;padding:7px;font-size:18px}
  .sentence-immersive-back span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .sentence-immersive-context{display:grid;justify-content:start;gap:3px;min-width:0}
  .sentence-immersive-context>span{font-size:9px}
  .sentence-immersive-context strong{font-size:11px}
  .sentence-immersive-context .sentence-immersive-word-position{display:none}
  .sentence-immersive-tools{gap:7px}
  .sentence-immersive-counter{font-size:11px}
  .sentence-immersive-score{font-size:12px}
  .sentence-immersive-settings-button{min-height:36px;padding:6px 8px;font-size:10px}
  .sentence-immersive-main{padding:24px 0}
  .sentence-immersive-content{width:100%}
  .sentence-immersive-main-position{margin-bottom:16px;font-size:10px}
  .sentence-immersive-word-preview{min-height:96px}
  .sentence-immersive-word-preview .sentence-word-flow{column-gap:clamp(5px,2vw,9px);row-gap:26px;padding:8px 0}
  .sentence-immersive-word-preview .sentence-word-unit{grid-template-rows:14px minmax(38px,auto) 12px minmax(16px,auto);gap:3px;min-width:24px}
  .sentence-immersive-word-preview .sentence-word-grammar{grid-template-rows:14px minmax(38px,auto) 12px minmax(16px,auto);gap:3px}
  .sentence-immersive-word-preview .sentence-word-phonetic{min-height:13px;font-size:9px}
  .sentence-immersive-word-preview .sentence-word-token{min-height:38px;padding:3px 5px;font-size:clamp(19px,5.8vw,26px)}
  .sentence-immersive-word-preview .sentence-word-pos{min-height:11px;font-size:8px}
  .sentence-immersive-word-preview .sentence-word-meaning{max-width:27vw;font-size:9px}
  .sentence-immersive-translation{margin-top:28px}
  .sentence-immersive-translation strong{font-size:17px}
  .sentence-immersive-status{margin-top:12px;font-size:11px}
  .sentence-immersive-footer{gap:9px;padding-top:10px}
  .sentence-immersive-actions{display:grid;width:100%;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
  .sentence-immersive-actions button{min-width:0;min-height:42px;padding:8px 3px;font-size:10px}
  .sentence-immersive-actions .sentence-immersive-primary{grid-column:1/-1;grid-row:1;min-height:44px}
  .sentence-immersive-key-help{display:grid;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 8px;padding:1px 0 3px;font-size:9px}
  .sentence-immersive-key-help span{justify-content:center;gap:4px}
  .sentence-immersive-key-help kbd{min-width:22px;padding:3px 4px;font-size:8px}
  .sentence-immersive-settings{right:-4px;width:min(340px,calc(100vw - 24px));padding:14px}
  .sentence-immersive-results{gap:12px 17px;margin-top:26px}
}
@media(max-width:380px){
  .sentence-immersive-layout{padding-inline:12px}
  .sentence-immersive-tools{gap:4px}
  .sentence-immersive-counter{font-size:10px}
  .sentence-immersive-score{display:none}
  .sentence-immersive-word-preview .sentence-word-flow{column-gap:4px}
  .sentence-immersive-word-preview .sentence-word-token{padding-inline:4px;font-size:18px}
  .sentence-immersive-word-preview .sentence-word-meaning{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.sentence-immersive-layout *{animation:none!important;scroll-behavior:auto!important;transition:none!important}}


/* Shared immersive display mode for sentence typing and English dictation. */
.practice-display-controls{display:inline-flex;align-items:center;flex:0 0 auto}
.practice-display-button{position:relative;display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--surface-raised);color:var(--muted);transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
.practice-display-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.practice-display-button:hover{border-color:var(--accent-primary);background:var(--surface-muted);color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-primary) 12%,transparent)}
.practice-display-button[aria-pressed="true"]{border-color:color-mix(in srgb,var(--accent-primary) 48%,var(--line));color:var(--accent-primary)}
.practice-display-button:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}
.practice-display-button::after{position:absolute;top:calc(100% + 8px);right:0;z-index:30;content:attr(data-tooltip);padding:5px 8px;border:1px solid var(--line);border-radius:6px;background:var(--surface-raised);color:var(--ink);font-size:10px;font-weight:500;opacity:0;pointer-events:none;transform:translateY(-3px);transition:opacity .12s ease,transform .12s ease;white-space:nowrap}
.practice-display-button:hover::after,.practice-display-button:focus-visible::after{opacity:1;transform:translateY(0)}
.dictation-heading-actions{display:flex;align-items:center;gap:9px;flex:0 0 auto}
body.practice-display-active[data-practice-page="dictation"] .dictation-page>.page-heading{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center}
body.practice-display-active[data-practice-page="dictation"] .dictation-page>.page-heading>div:first-child{grid-column:2;text-align:center}
body.practice-display-active[data-practice-page="dictation"] .dictation-heading-actions{grid-column:3;grid-row:1;justify-self:end}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-back,body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-settings-button{border-color:var(--line);background:var(--surface-raised);color:var(--muted)}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-back:hover,body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-settings-button:hover{border-color:var(--accent-primary);background:var(--surface-muted);color:var(--ink)}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-actions button{border-color:var(--line);border-radius:9px;background:var(--surface-raised);color:var(--muted)}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-actions button:hover:not(:disabled){border-color:var(--accent-primary);background:var(--surface-muted);color:var(--ink)}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-actions .sentence-immersive-primary,body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-footer>.sentence-immersive-primary{border-color:var(--accent-primary);background:var(--accent-primary);color:var(--on-accent,#fff);box-shadow:var(--shadow)}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-key-help,body.practice-display-active[data-practice-page="dictation"] .dictation-key-help{justify-content:center;flex-wrap:wrap;gap:7px 14px}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-key-help kbd,body.practice-display-active[data-practice-page="dictation"] .dictation-key-help kbd{border-color:var(--line);border-radius:5px;background:var(--surface-muted);color:var(--muted)}
body.practice-display-active{overflow-x:hidden}
body.practice-display-active .page-content{transition:padding .22s ease}
body.practice-display-active[data-practice-page="sentences"] .sentence-screen{min-height:0;animation:none}
body.practice-display-active[data-practice-mode="normal"][data-practice-page="sentences"] .sentence-immersive-layout{margin-inline:auto}
body.practice-display-active[data-practice-mode="normal"][data-practice-page="sentences"] .page-content{max-width:1520px}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-layout{--sentence-bg:var(--surface-raised);--sentence-text:var(--ink);--sentence-muted:var(--muted);--sentence-line:var(--line);--sentence-accent:var(--accent-primary);--sentence-good:var(--success,#87d6b3);--sentence-bad:var(--danger,#ff858a);width:min(1380px,100%);min-height:min(780px,calc(100dvh - 144px));margin:0 auto;overflow-x:hidden;border:1px solid var(--line);border-radius:var(--card-radius,16px);background:var(--surface-raised);color:var(--ink);box-shadow:var(--shadow)}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-progress,body.practice-display-active[data-practice-page="dictation"] .sentence-progress{height:5px;border-radius:999px;background:var(--surface-muted,var(--line))}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-progress span,body.practice-display-active[data-practice-page="dictation"] .sentence-progress span{border-radius:inherit;background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary,var(--accent-primary)));transition:width .24s ease}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-key-help,body.practice-display-active[data-practice-page="dictation"] .dictation-key-help{font-family:'DM Sans','Noto Sans SC',sans-serif}
body.practice-display-active[data-practice-page="dictation"] .dictation-page{width:min(1120px,100%);min-height:calc(100dvh - 142px);margin:0 auto;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:0}
body.practice-display-active[data-practice-mode="normal"][data-practice-page="dictation"] .dictation-card{margin-inline:auto}
body.practice-display-active[data-practice-page="dictation"] .dictation-card{display:flex;flex-direction:column;justify-content:center;width:min(900px,100%);min-height:500px;margin:0 auto;padding:clamp(22px,3vw,38px);border-radius:var(--card-radius,16px);background:var(--surface-raised);box-shadow:var(--shadow)}
body.practice-display-active[data-practice-page="dictation"] .dictation-answer{width:min(100%,760px);min-height:58px;margin-inline:auto;font-size:clamp(17px,1.45vw,21px)}
body.practice-display-active[data-practice-mode="fullscreen"] .sidebar,body.practice-display-active[data-practice-mode="fullscreen"] .topbar,body.practice-display-active[data-practice-mode="fullscreen"] .mobile-scrim{display:none!important}
body.practice-display-active[data-practice-mode="fullscreen"] .app-shell,body.practice-display-active[data-practice-mode="fullscreen"] .main-area{width:100%;min-width:0;min-height:100vh;min-height:100dvh;margin:0;background:var(--canvas)}
body.practice-display-active[data-practice-mode="fullscreen"] .page-content,body.practice-display-active[data-practice-mode="fullscreen"] .page-content>div{width:100%;max-width:none;min-width:0;min-height:100vh;min-height:100dvh;margin:0;padding:0}
body.practice-display-active[data-practice-mode="fullscreen"] .page-content>div{animation:practice-immersive-enter .22s ease both}
body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-screen{min-height:100vh;min-height:100dvh}
body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-immersive-layout{width:100%;min-height:100vh;min-height:100dvh;padding-inline:clamp(24px,5vw,96px);border:0;border-radius:0;background:var(--canvas);box-shadow:none}
body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-immersive-header-content{min-height:74px;border-color:var(--line)}
body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-immersive-word-preview .sentence-word-token{font-size:clamp(34px,4vw,64px);min-height:64px}
body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-immersive-word-preview .sentence-word-unit{grid-template-rows:22px minmax(64px,auto) 17px minmax(21px,auto)}
body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-immersive-main{padding-block:clamp(22px,5vh,68px)}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-page{width:100%;min-height:100vh;min-height:100dvh;grid-template-rows:auto minmax(0,1fr) auto;gap:0;padding:22px clamp(24px,5vw,92px)}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-page>.page-heading{margin-bottom:14px}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-card{width:100%;max-width:1500px;min-height:0;height:100%;padding:clamp(28px,5vh,66px) clamp(32px,8vw,150px);border-color:transparent;border-radius:0;background:transparent;box-shadow:none}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-listen-prompt{min-height:clamp(100px,16vh,180px);display:grid;place-content:center;text-align:center}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-translation{font-size:clamp(26px,2.9vw,42px);text-align:center}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-answer{min-height:72px;font-size:clamp(20px,1.8vw,27px)}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-controls{justify-content:center;margin-block:22px 28px}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-actions{justify-content:center;gap:12px;margin-top:24px}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-actions .button{min-height:48px;padding-inline:18px;font-size:12px}
body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-key-help{margin-top:19px}
@keyframes practice-immersive-enter{from{opacity:.75;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){
  .practice-display-button{width:36px;height:36px}
  body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-layout{min-height:calc(100dvh - 112px);border-radius:13px}
  body.practice-display-active[data-practice-page="dictation"] .dictation-page{min-height:calc(100dvh - 110px)}
  body.practice-display-active[data-practice-page="dictation"] .dictation-card{min-height:0;margin-top:13px;padding:16px 13px}
  body.practice-display-active[data-practice-mode="fullscreen"] .page-content,body.practice-display-active[data-practice-mode="fullscreen"] .page-content>div{min-height:100vh;min-height:100dvh}
  body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-immersive-layout{padding-inline:16px}
  body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-page{padding:14px 13px max(14px,env(safe-area-inset-bottom))}
  body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-card{padding:19px 15px}
  body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-controls{margin-block:14px 17px}
}
@media(max-width:380px){body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-height:780px) and (min-width:761px){
  body.practice-display-active[data-practice-page="sentences"][data-practice-mode="fullscreen"] .sentence-immersive-main{padding-block:18px}
  body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-card{padding-block:20px}
  body.practice-display-active[data-practice-page="dictation"][data-practice-mode="fullscreen"] .dictation-controls{margin-block:13px 17px}
}
@media(prefers-reduced-motion:reduce){body.practice-display-active *,body.practice-display-active *::before,body.practice-display-active *::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}/* Custom sentence-course additions: compact cover metadata and the capture inbox. */
.course-inbox{display:grid;gap:10px;padding:14px}
.course-cover{display:grid;place-items:center;width:34px;height:42px;flex:0 0 34px;overflow:hidden;border:1px solid var(--line);border-radius:7px;background:var(--canvas);font-size:20px}
.course-cover img{width:100%;height:100%;object-fit:cover}
.course-unit-title{display:grid;gap:3px}
.course-unit-title small{font-size:9px;font-weight:500;color:var(--muted)}
.course-inbox-modal{width:min(100%,580px)}
@media(max-width:760px){.course-inbox{padding:11px}.course-center-actions{grid-template-columns:1fr 1fr}.course-center-actions [data-course-action="quick-capture"]{grid-column:1/-1}.course-cover{width:30px;height:38px;flex-basis:30px}.course-unit>summary{flex-wrap:wrap}.course-unit-title{flex:1}.course-count{font-size:9px}}

body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-header-content{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto}
@media(max-width:760px){body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-header-content{grid-template-columns:auto minmax(0,1fr) auto auto;gap:5px}
body.practice-display-active[data-practice-page="sentences"] .sentence-immersive-tools{gap:5px}
}

/* Learning statistics: a scoped dashboard over the existing learning records. */
#page-content:has(.stats-dashboard){padding-top:max(24px,var(--page-padding-top));scroll-margin-top:calc(var(--shell-topbar-height) + 20px)}
.stats-dashboard{display:grid;gap:22px;min-width:0;color:var(--ink)}
.stats-dashboard h1,.stats-dashboard h2,.stats-dashboard h3,.stats-dashboard p{margin:0}
.stats-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;scroll-margin-top:calc(var(--shell-topbar-height) + 20px)}
.stats-heading h1{margin:5px 0 6px;font:750 28px/1.3 Manrope,'Noto Sans SC',sans-serif;letter-spacing:-.6px}
.stats-heading p{font-size:13px;color:var(--muted);line-height:1.6}
.stats-heading>.button{flex-shrink:0}
.stats-core{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:22px 0;background:var(--surface-raised);border-radius:var(--card-radius,14px)}
.stats-kpi{display:grid;gap:10px;padding:0 24px;min-width:0;border-right:1px solid var(--line)}
.stats-kpi:last-child{border-right:0}
.stats-kpi>span{font-size:12px;font-weight:550;color:var(--muted)}
.stats-kpi>strong{font:750 32px/1.15 Manrope,'Noto Sans SC',sans-serif;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.stats-kpi>strong small{font:400 12px 'Noto Sans SC',sans-serif;color:var(--muted);margin-left:6px;letter-spacing:0}
.stats-kpi p{font-size:11px;line-height:1.6;color:var(--muted)}
.stats-main-grid{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(230px,1fr);gap:20px;min-width:0}
.stats-surface{min-width:0;padding:23px;border:1px solid color-mix(in srgb,var(--line) 65%,transparent);border-radius:var(--card-radius,14px);background:var(--surface-raised)}
.stats-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.stats-section-head h2{font-size:15px;font-weight:650;line-height:1.5}
.stats-section-head p{margin-top:5px;font-size:11px;line-height:1.6;color:var(--muted)}
.stats-range{display:flex;align-items:center;gap:3px;flex-shrink:0;padding:3px;border-radius:8px;background:var(--surface-inset)}
.stats-range button{min-height:30px;padding:5px 9px;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:10px;white-space:nowrap;transition:background-color .15s,color .15s}
.stats-range button[aria-pressed="true"]{background:var(--accent-soft);color:var(--accent-primary);font-weight:650}
.stats-trend-summary{display:flex;align-items:baseline;gap:12px;margin:21px 0 21px}
.stats-trend-summary strong{font:700 25px/1.2 Manrope,sans-serif;font-variant-numeric:tabular-nums}
.stats-trend-summary strong small{font:400 11px 'Noto Sans SC',sans-serif;color:var(--muted);margin-left:4px}
.stats-trend-summary>span{font-size:10px;color:var(--muted)}
.stats-chart{height:154px;display:grid;grid-template-columns:28px minmax(0,1fr);gap:6px;margin-bottom:22px}
.stats-chart-y{display:flex;flex-direction:column;justify-content:space-between;padding-bottom:0;color:var(--muted);font-size:9px;transform:translateY(-5px);font-variant-numeric:tabular-nums}
.stats-chart-plot{position:relative;min-width:0;height:100%}
.stats-chart-grid{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}
.stats-chart-grid i{border-top:1px dashed color-mix(in srgb,var(--line) 70%,transparent)}
.stats-chart-bars{position:relative;display:flex;align-items:flex-end;gap:4px;height:100%;isolation:isolate}
.stats-bar-slot{flex:1;min-width:0;height:100%}
.stats-bar-hit{position:relative;display:flex;align-items:flex-end;justify-content:center;width:100%;max-width:36px;height:100%;margin:0 auto;padding:0;border:0;border-radius:5px;background:transparent;color:var(--ink);cursor:default}
.stats-bar-hit i{display:block;width:74%;min-width:2px;border-radius:4px 4px 0 0;background:color-mix(in srgb,var(--accent-primary) 72%,var(--surface-raised));transition:background-color .15s}
.stats-bar-hit i.is-today,.stats-bar-hit:hover i,.stats-bar-hit:focus-visible i{background:var(--accent-primary)}
.stats-bar-hit:focus-visible{outline:2px solid var(--accent-primary);outline-offset:3px}
.stats-bar-tooltip{position:absolute;z-index:2;top:-15px;left:50%;transform:translate(-50%,-100%);display:none;padding:5px 8px;border:1px solid var(--line);border-radius:6px;background:var(--surface-inset);font-size:10px;white-space:nowrap;box-shadow:var(--shadow)}
.stats-bar-hit:hover .stats-bar-tooltip,.stats-bar-hit:focus-visible .stats-bar-tooltip{display:block}
.stats-bar-slot:first-child .stats-bar-tooltip{left:0;transform:translateY(-100%)}
.stats-bar-slot:last-child .stats-bar-tooltip{right:0;left:auto;transform:translateY(-100%)}
.stats-chart-x{display:flex;justify-content:space-between;gap:6px;margin-top:11px;color:var(--muted);font-size:9px;font-variant-numeric:tabular-nums}
.stats-next{display:flex;align-items:flex-start;flex-direction:column;justify-content:center;gap:13px}
.stats-section-kicker{color:var(--accent-primary);font-size:11px;font-weight:650}
.stats-next h2{font-size:18px;font-weight:650;line-height:1.5}
.stats-due-number{font:750 38px/1.15 Manrope,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.8px}
.stats-due-number small{display:block;margin-top:7px;font:400 12px 'Noto Sans SC',sans-serif;color:var(--muted);letter-spacing:0}
.stats-next p{color:var(--muted);font-size:11px;line-height:1.7}
.stats-next-empty{display:flex;grid-column:1/-1;align-items:center;gap:12px;margin:5px 0}
.stats-next-empty>span{display:grid;place-items:center;flex:0 0 32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent-primary)}
.stats-next>.button{width:100%;min-height:40px;margin-top:3px}
.stats-next-foot{color:var(--muted);font-size:10px}
.stats-tabs{display:flex;align-items:center;gap:20px;overflow-x:auto;margin-top:16px;border-bottom:1px solid var(--line);scrollbar-width:thin}
.stats-tabs button{flex-shrink:0;min-height:43px;padding:9px 0 12px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font-size:12px;transition:color .15s,border-color .15s}
.stats-tabs button[aria-pressed="true"]{color:var(--accent-primary);border-bottom-color:var(--accent-primary);font-weight:650}
.stats-dashboard :is(.stats-tabs button,.stats-range button,.stats-module-row):focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}
.stats-module-list{display:grid}
.stats-module-row{display:grid;grid-template-columns:minmax(100px,.8fr) minmax(0,1.6fr) 18px;align-items:center;gap:20px;width:100%;min-height:74px;padding:16px 4px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;color:var(--ink);transition:background-color .15s}
.stats-module-row:last-child{border-bottom:0;padding-bottom:2px}
.stats-module-row:hover{background:var(--surface-hover)}
.stats-module-name{font-size:12px;font-weight:550}
.stats-module-result{display:grid;gap:5px;min-width:0}
.stats-module-result strong{font-size:12px;font-weight:550}
.stats-module-result small{color:var(--muted);font-size:10px;line-height:1.5}
.stats-module-row>span:last-child{color:var(--muted);text-align:right}
.stats-module-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:24px 0}
.stats-module-metrics>div{min-width:0}
.stats-module-metrics dt{font-size:11px;color:var(--muted);line-height:1.5}
.stats-module-metrics dd{margin:10px 0 0;font:700 24px/1.3 Manrope,'Noto Sans SC',sans-serif;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stats-module-metrics dd small{font:400 11px 'Noto Sans SC',sans-serif;color:var(--muted)}
.stats-details{margin-top:16px;border-top:1px solid var(--line)}
.stats-details>summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:14px 0 0;list-style:none;font-size:11px;color:var(--muted);cursor:pointer}
.stats-details>summary::-webkit-details-marker{display:none}
.stats-details[open]>summary>span{transform:rotate(45deg)}
.stats-detail-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 24px;margin:21px 0 0}
.stats-detail-values>div{min-width:0;display:grid;gap:8px}
.stats-detail-values dt{color:var(--muted);font-size:11px;line-height:1.6}
.stats-detail-values dd{margin:0;font-size:13px;font-weight:550;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.stats-dashboard p.stats-method{margin-top:20px;color:var(--muted);font-size:11px;line-height:1.8}
.stats-details h3{margin-top:24px;font-size:12px;font-weight:650}
.stats-category-row{display:grid;grid-template-columns:minmax(60px,1fr) minmax(50px,1.4fr) auto;align-items:center;gap:18px;padding:16px 0 0;font-size:11px}
.stats-category-row>span{overflow-wrap:anywhere}
.stats-category-row>small{color:var(--muted);font-size:10px;white-space:nowrap}
.stats-category-track{height:4px;border-radius:8px;background:var(--surface-inset);overflow:hidden}
.stats-category-track i{display:block;height:100%;border-radius:inherit;background:var(--accent-primary)}
.stats-empty{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;min-height:190px;padding:25px 12px;text-align:center}
.stats-empty-mark{font-size:26px;color:var(--accent-primary);line-height:1}
.stats-empty strong{font-size:13px;font-weight:550}
.stats-empty p{max-width:360px;color:var(--muted);font-size:11px;line-height:1.7}
.stats-text-link{font-size:11px;font-weight:550;color:var(--accent-primary);line-height:1.7;white-space:nowrap}
.stats-dashboard p.stats-source-note{color:var(--muted);font-size:10px;line-height:1.8;margin:-4px 2px 0}
@media(max-width:1050px){.stats-main-grid{grid-template-columns:minmax(0,1fr)}.stats-next{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 18px}.stats-section-kicker,.stats-next h2,.stats-next p,.stats-next-foot{grid-column:1}.stats-due-number{grid-column:2;grid-row:1/4;font-size:34px;text-align:right}.stats-next>.button{grid-column:2;grid-row:4/6;margin:0;min-width:158px}.stats-kpi{padding-inline:18px}}
@media(max-width:760px){
  #page-content:has(.stats-dashboard){padding-top:20px}
  .stats-dashboard{gap:16px}
  .stats-heading{align-items:flex-start;gap:10px}
  .stats-heading h1{font-size:23px;margin-top:5px}
  .stats-heading p{font-size:12px}
  .stats-heading>.button{font-size:10px;padding:8px 10px;margin-top:6px;min-height:36px}
  .stats-core{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 16px}
  .stats-kpi{gap:8px;padding:18px 12px 18px 0;border-right:0}
  .stats-kpi:nth-child(even){padding-left:16px;border-left:1px solid var(--line)}
  .stats-kpi:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .stats-kpi>strong{font-size:27px}
  .stats-kpi>span{font-size:11px}
  .stats-kpi p{font-size:10px}
  .stats-surface{padding:17px 16px}
  .stats-main-grid{gap:16px}
  .stats-trend .stats-section-head{align-items:flex-start;flex-direction:column;gap:12px}
  .stats-range{align-self:flex-end;margin-top:-3px}
  .stats-range button{min-height:34px;padding:6px 12px}
  .stats-trend-summary{margin:10px 0 20px}
  .stats-chart{height:137px;margin-bottom:22px}
  .stats-chart-bars{gap:2px}
  .stats-next{gap:8px 12px}
  .stats-next h2{font-size:16px}
  .stats-next>.button{min-width:132px;padding-inline:10px;min-height:40px;font-size:11px}
  .stats-due-number{font-size:28px}
  .stats-due-number small{font-size:10px}
  .stats-tabs{gap:21px;margin-top:12px}
  .stats-tabs button{font-size:11px}
  .stats-module-row{grid-template-columns:76px minmax(0,1fr) 13px;gap:12px;min-height:72px}
  .stats-module-result strong,.stats-module-name{font-size:11px}
  .stats-module-metrics{gap:12px;margin:22px 0}
  .stats-module-metrics dt{font-size:10px}
  .stats-module-metrics dd{font-size:20px;margin-top:8px}
  .stats-detail-values{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 14px}
  .stats-category-row{gap:10px;font-size:10px;grid-template-columns:minmax(60px,1fr) minmax(40px,.7fr) auto}
  .stats-empty{min-height:175px}
}
@media(prefers-reduced-motion:reduce){.stats-dashboard *{transition:none!important}}
/* Word library: shared theme tokens, bounded list rendering and two-level folders. */
.page-content:has(.word-library){max-width:none;width:100%}
.word-library{min-width:0;color:var(--ink)}
.wl-page-heading{gap:20px;margin-bottom:22px;align-items:center}.wl-page-heading h1{font-size:26px}.wl-page-heading p{margin-top:7px}.wl-page-heading .word-page-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px}.word-library svg,.wl-modal svg{width:18px;height:18px;flex-shrink:0}.word-library button svg{vertical-align:middle}
.wl-workspace{display:grid;grid-template-columns:224px minmax(0,1fr);min-height:650px;height:calc(100dvh - 224px);max-height:1000px;border:1px solid var(--line);border-radius:var(--card-radius,10px);background:var(--surface-raised);overflow:hidden;position:relative}
.wl-directory-panel{display:flex;flex-direction:column;background:var(--surface-inset);border-right:1px solid var(--line);padding:16px 10px;min-height:0;min-width:0}.wl-tree-heading{display:flex;align-items:center;gap:4px;padding:0 6px 13px}.wl-tree-heading strong{flex:1;font-size:13px}.wl-directory-panel nav{overflow:auto;flex:1;min-height:0}.wl-directory-panel ul{margin:0;padding:0;list-style:none}.wl-directory-panel li{margin:2px 0}.wl-smart-views{padding-bottom:16px!important;border-bottom:1px solid var(--line)}.wl-tree-section-label{display:flex;justify-content:space-between;padding:20px 10px 9px;color:var(--muted);font-size:11px}.wl-tree-section-label span{font-variant-numeric:tabular-nums}.wl-tree-item{width:100%;border:0;background:transparent;color:var(--muted);display:flex;align-items:center;gap:9px;padding:10px;border-radius:7px;text-align:left;cursor:pointer;font:inherit;font-size:12px;min-width:0}.wl-tree-item>span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wl-tree-item small{font-size:11px;opacity:.8;font-variant-numeric:tabular-nums}.wl-tree-item svg{width:16px;height:16px}.wl-tree-item:hover{background:var(--surface-hover);color:var(--ink)}.wl-tree-item.is-active{background:var(--accent-soft);color:var(--accent-primary);font-weight:600}.wl-tree-folder{display:flex;align-items:center;position:relative}.wl-tree-folder .wl-tree-item{padding-left:2px;gap:7px}.wl-tree-expander,.wl-tree-spacer{width:18px;flex:0 0 18px}.wl-tree-expander{border:0;padding:1px;background:none;color:var(--muted);cursor:pointer}.wl-tree-expander svg{width:13px;height:13px;transition:transform .16s}.wl-tree-expander.is-expanded svg{transform:rotate(90deg)}.wl-tree-folder.is-child{padding-left:12px}.wl-book-item{padding-left:32px;font-size:11px}.wl-folder-more{width:25px!important;height:29px!important;opacity:0}.wl-tree-folder:hover .wl-folder-more,.wl-folder-more:focus-visible{opacity:1}.wl-folder-more svg{width:14px!important}.wl-tree-foot{padding:16px 8px 2px;border-top:1px solid var(--line);margin-top:18px;display:flex;gap:8px;align-items:center;color:var(--muted);font-size:10px}.wl-tree-empty{font-size:12px;color:var(--muted);padding:10px;line-height:1.8}
.wl-content{min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.wl-list{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column}.wl-list-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:23px 24px 19px}.wl-list-title{display:flex;gap:12px;align-items:center;min-width:0}.wl-list-title>div{min-width:0}.wl-breadcrumb{color:var(--muted);font-size:10px;margin-bottom:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wl-list-header h2{font-size:18px;margin:0;display:flex;gap:10px;align-items:center}.wl-list-header h2 span{font-size:11px;color:var(--muted);padding:3px 7px;background:var(--surface-inset);border:1px solid var(--line);border-radius:5px;font-weight:400}.wl-list-header .button{white-space:nowrap;gap:7px;display:flex;align-items:center}.wl-list-header .button svg{width:14px;height:14px}
.wl-icon-button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:5px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--muted);cursor:pointer;flex-shrink:0}.wl-icon-button:hover{background:var(--surface-hover);color:var(--ink);border-color:var(--line)}.wl-icon-button:disabled{opacity:.35;cursor:default}.wl-folder-toggle,.wl-tree-close{display:none}.wl-drawer-scrim{display:none}
.wl-filters{display:flex;align-items:center;gap:8px;padding:0 24px 18px;flex-wrap:wrap}.wl-search{display:flex;gap:8px;align-items:center;flex:1 1 230px;min-width:150px;border:1px solid var(--line);border-radius:var(--control-radius,8px);background:var(--surface-inset);padding:0 11px;height:37px;color:var(--muted)}.wl-search svg{width:16px;height:16px}.wl-search:focus-within{border-color:var(--accent-primary)}.wl-search input{width:100%;min-width:0;border:0!important;outline:0!important;box-shadow:none!important;padding:0!important;background:transparent!important;color:var(--ink);font:inherit;font-size:12px}.wl-filters select,.wl-pagination select{background:var(--surface-inset);color:var(--muted);border:1px solid var(--line);border-radius:7px;min-height:37px;padding:0 26px 0 10px;font:inherit;font-size:11px;max-width:180px}.wl-selection-bar{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 24px;background:var(--surface-inset);border-block:1px solid var(--line);font-size:10px;color:var(--muted);min-height:45px}.wl-selection-bar>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.wl-selection-bar.has-selection{background:var(--accent-soft)}.wl-selection-bar strong{font-size:11px;color:var(--ink)}.wl-selection-bar .text-link{font-size:11px}.wl-selection-bar .button{min-height:29px;padding:4px 10px}
.wl-table-scroll{flex:1;min-height:0;overflow:auto;scrollbar-gutter:stable}.wl-table{border-collapse:collapse;width:100%;text-align:left;table-layout:fixed}.wl-table th{position:sticky;top:0;z-index:1;background:var(--surface-raised);color:var(--muted);font-size:10px;font-weight:500;padding:12px 10px;border-bottom:1px solid var(--line);white-space:nowrap}.wl-table td{padding:11px 10px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:12px}.wl-table th:nth-child(2){width:24%}.wl-table th:nth-child(3){width:27%}.wl-table th:nth-child(4){width:15%}.wl-table th:nth-child(5){width:13%}.wl-table th:nth-child(6){width:105px}.wl-table .wl-check-cell{width:38px;padding-left:18px;padding-right:3px}.wl-table input[type=checkbox]{accent-color:var(--accent-primary);width:15px;height:15px;cursor:pointer;vertical-align:middle}.wl-table tbody tr[data-word-id]{cursor:pointer;transition:background .13s}.wl-table tbody tr[data-word-id]:hover{background:var(--surface-hover)}.wl-table tbody tr.is-detail-selected{background:var(--accent-soft)}.wl-word-link{display:flex;align-items:center;gap:7px;border:0;background:none;color:var(--ink);font:inherit;font-weight:600;font-size:14px;max-width:100%;padding:0;cursor:pointer;overflow-wrap:anywhere;text-align:left}.wl-word-link:hover{color:var(--accent-primary)}.wl-row-star{display:flex;color:var(--accent-primary)}.wl-row-star svg{width:12px;height:12px}.wl-row-phonetic{display:block;color:var(--muted);font-size:10px;margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wl-row-pos{color:var(--muted);font-size:10px;margin-right:6px}.wl-meaning-cell>span{line-height:1.7;overflow-wrap:anywhere}.wl-category-cell>span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;color:var(--muted)}.wl-date-cell{color:var(--muted);font-size:10px!important;font-variant-numeric:tabular-nums}.wl-table .wl-row-end{width:34px;padding-inline:2px}.wl-status{display:inline-flex;align-items:center;gap:5px;font-size:10px;color:var(--muted);white-space:nowrap}.wl-status:before{content:'';width:5px;height:5px;background:var(--muted);border-radius:50%}.wl-status.is-learning{color:var(--accent-primary)}.wl-status.is-learning:before{background:var(--accent-primary)}.wl-status.is-due{color:#d9a94d}.wl-status.is-due:before{background:#d9a94d}.wl-status.is-mastered{color:#61bda5}.wl-status.is-mastered:before{background:#61bda5}.wl-empty{display:flex;align-items:center;flex-direction:column;text-align:center;padding:75px 15px;gap:12px;color:var(--muted)}.wl-empty svg{width:32px;height:32px}.wl-empty h3{margin:0;color:var(--ink);font-size:16px}.wl-empty p{font-size:12px;margin:0 0 8px}.wl-pagination{border-top:1px solid var(--line);padding:12px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--muted);font-size:10px}.wl-pagination>div,.wl-pagination label{display:flex;align-items:center;gap:8px}.wl-pagination select{min-height:29px;padding:0 20px 0 7px;font-size:10px}.wl-pagination .wl-icon-button{border:1px solid var(--line);height:28px;width:28px;font-size:20px}
.wl-detail{width:310px;flex:0 0 310px;min-width:0;display:flex;flex-direction:column;border-left:1px solid var(--line);background:var(--surface-raised);z-index:3}.wl-detail-top{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.wl-detail-scroll{overflow:auto;flex:1;min-height:0;padding:24px 23px}.wl-detail-identity h2{font-size:30px;letter-spacing:-.6px;line-height:1.25;margin:12px 0;overflow-wrap:anywhere}.wl-detail-pronunciation{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px;flex-wrap:wrap}.wl-detail-pronunciation>span{flex:1}.wl-icon-button.is-favorite{color:var(--accent-primary)}.wl-icon-button.is-favorite svg{fill:var(--accent-soft)}.wl-detail-section{border-top:1px solid var(--line);margin-top:24px;padding-top:19px}.wl-detail-section h3{font-size:10px;color:var(--muted);font-weight:500;margin:0 0 12px}.wl-detail-section p{font-size:13px;line-height:1.8;margin:7px 0;overflow-wrap:anywhere}.wl-pos{font-size:10px;color:var(--accent-primary)}.wl-detail-section .wl-example{font-size:14px}.wl-detail-section .wl-detail-muted{color:var(--muted);font-size:12px}.wl-learning-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:0}.wl-learning-grid dt,.wl-detail-meta dt{color:var(--muted);font-size:10px;margin-bottom:6px}.wl-learning-grid dd{font-size:18px;font-weight:600;margin:0}.wl-detail-meta{margin:20px 0 0}.wl-detail-meta>div{display:flex;justify-content:space-between;gap:12px;margin-top:13px}.wl-detail-meta dd{margin:0;font-size:10px;text-align:right;overflow-wrap:anywhere;max-width:65%}.wl-detail-actions{border-top:1px solid var(--line);padding:16px 18px;display:grid;gap:9px}.wl-detail-actions>.button{width:100%;display:flex;justify-content:center;align-items:center;gap:7px}.wl-detail-actions>div{display:flex;gap:7px}.wl-detail-actions>div button{flex:1;padding:7px 9px}.word-library .danger-action,.wl-modal .danger-action{color:var(--danger,#e57787)}
.wl-modal{max-width:620px;width:calc(100% - 28px)}.wl-modal-note,.wl-delete-description{font-size:12px;color:var(--muted);line-height:1.9;margin:0 0 19px}.wl-delete-description strong{color:var(--ink)}.wl-folder-create{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--line)}.wl-modal label{display:grid;gap:8px;font-size:11px;color:var(--muted)}.wl-modal input,.wl-modal select{width:100%;min-width:0;min-height:38px;color:var(--ink);background:var(--surface-inset);border:1px solid var(--line);border-radius:7px;padding:8px 10px;font:inherit;font-size:12px}.wl-manage-list{max-height:42dvh;overflow:auto}.wl-manage-row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:13px 3px;border-bottom:1px solid var(--line)}.wl-manage-row>div{display:flex;gap:8px;align-items:center;min-width:0}.wl-manage-row.is-child{padding-left:24px}.wl-manage-row strong{display:block;font-size:12px;overflow-wrap:anywhere}.wl-manage-row small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.wl-manage-row .row-action{font-size:11px;white-space:nowrap}.wl-form{display:grid;gap:18px}.word-library :focus-visible,.wl-modal :focus-visible{outline:2px solid var(--accent-primary);outline-offset:3px}
@media(max-width:1550px){.wl-detail{position:absolute;inset:0 0 0 auto;box-shadow:-16px 0 40px #0003;width:330px;max-width:100%}.wl-table .wl-date-cell{display:none}.wl-table th:nth-child(2){width:27%}.wl-table th:nth-child(3){width:31%}.wl-table th:nth-child(4){width:17%}.wl-table th:nth-child(5){width:17%}}
@media(max-width:1100px){.wl-workspace{grid-template-columns:200px minmax(0,1fr)}.wl-page-heading{align-items:flex-start}.wl-page-heading .word-page-actions{max-width:430px}.wl-list-header{padding:19px 16px}.wl-filters{padding:0 16px 16px}.wl-selection-bar{padding:10px 16px}.wl-selection-bar>span:last-child{display:none}.wl-table .wl-category-cell{display:none}.wl-table th:nth-child(2){width:36%}.wl-table th:nth-child(3){width:40%}.wl-table th:nth-child(5){width:24%}.wl-filters select{max-width:145px}.wl-pagination{padding:12px}.wl-list-header h2{font-size:16px}}
@media(max-width:760px){.wl-page-heading{display:block;margin-bottom:16px}.wl-page-heading h1{font-size:23px}.wl-page-heading p{font-size:12px}.wl-page-heading .word-page-actions{max-width:none;justify-content:flex-start;margin-top:16px;gap:7px}.wl-page-heading .word-page-actions .button{font-size:11px;padding:8px 11px;min-height:36px}.wl-workspace{display:block;height:calc(100dvh - 270px);min-height:560px;border-radius:9px}.wl-content{height:100%}.wl-directory-panel{display:none;position:fixed;inset:0 auto 0 0;width:min(300px,85vw);z-index:151;border-right:1px solid var(--line);padding:25px 12px}.wl-workspace.is-drawer-open .wl-directory-panel{display:flex}.wl-workspace.is-drawer-open .wl-drawer-scrim{display:block;position:fixed;inset:0;z-index:150;background:#0009;border:0;backdrop-filter:blur(3px)}.wl-folder-toggle,.wl-tree-close{display:inline-flex}.wl-folder-toggle{border:1px solid var(--line);width:36px;height:36px}.wl-folder-more{opacity:1;width:30px!important}.wl-tree-item{min-height:43px;font-size:13px}.wl-tree-expander{width:24px;flex-basis:24px;height:36px}.wl-list-header{padding:17px 12px;gap:8px}.wl-list-title{gap:8px}.wl-list-header h2{font-size:15px}.wl-list-header .button{font-size:11px;padding:9px;min-height:36px}.wl-breadcrumb{max-width:170px}.wl-filters{padding:0 12px 13px;gap:7px}.wl-search{flex-basis:100%;height:40px}.wl-filters select{min-height:37px;font-size:10px;max-width:145px;padding-left:7px}.wl-filter-label{flex:1;min-width:0}.wl-filter-label select{width:100%}.wl-selection-bar{padding:9px 12px;min-height:41px;font-size:10px;flex-wrap:wrap}.wl-selection-bar .text-link{font-size:10px}.wl-selection-bar>div{gap:8px}.wl-table th{font-size:9px;padding:11px 6px}.wl-table td{padding:13px 6px;font-size:11px}.wl-table .wl-check-cell{width:29px;padding-left:10px;padding-right:1px}.wl-table th:nth-child(2){width:34%}.wl-table th:nth-child(3){width:40%}.wl-table th:nth-child(5){width:26%}.wl-table .wl-row-end{display:none}.wl-word-link{font-size:13px}.wl-row-phonetic{font-size:9px}.wl-status{font-size:9px;gap:4px}.wl-pagination{gap:8px;flex-wrap:wrap;font-size:9px}.wl-pagination>div{gap:6px}.wl-pagination label{gap:5px}.wl-detail{position:fixed;inset:12dvh 0 0;width:100%;max-width:none;height:88dvh;border-radius:16px 16px 0 0;border-top:1px solid var(--line);z-index:149;box-shadow:0 -30vh 0 40vh #0009;flex-basis:auto}.wl-detail-top{padding:12px 20px}.wl-detail-scroll{padding:22px}.wl-detail-actions{padding:13px 20px max(16px,env(safe-area-inset-bottom))}.wl-detail-actions button{min-height:40px}.wl-folder-create{grid-template-columns:1fr}.wl-manage-row{gap:8px}.wl-manage-row>div:last-child{gap:3px}.wl-manage-row .row-action{padding:6px}.wl-modal{max-height:90dvh;overflow:auto}}
@media(prefers-reduced-motion:reduce){.word-library *{transition:none!important;animation:none!important}}
.word-library .sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wl-folder-menu{display:grid;gap:9px}
@media(min-width:761px){.wl-workspace{height:calc(100dvh - 238px);min-height:460px}}
@media(max-width:760px){.wl-search input{font-size:16px}.wl-row-phonetic{font-size:10px}.wl-status{font-size:10px}.wl-table input[type=checkbox]{width:19px;height:19px}.wl-detail-top .wl-icon-button{width:40px;height:40px}}

/* Smart review: one entry, separate content types and resumable practice modes. */
.review-page .page-heading{margin-bottom:3px}
.review-tabs{display:flex;gap:6px;padding:4px;width:fit-content;max-width:100%;border:1px solid var(--line);border-radius:10px;background:var(--surface-inset)}
.review-tabs button,.review-mode-options button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:600;min-height:40px;padding:9px 16px;transition:background .15s,color .15s,border-color .15s}
.review-tabs button:hover,.review-mode-options button:hover{background:var(--surface-hover);color:var(--ink)}
.review-tabs button[aria-current="page"],.review-mode-options button[aria-pressed="true"]{background:var(--accent-soft);color:var(--accent-primary);border-color:color-mix(in srgb,var(--accent-primary) 24%,transparent)}
.review-page button:focus-visible{outline:2px solid var(--accent-primary);outline-offset:3px}
.review-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.review-type-card{display:flex;align-items:flex-start;flex-direction:column;gap:14px;padding:24px;background:var(--surface-raised)}
.review-type-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
.review-type-heading h2{margin:0;font-size:17px}
.review-type-heading>span{font-size:11px;color:var(--muted);white-space:nowrap}
.review-type-count{display:flex;align-items:baseline;gap:10px;color:var(--muted);font-size:12px}
.review-type-count strong{font-size:38px;line-height:1.2;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-1px}
.review-type-card>p{margin:-6px 0 0;color:var(--muted);font-size:11px}
.review-task-breakdown{display:grid;align-content:start;gap:8px;width:100%;min-height:76px;color:var(--muted);font-size:11px}
.review-task-breakdown>span{display:flex;justify-content:space-between;gap:10px;line-height:1.6}
.review-task-breakdown b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.review-type-card>.button{margin-top:auto;min-height:40px}
.review-saved-note{color:var(--accent-primary);font-size:11px}
.review-mode-options{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.review-mode-options button{min-height:38px;padding:8px 12px;border-color:var(--line);font-size:11px}
.review-mode-options button>span{font-weight:500;opacity:.75;font-variant-numeric:tabular-nums}
.review-resume{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 15px;margin-bottom:16px;border-radius:9px;background:var(--accent-soft)}
.review-resume>div{display:grid;gap:5px;min-width:0}
.review-resume strong{font-size:12px;color:var(--ink)}
.review-resume span{font-size:11px;color:var(--muted)}
.review-resume .button{flex-shrink:0;min-height:38px}
.review-page>.review-session-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:780px;width:100%;margin:0 auto;color:var(--muted);font-size:12px}
.review-page .review-queue-list{max-height:430px;overflow:auto;overscroll-behavior:contain}
.review-page .review-control-row{flex-wrap:wrap}
.review-page .review-answer-reveal{flex-wrap:wrap;overflow-wrap:anywhere}
@media(max-width:760px){
  .review-tabs{width:100%;gap:3px}.review-tabs button{flex:1;min-width:0;padding:9px 7px;font-size:12px}
  .review-type-grid{grid-template-columns:1fr;gap:12px}.review-type-card{padding:19px;gap:12px}
  .review-type-heading h2{font-size:16px}.review-type-count strong{font-size:32px}.review-task-breakdown{min-height:0}
  .review-type-card>.button{align-self:stretch}.review-mode-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .review-mode-options button{padding:9px 6px;min-height:42px;gap:5px}.review-resume{padding:12px;gap:9px}
  .review-resume strong{font-size:11px}.review-resume span{font-size:10px}.review-resume .button{padding:8px;font-size:10px}
  .review-page>.review-session-heading{font-size:11px}.review-page .review-answer-input{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.review-tabs button,.review-mode-options button{transition:none}}
.wl-list-header h2{overflow-wrap:anywhere}
@media(max-width:760px){.wl-filter-label{flex:1 0 calc((100% - 14px)/3)}.wl-filters>select{flex:1 0 calc((100% - 7px)/2);max-width:none}}
.sound-feedback-settings #sound-feedback-volume{width:100%;accent-color:var(--accent-primary);margin:10px 0 4px;min-height:32px}.sound-feedback-settings label[for="sound-feedback-volume"]{display:flex;align-items:center;gap:12px}.sound-feedback-settings #sound-feedback-volume-label{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.sound-feedback-settings .switch:focus-visible,.sound-feedback-settings input[type="range"]:focus-visible{outline:2px solid var(--accent-primary);outline-offset:3px}