:root{--bg:#0e0e13;--panel:#1a1a22;--text:#e9e8ee;--text-dim:#9b98a8;--border:#2c2c38;--accent:#ff7a45;--accent-dim:#ff7a4526;--danger:#ff6b6b;--card-bg:#fff;--card-text:#1c1c22;--card-text-dim:#6b6875;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{background:var(--bg);min-height:100svh;margin:0}#root{flex-direction:column;align-items:center;min-height:100svh;display:flex}button{font:inherit;cursor:pointer}input,select{font:inherit}.icon-btn{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;display:inline-flex}.icon-btn.starred{color:var(--accent)}.link-btn{color:var(--accent);background:0 0;border:none;padding:0;text-decoration:underline}.btn-primary{background:var(--accent);color:#1c1006;border:none;border-radius:10px;padding:12px 20px;font-weight:600}.btn-primary:disabled{opacity:.5;cursor:default}.btn-ghost{border:1px solid var(--border);color:var(--text);background:0 0;border-radius:10px;padding:12px 20px}.error-banner{color:var(--danger);background:#ff6b6b1f;border:1px solid #ff6b6b66;border-radius:10px;padding:10px 14px;font-size:14px}.muted{color:var(--card-text-dim)}.home-screen{flex-direction:column;justify-content:center;gap:20px;width:100%;max-width:480px;min-height:100svh;padding:32px 24px;display:flex;position:relative}.settings-fab{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:50%;width:40px;height:40px;font-size:18px;position:absolute;top:20px;right:20px}.home-hero h1{letter-spacing:-.5px;margin:0 0 8px;font-size:34px}.home-tagline{color:var(--text-dim);margin:0;font-size:15px}.notice{background:var(--accent-dim);color:var(--accent);border:1px solid #ff7a4559;border-radius:10px;padding:10px 14px;font-size:14px}.home-form{gap:10px;display:flex}.home-form input{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:10px;flex:1;padding:12px 14px}.home-hint{color:var(--text-dim);margin:0;font-size:13px}.paste-screen{justify-content:flex-start;padding-top:72px}.back-fab{position:absolute;top:20px;left:20px}.paste-steps{color:var(--text-dim);margin:0;padding-left:20px;font-size:14px;line-height:1.7}.paste-steps a{color:var(--accent)}.paste-textarea{background:var(--panel);border:1px solid var(--border);color:var(--text);resize:vertical;border-radius:10px;padding:12px 14px;font-family:ui-monospace,Consolas,monospace;font-size:13px}.paste-preview-note{color:var(--text-dim);font-size:13px}.study-screen{flex-direction:column;gap:16px;width:100%;max-width:480px;min-height:100svh;padding:16px 16px 24px;display:flex}.study-topbar{align-items:center;gap:12px;display:flex}.progress-track{background:var(--panel);border-radius:999px;flex:1;height:6px;overflow:hidden}.progress-fill{background:var(--accent);height:100%;transition:width .2s}.progress-label{color:var(--text-dim);white-space:nowrap;font-size:13px}.card{background:var(--card-bg);border-radius:20px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 20px 40px #00000059}.card-media{background-position:50%;background-size:cover;height:220px;position:relative}.card-media-overlay{background:linear-gradient(#00000026 0%,#000000bf 100%);position:absolute;inset:0}.card-media-title{color:#fff;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 4px #00000080;font-size:13px;font-weight:600;position:absolute;bottom:14px;left:16px;right:16px;overflow:hidden}.card-body{color:var(--card-text);flex-direction:column;gap:14px;padding:20px;display:flex}.card-sentence-row{align-items:flex-start;gap:12px;display:flex}.card-sentence{flex:1;font-size:22px;font-weight:600;line-height:1.6}.card-sentence ruby rt{color:var(--card-text-dim);font-size:12px;font-weight:400}.card-sentence-actions{flex-direction:column;gap:8px;display:flex}.card-sentence-actions .icon-btn{width:34px;height:34px;color:var(--card-text);background:#f4f3f6;border-color:#eceaee;font-size:15px}.card-translation{color:var(--card-text-dim);font-size:15px}.card-error{color:#c0392b;font-size:14px}.card-tabs{border-bottom:1px solid #ece9ee;gap:8px;display:flex}.card-tabs button{color:var(--card-text-dim);background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:8px 4px 12px;font-size:14px;font-weight:600}.card-tabs button.active{color:var(--accent);border-bottom-color:var(--accent)}.card-tab-content{color:var(--card-text);min-height:48px;font-size:14px;line-height:1.6}.card-tab-content p{margin:0 0 8px}.card-tab-content p:last-child{margin-bottom:0}.controls-row{justify-content:center;align-items:center;gap:14px;display:flex}.ctrl-btn{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:18px;display:inline-flex}.ctrl-btn:disabled{opacity:.35}.ctrl-btn.play-btn{background:var(--accent);border-color:var(--accent);color:#1c1006;width:60px;height:60px;font-size:22px}.mic-btn.recording{background:var(--danger);border-color:var(--danger);color:#fff}.mic-btn.ready{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.yt-player-preview{border:1px solid var(--border);border-radius:10px;width:120px;height:68px;position:fixed;bottom:14px;right:14px;overflow:hidden;box-shadow:0 8px 20px #00000080}.modal-overlay{z-index:10;background:#0009;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{background:var(--panel);border:1px solid var(--border);border-radius:16px;flex-direction:column;gap:16px;width:100%;max-width:400px;padding:24px;display:flex}.modal h2{margin:0}.field{flex-direction:column;gap:6px;font-size:14px;display:flex}.field input,.field select{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:10px 12px}.field small{color:var(--text-dim);font-size:12px}.field small a{color:var(--accent)}.modal-actions{justify-content:flex-end;gap:10px;display:flex}