:root{--bg: #F5F5F7;--surface: #FFFFFF;--text: #1D1D1F;--text-secondary: #5F6368;--accent: #0066CC;--accent-text: #FFFFFF;--danger: #B3261E;--success: #1E7B34;--border: #D8D8DE;--border-strong: #767680;--focus: #0066CC;--accent-active-bg: #0066CC;--radius-btn: 12px;--radius-card: 16px;--shadow-card: 0 1px 3px rgba(0, 0, 0, .08);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--highlight-bg: rgba(0, 102, 204, .14);--highlight-warn-bg: rgba(179, 38, 30, .1);--highlight-ok-bg: rgba(30, 123, 52, .12);--font-family: -apple-system, "SF Pro Text", "PingFang SC", "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;--font-size-body: 1rem;--font-size-en: 1.125rem;--font-size-aux: .875rem;--touch-min: 44px;--btn-primary-h: 48px;--content-max: 760px;--reading-max: 1120px;--nav-h: 56px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--font-family);font-size:var(--font-size-body);line-height:1.6;color:var(--text);background:var(--bg)}h1{font-size:1.375rem;margin:0 0 var(--space-4)}h2{font-size:1.125rem;margin:var(--space-5) 0 var(--space-3)}p{margin:0 0 var(--space-3)}a{color:var(--accent)}button{font-family:inherit}:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:4px}#root{min-height:100dvh;display:flex;flex-direction:column}.app-column{min-width:0;flex:1;display:flex;flex-direction:column}.app-main{flex:1;width:100%;max-width:var(--content-max);margin:0 auto;padding:var(--space-4) var(--space-4) calc(var(--nav-h) + var(--space-6) + env(safe-area-inset-bottom))}.app-main.wide{max-width:var(--reading-max)}.icp-footer{flex:none;width:100%;max-width:var(--content-max);margin:0 auto;padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);color:var(--text-secondary);text-align:center;font-size:var(--font-size-aux)}.icp-footer a{color:inherit;text-underline-offset:2px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--touch-min);padding:var(--space-2) var(--space-4);border:1px solid var(--border-strong);border-radius:var(--radius-btn);background:var(--surface);color:var(--text);font-size:1rem;cursor:pointer;text-decoration:none}.btn-primary{min-height:var(--btn-primary-h);width:100%;background:var(--accent);color:var(--accent-text);border-color:var(--accent);font-weight:600}.btn-ghost{border-color:transparent;color:var(--accent)}.btn-danger{color:var(--danger);border-color:var(--danger)}.btn[disabled]{opacity:.5;cursor:not-allowed}.btn+.btn{margin-left:0}.btn-row{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-4)}.btn-row .btn{flex:1 1 auto}.card{background:var(--surface);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:var(--space-4);margin-bottom:var(--space-4)}.card-title{font-weight:600;margin:0 0 var(--space-2)}.aux{color:var(--text-secondary);font-size:var(--font-size-aux)}.en{font-size:var(--font-size-en)}.field{margin-bottom:var(--space-4)}.field label{display:block;font-weight:600;margin-bottom:var(--space-1)}.field .aux{font-weight:400}input[type=text],input[type=password],input[type=number],input[type=date],textarea,select{width:100%;min-height:var(--touch-min);font-size:1rem;font-family:inherit;color:var(--text);padding:var(--space-3);border:1px solid var(--border-strong);border-radius:var(--radius-btn);background:var(--surface)}textarea{min-height:160px;line-height:1.6;resize:vertical}.form-error{color:var(--danger);font-size:var(--font-size-aux);margin-top:var(--space-1)}.option-row{display:flex;align-items:flex-start;gap:var(--space-3);min-height:var(--touch-min);padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-btn);margin-bottom:var(--space-2);cursor:pointer;background:var(--surface)}.option-row input{margin-top:6px;min-width:18px;min-height:18px}.option-row.selected{border-color:var(--accent);background:var(--highlight-bg)}.option-row.correct{border-color:var(--success);background:var(--highlight-ok-bg)}.option-row.wrong{border-color:var(--danger);background:var(--highlight-warn-bg)}.option-row .opt-id{font-weight:600}.state-block{text-align:center;padding:var(--space-7) var(--space-4);color:var(--text-secondary)}.state-block .state-title{font-size:1.125rem;color:var(--text);margin-bottom:var(--space-2)}.inline-error{color:var(--danger);background:var(--highlight-warn-bg);border:1px solid var(--danger);border-radius:var(--radius-btn);padding:var(--space-3);margin:var(--space-3) 0}.inline-ok{color:var(--success);background:var(--highlight-ok-bg);border:1px solid var(--success);border-radius:var(--radius-btn);padding:var(--space-3);margin:var(--space-3) 0}.pill{display:inline-flex;align-items:center;min-height:28px;padding:2px var(--space-3);border-radius:999px;font-size:var(--font-size-aux);border:1px solid var(--border-strong);color:var(--text-secondary);background:var(--surface)}.pill.ok{color:var(--success);border-color:var(--success)}.pill.warn{color:var(--danger);border-color:var(--danger)}.pill.accent{color:var(--accent);border-color:var(--accent)}.hl{background:var(--highlight-bg);border-radius:3px;padding:0 1px}.hl-ok{background:var(--highlight-ok-bg);border-radius:3px;padding:0 1px}.hl-warn{background:var(--highlight-warn-bg);border-radius:3px;padding:0 1px}.save-bar{position:sticky;bottom:calc(var(--nav-h) + env(safe-area-inset-bottom));display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-btn);box-shadow:var(--shadow-card);font-size:var(--font-size-aux);color:var(--text-secondary);margin-top:var(--space-3);z-index:5}.save-bar .dot{width:8px;height:8px;border-radius:50%;background:var(--border-strong);flex:none}.save-bar[data-state=saving] .dot{background:var(--accent)}.save-bar[data-state=server] .dot{background:var(--success)}.save-bar[data-state=device] .dot{background:var(--text-secondary)}.save-bar[data-state=failed]{color:var(--danger);border-color:var(--danger)}.save-bar[data-state=failed] .dot{background:var(--danger)}.save-bar .retry{margin-left:auto}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:10;display:flex;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom)}.bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:var(--nav-h);color:var(--text-secondary);text-decoration:none;font-size:var(--font-size-aux);gap:2px}.bottom-nav a .nav-icon{font-size:1.25rem;line-height:1}.bottom-nav a.active{color:var(--accent);font-weight:600}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#00000059;display:flex;align-items:flex-end;justify-content:center}.modal{background:var(--surface);border-radius:var(--radius-card) var(--radius-card) 0 0;width:100%;max-width:var(--content-max);max-height:85dvh;overflow:auto;padding:var(--space-5) var(--space-4) calc(var(--space-5) + env(safe-area-inset-bottom))}.modal h2{margin-top:0}.ws-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3)}.ws-head .spacer{flex:1}.item-chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-4)}.item-chip{min-width:var(--touch-min);min-height:var(--touch-min);border:1px solid var(--border-strong);border-radius:var(--radius-btn);background:var(--surface);cursor:pointer;font-size:var(--font-size-aux)}.item-chip.active{border-color:var(--accent-active-bg);background:var(--accent-active-bg);color:var(--accent-text);font-weight:600}.item-chip.done{border-color:var(--success);color:var(--success)}.sentence-text{font-size:var(--font-size-en);line-height:1.8}.stem{font-size:var(--font-size-en);margin-bottom:var(--space-4)}.reading-toggle{display:flex;gap:var(--space-2);margin-bottom:var(--space-3)}.reading-toggle .btn{flex:1}.reading-panes .pane-scroll{max-height:60dvh;overflow:auto}@media (min-width: 1024px){.reading-toggle{display:none}.reading-panes{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);max-width:var(--reading-max)}.reading-panes .pane-scroll{max-height:70dvh}.reading-panes [hidden]{display:block!important}}.passage p{margin:0 0 var(--space-3)}.passage .sent{display:inline}.side-nav{display:none}@media (min-width: 1024px){#root{flex-direction:row}.side-nav{display:flex;flex-direction:column;gap:var(--space-1);width:200px;flex:none;padding:var(--space-5) var(--space-3);border-right:1px solid var(--border);background:var(--surface);min-height:100dvh;position:sticky;top:0;align-self:flex-start}.side-nav a{display:flex;align-items:center;gap:var(--space-2);min-height:var(--touch-min);padding:0 var(--space-3);border-radius:var(--radius-btn);color:var(--text);text-decoration:none}.side-nav a.active{background:var(--accent-active-bg);color:var(--accent-text);font-weight:600}.side-nav .brand{font-weight:700;padding:0 var(--space-3) var(--space-4)}.bottom-nav{display:none}.app-main{padding-bottom:var(--space-6)}.save-bar{bottom:var(--space-3)}}.metric-grid{display:grid;grid-template-columns:1fr;gap:var(--space-3)}@media (min-width: 640px){.metric-grid{grid-template-columns:1fr 1fr}}.metric-num{font-size:1.375rem;font-weight:700}.seg{display:flex;gap:var(--space-2);margin-bottom:var(--space-4)}.seg .btn{flex:1}.btn.active{background:var(--accent-active-bg);color:var(--accent-text);border-color:var(--accent-active-bg);font-weight:600}details.card summary{cursor:pointer;font-weight:600;min-height:var(--touch-min);display:flex;align-items:center}.wordcard-lemma{font-size:1.5rem;font-weight:700}.vocab-reveal{border-top:1px solid var(--border);margin-top:var(--space-4);padding-top:var(--space-4)}.table-scroll{overflow-x:auto;max-width:100%}.table-lite{width:100%;border-collapse:collapse;font-size:var(--font-size-aux)}.table-lite th,.table-lite td{text-align:left;padding:var(--space-2);border-bottom:1px solid var(--border);vertical-align:top}pre.payload-view{white-space:pre-wrap;word-break:break-word;font-size:var(--font-size-aux);background:var(--bg);border-radius:var(--radius-btn);padding:var(--space-3);max-height:50dvh;overflow:auto}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:var(--space-3);top:var(--space-3);z-index:30;background:var(--surface);padding:var(--space-2) var(--space-3);border-radius:var(--radius-btn)}.btn:active{transform:scale(.98)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}.btn:active{transform:none}}