.video-section{position:relative;background:#000;display:flex;align-items:center;justify-content:center;padding:16px 0}.video-top-controls{position:absolute!important;top:0;left:0;right:0;background:linear-gradient(to bottom,rgba(0,0,0,.8),transparent);padding:12px 20px;display:flex;align-items:center;justify-content:space-between;z-index:10}.video-bottom-controls{position:absolute!important;left:0;right:0;bottom:0;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:8px;z-index:10}.video-canvas{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.video-canvas .subtitle-overlay{position:absolute;bottom:var(--subtitle-baseline, 12%);left:50%;transform:translate(-50%);text-align:center;z-index:5;pointer-events:auto;display:flex;flex-direction:column;align-items:center;max-width:92%}.subtitle-overlay-original{display:block;white-space:normal;text-wrap:balance;max-width:100%;font-size:clamp(16px,2.2vw,26px)}.subtitle-overlay-translation{display:block;max-width:100%;font-size:clamp(14px,2vw,22px)}.video-section:fullscreen .subtitle-overlay{bottom:var(--subtitle-baseline-full, 10%)}.dict-popup{position:absolute;right:24px;bottom:80px;max-width:360px;max-height:55%;overflow:auto;background:#fff;color:#111;padding:16px;border-radius:12px;box-shadow:0 10px 30px #0000003d;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:11}.dict-popup::-webkit-scrollbar{width:6px;height:6px}.dict-popup::-webkit-scrollbar-track{background:transparent}.dict-popup::-webkit-scrollbar-thumb{background:#0000002e;border-radius:4px}.dict-popup{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.18) transparent}.dict-popup-header{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.dict-popup-title{font-size:21px;font-weight:700;line-height:1.3;color:#111}.dict-popup-phonetic{font-size:16px;color:#555;font-weight:600}.dict-popup-phonetic-row{display:flex;align-items:center;gap:8px}.dict-ipa-label{color:#555;font-weight:700}.dict-ipa{color:#555}.dict-speak-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;color:#666;width:28px;height:28px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.dict-speak-btn:hover{background:#0000000f;color:#333}.dict-speak-btn:disabled{color:#bbb;cursor:not-allowed}.dict-speak-icon{width:16px;height:16px;display:block}.dict-popup-tip{font-size:12px;color:#888;margin-top:4px}.dict-popup-loading{opacity:.9;margin-bottom:6px}.dict-popup-list{display:grid;gap:6px}.dict-popup-list-item{line-height:1.6;font-size:14.5px;color:#333}.dict-popup-empty{opacity:.9}.dict-popup-subtitle{font-size:13px;margin-bottom:4px;font-weight:700;color:#111}.dict-popup-example{margin-bottom:6px}.dict-popup-example-en{font-weight:600;color:#111}.dict-popup-example-zh{color:#555}.dict-popup-actions{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:10px}.dict-popup-link{color:#2563eb;text-decoration:none}:root{--bg: #F8FAFC;--card: #FFFFFF;--text: #1E293B;--text-secondary: #475569;--muted: #64748B;--primary: #2563EB;--primary-hover: #1D4ED8;--primary-weak: rgba(37,99,235,.08);--success: #06D6A0;--border: #E2E8F0;--practice-bg: #12171f;--practice-surface: rgba(255,255,255,.04);--practice-border: rgba(255,255,255,.08);--practice-radius: 14px;--practice-accent: #22c55e;--practice-accent-2: #0ea5e9;--practice-accent-3: #f59e0b}body.theme-dark-edu{--bg: #0b1220;--card: #0f172a;--text: #e2e8f0;--text-secondary: #94a3b8;--muted: #94a3b8;--primary: #7c9cff;--primary-hover: #6b8bd6;--primary-weak: rgba(124, 156, 255, .1);--success: #06D6A0;--border: #1f2b4a}body.theme-dark-minimal{--bg: #0d1117;--card: #0f141a;--text: #c9d1d9;--text-secondary: #8b949e;--muted: #6e7681;--primary: #7c9cff;--primary-hover: #6b8bd6;--primary-weak: rgba(124, 156, 255, .08);--success: #06D6A0;--border: #20252d}body.theme-dark{--bg: #252b36;--card: #343b47;--text: #ffffff;--text-secondary: #e8eef7;--muted: #d8e0ea;--primary: #81a1c1;--primary-hover: #5e81ac;--primary-weak: rgba(94, 129, 172, .22);--success: #a3be8c;--border: #6a7a90}body.theme-dark .brand-title{color:var(--text)}body.theme-dark .tab-btn{color:var(--text-secondary)}body.theme-dark .tab-btn.active{color:var(--text)}body.theme-dark .primary-btn{color:#fff;font-weight:700}body.theme-dark .upload-text{color:var(--text);font-weight:700}body.theme-dark .upload-subtext,body.theme-dark .brand-subtitle{color:var(--text-secondary)}.page-header .brand-title{color:#0b1228;font-weight:800;letter-spacing:.25px}.page-header .header-tabs .tab-btn{color:#0b1228;font-weight:700}.page-header .header-tabs .tab-btn:hover{color:#0b1228}.page-header .header-tabs .tab-btn.active{color:#0b1228;background:#7c9cff3d;box-shadow:0 0 0 1px #7c9cff inset}.page-header .user-chip{color:#0b1228}.page-header .user-email{color:#0b1228;font-weight:700}.page-header .membership-badge{color:#0b57d0;border-color:#0b57d0;background:#0b57d01f}.hero-actions .hint-text{color:#e5edff;font-weight:700;font-size:15px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";background:linear-gradient(180deg,var(--primary-weak),var(--bg) 240px);color:var(--text);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{height:100vh;display:flex;flex-direction:column}.upload-page{max-width:1200px;margin:0 auto;padding:16px 24px;min-height:100vh;display:flex;flex-direction:column;justify-content:flex-start}.page-title{margin:8px 0 20px;font-size:36px;font-weight:800;letter-spacing:.6px;color:var(--primary-hover)}.page-header{position:sticky;top:0;background:var(--primary-weak);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid var(--border);box-shadow:0 1px 0 var(--border),0 6px 12px #2563eb14;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:12px 24px;margin:-24px -24px 16px}.brand{display:flex;align-items:center;gap:10px}.brand-title{font-size:22px;font-weight:800;color:var(--text);letter-spacing:.2px}.brand-subtitle{font-size:12px;font-weight:700;color:var(--primary);background:var(--primary-weak);border:1px solid var(--primary);border-radius:999px;padding:4px 10px}.tab-nav,.header-tabs{display:flex;gap:16px;border-bottom:1px solid var(--border);margin-bottom:16px;align-items:center;flex-wrap:wrap}.tab-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;color:var(--muted);padding:12px 8px;cursor:pointer;font-size:14px;position:relative;border-radius:8px;font-weight:600}.tab-btn:hover{color:var(--text-secondary);background:var(--primary-weak)}.tab-btn.active{color:var(--text);background:var(--primary-weak);box-shadow:0 0 0 1px var(--primary) inset}.header-actions{margin-left:auto;display:flex;align-items:center}.header-action-btn{padding:12px;border:1px solid var(--primary);background:linear-gradient(180deg,var(--primary),var(--primary-hover));color:#fff;border-radius:10px;font-size:14px;font-weight:600;box-shadow:0 2px 8px #2563eb40;cursor:pointer}.header-action-btn:hover{background:linear-gradient(180deg,var(--primary-hover),var(--primary-hover));border-color:var(--primary-hover);transform:translateY(-1px);box-shadow:0 8px 18px #1d4ed84d}@media (max-width: 1024px){.header-actions{order:2;margin-left:auto}.header-tabs{order:3;width:100%;margin-top:6px}}.section-title{font-size:18px;margin:0 0 12px}.section-desc{color:var(--text-secondary);font-size:14px;margin:0}.field-label{font-size:15px;color:var(--text);display:block;margin-bottom:8px;font-weight:600}.ted-input-row{display:flex;gap:12px;align-items:center}.ted-url-input{flex:1;border:1px solid var(--border);border-radius:10px;padding:14px;font-size:16px;color:var(--text);background:var(--card)}.ted-url-input:focus{outline:2px solid var(--primary-weak);border-color:var(--primary)}.primary-btn{padding:12px 18px;border:1px solid var(--primary);background:linear-gradient(180deg,var(--primary),var(--primary-hover));color:#fff;border-radius:10px;font-size:15px;font-weight:600;box-shadow:0 2px 8px #2563eb40}.primary-btn:disabled{opacity:.6;cursor:not-allowed}.primary-btn:not([disabled]):hover{background:linear-gradient(180deg,var(--primary-hover),var(--primary-hover));border-color:var(--primary-hover);transform:translateY(-1px);box-shadow:0 8px 18px #1d4ed84d}.ted-card-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.ted-card{display:block;border:1px solid var(--border);border-radius:12px;padding:18px;text-decoration:none;color:inherit;background:#fff;transition:box-shadow .15s ease,transform .05s ease,border-color .15s ease}.ted-card:hover{box-shadow:0 6px 16px #00000014;border-color:#cbd5e1;transform:translateY(-1px)}.ted-card-title{font-weight:700;font-size:18px;color:#111827;margin-bottom:6px}.ted-card-meta{color:#374151;font-size:14px}.ted-card-tags{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap}.tag{font-size:12px;color:#1f2937;background:#eef2ff;border:1px solid #c7d2fe;border-radius:999px;padding:3px 10px}.copyright-note{margin-top:12px;padding-top:12px;border-top:1px solid var(--border);color:#6b7280;font-size:12px}@media (min-width: 1440px){.upload-page{max-width:1400px}}@media (max-width: 640px){.page-title{font-size:26px}.ted-url-input{font-size:15px;padding:12px}.primary-btn{padding:10px 16px;font-size:14px}}.tab-content{animation:fadeIn .18s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.section{margin:12px 0 20px}.section-title{font-size:16px;color:#e2e8f0;margin-bottom:10px}.section-desc{font-size:14px;color:#cbd5e1}.ted-input-row{display:flex;gap:10px;margin-top:10px}.ted-url-input{flex:1;padding:10px 12px;border-radius:8px;border:1px solid #334155;background:#0f172a;color:#e2e8f0}.ted-url-input::placeholder{color:#64748b}.ted-card-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.ted-card{display:flex;align-items:center;gap:12px;text-decoration:none;border:1px solid #334155;border-radius:10px;padding:12px;background:#0b1220;cursor:pointer}.ted-card:hover{border-color:#475569;background:#0e1626}.ted-card-cover{width:48px;height:48px;display:grid;place-items:center;border-radius:8px;background:#1f2937;color:#e2e8f0}.ted-card-body{display:flex;flex-direction:column}.ted-card-title{color:#e5e7eb;font-weight:600}.ted-card-meta{color:#94a3b8;font-size:12px}.disclaimer{margin-top:8px;color:#94a3b8;font-size:12px;display:flex;gap:6px;align-items:center}.copyright-notice{position:absolute;left:12px;bottom:12px;background:#00000073;color:#e5e7eb;padding:6px 10px;border-radius:8px;font-size:12px}.copyright-notice a{color:#7c9cff}.upload-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}.upload-slot{display:grid;align-content:start;gap:6px}.upload-card{display:grid;gap:6px;align-content:center;justify-items:center;padding:20px;min-height:130px;background:var(--card);border:1px solid var(--border);border-radius:12px;color:var(--text);cursor:pointer;box-shadow:0 2px 8px #1e293b0f;transition:border-color .2s ease,background .2s ease,transform .06s ease,box-shadow .2s ease}.upload-card input[type=file]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.upload-card:hover,.upload-card:focus-visible{border-color:var(--primary);background:var(--primary-weak);box-shadow:0 6px 16px #2563eb29;transform:translateY(-1px)}.upload-card:active{transform:scale(.997)}.upload-icon{font-size:36px;color:var(--primary)}.upload-text{font-weight:600}.upload-subtext{color:var(--text-secondary);font-size:14px}.upload-hint{color:#ffc857;font-size:13px;font-style:italic;margin-top:4px}.selected-file{margin-top:-8px;margin-bottom:8px;color:var(--muted);font-size:14px;display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.actions{margin-top:20px;position:sticky;bottom:16px;z-index:100;display:flex;align-items:center;gap:12px;background:linear-gradient(180deg,transparent,var(--bg) 60%);padding:12px 16px;border-top:1px solid var(--border);border-radius:12px}.tab-content{padding-bottom:90px}.primary-btn{padding:10px 16px;border:1px solid var(--border);background:#1c2846;color:#fff;border-radius:8px;display:inline-block;text-decoration:none}.actions .primary-btn{color:#fff!important;font-weight:700;text-shadow:0 1px 0 rgba(0,0,0,.35);background:#1c2846!important}.actions .primary-btn:disabled,.actions .primary-btn[disabled]{color:#fff!important;opacity:1}.actions .hint-text{margin-left:12px;color:#ffc857;font-size:14px}.primary-btn[disabled]{opacity:.9;cursor:not-allowed;color:#fff}.primary-btn:not([disabled]){border-color:var(--primary);background:linear-gradient(180deg,#7c9cff38,#7c9cff14);box-shadow:0 0 0 1px #7c9cff40 inset,0 6px 18px #7c9cff26;color:#fff}.primary-btn:not([disabled]):hover{filter:brightness(1.03)}.disabled-link{pointer-events:none;opacity:.6}.player-page{display:grid;gap:16px}.player-main{display:flex;gap:16px}.video-area{flex:7;background:#0e1630;border:1px solid var(--border);border-radius:12px;padding:12px}.video{width:100%;height:420px;background:#000;border-radius:8px}.current-caption{margin-top:10px;font-size:24px;line-height:1.4;text-shadow:0 2px 6px rgba(0,0,0,.6)}.control-panel{flex:3;border:1px solid var(--border);border-radius:12px;padding:12px;background:#ffffff08;display:grid;gap:12px;align-content:start}.panel-section{border:1px dashed var(--border);border-radius:10px;padding:10px}.panel-title{margin:0 0 8px;font-size:16px;color:var(--muted)}.btn-row{display:flex;gap:8px;flex-wrap:wrap}.ctrl-btn{padding:8px 12px;border:1px solid var(--border);background:#1c2846;color:var(--text);border-radius:8px;cursor:pointer}.ctrl-btn:hover{border-color:var(--primary);background:#7c9cff24}.recording-indicator{display:flex;align-items:center;gap:6px;color:#ff6b6b;font-size:14px;margin-top:6px}.recording-indicator .dot{width:10px;height:10px;background:#ff4d4f;border-radius:50%;animation:pulse 1s infinite;display:inline-block}.caption-list{max-height:180px;overflow:auto;border:1px solid var(--border);border-radius:12px;padding:8px;background:#0003}.caption-item{padding:6px 8px;border-radius:6px}.caption-item:hover{background:#ffffff0d}.caption-item.active{background:#7c9cff2e;border:1px solid rgba(124,156,255,.35)}.score-box{padding:12px;border-radius:8px;border:1px solid var(--border);background:#0e1630;font-size:24px;text-align:center}.player-container{display:flex;height:100vh;height:100dvh;background:var(--bg)}.left-panel{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;width:100%}.video-section{position:relative;background:#000;flex:1;display:flex;align-items:center;justify-content:center;padding:16px 0;min-height:0}.video-canvas{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin:0}.video-top-controls{position:absolute;top:0;left:0;right:0;background:linear-gradient(to bottom,rgba(0,0,0,.8),transparent);padding:12px 0;display:flex;align-items:center;justify-content:space-between;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10}.top-controls-left{display:flex;align-items:center;gap:12px}.top-controls-center{flex:1;display:flex;justify-content:center;margin:0}.top-controls-right{display:flex;align-items:center;gap:8px}.subtitle-toolbar{display:flex;align-items:center;gap:8px;margin-top:8px}.current-time,.total-time{color:#fff;font-size:14px;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.5)}.progress-container{width:100%;max-width:none}.video-progress-slider{width:100%;height:4px;background:#ffffff4d;border-radius:2px;outline:none;cursor:pointer}.video-progress-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:#7c9cff;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0000004d}.video-progress-slider::-moz-range-thumb{width:16px;height:16px;background:#7c9cff;border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 4px #0000004d}.top-control-btn{background:transparent;color:#fff;border:none;padding:10px;border-radius:6px;cursor:pointer;font-size:18px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.top-control-btn:hover{background:#ffffff1a}.video-bottom-controls{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);padding:12px 0;display:flex;align-items:center;justify-content:space-between;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;transition:opacity .2s ease}.bottom-controls-left,.bottom-controls-center,.bottom-controls-right{display:flex;align-items:center;gap:8px}.bottom-control-btn{background:#ffffff14;color:#fff;border:1px solid rgba(255,255,255,.18);padding:10px 16px;border-radius:10px;cursor:pointer;font-size:16px;font-weight:600;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;white-space:nowrap;min-width:48px;height:48px;display:flex;align-items:center;justify-content:center;box-shadow:0 1px #00000059 inset}.bottom-control-btn:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 0 0 1px #ffffff38 inset,0 6px 16px #00000040}.bottom-control-btn:active{transform:translateY(0);filter:brightness(.98)}.bottom-control-btn.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 0 0 1px #ffffff47 inset,0 8px 24px #2563eb47}.center-play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;background:#000000b3;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.3);z-index:10}.center-play-button:hover{background:#000c;transform:translate(-50%,-50%) scale(1.1);border-color:#ffffff80}.play-button-icon{font-size:32px;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5)}.subtitle-overlay{position:absolute;bottom:var(--subtitle-baseline, 12%);left:50%;transform:translate(-50%);text-align:center;z-index:5;pointer-events:auto;max-width:92%}.video-section.controls-visible .subtitle-overlay,.video-section.controls-visible.mode-both .subtitle-overlay{bottom:var(--subtitle-baseline, 12%)}.video-section:fullscreen.controls-visible .subtitle-overlay{bottom:var(--subtitle-baseline, 12%)}.video-section:fullscreen.controls-visible.mode-both .subtitle-overlay{bottom:var(--subtitle-baseline, 12%)}.subtitle-overlay-original{color:#ffeb3b;font-size:26px;line-height:1.5;white-space:normal;text-wrap:balance;max-width:100%;display:inline-block;text-shadow:0 0 2px #000,0 0 4px #000,0 2px 6px rgba(0,0,0,.85)}.subtitle-overlay-translation{color:#fff;opacity:.95;font-size:20px;max-width:100%;display:inline-block;overflow-wrap:anywhere;text-shadow:0 1px 3px rgba(0,0,0,.6)}.subtitle-word{cursor:pointer;padding:2px 3px;border-radius:4px;pointer-events:auto}.subtitle-word:hover{background:#ffffff26}.translate-popup{position:fixed;transform:translate(-50%,-120%);background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:10px 12px;box-shadow:0 10px 24px #2563eb1f;max-width:280px;font-size:14px}.control-popup{position:absolute;left:50%;bottom:72px;transform:translate(-50%);background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px 12px;box-shadow:0 10px 24px #2563eb1f;display:grid;gap:8px;z-index:20;min-width:160px}.popup-title{font-size:13px;color:var(--muted)}.menu-item{background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:6px 10px;cursor:pointer}.menu-item:hover{border-color:var(--primary);background:var(--primary-weak)}.menu-item.selected{border-color:var(--primary);background:var(--primary-weak);box-shadow:0 0 0 1px var(--primary) inset}.inline-slider{width:120px;height:4px;background:#ffffff4d;border-radius:2px}.inline-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;background:#7c9cff;border-radius:50%}.inline-slider::-moz-range-thumb{width:12px;height:12px;background:#7c9cff;border-radius:50%;border:none}.right-panel{width:320px;min-width:320px;border-left:1px solid var(--border);display:flex;flex-direction:column;background:#0003;flex-shrink:0}.subtitle-list-section{display:flex;flex-direction:column;height:100%}.section-header{padding:16px;border-bottom:1px solid var(--border);background:#ffffff08;flex-shrink:0}.section-header h3{margin:0 0 8px;font-size:16px;color:var(--text);font-weight:600}.subtitle-stats{display:flex;flex-direction:column;gap:4px}.subtitle-stats span{font-size:12px;color:var(--muted)}.subtitle-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:6px;padding:8px}.subtitle-item{padding:12px 16px;border-radius:8px;cursor:pointer;display:flex;gap:12px;align-items:flex-start;transition:all .2s ease;border:1px solid transparent;margin-bottom:2px}.subtitle-item:hover{background:#ffffff0d;border-color:#ffffff1a;transform:translate(2px)}.subtitle-item.active{background:#e3f2fd;border-left:3px solid #2196f3;transform:translate(4px);box-shadow:0 2px 8px #2196f333}.subtitle-time{font-size:12px;color:var(--muted);min-width:60px;font-family:monospace;margin-top:2px;font-weight:500}.subtitle-content{flex:1;display:flex;flex-direction:column;gap:4px}.subtitle-original{font-size:14px;line-height:1.4;color:var(--text);font-weight:500}.subtitle-translation{font-size:12px;line-height:1.3;color:var(--muted);font-style:italic}.control-btn{padding:8px 12px;border:1px solid var(--border);background:#1c2846;color:var(--text);border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:13px}.control-btn:hover{border-color:var(--primary);background:#7c9cff24;transform:translateY(-1px)}.primary-btn{border-color:var(--primary);background:#7c9cff1a}.secondary-btn{border-style:dashed}.btn-row{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}.hint-text{font-size:12px;color:var(--muted);margin:4px 0;line-height:1.4}.recording-indicator{display:flex;align-items:center;gap:6px;color:#ff6b6b;font-size:12px;margin-top:8px}.recording-dot{width:8px;height:8px;background:#ff4d4f;border-radius:50%;animation:pulse 1s infinite}@keyframes pulse{0%{opacity:.4}50%{opacity:1}to{opacity:.4}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{width:min(560px,92vw);background:#0e1630;border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:0 12px 40px #00000073}.subtitle-options{display:grid;gap:10px;margin-top:12px}.track-option-btn,.external-subtitle-btn{text-align:left}.subtitle-choice-btn{margin-top:8px}.player-container{display:flex;gap:16px;height:100dvh;min-height:0;overflow:hidden}.left-panel{flex:3;display:flex;flex-direction:column;gap:16px;min-height:0}.right-panel{flex:1;display:flex;flex-direction:column}.video-section{position:relative;background:#000;border:none;border-radius:12px;display:grid;grid-template-rows:44px minmax(0,1fr) 72px;padding:0;min-height:0}.video-player{width:100%;height:100%;background:#000;border-radius:8px;object-fit:contain}.ted-embed-wrapper{position:relative;width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}.ted-embed{width:100%;height:100%;border:none;transform:scale(var(--ted-zoom, 2));transform-origin:center center}.video-section:fullscreen .ted-embed{transform:scale(1)}.video-section.embed-mode{display:grid!important;grid-template-rows:0 minmax(0,1fr) 0;padding:0!important}.practice-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;padding:16px;z-index:10000}.practice-modal{width:520px;max-width:92vw;max-height:84vh;overflow-y:auto;background:var(--card);color:var(--text);border-radius:12px;box-shadow:0 12px 28px #2563eb1f;border:1px solid var(--border);padding:16px 18px}.practice-header{display:flex;align-items:center;justify-content:space-between}.practice-title{font-size:16px;font-weight:700;color:var(--primary-hover)}.practice-close{background:transparent;color:var(--muted);border:none;font-size:18px;cursor:pointer}.practice-steps{display:flex;align-items:center;gap:8px;margin:8px 0;color:var(--muted)}.practice-steps .step-index{font-weight:700;background:var(--primary-weak);border:1px solid var(--border);border-radius:999px;padding:2px 8px;font-size:12px;color:var(--text)}.practice-steps .step-label{font-size:12px}.practice-target{margin:6px 0 8px;padding:8px 10px;background:var(--card);border:1px solid var(--border);border-radius:8px;font-size:14px;overflow-wrap:anywhere;cursor:pointer}.practice-recorder{margin-top:6px}.practice-wave{width:100%;height:48px;background:var(--primary-weak);border:1px solid var(--border);border-radius:8px}.practice-actions{display:flex;align-items:center;gap:8px;margin-top:8px}.practice-btn{padding:6px 10px;border-radius:8px;border:1px solid var(--border);background:var(--primary-weak);color:var(--text);cursor:pointer}.practice-btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}.practice-btn.danger{background:#ef4444;border-color:#ef4444}.practice-duration{color:var(--muted);font-size:13px}.practice-error{margin-top:8px;color:#ef4444;font-size:13px}.practice-section-title{margin-top:8px;margin-bottom:4px;font-weight:600;color:var(--text);font-size:14px}.practice-transcript{padding:8px 10px;background:var(--card);border:1px solid var(--border);border-radius:8px;font-size:14px;min-height:42px}.score-row{display:grid;grid-template-columns:72px 1fr 56px;align-items:center;gap:6px;margin:6px 0}.score-label{color:var(--muted);font-size:13px}.score-bar{height:8px;background:var(--primary-weak);border-radius:999px;overflow:hidden}.score-fill{height:100%;width:0%;background:var(--practice-accent);border-radius:999px;transition:width .3s ease}.practice-overall{margin-top:6px;font-size:15px}.practice-suggestions ul{margin:0;padding-left:18px;color:var(--muted)}.practice-suggestions li{font-size:12px;line-height:1.4}.practice-footer{margin-top:16px;display:flex;justify-content:flex-end}.practice-audio{width:100%;height:30px;background:var(--primary-weak);border:1px solid var(--border);border-radius:8px}.diff-ok{margin-right:4px}.practice-transcript .attempt-line{margin-top:6px}.diff-bad{background:#ef444440;color:#fff;border-radius:4px;padding:0 2px;margin-right:4px}.diff-miss-inline{color:#94a3b8;font-size:12px;margin-top:4px}.collapse-arrow{cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center}.video-canvas{grid-row:2;position:relative;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0;width:100%;height:100%;margin:0}.video-section.hardsub-safe .video-canvas{padding-bottom:var(--subtitle-safe-area, 12%);box-sizing:border-box}.video-section:fullscreen.hardsub-safe .video-canvas{padding-bottom:var(--subtitle-safe-area-full, 8%)}.current-subtitle-section{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;min-height:120px}.original-text{font-size:24px;line-height:1.5;margin-bottom:8px;color:var(--text);font-weight:500}.translation-text{font-size:18px;line-height:1.4;color:var(--muted);opacity:.9}.subtitle-list-section{background:#0e1630;height:100%;border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden}.section-header{background:#1b2235;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.08)}.section-header h3{margin:0 0 4px;font-size:16px;color:#a3e635}.subtitle-stats{display:flex;gap:16px;font-size:12px;color:#cbd5e1}.subtitle-list{height:calc(100% - 60px);overflow-y:auto;background:#222831}.subtitle-item{padding:10px 15px;border-bottom:1px solid rgba(255,255,255,.08);cursor:pointer;transition:background-color .2s;display:flex;flex-direction:column;gap:5px}.subtitle-item:hover{background:#ffffff0d}.subtitle-item.active{background:#ffffff0f;border-left:3px solid #7c9cff;padding-left:12px}.no-subtitle-title{color:#fff;font-weight:600}.no-subtitle-desc{color:#fff;opacity:.98}.no-subtitle-extra{color:#fff;opacity:.9}.subtitle-meta{display:flex;align-items:center;gap:10px;font-size:12px}.subtitle-id{color:#a3e635;font-weight:700}.subtitle-timestamp{color:#94a3b8}.subtitle-star{margin-left:auto;color:#e2e8f0;font-size:16px}.subtitle-text-container{display:flex;flex-direction:column;gap:2px;min-width:0}.subtitle-original{font-weight:500;font-size:var(--list-original-size, 14px);color:#ffeb3b}.subtitle-translation{font-size:var(--list-translation-size, 13px);color:#fff;opacity:.9}.subtitle-list .subtitle-original,.subtitle-list .subtitle-translation{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}.subtitle-list::-webkit-scrollbar{width:8px}.subtitle-list::-webkit-scrollbar-track{background:#222831}.subtitle-list::-webkit-scrollbar-thumb{background-color:#555;border-radius:4px;border:2px solid #222831}.video-top-controls{transition:opacity .2s ease}.video-top-controls.hidden,.video-bottom-controls.hidden{opacity:0;pointer-events:none}.video-top-controls.visible,.video-bottom-controls.visible{opacity:1}.video-top-controls{grid-row:1;position:static!important;background:#000;padding:8px 0;display:flex;align-items:center;justify-content:space-between;z-index:10}.video-bottom-controls{grid-row:3;position:static!important;background:#000;padding:10px 0;display:flex;align-items:center;justify-content:space-between;z-index:10}.video-section:fullscreen{padding:0;border:none;border-radius:0;background:#000}.video-section:fullscreen .video-player{width:100vw;height:100vh;border-radius:0;object-fit:contain}.video-section:fullscreen .video-top-controls,.video-section:fullscreen .video-bottom-controls{padding:16px 20px}.video-bottom-controls{justify-content:flex-start!important;gap:8px}.loop-count-badge{background:#ffffff1f;color:#fff;border-radius:12px;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;font-size:12px}.bottom-controls-far-right{margin-left:auto;display:flex;align-items:center;gap:8px}.video-canvas .subtitle-overlay{position:absolute;bottom:var(--subtitle-baseline, 12%);left:50%;transform:translate(-50%);text-align:center;z-index:5;pointer-events:none}.dict-modal-content{width:min(800px,92vw)}.dict-iframe{width:100%;height:65vh;border:1px solid var(--border);border-radius:8px}.ted-page{flex:1;display:flex;flex-direction:column}.ted-page .section{margin:10px 0 18px}.ted-page .ted-card-list{flex:1}.upload-slot{min-height:200px;display:flex;flex-direction:column;gap:8px}.user-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--border);border-radius:999px;background:#ffffff14;color:var(--text);font-size:14px;font-weight:600;box-shadow:0 2px 8px #00000026;cursor:pointer}.user-email{color:var(--text);font-weight:700;letter-spacing:.2px}.membership-badge{background:var(--primary-weak);color:var(--primary);border:1px solid var(--primary);border-radius:999px;padding:2px 8px;font-size:12px;font-weight:700}.membership-badge.member{color:#10b981;border-color:#10b981;background:#10b98126}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.auth-card{width:min(520px,92vw);border:1px solid var(--border);border-radius:16px;background:var(--card);box-shadow:0 10px 28px #2563eb1f;padding:24px}.auth-title{margin:0 0 6px;font-size:24px;font-weight:800;color:var(--text)}.auth-subtitle{margin:0 0 16px;color:var(--text-secondary)}.auth-form{display:grid;gap:10px}.auth-input{border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-size:14px;color:var(--text);background:var(--card)}.auth-input:focus{outline:2px solid var(--primary-weak);border-color:var(--primary)}.auth-error{color:#ef4444;font-size:13px}.auth-divider{display:flex;align-items:center;gap:8px;margin:12px 0;color:var(--muted)}.auth-divider:before,.auth-divider:after{content:"";flex:1;border-top:1px solid var(--border)}.google-btn{width:100%;padding:12px 14px;border-radius:10px;border:1px solid #d1d5db;background:#fff;color:#111827;font-weight:600;cursor:pointer}.google-btn:hover{background:#f9fafb}.auth-footer{margin-top:10px;color:var(--muted);display:flex;gap:6px}.link-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;color:var(--primary);cursor:pointer}.player-container{gap:16px}.left-panel{flex:1 1 auto;min-width:0}.video-canvas{width:100%;height:100%;margin:0;max-width:100%}.video-player{width:100%;height:100%;max-width:100%;max-height:none;object-fit:contain}@media (min-width: 1440px){.video-canvas{width:100%}}.upload-page .header-actions{position:static;top:auto;right:auto;z-index:10}.home-hero{margin:12px 0 20px;padding:32px 28px;border-radius:16px;background:linear-gradient(180deg,#0b1228,#0e1a3d);border:1px solid rgba(124,156,255,.22);display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:24px}.hero-copy{display:flex;flex-direction:column;gap:14px}.hero-title{font-family:var(--font-display, ui-sans-serif);font-weight:800;letter-spacing:.4px;font-size:clamp(24px,4vw,40px);line-height:1.15;color:#e5edff}.hero-title.brand{display:flex;align-items:center;gap:12px}.duck-logo{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center}.duck-logo img,.duck-logo-img{display:block;width:48px;height:48px;object-fit:cover;border-radius:50%;box-shadow:0 2px 8px #00000026}.duck-logo .duck-svg{display:block}.hero-desc{color:#9fb1ff;font-size:clamp(14px,2.1vw,18px);opacity:.9}.hero-actions{display:flex;gap:12px;align-items:center}.hero-primary{padding:12px 18px;border-radius:12px;border:1px solid #7c9cff;background:#7c9cff;color:#0b1228;font-weight:700;cursor:pointer}.hero-secondary{padding:12px 18px;border-radius:12px;border:1px solid #7c9cff;background:transparent;color:#e5edff;font-weight:700;cursor:pointer}.hero-visual{height:clamp(160px,26vh,220px);border-radius:12px;background:radial-gradient(120px 120px at 18% 30%,rgba(124,156,255,.35) 0%,transparent 60%),radial-gradient(160px 160px at 78% 68%,rgba(34,197,94,.25) 0%,transparent 60%),#0b1228;border:1px solid rgba(124,156,255,.22)}.app-toast{position:fixed;left:50%;top:20px;transform:translate(-50%);background:#141828e6;color:#fff;border:1px solid var(--border);border-radius:10px;padding:10px 14px;box-shadow:0 12px 24px #00000059;z-index:2000}.app-toast.warning{border-color:#f59e0b}.app-toast.error{border-color:#ef4444}.app-toast.success{border-color:#22c55e}.app-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:1000}.app-modal{width:min(520px,92vw);background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:0 12px 40px #00000059}.app-modal-title{font-size:18px;font-weight:700;margin-bottom:8px}.app-modal-message{font-size:14px;line-height:1.6;white-space:pre-line}.app-modal-actions{margin-top:12px;display:flex;gap:10px;justify-content:flex-end}