:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;font-size:16px;--bg: #0e1116;--surface: #161a22;--surface-2: #1f2530;--text: #e6e9ef;--text-muted: #8a93a3;--border: #2a3140;--primary: #4d9eff;--primary-fg: #ffffff;--primary-hover: #6cb0ff;--error-bg: #3a1717;--error-border: #6b2727;--error-fg: #ffb1b1;--success-bg: #14321f;--success-border: #1e6b3f;--success-fg: #b6e8c2;--w-untouched-bg: #1a3a6b;--w-untouched-fg: #e9efff;--w-s0-bg: #3a7a4a;--w-s1-bg: #2c6440;--w-s2-bg: #214f33;--w-s3-bg: #173a27;--w-s4-bg: #0f261a;--w-fg: #f3f5ef}@media (prefers-color-scheme: light){:root{color-scheme:light;--bg: #ffffff;--surface: #f7f8fb;--surface-2: #eef1f6;--text: #1a1d23;--text-muted: #5d6470;--border: #d4d9e2;--primary: #0a66c2;--primary-fg: #ffffff;--primary-hover: #084e96;--error-bg: #fde2e2;--error-border: #d68a8a;--error-fg: #7a1d1d;--success-bg: #e2f4e8;--success-border: #8ccca0;--success-fg: #1d5a31;--w-untouched-bg: #cfe0ff;--w-untouched-fg: #0b1d3b;--w-s0-bg: #b5d8b9;--w-s1-bg: #8fc097;--w-s2-bg: #6ba679;--w-s3-bg: #468d5d;--w-s4-bg: #2c6f44;--w-fg: #0a1410}}*{box-sizing:border-box}html,body{margin:0;max-width:100%;overflow-x:hidden}body{background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%;overflow-wrap:break-word}.container{max-width:760px;margin:0 auto;padding:20px 16px 120px}@media (max-width: 640px){.container{padding:16px 12px 96px}}h1{font-size:1.3rem;margin:8px 0}h2{font-size:1.1rem;margin:4px 0}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button{padding:.55rem .9rem;border:1px solid var(--border);border-radius:6px;cursor:pointer;background:var(--surface);color:var(--text);font:inherit;min-height:38px}button:hover:not(:disabled){background:var(--surface-2)}button.primary{background:var(--primary);color:var(--primary-fg);border-color:var(--primary);font-weight:600}button.primary:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover)}button:disabled{opacity:.5;cursor:not-allowed}input,select{padding:.55rem;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text);font:inherit;min-height:38px}input:focus,select:focus{outline:2px solid var(--primary);outline-offset:-1px}.error{background:var(--error-bg);border:1px solid var(--error-border);color:var(--error-fg);padding:10px 12px;border-radius:6px;margin:8px 0}.muted{color:var(--text-muted)}code{background:var(--surface-2);padding:1px 5px;border-radius:4px;font-size:.9em;word-break:break-all}.toolbar{display:flex;gap:8px;align-items:center;margin-bottom:16px;flex-wrap:wrap;max-width:100%;min-width:0}.toolbar h1.reader-title{flex:1 1 100%;margin:8px 0;font-size:1.15rem;line-height:1.3;min-width:0;overflow-wrap:anywhere}@media (min-width: 640px){.toolbar h1.reader-title{flex:1 1 auto;margin:0 0 0 16px;font-size:1.3rem}}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:8px;border-bottom:1px solid var(--border)}th{color:var(--text-muted);font-weight:600;font-size:.85rem}@media (max-width: 640px){table,thead,tbody,tr,th,td{display:block}thead{display:none}tr{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:12px 14px;margin-bottom:10px}td{border:0;padding:3px 0}td[data-label]:before{content:attr(data-label) ": ";color:var(--text-muted);font-weight:600;margin-right:6px;font-size:.85rem}td[data-label=Title]:before{display:none}td[data-label=Title]{font-weight:600;font-size:1.05rem;margin-bottom:4px}td[data-label=Actions]{margin-top:6px}}.title-link{color:inherit;text-decoration:none}.title-link:hover{color:var(--primary);text-decoration:underline}.reader,.sentence-view{max-width:100%;overflow-wrap:anywhere}.reader{line-height:2;font-size:1.05rem}.reader .word{display:inline-block;background:transparent;border:0;padding:1px 3px;margin:1px 0;cursor:pointer;font:inherit;color:inherit;border-radius:4px;line-height:1.5;min-height:0;white-space:nowrap}.reader .word.untouched{background:var(--w-untouched-bg);color:var(--w-untouched-fg)}.reader .word.s0{background:var(--w-s0-bg);color:var(--w-fg)}.reader .word.s1{background:var(--w-s1-bg);color:var(--w-fg)}.reader .word.s2{background:var(--w-s2-bg);color:var(--w-fg)}.reader .word.s3{background:var(--w-s3-bg);color:var(--w-fg)}.reader .word.s4{background:var(--w-s4-bg);color:var(--w-fg)}.reader .word:hover{outline:2px solid var(--primary);outline-offset:1px}.sentence-view{font-size:1.15rem;padding:18px 0;line-height:1.9}.sentence-view .word{display:inline-block;background:transparent;border:0;padding:2px 4px;cursor:pointer;font:inherit;color:inherit;border-radius:4px;line-height:1.5;min-height:0;white-space:nowrap}.sentence-view .word.untouched{background:var(--w-untouched-bg);color:var(--w-untouched-fg)}.sentence-view .word.s0{background:var(--w-s0-bg);color:var(--w-fg)}.sentence-view .word.s1{background:var(--w-s1-bg);color:var(--w-fg)}.sentence-view .word.s2{background:var(--w-s2-bg);color:var(--w-fg)}.sentence-view .word.s3{background:var(--w-s3-bg);color:var(--w-fg)}.sentence-view .word.s4{background:var(--w-s4-bg);color:var(--w-fg)}.sentence-view .translation{color:var(--text-muted);margin-top:12px;font-style:italic}.panel{position:fixed;right:0;top:0;bottom:0;width:340px;background:var(--surface);border-left:1px solid var(--border);box-shadow:-2px 0 16px #00000073;padding:16px;overflow:auto;z-index:10}.panel h2{margin-top:0}@media (max-width: 640px){.panel{width:auto;right:0;left:0;top:auto;bottom:0;max-height:65vh;border-left:0;border-top:1px solid var(--border);border-radius:16px 16px 0 0;box-shadow:0 -6px 20px #00000073;padding-bottom:max(16px,env(safe-area-inset-bottom))}}.statusrow{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.statusrow button{padding:.45rem .7rem;font-size:.95rem;min-width:44px}.statusrow button.active{background:var(--primary);color:var(--primary-fg);border-color:var(--primary)}.word-popup{position:absolute;width:320px;max-width:calc(100vw - 16px);background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:0 6px 24px #00000073;padding:12px 14px 10px;z-index:20}.word-popup .statusrow{margin:8px 0 0;gap:4px}.word-popup .statusrow button{padding:.3rem .45rem;font-size:.85rem;min-width:38px;min-height:32px}.word-popup-close{position:absolute;top:4px;right:4px;width:28px;height:28px;min-height:0;padding:0;border:0;background:transparent;color:var(--text-muted);font-size:1.2rem;line-height:1;cursor:pointer;border-radius:4px}.word-popup-close:hover{background:var(--surface-2);color:var(--text)}.word-popup-surface{font-size:1.1rem;font-weight:600;padding-right:24px;margin-bottom:2px}.word-popup-meta{font-size:.85rem;margin-bottom:6px}.word-popup-translation{font-size:.95rem;color:var(--text)}.add-lesson-form{border:1px solid var(--border);border-radius:10px;padding:16px;background:var(--surface)}.add-lesson-form h3{margin:0 0 4px}.add-lesson-form p.muted{margin:0 0 12px;font-size:.9rem}.complete-bar{display:flex;justify-content:flex-end;margin-top:28px;padding:12px 0}.complete-bar button{min-width:160px}@media (max-width: 640px){.complete-bar{position:sticky;bottom:0;margin:24px -12px 0;padding:10px 12px max(10px,env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--border);z-index:5;justify-content:stretch}.complete-bar button{width:100%;min-height:48px;font-size:1rem}}.add-lesson-form .row{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:8px;margin:8px 0}.add-lesson-form .row label.block{font-weight:600;margin:0}.add-lesson-form .row input,.add-lesson-form .row select{width:100%}.add-lesson-form .actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px;flex-wrap:wrap}@media (max-width: 640px){.add-lesson-form .row{grid-template-columns:1fr;gap:4px}.add-lesson-form .actions{justify-content:stretch}.add-lesson-form .actions button{flex:1 1 auto}}.reader .sentence{display:block;position:relative;margin:0 0 .45em}.reader .sentence-marker{display:inline-block;width:18px;min-width:18px;height:1em;min-height:0;margin-right:4px;padding:0;border:0;background:transparent;color:var(--text-muted);opacity:.35;font-size:.85em;line-height:1;text-align:center;vertical-align:baseline;cursor:pointer;border-radius:3px}.reader .sentence-marker:hover,.reader .sentence.is-playing .sentence-marker{opacity:1;color:var(--primary)}.reader .is-playing:after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;background:var(--primary);border-radius:2px;z-index:2;pointer-events:none}.reader-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 0;margin:8px 0;position:sticky;top:0;background:var(--bg);z-index:2}.phase-steps{list-style:none;padding:0;margin:12px 0;display:flex;flex-direction:column;gap:4px;color:var(--text-muted)}.phase-steps li:before{content:"○ ";color:var(--text-muted)}.phase-steps li.done:before{content:"● ";color:var(--primary)}.phase-steps li.done{color:var(--text)}.filters{margin:8px 0}.filters summary{cursor:pointer;-webkit-user-select:none;user-select:none;padding:4px 0}.filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 16px;margin-top:8px;padding:10px 12px;border:1px solid var(--border);border-radius:6px;background:var(--surface);font-size:.9rem}.filter-grid h4{margin:0 0 4px;font-size:.7rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}.filter-grid label.check{display:flex;align-items:center;gap:6px;line-height:1.3;padding:1px 0}.filter-grid label.check input[type=checkbox],.filter-grid label.check input[type=radio]{margin:0;min-height:0}.filter-grid input[type=date]{min-height:26px;padding:2px 6px;font-size:.85rem}.preset-row{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.preset-row button{font-size:.8rem;padding:2px 8px;min-height:24px}.pager{display:flex;gap:8px;align-items:center;margin:16px 0}td .row-actions{display:flex;gap:6px;align-items:center}td .row-actions button.icon{font-size:1rem;line-height:1;padding:0;width:32px;height:32px;min-height:0;display:inline-flex;align-items:center;justify-content:center}td .row-actions .danger{color:var(--error-fg);border-color:var(--error-border)}td .row-actions .danger:hover:not(:disabled){background:var(--error-bg)}.archive-prompt{position:sticky;bottom:0;display:flex;align-items:center;gap:12px;margin-top:16px;padding:10px 14px;background:color-mix(in srgb,var(--primary) 18%,var(--surface));border:1px solid var(--border);border-radius:6px}.archive-prompt span{flex:1}
