:root{--accent: #ed1c24;--blue: #6aa0f0;--good: #2ec795;--warn: #e8b04a;--bad: #f06a52;--bg: #1d2026;--surface: #262a31;--surface2: #2f343d;--surface3: #3a404b;--border: rgba(255, 255, 255, .1);--border2: rgba(255, 255, 255, .17);--text: #eef0f3;--text-dim: #aab0bb;--text-faint: #767c88;--glow: rgba(237, 28, 36, .06);--font: "Hanken Grotesk", system-ui, -apple-system, sans-serif;--mono: "JetBrains Mono", ui-monospace, monospace;--sticky-top: 78px;--pane-height: calc(100vh - var(--sticky-top) - 40px)}:root[data-theme=light]{--bg: #f4f5f7;--surface: #ffffff;--surface2: #eef0f3;--surface3: #e3e6ec;--border: rgba(0, 0, 0, .1);--border2: rgba(0, 0, 0, .17);--text: #171a1f;--text-dim: #5b616c;--text-faint: #8b909b;--glow: rgba(237, 28, 36, .05)}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}@keyframes fadeUp{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes popIn{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}@keyframes popOut{0%{opacity:1;transform:none}to{opacity:0;transform:scale(.97)}}.anim-in{animation:fadeUp .26s ease both}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}body{min-height:100vh;font-family:var(--font);font-size:14px;color:var(--text);background:radial-gradient(1100px 560px at 84% -14%,var(--glow),transparent 60%),var(--bg);-webkit-font-smoothing:antialiased;transition:background .25s ease,color .25s ease}::selection{background:var(--accent);color:#fff}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--surface3);border-radius:8px;border:3px solid transparent;background-clip:content-box}input,select,textarea,button{font-family:inherit}textarea::placeholder,input::placeholder{color:var(--text-faint)}textarea:focus,input:focus,select:focus{outline:none}button:focus-visible,select:focus-visible{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 24px;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bg) 86%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.topbar-side{display:flex;align-items:center;gap:13px;min-width:0}.brand-logo{height:28px;width:auto;display:block}:root[data-theme=dark] .brand-logo.on-light,:root[data-theme=light] .brand-logo.on-dark{display:none}.topbar-rule{width:1px;height:22px;background:var(--border2);flex-shrink:0}.topbar-title{font-size:15px;font-weight:600;color:var(--text-dim);white-space:nowrap}.file-chip{display:flex;align-items:center;gap:8px;max-width:300px;padding:6px 12px;background:var(--surface2);border:1px solid var(--border);border-radius:9px;min-width:0}.file-chip .chip-dot{width:7px;height:7px;border-radius:99px;background:var(--good);flex-shrink:0}#fileChipName{font-family:var(--mono);font-size:12.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:none;border-radius:9px;padding:10px 17px;font-size:14px;font-weight:700;color:#fff;cursor:pointer;transition:filter .15s ease,opacity .15s ease}.btn-accent{background:var(--accent)}.btn-blue{background:var(--blue)}.btn-ghost{background:var(--surface2);border:1px solid var(--border);color:var(--text);transition:border-color .18s ease,background .18s ease,transform .12s ease}.btn-ghost:hover:not(:disabled){filter:none;border-color:var(--border2)}.btn-ghost:active:not(:disabled){transform:translateY(1px)}.btn-blue.off{background:color-mix(in srgb,var(--blue) 16%,transparent);color:var(--blue)}.btn:hover:not(:disabled){filter:brightness(1.08)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-block{width:100%;padding:13px 18px;font-size:14.5px;border-radius:11px}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--border);background:var(--surface2);border-radius:9px;color:var(--text);cursor:pointer;transition:border-color .15s ease,color .15s ease}.icon-btn:hover:not(:disabled){border-color:var(--border2)}.icon-btn:disabled{opacity:.4;cursor:not-allowed}:root[data-theme=dark] #themeBtn .ic-moon,:root[data-theme=light] #themeBtn .ic-sun{display:none}.btn-ic{display:block;flex-shrink:0}#newFileBtn{padding:10px 16px;font-size:14px;gap:7px}.export-wrap{position:relative}#downloadBtn{padding:10px 15px;font-size:14px;gap:8px}.chevron{transition:transform .2s ease}.export-wrap.open .chevron{transform:rotate(180deg)}.export-menu{position:absolute;right:0;top:calc(100% + 8px);width:max-content;min-width:240px;max-width:340px;background:var(--surface);border:1px solid var(--border2);border-radius:12px;padding:7px;box-shadow:0 20px 50px -12px #00000073;z-index:40;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px) scale(.98);transform-origin:top right;transition:opacity .18s ease,transform .18s ease,visibility .18s}.export-wrap.open .export-menu{opacity:1;visibility:visible;pointer-events:auto;transform:none}.export-menu button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;background:transparent;border:none;border-radius:8px;padding:11px 12px;font-size:13.5px;font-weight:600;color:var(--text);cursor:pointer;text-align:left;opacity:0;transform:translateY(-4px);transition:opacity .2s ease,transform .2s ease,background .12s ease}.export-wrap.open .export-menu button{opacity:1;transform:none;transition-delay:var(--d, 0s),var(--d, 0s),0s}.export-menu button:hover{background:var(--surface2)}.export-div{height:1px;background:var(--border);margin:6px 4px}.ex-label{white-space:nowrap}.ex-ext{font-family:var(--mono);font-size:12px;color:var(--text-faint);white-space:nowrap}#copyBtn .icon-check{display:none}#copyBtn.copied{color:var(--good);border-color:var(--good)}#copyBtn.copied .icon-copy{display:none}#copyBtn.copied .icon-check{display:block}.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:15px 16px}select{background:var(--surface2);border:1px solid var(--border);border-radius:9px;color:var(--text);font-size:13.5px;font-weight:600;padding:8px 11px;cursor:pointer;transition:border-color .15s ease}select:hover{border-color:var(--border2)}.settings-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 20px;align-items:end}.setting-group{display:flex;flex-direction:column;gap:8px;min-width:0}.setting-group select{width:100%}.setting-label{font-size:12.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--text-faint)}.setting-field{display:flex;align-items:center;gap:8px}.setting-unit{font-family:var(--mono);font-size:11.5px;color:var(--text-faint)}.stepper{display:flex;align-items:stretch;background:var(--surface2);border:1px solid var(--border);border-radius:9px;overflow:hidden;transition:border-color .15s ease}.stepper:hover{border-color:var(--border2)}.stepper:focus-within{border-color:var(--accent)}#charLimit{width:48px;background:transparent;border:none;color:var(--text);font-family:var(--mono);font-size:13.5px;font-weight:600;padding:8px 0 8px 8px;text-align:center;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}#charLimit::-webkit-inner-spin-button,#charLimit::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}.stepper-btns{display:flex;flex-direction:column;border-left:1px solid var(--border)}.stepper-btns button{flex:1;display:flex;align-items:center;justify-content:center;width:23px;padding:0;border:none;background:transparent;color:var(--text-faint);cursor:pointer;transition:background .12s ease,color .12s ease}.stepper-btns button:hover{background:var(--surface3);color:var(--text)}.stepper-btns button:active{color:var(--accent)}.stepper-btns button:first-child{border-bottom:1px solid var(--border)}.ref-card{display:flex;flex-direction:column;gap:11px}.ref-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.ref-optional{font-family:var(--mono);font-size:11px;color:var(--text-faint)}#referenceText{width:100%;resize:vertical;min-height:84px;background:var(--bg);border:1px solid var(--border);border-radius:11px;padding:12px 13px;font-size:14px;line-height:1.55;color:var(--text);transition:border-color .2s ease,box-shadow .2s ease}#referenceText:focus{border-color:var(--accent)}#referenceText.highlight{border-color:var(--good);box-shadow:0 0 0 3px color-mix(in srgb,var(--good) 20%,transparent)}#workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:24px;padding:22px 24px 40px;max-width:1680px;width:100%;margin:0 auto;align-items:start}.pane-video{display:flex;flex-direction:column;gap:14px;position:sticky;top:var(--sticky-top)}#dropzone{aspect-ratio:16 / 9;min-height:240px;overflow:hidden;border:2px dashed var(--border2);border-radius:18px;background:var(--surface);cursor:pointer;transition:border-color .2s ease,background .2s ease}#dropzone:hover:not(.has-file){border-color:var(--accent)}#dropzone.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--surface))}#dropzone.has-file{border:1px solid var(--border);cursor:default;overflow:hidden;background:#000;box-shadow:0 24px 60px -28px #0009}#fileInput{display:none}#dropContent{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:24px 26px;text-align:center;animation:fadeUp .3s ease both}#dropIcon{width:62px;height:62px;border-radius:16px;background:var(--surface2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-dim);transition:transform .22s ease,border-color .22s ease,color .22s ease}#dropzone:hover:not(.has-file) #dropIcon{transform:translateY(-4px);border-color:var(--accent);color:var(--accent)}#dropLabel{font-size:17px;font-weight:700}#dropHint{font-size:14px;color:var(--text-dim)}#dropHint em{font-style:normal;color:var(--accent);font-weight:700}.format-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.format-chips span{font-family:var(--mono);font-size:11.5px;font-weight:500;color:var(--text-dim);background:var(--surface2);border:1px solid var(--border);padding:4px 8px;border-radius:7px}#videoPreview{width:100%;height:100%;animation:popIn .32s ease both}#videoPreview.leaving{animation:popOut .18s ease both}.video-stage{position:relative;width:100%;height:100%;background:#07070a;overflow:hidden;cursor:pointer}#videoBg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;filter:blur(28px) saturate(1.5) brightness(.5);transform:scale(1.15);pointer-events:none}#videoEl{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;display:block}#subtitleOverlay{position:absolute;left:0;right:0;bottom:62px;display:flex;justify-content:center;padding:0 24px;pointer-events:none}#cueBox{max-width:92%;background:#000000a8;border-radius:7px;padding:7px 14px;font-size:clamp(12px,1.7vw,18px);font-weight:600;line-height:1.4;text-align:center;text-wrap:balance;white-space:pre-wrap;color:#ffffff80;text-shadow:0 1px 3px rgba(0,0,0,.6)}#cueBox:empty{display:none}#cueBox span{transition:color .1s linear}#cueBox span.active{color:#fff}#videoBadge{position:absolute;top:12px;left:13px;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.6px;color:#ffffff80;pointer-events:none}#videoActions{position:absolute;top:10px;right:11px;display:flex;gap:7px;opacity:0;transform:translateY(-4px);transition:opacity .2s ease,transform .2s ease}.video-stage:hover #videoActions,#videoActions:focus-within{opacity:1;transform:none}.stage-btn{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#ffffffe6;background:#00000073;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:6px 10px;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease}.stage-btn:hover{background:#000000b8}.stage-btn-icon{padding:6px 7px}#clearVideoBtn:hover{color:#fff;background:var(--bad);border-color:var(--bad)}#videoActions:has(.stage-btn:disabled){opacity:0!important}#videoControls{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;background:linear-gradient(transparent,#000000bf);opacity:0;transition:opacity .2s ease}.video-stage:hover #videoControls,#videoControls:focus-within,.video-stage:not(.playing) #videoControls{opacity:1}#scrubTrack{position:relative;height:6px;border-radius:3px;background:#fff3;cursor:pointer}#scrubTrack:before{content:"";position:absolute;top:-7px;right:0;bottom:-7px;left:0}#scrubTicks{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}#scrubTicks span{position:absolute;top:-2px;width:2px;height:10px;border-radius:1px;background:#ffffff59}#scrubFill{position:absolute;left:0;top:0;height:100%;width:0;border-radius:3px;background:var(--accent);pointer-events:none}#scrubHandle{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);width:14px;height:14px;border-radius:99px;background:#fff;box-shadow:0 1px 4px #00000080;pointer-events:none}.ctl-row{display:flex;align-items:center;gap:13px;margin-top:11px}.ctl-right{margin-left:auto;display:flex;align-items:center;gap:7px}.play-btn{width:36px;height:36px;border-radius:99px;border:none;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}.play-btn:hover{filter:brightness(1.1)}.play-btn .ic-pause,.video-stage.playing .play-btn .ic-play{display:none}.video-stage.playing .play-btn .ic-pause{display:block}#timeLabel{font-family:var(--mono);font-size:13px;color:#ffffffd1;white-space:nowrap}.ctl-btn{font-family:var(--mono);font-size:12px;font-weight:600;color:#ffffffd9;background:#ffffff24;border:none;border-radius:7px;padding:6px 10px;cursor:pointer;transition:background .15s ease}.ctl-btn:hover{background:#ffffff42}.ctl-icon{display:flex;align-items:center;justify-content:center;width:30px;height:27px;padding:0}#muteBtn .ic-mute,#muteBtn.muted .ic-vol{display:none}#muteBtn.muted .ic-mute{display:block}#fullscreenBtn .ic-collapse{display:none}.video-stage:fullscreen{width:100%;height:100%}.video-stage:fullscreen #fullscreenBtn .ic-expand{display:none}.video-stage:fullscreen #fullscreenBtn .ic-collapse{display:block}.video-stage:fullscreen #subtitleOverlay{bottom:84px}.video-stage:fullscreen #cueBox{font-size:clamp(18px,2.6vw,40px)}.collapsible{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .3s ease,opacity .25s ease}.collapsible>*{overflow:hidden;min-height:0}.collapsible.visible{grid-template-rows:1fr;opacity:1}.progress-inner{display:flex;flex-direction:column;gap:9px;padding-top:2px}#progressTrack{height:8px;border-radius:4px;background:var(--surface3);overflow:hidden}#progressFill{height:100%;width:0;border-radius:4px;background:var(--accent);transition:width .25s ease}#progressText{font-size:13px;color:var(--text-dim);font-variant-numeric:tabular-nums}.pane-editor{display:flex;flex-direction:column;min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:16px;overflow:hidden;position:sticky;top:var(--sticky-top);max-height:var(--pane-height);min-height:min(540px,var(--pane-height))}.editor-toolbar{display:flex;align-items:center;gap:11px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid var(--border)}.seg-switch{position:relative;display:flex;background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:3px;gap:2px}.switch-pill{position:absolute;top:3px;bottom:3px;left:0;width:0;border-radius:7px;background:var(--accent);pointer-events:none;transition:none}.seg-switch.ready .switch-pill{transition:transform .28s cubic-bezier(.4,0,.2,1),width .28s cubic-bezier(.4,0,.2,1)}.seg-switch button{position:relative;z-index:1;border:none;border-radius:7px;padding:7px 13px;font-size:13.5px;font-weight:700;color:var(--text-dim);background:transparent;cursor:pointer;transition:color .2s ease}.seg-switch button:hover:not(.active){color:var(--text)}.seg-switch button.active{color:#fff}.toolbar-right{margin-left:auto;display:flex;align-items:center;gap:8px}.toolbar-rule{width:1px;height:22px;background:var(--border)}.editor-body{flex:1;min-height:0;display:flex;flex-direction:column;overflow-y:auto}.chunk-alert{display:flex;align-items:center;gap:11px;padding:12px 18px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--warn) 11%,transparent);color:var(--warn);font-size:13px;animation:fadeUp .28s ease both}.chunk-alert svg{flex-shrink:0}#chunkAlertText{flex:1;min-width:0;color:var(--text);line-height:1.45}#retryChunksBtn{flex-shrink:0;padding:7px 13px;font-size:13px;border-radius:8px}@media(max-width:640px){.chunk-alert{flex-wrap:wrap}#chunkAlertText{flex-basis:100%}}.editor-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:17px;padding:48px 30px;text-align:center}.empty-icon{width:56px;height:56px;border-radius:14px;background:var(--surface2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--text-dim)}.empty-copy{max-width:430px}#emptyTitle{font-size:17px;font-weight:700}#emptyText{font-size:14px;color:var(--text-dim);line-height:1.6;margin-top:8px}#emptyText strong{color:var(--text);font-weight:700}.segment-list{display:flex;flex-direction:column}.seg-row{position:relative;display:flex;gap:14px;padding:15px 18px;border-bottom:1px solid var(--border);border-left:3px solid transparent;cursor:pointer;transition:background .15s ease,border-left-color .2s ease;animation:fadeUp .28s ease both}.seg-row:hover{background:color-mix(in srgb,var(--text) 3%,transparent)}.seg-row.active{border-left-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,transparent)}.seg-gutter{display:flex;flex-direction:column;align-items:flex-start;gap:7px;width:74px;flex-shrink:0;padding-top:2px}.seg-tc{font-family:var(--mono);font-size:12.5px;font-weight:500;color:var(--text-faint);white-space:nowrap}.seg-row.active .seg-tc{color:var(--accent)}.seg-row.edited .seg-tc:after{content:"•";color:var(--warn);margin-left:4px}.seg-cps{font-family:var(--mono);font-size:11.5px;font-weight:600;padding:2px 7px;border-radius:6px}.seg-cps.good{color:var(--good);background:color-mix(in srgb,var(--good) 16%,transparent)}.seg-cps.warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 16%,transparent)}.seg-cps.bad{color:var(--bad);background:color-mix(in srgb,var(--bad) 16%,transparent)}.seg-body{flex:1;min-width:0;display:grid;grid-template-columns:1fr;gap:14px;align-items:start}.seg-body.paired{grid-template-columns:1fr 1fr}.seg-text{width:100%;field-sizing:content;resize:none;overflow:hidden;background:transparent;border:none;border-radius:7px;color:var(--text);font-size:15.5px;line-height:1.55;white-space:pre-wrap;cursor:text;padding:5px 7px;margin:-5px -7px;transition:background .15s ease,box-shadow .15s ease}.seg-text:hover{background:color-mix(in srgb,var(--text) 7%,transparent)}.seg-text:focus{background:var(--bg);box-shadow:0 0 0 1px var(--border2)}.seg-trans{font-size:14.5px;line-height:1.5;color:color-mix(in srgb,var(--blue) 78%,var(--text));padding-left:12px;border-left:2px solid color-mix(in srgb,var(--blue) 45%,transparent);white-space:pre-wrap}.seg-trans.stale{opacity:.45}#codeView{flex:1}#codePre{margin:0;padding:20px;font-family:var(--mono);font-size:13.5px;line-height:1.75;color:var(--text);white-space:pre-wrap;word-break:break-word}#dropOverlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .18s ease}#dropOverlay.visible{opacity:1}#dropOverlayInner{display:flex;flex-direction:column;align-items:center;gap:16px;padding:52px 68px;border:2px dashed var(--accent);border-radius:22px;background:var(--surface);color:var(--accent)}#dropOverlay.visible #dropOverlayInner{animation:popIn .24s ease both}#dropOverlayLabel{font-size:18px;font-weight:700;color:var(--text)}@media(max-width:1180px){#workspace{grid-template-columns:1fr}.pane-video{position:static}.pane-editor{position:static;max-height:none;min-height:540px}.editor-body{overflow-y:visible}.seg-body.paired{grid-template-columns:1fr;gap:9px}}@media(max-width:640px){.topbar{padding:11px 15px}.topbar-title,.topbar-rule,.file-chip{display:none}#workspace{padding:15px 14px 30px}.seg-row{padding:13px;gap:10px}.seg-gutter{width:62px}.editor-toolbar{gap:8px}.toolbar-right{margin-left:0;width:100%}}
