:root{--bg: #f8faf6;--bg-grid: rgba(47, 107, 69, .08);--surface: #ffffff;--surface-soft: #eef5ee;--surface-active: #e1ecdd;--surface-tint: rgba(255, 255, 255, .86);--surface-tint-strong: rgba(255, 255, 255, .95);--text: #1d261f;--text-muted: #5e6b61;--text-subtle: #7c897d;--border: #d8e3d5;--border-strong: #b8ccb5;--divider: #dce7d9;--primary: #2f6b45;--primary-hover: #25563a;--primary-soft: #e3f0e5;--primary-soft-strong: #cfe2d0;--primary-contrast: #ffffff;--accent: #b86f35;--accent-soft: #f5e2c8;--accent-contrast: #654015;--danger: #b84f47;--danger-soft: #f6deda;--danger-border: #e7b9b3;--success: #408354;--overlay: rgba(29, 38, 31, .36);--video-overlay: rgba(14, 18, 15, .72);--video-surface: #111312;--focus-ring: rgba(47, 107, 69, .18);--code-text: #7b431c;--code-bg: var(--accent-soft);--pre-bg: #1d261f;--pre-text: #f8faf6;--playing-bg: #fff7ea;--radius-sm: 8px;--radius-md: 8px;--radius-lg: 8px;--shadow-card: 0 8px 24px rgba(31, 60, 38, .08);--shadow-panel: 0 16px 40px rgba(31, 60, 38, .16);--shadow-popover: var(--shadow-panel);--shadow-dialog: 0 24px 80px rgba(12, 18, 14, .32);color:var(--text);background:var(--bg);font-family:Inter,Noto Sans SC,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}[data-theme=dark]{--bg: #101813;--bg-grid: rgba(176, 211, 177, .06);--surface: #17231b;--surface-soft: #1d2c21;--surface-active: #263a2b;--surface-tint: rgba(23, 35, 27, .84);--surface-tint-strong: rgba(23, 35, 27, .94);--text: #eef4ea;--text-muted: #b7c5b6;--text-subtle: #8fa08f;--border: #304333;--border-strong: #49644e;--divider: #293a2e;--primary: #a4d3a3;--primary-hover: #b6dfb6;--primary-soft: #233a29;--primary-soft-strong: #31553a;--primary-contrast: #0f1a12;--accent: #e0a05f;--accent-soft: #3c2d1b;--accent-contrast: #ffd9a3;--danger: #ff8d7f;--danger-soft: #3d2321;--danger-border: #75413b;--success: #8ed59b;--overlay: rgba(4, 8, 5, .58);--video-overlay: rgba(3, 5, 4, .82);--video-surface: #070807;--focus-ring: rgba(164, 211, 163, .24);--code-text: #ffd29a;--code-bg: #33271b;--pre-bg: #0b110d;--pre-text: #eaf2e8;--playing-bg: #2c261a;--shadow-card: 0 8px 26px rgba(0, 0, 0, .22);--shadow-panel: 0 18px 44px rgba(0, 0, 0, .38);--shadow-dialog: 0 24px 80px rgba(0, 0, 0, .52)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(90deg,var(--bg-grid) 1px,transparent 1px),linear-gradient(180deg,var(--bg-grid) 1px,transparent 1px),var(--bg);background-size:28px 28px}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.62}.boot{display:grid;min-height:100vh;place-items:center;color:var(--primary);font-family:Georgia,Times New Roman,serif;font-size:24px}.login-shell{display:grid;min-height:100vh;place-items:center;padding:24px}.login-panel{width:min(420px,100%);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-tint-strong);box-shadow:var(--shadow-popover);padding:34px}.login-panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand-mark{display:grid;width:52px;height:52px;place-items:center;border:1px solid var(--border-strong);border-radius:var(--radius-sm);color:var(--primary);background:var(--primary-soft)}.login-panel h1{margin:18px 0 0;color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:30px;font-weight:600;letter-spacing:0}.login-panel p{margin:10px 0 24px;color:var(--text-muted)}.login-form,.drawer-form{display:grid;gap:16px}label,.translation-field{display:grid;gap:8px;color:var(--text-muted);font-size:13px;font-weight:750}.translation-field-head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}.translation-field-head label{display:block;min-width:0}.translate-button{min-height:34px;padding:0 10px;font-size:13px;white-space:nowrap}input,textarea{width:100%;min-width:0;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);background:var(--surface);outline:none}input{min-height:42px;padding:0 12px}textarea{resize:vertical;padding:12px;line-height:1.6}input:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--focus-ring)}.primary-button,.secondary-button,.icon-button,.ghost-icon,.ghost-action,.video-play-button,.phonetic-play-button,.practice-button,.audio-play,.audio-rate,.tag-strip button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-sm);min-height:38px;border:0;text-decoration:none}.primary-button{min-height:44px;padding:0 16px;color:var(--primary-contrast);background:var(--primary);font-weight:800}.primary-button:hover{background:var(--primary-hover)}.secondary-button{min-height:40px;border:1px solid var(--border);padding:0 14px;color:var(--primary);background:var(--surface-soft);font-weight:800}.secondary-button:hover{border-color:var(--border-strong);background:var(--surface-active)}.secondary-button.danger{color:var(--danger);border-color:var(--danger-border);background:var(--danger-soft)}.compact-button{width:auto;min-height:36px;padding:0 12px;font-size:13px}.icon-button,.ghost-icon{width:36px;height:36px;color:var(--text-muted);background:var(--surface-soft)}.ghost-icon{background:transparent}.icon-button:hover,.ghost-icon:hover{color:var(--primary);background:var(--surface-active)}.icon-button.danger,.ghost-action.danger,.ghost-icon.danger{color:var(--danger)}.ghost-action{width:auto;min-height:34px;padding:0 8px;color:var(--text-muted);background:transparent;font-size:13px;font-weight:750}.ghost-action:hover{background:var(--surface-soft)}.app-shell{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;z-index:20;display:flex;height:100vh;flex-direction:column;justify-content:space-between;border-right:1px solid var(--border);background:var(--surface-tint);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);padding:24px 18px}.sidebar-brand{display:flex;align-items:center;gap:10px;color:var(--primary);font-family:Georgia,Times New Roman,serif;font-size:20px;font-weight:700}.nav-tabs{display:grid;gap:8px;margin-top:30px}.nav-tabs button{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;min-height:42px;border:0;border-radius:var(--radius-sm);padding:0 12px;color:var(--text-muted);background:transparent;text-align:left}.nav-tabs button:before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:999px;background:transparent}.nav-tabs button:hover{background:var(--surface-soft)}.nav-tabs button.active{color:var(--primary);background:var(--primary-soft-strong);font-weight:800}.nav-tabs button.active:before{background:var(--primary)}.nav-tabs span{min-width:0}.nav-tabs em{min-width:28px;border-radius:999px;padding:2px 8px;color:var(--text-muted);background:var(--surface-tint-strong);font-size:12px;font-style:normal;font-weight:800;text-align:center}.sidebar-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--text-muted)}.sidebar-actions{display:flex;align-items:center;gap:8px}.workspace-area{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;min-width:0}.workspace-area.with-detail{grid-template-columns:minmax(0,1fr) 380px}.content{min-width:0;padding:28px}.page-head{display:flex;width:100%;align-items:flex-start;justify-content:space-between;gap:18px;max-width:1180px;margin:0 auto 18px}.page-head>div:first-child{min-width:0}.page-head h1{margin:0;color:var(--text);font-family:"Noto Serif SC",Georgia,Times New Roman,serif;font-size:28px;font-weight:650;letter-spacing:0}.page-head p{margin:7px 0 0;color:var(--text-muted);line-height:1.55}.page-actions{display:flex;flex:0 0 auto;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px}.page-action{width:auto;flex:0 0 auto}.toolbar{display:grid;width:100%;gap:12px;max-width:1180px;margin:0 auto 18px}.search-box{display:grid;width:100%;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-tint-strong);box-shadow:var(--shadow-card);padding:0 10px}.search-box input{border:0;background:transparent;box-shadow:none}.search-box input:focus{box-shadow:none}.filter-stack{display:grid;gap:8px}.tag-strip{display:flex;gap:8px;overflow-x:auto;padding-bottom:3px}.tag-strip button{flex:0 0 auto;min-height:34px;border:1px solid transparent;padding:0 12px;color:var(--text-muted);background:var(--surface-soft);font-size:13px;font-weight:750}.tag-strip button.active{border-color:var(--border-strong);color:var(--primary);background:var(--primary-soft-strong)}.records,.phonetics-page{max-width:1180px;margin:0 auto}.example-list,.word-list,.related-list,.comment-list{display:grid;gap:12px;min-width:0}.example-row,.word-row,.phonetic-symbol-item,.detail-section,.comment-card,.related-example-row{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card)}.example-row{display:grid;gap:16px;padding:18px}.sentence-content{min-width:0}.english-line{display:block;margin:0;color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:23px;line-height:1.55;overflow-wrap:anywhere}.chinese-line{display:block;margin:10px 0 0;color:var(--text-muted);line-height:1.7;overflow-wrap:anywhere}.example-row .english-line,.example-row .chinese-line{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical}.example-row .english-line{-webkit-line-clamp:4}.example-row .chinese-line{-webkit-line-clamp:2}.meta-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}.tag-list{display:flex;flex-wrap:wrap;gap:6px;min-width:0}.tag-list span{display:inline-flex;align-items:center;min-height:26px;border-radius:var(--radius-sm);padding:0 9px;color:var(--accent-contrast);background:var(--accent-soft);font-size:12px;font-weight:800}.sentence-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;min-width:0}.audio-player{display:grid;grid-template-columns:30px auto minmax(86px,148px) auto;align-items:center;gap:8px;min-height:34px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 8px;color:var(--primary);background:var(--primary-soft-strong);font-size:12px;font-weight:800}.audio-play,.audio-rate{min-height:26px;border:0;color:var(--primary);background:transparent}.audio-play{width:26px}.audio-rate{padding:0 4px;font-size:12px}.audio-player input[type=range]{height:3px;min-height:0;padding:0;accent-color:var(--primary)}.word-row{display:grid;grid-template-columns:34px minmax(120px,1.15fr) minmax(160px,1.6fr) auto auto;align-items:center;gap:14px;padding:14px 16px}.word-letter{display:grid;width:30px;height:30px;place-items:center;border-radius:var(--radius-sm);color:var(--primary);background:var(--primary-soft-strong);font-weight:900}.word-main{display:grid;gap:3px;min-width:0}.word-main h3{margin:0;color:var(--primary);font-family:Georgia,Times New Roman,serif;font-size:23px;letter-spacing:0;overflow-wrap:anywhere}.word-main small{color:var(--text-subtle);line-height:1.4;overflow-wrap:anywhere}.word-row>p{margin:0;color:var(--text);line-height:1.6;overflow-wrap:anywhere}.word-status{display:flex;justify-content:flex-end}.status-chip{display:inline-flex;min-height:26px;align-items:center;border-radius:var(--radius-sm);padding:0 9px;color:var(--text-muted);background:var(--surface-soft);font-size:12px;font-weight:800;white-space:nowrap}.status-chip.success{color:var(--success);background:var(--primary-soft-strong)}.row-actions,.detail-actions,.popover-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px}.pager-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:12px;padding:10px 12px;color:var(--text-muted);background:var(--surface-tint);font-size:14px}.pager-actions{display:flex;gap:8px}.word-game-page{display:grid;gap:16px}.word-game-controls,.word-game-layout{width:100%;max-width:1180px;margin:0 auto}.word-game-controls{display:grid;grid-template-columns:minmax(240px,1fr) minmax(300px,1.2fr) auto;align-items:center;gap:12px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card);padding:14px}.segmented-control{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:6px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-soft);padding:4px}.segmented-control button{min-height:36px;border:0;border-radius:calc(var(--radius-sm) - 2px);color:var(--text-muted);background:transparent;font-size:13px;font-weight:850}.segmented-control button.active{color:var(--primary);background:var(--surface);box-shadow:var(--shadow-soft)}.word-game-error{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.word-game-layout{display:grid;grid-template-columns:minmax(360px,1fr) minmax(280px,360px);gap:16px;align-items:start}.word-game-board-panel,.word-game-side{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card)}.word-game-board-panel{display:grid;justify-items:center;gap:14px;padding:18px}.word-game-board{display:grid;width:min(100%,640px);aspect-ratio:1;grid-template-columns:repeat(var(--board-size),minmax(0,1fr));grid-template-rows:repeat(var(--board-size),minmax(0,1fr));gap:6px}.word-game-cell{display:grid;place-items:center;min-width:0;min-height:0;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);background:var(--surface);font-size:clamp(18px,5vmin,34px);font-weight:900;letter-spacing:0;box-shadow:var(--shadow-soft)}.word-game-cell.selected{border-color:var(--primary);color:var(--primary);background:var(--primary-soft-strong)}.word-game-cell:disabled{opacity:.78}.word-game-targets{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.word-game-targets span{border:1px solid var(--border);border-radius:var(--radius-sm);padding:5px 9px;color:var(--text-muted);background:var(--surface-soft);font-size:13px;font-weight:850}.word-game-targets span.cleared{border-color:var(--success);color:var(--success);background:var(--primary-soft)}.word-game-side{display:grid;gap:12px;padding:14px}.word-game-side-section{display:grid;gap:8px;border-bottom:1px solid var(--divider);padding-bottom:12px}.word-game-side-section:last-child{border-bottom:0;padding-bottom:0}.word-game-side-section>span,.word-game-stat span{color:var(--text-muted);font-size:12px;font-weight:850}.word-game-side-section>strong{color:var(--text);font-size:18px;overflow-wrap:anywhere}.word-game-side-section small{color:var(--text-subtle)}.word-game-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.word-game-stat{display:grid;gap:4px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);padding:10px}.word-game-stat strong{color:var(--primary);font-size:20px;letter-spacing:0}.word-game-cleared-list,.word-game-score-list{display:grid;gap:8px;max-height:240px;overflow:auto}.word-game-cleared-list>div,.word-game-score-list>div{display:grid;gap:3px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);padding:9px 10px}.word-game-cleared-list strong,.word-game-score-list strong{color:var(--text);font-size:14px}.word-game-cleared-list p,.word-game-score-list p{margin:0;color:var(--text-muted);font-size:13px;line-height:1.45}.settings-form{display:grid;gap:16px}.settings-section,.scenario-import-panel,.scenario-side-panel,.scenario-chat-panel,.scenario-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card)}.settings-section{display:grid;gap:14px;padding:16px}.settings-section-head{display:flex;align-items:center;gap:10px;color:var(--primary)}.settings-section-head>div{display:flex;min-width:0;flex-wrap:wrap;align-items:center;gap:8px}.settings-section-head h3{margin:0;color:var(--text);font-size:16px;letter-spacing:0}.checkbox-line{display:flex;grid-template-columns:none;align-items:center;gap:10px}.checkbox-line input{width:18px;min-width:18px;min-height:18px;accent-color:var(--primary)}.settings-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.scenarios-page,.scenario-practice{display:grid;gap:16px}.scenario-import-panel{display:grid;gap:12px;width:100%;max-width:1180px;margin:0 auto;padding:14px}.scenario-import-panel textarea{min-height:300px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:13px;line-height:1.55}.scenario-import-actions,.scenario-card-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}.scenario-grid{display:grid;width:100%;max-width:1180px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:0 auto}.scenario-card{display:grid;gap:14px;align-content:start;padding:16px}.scenario-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.scenario-card-head div{min-width:0}.scenario-card-head span{color:var(--text-subtle);font-size:12px;font-weight:900}.scenario-card-head h2{margin:4px 0 0;color:var(--text);font-family:"Noto Serif SC",Georgia,Times New Roman,serif;font-size:22px;font-weight:650;letter-spacing:0;overflow-wrap:anywhere}.scenario-card-head strong,.scenario-meta-list span,.scenario-progress-list span{display:inline-flex;min-height:26px;align-items:center;border-radius:var(--radius-sm);padding:0 9px;color:var(--primary);background:var(--primary-soft-strong);font-size:12px;font-weight:850;white-space:nowrap}.scenario-card p{margin:0;color:var(--text-muted);line-height:1.65;overflow-wrap:anywhere}.scenario-meta-list{display:flex;flex-wrap:wrap;gap:6px}.scenario-practice-layout{display:grid;width:100%;max-width:1180px;grid-template-columns:minmax(230px,280px) minmax(0,1fr);gap:14px;margin:0 auto}.scenario-side-panel{display:grid;align-content:start;gap:18px;padding:16px}.scenario-side-panel h3{margin:0 0 10px;color:var(--text);font-size:14px;letter-spacing:0}.scenario-progress-list,.scenario-phrase-list{display:grid;gap:8px}.scenario-progress-list span{justify-content:flex-start;color:var(--text-muted);background:var(--surface-soft)}.scenario-progress-list span.done{color:var(--success);background:var(--primary-soft-strong)}.scenario-phrase-list button,.suggested-replies button{display:block;width:100%;border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 10px;color:var(--primary);background:var(--surface-soft);font:inherit;font-size:13px;font-weight:750;line-height:1.45;text-align:left;overflow-wrap:anywhere}.scenario-phrase-list button:hover,.suggested-replies button:hover{border-color:var(--border-strong);background:var(--surface-active)}.scenario-chat-panel{display:grid;min-width:0;gap:12px;padding:14px}.scenario-messages{display:grid;max-height:calc(100vh - 270px);min-height:360px;gap:12px;overflow-y:auto;overscroll-behavior:contain;padding:4px}.scenario-message{display:grid;width:min(720px,88%);gap:8px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);padding:12px}.scenario-message.learner{justify-self:end;border-color:var(--border-strong);background:var(--primary-soft)}.scenario-message.scene{justify-self:start}.scenario-message.teacher-answer{border-color:var(--accent);background:var(--surface-soft)}.scenario-message-divider{display:flex;width:100%;align-items:center;gap:10px;color:var(--text-subtle);font-size:12px;font-weight:850;line-height:1.4;text-align:center}.scenario-message-divider:before,.scenario-message-divider:after{content:"";flex:1 1 0;height:1px;background:var(--divider)}.scenario-message-divider span{max-width:min(560px,70%);overflow-wrap:anywhere}.scenario-message-label{display:flex;align-items:center;justify-content:space-between;color:var(--text-subtle);font-size:12px;font-weight:900}.scenario-message p{margin:0;color:var(--text);line-height:1.65;overflow-wrap:anywhere}.teacher-feedback{display:grid;gap:6px;border-top:1px solid var(--divider);padding-top:10px;color:var(--text-muted);font-size:14px;line-height:1.6}.teacher-feedback strong{color:var(--primary);font-size:13px}.teacher-feedback code{width:fit-content;max-width:100%;border-radius:var(--radius-sm);padding:6px 8px;color:var(--code-text);background:var(--code-bg);white-space:normal;overflow-wrap:anywhere}.suggested-replies{display:grid;gap:6px}.scenario-compose{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px}.scenario-compose-tools{display:flex;grid-column:1 / -1;flex-wrap:wrap;gap:8px}.scenario-compose-tools button{width:fit-content;min-height:34px}.scenario-compose textarea{min-height:76px;resize:vertical}.detail-panel{position:sticky;top:0;display:grid;align-content:start;gap:12px;height:100vh;min-width:0;overflow-y:auto;border-left:1px solid var(--border);background:var(--surface-tint);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);padding:20px}.detail-panel.example-detail-fullscreen,.detail-panel.word-detail-fullscreen,.detail-panel.sentence-detail-fullscreen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;width:auto;height:100vh;height:100dvh;overflow-x:hidden;overscroll-behavior:contain;border:0;border-radius:0;background:var(--surface);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:24px clamp(18px,4vw,48px) 36px}.detail-panel.sentence-detail-fullscreen{padding-top:calc(24px + env(safe-area-inset-top,0px));scroll-padding-top:calc(92px + env(safe-area-inset-top,0px))}.detail-panel.example-detail-fullscreen .detail-panel-head,.detail-panel.example-detail-fullscreen .detail-section,.detail-panel.word-detail-fullscreen .detail-panel-head,.detail-panel.word-detail-fullscreen .detail-section,.detail-panel.sentence-detail-fullscreen .detail-panel-head,.detail-panel.sentence-detail-fullscreen .detail-section{width:min(1180px,100%);margin-right:auto;margin-left:auto}.detail-panel.example-detail-fullscreen .detail-panel-head,.detail-panel.word-detail-fullscreen .detail-panel-head,.detail-panel.sentence-detail-fullscreen .detail-panel-head{position:sticky;top:0;z-index:2;border-bottom:1px solid var(--border);padding:12px 0;background:var(--surface)}.detail-panel.sentence-detail-fullscreen .detail-panel-head{top:env(safe-area-inset-top,0px);z-index:5;box-shadow:0 -48px 0 48px var(--surface)}.detail-panel.example-detail-fullscreen .detail-section,.detail-panel.word-detail-fullscreen .detail-section,.detail-panel.sentence-detail-fullscreen .detail-section{padding:22px}.detail-panel.example-detail-fullscreen .hero-detail,.detail-panel.word-detail-fullscreen .word-detail-main,.detail-panel.sentence-detail-fullscreen .sentence-detail-main{gap:18px}.detail-panel.sentence-detail-fullscreen .sentence-detail-main{margin-top:12px}.detail-panel.example-detail-fullscreen .detail-english-line{font-size:28px;line-height:1.65}.detail-panel.example-detail-fullscreen .detail-chinese-line{font-size:18px;line-height:1.75}.detail-panel.sentence-detail-fullscreen .sentence-detail-lines .book-english-line{font-size:28px;line-height:1.65}.detail-panel.sentence-detail-fullscreen .sentence-detail-lines .book-chinese-line{font-size:18px;line-height:1.75}.detail-panel.example-detail-fullscreen .audio-player,.detail-panel.word-detail-fullscreen .audio-player,.detail-panel.sentence-detail-fullscreen .audio-player{width:min(540px,100%)}.detail-panel.word-detail-fullscreen .word-detail-main h1{font-size:44px}.detail-panel.word-detail-fullscreen .word-detail-main p{font-size:20px}.detail-panel.word-detail-fullscreen .related-example-row .english-line{font-size:20px;line-height:1.6}.detail-panel-head,.drawer-head,.records-head,.video-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.detail-panel-head{color:var(--text-muted)}.detail-panel-head div,.drawer-head div{display:grid;gap:4px}.detail-panel-head span,.drawer-head span{color:var(--text-subtle);font-size:12px;font-weight:800;text-transform:uppercase}.detail-panel-head strong{color:var(--text);font-size:14px}.detail-section{display:grid;gap:14px;min-width:0;padding:16px}.hero-detail{background:var(--surface)}.detail-english-line{font-size:26px}.detail-chinese-line{margin-top:0;font-size:16px}.sentence-detail-main{gap:12px}.sentence-detail-lines{display:grid;gap:8px;min-width:0}.sentence-detail-lines .book-english-line,.sentence-detail-lines .book-chinese-line{padding:0}.sentence-detail-lines .book-english-line{font-size:22px;line-height:1.65}.sentence-detail-lines .book-chinese-line{margin-top:0;font-size:16px;line-height:1.75}.sentence-detail-lines.chinese-first .book-chinese-line{color:var(--text);font-family:"Noto Serif SC",Georgia,serif;font-size:21px;line-height:1.65}.sentence-detail-lines.chinese-first .book-english-line{color:var(--text-muted);font-size:16px;line-height:1.75}.explainer-section{overflow:visible;background:var(--surface)}.sentence-explainer{display:flex;flex-direction:column;gap:14px;min-width:0}.sentence-explainer-canvas{position:relative;min-width:0;overflow:hidden;padding:12px}.sentence-explainer-links{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.sentence-explainer-links path{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;opacity:.58}.sentence-explainer-line{position:relative;z-index:2;width:fit-content;max-width:100%;margin:28px auto 0;color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:27px;line-height:1.85;overflow-wrap:anywhere;-webkit-user-select:text;user-select:text}.sentence-explainer-text{display:inline}.annotation-text-mark{border-radius:4px;background:color-mix(in srgb,var(--accent-soft) 78%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent-soft) 72%,transparent)}.annotation-note{position:absolute;z-index:3;display:grid;width:fit-content;min-width:180px;max-width:min(340px,calc(100% - 24px));gap:8px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-tint-strong);box-shadow:var(--shadow-popover);padding:10px}.annotation-note p{margin:0;color:var(--text);line-height:1.55;overflow-wrap:anywhere;white-space:pre-wrap}.annotation-note-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;color:var(--text-muted);font-size:12px;font-weight:800}.annotation-note-head>span{min-width:0;overflow-wrap:anywhere}.annotation-note-head>div{display:inline-flex;flex:0 0 auto;gap:4px}.annotation-edit-form,.annotation-draft{display:grid;gap:8px}.annotation-edit-form textarea,.annotation-draft textarea{min-width:0;min-height:84px;font-size:14px}.annotation-actions{display:flex;justify-content:flex-end;gap:8px}.annotation-draft{z-index:4}.explainer-head{align-items:center}.explainer-head>div{display:grid;gap:4px}.syntax-diagram{position:relative;display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,900px) minmax(120px,1fr);grid-template-areas:"top top top" "left sentence right" "bottom bottom bottom";gap:16px;align-items:center;justify-items:stretch;min-height:360px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-tint);padding:14px;overflow:visible}.syntax-links{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.syntax-link{fill:none;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;opacity:.68;transition:opacity .16s ease,stroke-width .16s ease}.syntax-link.is-active{opacity:1;stroke-width:3.8}.syntax-link.is-dimmed{opacity:.12}.syntax-manual-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none}.syntax-notes-zone{position:relative;z-index:4;display:flex;flex-wrap:wrap;gap:10px;min-width:0;align-content:flex-start;align-items:flex-start;justify-content:center}.syntax-notes-zone[data-zone=top]{grid-area:top}.syntax-notes-zone[data-zone=right]{grid-area:right}.syntax-notes-zone[data-zone=bottom]{grid-area:bottom}.syntax-notes-zone[data-zone=left]{grid-area:left}.syntax-notes-zone[data-zone=left],.syntax-notes-zone[data-zone=right]{align-self:stretch;flex-direction:column;align-items:center;justify-content:center}.syntax-sentence-board{position:relative;z-index:4;grid-area:sentence;align-self:stretch;width:100%;margin:0 auto;min-width:0;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-tint-strong);box-shadow:var(--shadow-card);padding:24px}.syntax-sentence{margin:0;color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:27px;line-height:1.9;letter-spacing:0;overflow-wrap:anywhere}.syntax-token{position:relative;display:inline-block;min-height:1.82em;border:2px solid transparent;border-radius:7px;margin:0 .02em;padding:.08em .22em .24em;cursor:pointer;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,opacity .16s ease}.syntax-token:hover,.syntax-token:focus-visible{outline:none;background:var(--surface-soft)}.syntax-token.is-selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent-soft) 72%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}.syntax-token.is-active-annotation{border-color:var(--syntax-token-color);background:color-mix(in srgb,var(--syntax-token-color),var(--surface) 78%);box-shadow:0 0 0 3px color-mix(in srgb,var(--syntax-token-color),transparent 78%),0 10px 20px color-mix(in srgb,var(--syntax-token-color),transparent 88%)}.syntax-token.is-dimmed{opacity:.34}.syntax-token-bars{position:absolute;right:.18em;bottom:.1em;left:.18em;display:grid;gap:2px;pointer-events:none}.syntax-token-bar{height:3px;border-radius:999px;background:var(--syntax-bar-color);opacity:.92}.syntax-token-bar.is-dimmed{opacity:.18}.syntax-punctuation{color:var(--text-muted)}.syntax-note{--syntax-note-color: var(--primary);position:relative;z-index:4;display:flex;width:fit-content;max-width:min(100%,340px);min-width:0;flex-direction:column;align-items:center;gap:5px;border:0;border-radius:999px;padding:12px 20px 13px;color:var(--text);background:radial-gradient(ellipse at 50% 28%,var(--surface-tint-strong) 0%,color-mix(in srgb,var(--syntax-note-color),var(--surface) 88%) 100%);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--syntax-note-color),transparent 62%),0 12px 26px #1f3c261a;text-align:center;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;transition:opacity .16s ease,box-shadow .16s ease,transform .16s ease}.syntax-note.is-manual{position:absolute;left:var(--note-left, auto);top:var(--note-top, auto);pointer-events:auto}.syntax-note.is-dragging{z-index:8;cursor:grabbing;opacity:.94;transition:none}.syntax-note:hover,.syntax-note:focus-visible{outline:none;transform:translateY(-2px);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--syntax-note-color),transparent 50%),0 18px 34px #1f3c2624}.syntax-note.is-active{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--syntax-note-color),transparent 42%),0 0 0 4px color-mix(in srgb,var(--syntax-note-color),transparent 82%),0 18px 38px color-mix(in srgb,var(--syntax-note-color),transparent 76%)}.syntax-note.is-dimmed{opacity:.3}.syntax-note-head{display:inline-flex;align-items:center;gap:7px;color:color-mix(in srgb,var(--syntax-note-color),var(--text) 24%);font-size:12px;font-weight:850;line-height:1.2}.syntax-note-head:before{content:"";width:9px;height:9px;flex:0 0 auto;border-radius:999px;background:var(--syntax-note-color)}.syntax-note strong{color:var(--text);font-size:15px;line-height:1.25;overflow-wrap:anywhere}.syntax-note span:not(.syntax-note-head){color:var(--text-muted);font-size:13px;line-height:1.45;overflow-wrap:anywhere}.syntax-note em{color:var(--text-subtle);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:11px;font-style:normal;line-height:1.35;overflow-wrap:anywhere}.syntax-editor-panel{position:absolute;top:var(--editor-top, 50%);left:var(--editor-left, 50%);z-index:12;display:grid;width:min(var(--editor-width, 360px),calc(100% - 28px));min-width:0;gap:12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-tint-strong);box-shadow:var(--shadow-popover);padding:14px;opacity:0;pointer-events:none;transform:translateY(8px) scale(.98);transition:opacity .16s ease,transform .16s ease}.syntax-editor-panel.is-open{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}.syntax-editor-title{display:flex;align-items:center;justify-content:space-between;gap:10px}.syntax-editor-title h3{margin:0;color:var(--text);font-size:16px;line-height:1.2}.syntax-editor-title span{min-width:56px;border-radius:999px;padding:4px 8px;color:var(--text-muted);background:var(--surface-soft);text-align:center;font-size:12px;font-weight:800}.syntax-selected-preview{min-height:42px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);padding:9px 10px;color:var(--text-muted);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:12px;line-height:1.45;overflow-wrap:anywhere}.syntax-editor-panel form{display:grid;gap:12px}.syntax-editor-panel textarea{min-height:104px}.syntax-color-row{display:flex;flex-wrap:wrap;gap:7px}.syntax-color-row button{width:24px;min-width:24px;height:24px;min-height:24px;border:2px solid transparent;border-radius:999px;background:var(--syntax-swatch-color)}.syntax-color-row button.is-active{border-color:var(--text);box-shadow:0 0 0 3px color-mix(in srgb,var(--syntax-swatch-color),transparent 78%)}.syntax-editor-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.syntax-editor-actions .danger{grid-column:1 / -1}.syntax-status{min-height:18px;margin:0;color:var(--text-muted);font-size:12px;line-height:1.4}.syntax-status.is-error{color:var(--danger)}.stale-annotations{display:grid;gap:10px;border-top:1px solid var(--border);padding-top:12px}.stale-annotation{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start;border:1px solid var(--danger-border);border-radius:var(--radius-sm);background:var(--danger-soft);padding:10px}.stale-annotation strong{display:block;color:var(--danger);overflow-wrap:anywhere}.stale-annotation p{margin:4px 0 0;color:var(--text);line-height:1.55;overflow-wrap:anywhere}.records-head h2,.drawer-head h2,.video-head h2{margin:0;color:var(--text);font-family:"Noto Serif SC",Georgia,serif;font-size:20px;font-weight:650;letter-spacing:0}.records-head span{color:var(--text-muted);font-size:13px}.word-detail-main h1{margin:0;color:var(--primary);font-family:Georgia,Times New Roman,serif;font-size:36px;letter-spacing:0}.word-detail-main p{margin:0;color:var(--text);font-size:18px;line-height:1.7}.word-detail-main em{color:var(--accent);font-style:normal;line-height:1.6}.word-detail-main small{color:var(--text-muted);line-height:1.6}.comment-form{display:grid;gap:10px;border-bottom:1px solid var(--border);margin-bottom:14px;padding-bottom:14px}.comment-form-bottom{border-top:1px solid var(--border);border-bottom:0;margin-top:14px;margin-bottom:0;padding-top:14px;padding-bottom:0}.comment-card{min-width:0;max-width:100%;padding:14px}.comment-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;color:var(--text-muted);font-size:13px}.markdown-body{min-width:0;max-width:100%;color:var(--text);line-height:1.7;overflow-wrap:anywhere}.markdown-body>:first-child{margin-top:0}.markdown-body>:last-child{margin-bottom:0}.markdown-body p,.markdown-body ul,.markdown-body ol,.markdown-body blockquote,.markdown-body pre{margin:0 0 12px}.markdown-body ul,.markdown-body ol{padding-left:22px}.markdown-body a{color:var(--primary);font-weight:800}.markdown-body blockquote{border-left:3px solid var(--accent);padding-left:12px;color:var(--text-muted)}.markdown-body code{border-radius:6px;padding:2px 5px;color:var(--code-text);background:var(--code-bg);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.92em}.markdown-body pre{max-width:100%;overflow-x:hidden;border-radius:var(--radius-sm);padding:12px;background:var(--pre-bg);white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.markdown-body pre code{display:block;min-width:0;padding:0;color:var(--pre-text);background:transparent;white-space:inherit;overflow-wrap:anywhere;word-break:break-word}.related-example-row{display:grid;gap:10px;padding:12px}.related-open{display:grid;gap:6px;border:0;padding:0;color:inherit;background:transparent;text-align:left}.related-source{color:var(--text-muted);font-size:12px}.related-example-row .english-line{font-size:18px;line-height:1.5}.related-example-row .chinese-line{margin:0;font-size:14px}.compact-pager{margin-bottom:10px;padding:8px;font-size:12px}.notes-page{display:grid;gap:16px}.note-card-grid,.note-reader,.note-editor{width:100%;max-width:1180px;margin:0 auto}.note-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.note-card-grid .empty-state{grid-column:1 / -1}.note-card{display:grid;min-width:0;min-height:240px;align-content:space-between;gap:18px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card);padding:18px}.note-card-clickable{cursor:pointer;transition:border-color .14s ease,box-shadow .14s ease,transform .14s ease}.note-card-clickable:hover,.note-card-clickable:focus-within{border-color:var(--border-strong);box-shadow:var(--shadow-panel);transform:translateY(-1px);outline:none}.note-card-main{min-width:0}.note-card-open{width:100%;border:0;background:transparent;box-shadow:none;color:inherit;cursor:pointer;padding:0;text-align:left}.note-card-open:focus{box-shadow:none}.note-card h2{margin:10px 0 8px;color:var(--text);font-family:"Noto Serif SC",Georgia,serif;font-size:22px;line-height:1.3;letter-spacing:0;overflow-wrap:anywhere}.note-card time,.note-reader time,.note-editor-head span{color:var(--text-subtle);font-size:12px;font-weight:800}.note-card p{display:-webkit-box;margin:12px 0 0;color:var(--text-muted);line-height:1.65;overflow:hidden;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:5}.note-card-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.note-editor{display:grid;gap:16px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card);padding:18px}.note-reader{display:grid;gap:16px;max-width:960px;padding-bottom:48px}.note-reader-head,.note-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.note-reader-head>div:first-child,.note-editor-head>div:first-child{min-width:0}.note-reader h2,.note-editor h2{margin:4px 0 0;color:var(--text);font-family:"Noto Serif SC",Georgia,serif;font-size:24px;line-height:1.3;letter-spacing:0;overflow-wrap:anywhere}.note-markdown{font-size:16px}.note-markdown h1,.note-markdown h2,.note-markdown h3,.note-markdown h4,.note-markdown h5,.note-markdown h6{scroll-margin-top:28px}.note-outline{position:fixed;top:46%;right:0;z-index:55;display:flex;align-items:stretch;max-width:calc(100vw - 24px);transform:translate(calc(100% - 42px));transition:transform .16s ease}.note-outline:hover,.note-outline:focus-within{transform:translate(0)}.note-outline-trigger{display:inline-flex;width:42px;min-width:42px;min-height:54px;align-items:center;justify-content:center;border:1px solid var(--border);border-right:0;border-radius:var(--radius-sm) 0 0 var(--radius-sm);color:var(--primary);background:var(--surface-tint-strong);box-shadow:var(--shadow-card)}.note-outline-trigger:hover,.note-outline-trigger:focus{background:var(--surface-active);outline:none}.note-outline-trigger:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}.note-outline-panel{width:min(280px,calc(100vw - 66px));max-height:68vh;overflow-y:auto;border:1px solid var(--border);border-right:0;border-radius:var(--radius-sm) 0 0 var(--radius-sm);background:var(--surface-tint-strong);box-shadow:var(--shadow-panel);padding:14px}.note-outline-title{margin-bottom:8px;color:var(--text-subtle);font-size:12px;font-weight:900}.note-outline ol{display:grid;gap:2px;margin:0;padding:0;list-style:none}.note-outline li{min-width:0}.note-outline a{display:block;border-radius:var(--radius-sm);padding:7px 8px;color:var(--text-muted);font-size:13px;font-weight:750;line-height:1.35;overflow-wrap:anywhere;text-decoration:none}.note-outline a:hover,.note-outline a:focus{color:var(--primary);background:var(--surface-soft);outline:none}.note-outline-level-1 a{color:var(--text);font-weight:900}.note-outline-level-2 a{padding-left:18px}.note-outline-level-3 a{padding-left:28px}.note-outline-level-4 a{padding-left:38px}.note-outline-level-5 a,.note-outline-level-6 a{padding-left:48px}.note-title-field{max-width:680px}.note-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}.note-editor textarea{min-height:420px}.note-preview{display:grid;min-width:0;min-height:420px;align-content:start;gap:12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);padding:14px}.note-preview-empty{color:var(--text-subtle);font-size:14px}.books-page{display:grid;gap:16px}.book-card-grid,.chapter-card-grid,.chapter-reader{display:grid;width:100%;max-width:1180px;margin:0 auto;gap:14px}.book-card-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.chapter-card-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}.books-breadcrumb,.inline-editor{width:100%;max-width:1180px;margin:0 auto}.books-breadcrumb{display:flex;align-items:center}.inline-editor{display:grid;gap:14px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card);padding:16px}.sentence-inline-editor{max-width:960px}.inline-editor-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}.book-card,.chapter-card{min-width:0;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-tint-strong);box-shadow:var(--shadow-card)}.book-card{display:grid;align-content:space-between;gap:20px;min-height:210px;padding:18px}.book-card-main,.chapter-card-main{min-width:0}.book-card-kicker{display:inline-flex;min-height:24px;align-items:center;border-radius:var(--radius-sm);padding:0 8px;color:var(--accent-contrast);background:var(--accent-soft);font-size:12px;font-weight:900}.book-card h2,.chapter-card h2{margin:10px 0 8px;color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:24px;line-height:1.25;letter-spacing:0;overflow-wrap:anywhere}.book-card p,.chapter-card p{margin:0;color:var(--text-muted);line-height:1.55}.book-card time{display:block;margin-top:14px;color:var(--text-subtle);font-size:12px;font-weight:800}.book-card-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.chapter-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;padding:16px}.chapter-card .book-card-actions{grid-column:1 / -1}.chapter-number{display:grid;place-items:center;border-radius:var(--radius-sm);color:var(--primary);background:var(--primary-soft-strong);font-family:Georgia,Times New Roman,serif;font-weight:900}.chapter-number{width:38px;height:38px;font-size:18px}.chapter-reader{display:block;max-width:960px;padding:10px 0 48px}.sentence-reading-item{position:relative;min-width:0;border-radius:var(--radius-sm);transition:background-color .14s ease}.sentence-reading-item.playing{background:var(--playing-bg)}.sentence-reading-item+.sentence-reading-item{margin-top:4px}.sentence-hover-zone{display:flex;min-height:52px;align-items:center}.sentence-hover-bar{display:flex;width:100%;min-width:0;min-height:40px;align-items:center;gap:10px;border-radius:var(--radius-sm);padding:4px 8px;opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .14s ease,transform .14s ease,background-color .14s ease}.sentence-hover-zone:hover .sentence-hover-bar,.sentence-hover-zone:focus-within .sentence-hover-bar{opacity:1;pointer-events:auto;transform:translateY(0);background:var(--surface-tint-strong)}.sentence-hover-index{display:inline-flex;width:28px;height:28px;flex:0 0 auto;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--text-subtle);background:var(--surface-soft);font-family:Georgia,Times New Roman,serif;font-size:15px;font-weight:900}.book-english-line,.book-chinese-line{margin:0;overflow-wrap:anywhere}.book-english-line{color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:27px;line-height:1.9;padding:0 8px}.book-chinese-line{margin-top:8px;padding:0 8px 4px;color:var(--text-muted);font-size:17px;line-height:2}.sentence-reading-item.chinese-first .book-chinese-line{margin-top:0;color:var(--text);font-family:"Noto Serif SC",Georgia,serif;font-size:25px;line-height:1.9}.sentence-reading-item.chinese-first .book-english-line{margin-top:8px;color:var(--text-muted);font-size:17px;line-height:2}.book-sentence-actions{margin-left:auto;justify-content:flex-start}.chapter-floating-actions{position:fixed;right:max(24px,env(safe-area-inset-right,0px));bottom:max(24px,env(safe-area-inset-bottom,0px));z-index:70;display:grid;justify-items:end;gap:10px}.chapter-floating-trigger{width:56px;min-width:56px;height:56px;min-height:56px;border:1px solid var(--border-strong);border-radius:50%;color:var(--surface);background:var(--primary);box-shadow:var(--shadow-popover)}.chapter-floating-trigger:hover,.chapter-floating-trigger:focus-visible{outline:none;background:color-mix(in srgb,var(--primary),var(--text) 12%)}.chapter-floating-menu{display:grid;width:min(220px,calc(100vw - 32px));gap:6px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);box-shadow:var(--shadow-popover);padding:8px}.chapter-floating-menu button{display:flex;width:100%;min-height:42px;align-items:center;justify-content:flex-start;gap:10px;border:0;border-radius:var(--radius-sm);padding:0 10px;color:var(--text);background:transparent;font-weight:800}.chapter-floating-menu button:hover,.chapter-floating-menu button:focus-visible{outline:none;background:var(--surface-soft)}.chapter-floating-menu button:disabled{cursor:not-allowed;opacity:.5}.sentence-hover-bar .audio-player{flex:0 1 420px}.file-action{position:relative;overflow:hidden}.file-action input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.file-action.disabled{pointer-events:none;opacity:.62}.drawer-backdrop,.video-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;background:var(--overlay)}.drawer-backdrop{justify-content:end}.editor-drawer{display:flex;flex-direction:column;width:min(440px,100vw);height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;overflow:hidden;border-left:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-popover);padding:22px}.drawer-head{flex:0 0 auto;margin-bottom:22px}.editor-drawer>.drawer-form{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:4px}.drawer-actions{position:sticky;bottom:0;display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin-top:0;padding-top:4px;background:var(--surface)}.file-line{position:relative;display:flex;min-height:42px;align-items:center;gap:9px;border:1px dashed var(--border-strong);border-radius:var(--radius-sm);padding:0 12px;color:var(--accent);background:var(--accent-soft)}.file-line input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.youtube-video-search{display:grid;gap:9px;min-width:0}.youtube-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.youtube-search-row .secondary-button{min-height:42px;white-space:nowrap}.youtube-search-status{border-radius:var(--radius-sm);padding:9px 10px;color:var(--text-muted);background:var(--surface-soft);font-size:12px;font-weight:800}.youtube-search-status.error{color:var(--danger);background:var(--danger-soft)}.youtube-result-list{display:grid;gap:8px}.youtube-result{display:grid;grid-template-columns:88px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;min-height:66px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:7px;color:var(--text);background:var(--surface);text-align:left}.youtube-result:hover,.youtube-result:focus-visible{outline:none;border-color:var(--primary);background:var(--surface-soft);box-shadow:0 0 0 3px var(--focus-ring)}.youtube-result.selected{border-color:var(--success);background:var(--primary-soft)}.youtube-result img,.youtube-result-thumb{width:88px;height:50px;border-radius:5px;background:var(--surface-soft)}.youtube-result img{object-fit:cover}.youtube-result-thumb{display:inline-flex;align-items:center;justify-content:center;color:var(--text-muted)}.youtube-result span{display:grid;min-width:0;gap:4px}.youtube-result strong,.youtube-result small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.youtube-result strong{font-size:13px}.youtube-result small{color:var(--text-muted);font-size:12px}.youtube-result em{color:var(--primary);font-size:12px;font-style:normal;font-weight:850}.youtube-video-search.compact{gap:7px}.youtube-video-search.compact .youtube-search-row{grid-template-columns:1fr}.youtube-video-search.compact .youtube-search-row .secondary-button{width:100%;min-height:34px}.youtube-video-search.compact .youtube-result{grid-template-columns:64px minmax(0,1fr);min-height:54px}.youtube-video-search.compact .youtube-result img,.youtube-video-search.compact .youtube-result-thumb{width:64px;height:36px}.youtube-video-search.compact .youtube-result em{grid-column:1 / -1;justify-self:end}.notice,.form-error,.empty-state{border-radius:var(--radius-sm);padding:12px 14px;color:var(--text-muted);background:var(--surface-soft)}.notice{max-width:1180px;margin:0 auto 12px}.notice.error,.form-error{color:var(--danger);background:var(--danger-soft)}.notice.success{color:var(--success);background:var(--primary-soft)}.empty-state{display:grid;min-height:132px;place-items:center;gap:6px;text-align:center}.empty-state strong{color:var(--text);font-family:"Noto Serif SC",Georgia,serif;font-size:19px}.empty-state span{max-width:420px;line-height:1.6}.word-token-wrap{position:relative;display:inline-block}.word-token{display:inline;border:0;border-bottom:2px solid var(--accent);border-radius:0;padding:0 1px;color:inherit;background:transparent;font-family:inherit;font-size:inherit;line-height:inherit}.quick-add-token{display:inline;border:0;border-radius:var(--radius-sm);padding:0 1px;color:inherit;background:transparent;font-family:inherit;font-size:inherit;line-height:inherit}.quick-add-token:hover,.quick-add-token:focus-visible,.quick-add-token.active{color:var(--primary);background:var(--primary-soft);box-shadow:0 0 0 2px var(--focus-ring)}.word-popover{position:absolute;left:0;bottom:calc(100% + 10px);z-index:30;width:min(280px,82vw);border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-popover);padding:12px;color:var(--text);font-family:Inter,Noto Sans SC,system-ui,sans-serif;font-size:14px;line-height:1.45}.quick-add-popover{bottom:auto;z-index:90;max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}.word-popover-card{display:grid;gap:7px}.quick-add-form{display:grid;gap:10px}.quick-add-form label{gap:5px;font-size:12px}.quick-add-form input{min-height:34px;padding:0 9px;font-size:13px}.quick-add-popover .youtube-result-list{max-height:min(34vh,320px);max-height:min(34dvh,320px);overflow-y:auto;overscroll-behavior:contain;padding-right:2px}.quick-add-error,.word-popover .word-popover-notice{border-radius:var(--radius-sm);padding:8px 9px;color:var(--danger);background:var(--danger-soft);font-size:12px;font-weight:800}.word-popover .word-popover-notice{color:var(--success);background:var(--primary-soft-strong)}.word-popover strong{color:var(--primary);font-size:16px}.word-popover span,.word-popover small{color:var(--text-muted)}.word-popover em{color:var(--accent);font-style:normal}.video-play-button{width:fit-content;min-height:32px;border:1px solid var(--border);padding:0 10px;color:var(--primary);background:var(--surface-soft);font-size:13px;font-weight:800}.primary-popover-action{color:var(--surface);background:var(--primary)}.phonetics-page{display:grid;width:100%;gap:16px}.phonetic-tabs{display:flex;width:100%;max-width:1180px;margin:0 auto;gap:8px;overflow-x:auto;padding-bottom:3px}.phonetic-tabs button{display:inline-flex;flex:0 0 auto;align-items:center;gap:8px;min-height:36px;border:1px solid transparent;border-radius:var(--radius-sm);padding:0 12px;color:var(--text-muted);background:var(--surface-soft);font-weight:800}.phonetic-tabs button.active{border-color:var(--border-strong);color:var(--primary);background:var(--primary-soft-strong)}.phonetic-tabs span{color:var(--text-subtle);font-size:12px}.phonetic-map{display:grid;width:100%;gap:14px;max-width:1180px;margin:0 auto}.phonetic-group{display:grid;width:100%;gap:12px}.phonetic-group-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--text-muted)}.phonetic-group-head h2{margin:0;color:var(--primary);font-size:18px;letter-spacing:0}.phonetic-group-head span{font-size:13px}.phonetic-symbols{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:12px}.phonetic-symbol-item{display:grid;min-width:0;gap:12px;padding:14px}.phonetic-symbol-item.playing{border-color:var(--accent);background:var(--playing-bg)}.phonetic-symbol-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.phonetic-symbol-top small{display:block;margin-top:4px;color:var(--text-muted);font-size:12px;font-weight:800}.phonetic-symbol-mark{color:var(--primary);font-family:Georgia,Times New Roman,serif;font-size:32px;line-height:1}.phonetic-play-button,.practice-button{width:fit-content;min-height:32px;border:1px solid var(--border);padding:0 10px;color:var(--primary);background:var(--primary-soft-strong);font-size:13px;font-weight:800}.practice-button{justify-self:start;color:var(--text-muted);background:var(--surface-soft)}.phonetic-symbol-detail{display:grid;gap:8px}.phonetic-example{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 10px;border-top:1px solid var(--divider);padding-top:8px;min-width:0}.phonetic-example:first-child{border-top:0;padding-top:0}.phonetic-example strong,.phonetic-example-word{min-width:0;color:var(--text);font-size:15px;font-weight:800;overflow-wrap:anywhere}.phonetic-token-wrap{display:inline-block;max-width:100%}.phonetic-word-token{color:var(--text);font-weight:800;text-align:left;overflow-wrap:anywhere}.phonetic-word-popover{left:0;bottom:calc(100% + 8px)}.phonetic-example em{margin-left:auto;color:var(--accent);font-family:Georgia,Times New Roman,serif;font-size:15px;font-style:normal;overflow-wrap:anywhere;text-align:right}.video-backdrop{place-items:center;padding:24px;background:var(--video-overlay)}.video-dialog{width:min(920px,100%);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-dialog);padding:14px}.video-head{margin-bottom:10px}.video-dialog video,.video-frame{display:block;width:100%;max-height:min(72vh,680px);border-radius:var(--radius-sm);background:var(--video-surface)}.video-frame{aspect-ratio:16 / 9;border:0}@media (max-width: 1180px){.workspace-area.with-detail{grid-template-columns:1fr}.detail-panel{position:fixed;top:16px;right:16px;bottom:16px;z-index:80;width:min(420px,calc(100vw - 32px));height:auto;border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-popover)}}@media (max-width: 920px){.note-outline{display:none}.syntax-diagram{display:flex;flex-direction:column;min-height:340px;padding:10px}.syntax-notes-zone[data-zone=top]{order:0}.syntax-notes-zone[data-zone=left],.syntax-notes-zone[data-zone=right]{flex-direction:row;justify-content:center;order:2}.syntax-notes-zone[data-zone=bottom]{order:3}.syntax-sentence-board{order:1;padding:18px}.syntax-sentence{font-size:22px;line-height:1.9}.syntax-editor-panel{position:fixed;top:auto;right:12px;bottom:12px;left:12px;z-index:110;width:auto;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto;transform:translateY(12px) scale(.98)}.syntax-editor-panel.is-open{transform:translateY(0) scale(1)}.syntax-editor-actions,.app-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;flex-direction:row;align-items:center;gap:16px;border-right:0;border-bottom:1px solid var(--border);padding:14px}.nav-tabs{display:flex;margin-top:0}.content{padding:18px}.word-game-controls,.word-game-layout,.scenario-practice-layout{grid-template-columns:1fr}.scenario-side-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.word-row{grid-template-columns:34px minmax(0,1fr) auto}.note-editor-grid{grid-template-columns:1fr}.word-row>p,.word-status{grid-column:2 / -1}.row-actions{grid-column:2 / -1;justify-content:flex-start}}@media (max-width: 640px){.app-shell{padding-bottom:78px}.sidebar{position:fixed;left:0;right:0;bottom:0;z-index:70;height:72px;border-top:1px solid var(--border);border-bottom:0;background:var(--surface-tint-strong);padding:8px 10px}.sidebar-brand,.sidebar-foot span{display:none}.sidebar-foot{flex:0 0 auto}.nav-tabs{display:grid;flex:1;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}.nav-tabs button{display:flex;min-height:54px;flex-direction:column;justify-content:center;gap:2px;padding:4px 2px;font-size:11px;text-align:center}.sidebar-actions{gap:4px}.sidebar-actions .icon-button{width:34px;height:34px}.nav-tabs button:before,.nav-tabs em{display:none}.content{padding:14px}.word-game-controls{grid-template-columns:1fr;padding:12px}.word-game-board-panel,.word-game-side{padding:12px}.word-game-board{gap:4px}.settings-actions,.scenario-side-panel,.scenario-compose,.scenario-grid{grid-template-columns:1fr}.scenario-messages{max-height:none;min-height:300px}.scenario-message{width:94%}.page-head{align-items:flex-start}.page-head h1{font-size:25px}.page-head p{font-size:13px}.page-actions{position:fixed;right:16px;bottom:88px;z-index:60;gap:8px}.page-action{position:static;width:52px;min-width:52px;height:52px;padding:0;border-radius:50%;box-shadow:var(--shadow-popover);font-size:0}.page-action svg{width:22px;height:22px}.english-line{font-size:20px}.detail-english-line{font-size:22px}.sentence-actions{justify-content:flex-start}.audio-player{width:100%;grid-template-columns:30px auto minmax(0,1fr) auto}.book-card-grid,.chapter-card-grid,.note-card-grid{grid-template-columns:1fr}.note-editor{padding:14px}.note-reader-head,.note-editor-head{display:grid}.note-card-actions{justify-content:flex-start}.chapter-reader{padding-bottom:32px}.sentence-hover-zone{min-height:68px}.sentence-hover-bar{flex-wrap:wrap;align-items:flex-start;gap:8px;padding:6px 0}.sentence-hover-zone:hover .sentence-hover-bar,.sentence-hover-zone:focus-within .sentence-hover-bar{background:transparent}.sentence-hover-bar .audio-player{flex:1 0 calc(100% - 42px)}.book-sentence-actions{width:100%;margin-left:0}.book-english-line{font-size:23px;line-height:1.85}.book-chinese-line{font-size:16px}.sentence-reading-item.chinese-first .book-chinese-line{font-size:22px}.sentence-reading-item.chinese-first .book-english-line{font-size:16px}.word-row{grid-template-columns:30px minmax(0,1fr);align-items:start}.word-row>p,.word-status,.row-actions{grid-column:1 / -1}.drawer-backdrop{align-items:stretch;justify-content:stretch}.editor-drawer{width:100vw;height:100vh;border-left:0}.detail-panel{top:10px;right:10px;bottom:10px;left:10px;width:auto;padding:14px}.detail-panel.example-detail-fullscreen,.detail-panel.word-detail-fullscreen,.detail-panel.sentence-detail-fullscreen{top:0;right:0;bottom:0;left:0;height:100vh;height:100dvh;padding:10px 12px 18px}.detail-panel.sentence-detail-fullscreen{padding-top:calc(10px + env(safe-area-inset-top,0px));scroll-padding-top:calc(78px + env(safe-area-inset-top,0px))}.detail-panel.example-detail-fullscreen .detail-panel-head,.detail-panel.word-detail-fullscreen .detail-panel-head,.detail-panel.sentence-detail-fullscreen .detail-panel-head{padding:10px 0}.detail-panel.example-detail-fullscreen .detail-section,.detail-panel.word-detail-fullscreen .detail-section,.detail-panel.sentence-detail-fullscreen .detail-section{padding:14px}.detail-panel.example-detail-fullscreen .detail-english-line{font-size:22px;line-height:1.6}.detail-panel.example-detail-fullscreen .detail-chinese-line{font-size:15px}.detail-panel.sentence-detail-fullscreen .sentence-detail-lines .book-english-line,.sentence-explainer-line{font-size:22px;line-height:1.7}.detail-panel.sentence-detail-fullscreen .sentence-detail-lines .book-chinese-line{font-size:15px}.annotation-note{min-width:160px;max-width:calc(100% - 20px)}.annotation-actions{flex-wrap:wrap}.detail-panel.example-detail-fullscreen .audio-player,.detail-panel.word-detail-fullscreen .audio-player,.detail-panel.sentence-detail-fullscreen .audio-player{width:100%}.detail-panel.word-detail-fullscreen .word-detail-main h1{font-size:34px}.detail-panel.word-detail-fullscreen .word-detail-main p,.detail-panel.word-detail-fullscreen .related-example-row .english-line{font-size:18px}.drawer-actions{grid-template-columns:1fr}.phonetic-symbols{grid-template-columns:repeat(2,minmax(0,1fr))}}