:root{--bg:#0e1115;--panel:#171c22;--line:#2a313a;--muted:#9ba6b5;--text:#edf2f6;--accent:#b6f36b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:#202730;color:var(--text);border-radius:9px;padding:8px 12px;transition:background .15s}button:hover{background:#2c3541}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.overlay:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button.primary{background:var(--accent);color:#1d2b15;border:0;font-weight:700}.brand{color:inherit;text-decoration:none;font-size:22px;font-weight:760;display:flex;align-items:center;gap:10px;letter-spacing:-.6px}.brand-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:var(--accent);color:#16250b;font-style:italic}.brand small{font-size:12px;font-weight:400;color:var(--muted);letter-spacing:0;margin-left:8px}header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 28px;gap:18px}.version,.badge{color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:4px 10px;font-size:11px}.header-actions{margin-left:auto;display:flex;gap:10px;align-items:center}#save-state{font-size:12px;color:var(--muted);margin-right:12px}.workspace{display:grid;grid-template-columns:208px minmax(340px,1fr) 338px;min-height:calc(100vh - 121px)}.sidebar{padding:32px 16px;border-right:1px solid var(--line);display:flex;flex-direction:column}.eyebrow{font:600 10px/1.5 ui-monospace,monospace;letter-spacing:1.5px;color:var(--muted);margin-bottom:12px}.sidebar .eyebrow{padding-left:12px}nav{display:grid;gap:10px}nav button{background:transparent;text-align:left;border:1px solid transparent;padding:13px 10px;color:var(--muted);font-size:13px}nav button b{font:11px ui-monospace,monospace;margin-right:8px}nav button.active{background:#243220;color:var(--accent);border-color:#3e5730}.sidebar-note{margin-top:auto;padding:40px 12px 20px;color:#c2cbd6;font-size:12px}.sidebar-note p{color:var(--muted);font-size:12px;line-height:1.8}.dot{display:inline-block;width:6px;height:6px;border-radius:100%;background:var(--accent);margin-right:5px}.quiet{font-size:11px;background:transparent;color:var(--muted)}.center{padding:28px 32px 55px;min-width:0}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.section-heading h1{font-size:23px;letter-spacing:-.5px;margin:0 0 8px;font-weight:600}.section-heading .eyebrow{margin-bottom:5px}.preview-wrap{border:1px solid var(--line);border-radius:16px;background:radial-gradient(ellipse at 50% 50%,#252e31,#14191e 65%);margin-top:20px;padding:20px 16px 12px;display:flex;flex-direction:column;align-items:center}#stage{position:relative;width:min(100%,230px);aspect-ratio:9/16;overflow:hidden;background:#111c20;border-radius:8px;box-shadow:0 12px 36px #0007;touch-action:none}#video{position:absolute;width:100%;height:100%;object-fit:contain;background:#080a0c;display:none}#empty-stage{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at 70% 20%,#344d3b,transparent 70%),linear-gradient(155deg,#182822,#142026);color:#b8c6c4;text-align:center;padding:20px}#empty-stage p{font-size:13px;margin:10px 0}.frame-mark{font:italic 700 55px ui-monospace,monospace;color:#7b9a8033;letter-spacing:-8px}#empty-stage small{font-size:9px;color:#83928d}.safe-area{position:absolute;inset:8% 5% 13%;border:1px dashed #ffffff14;border-radius:4px;pointer-events:none}.preview-note{font-size:10px;color:var(--muted);display:flex;gap:25px;margin-top:12px}.overlay{position:absolute;transform:translate(-50%,-50%);max-width:90%;cursor:move;text-align:center;white-space:pre-wrap;line-height:1.3;padding:3px;border:1px dashed #b6f36b80;border-radius:3px;user-select:none;min-width:16px;z-index:3}.overlay.sub{width:90%}.overlay.sub span{box-decoration-break:clone;-webkit-box-decoration-break:clone;background:#101820a6;border-radius:3px;padding:2px 4px}.overlay.big{font-weight:800;z-index:4}.overlay[hidden]{display:none}.resize-handle{position:absolute;bottom:-8px;right:-8px;width:18px;height:18px;border-radius:4px;background:var(--accent);color:#203215;border:1px solid #111;padding:0;font:13px sans-serif;cursor:nwse-resize;touch-action:none}.transport{display:flex;gap:12px;align-items:center;margin:13px 0 24px}.transport button{font-size:11px;min-width:73px}.transport input{flex:1;min-width:30px;accent-color:var(--accent)}.transport output{font:10px ui-monospace,monospace;color:var(--muted);white-space:nowrap}.transcript{border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden}.transcript-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px;border-bottom:1px solid var(--line)}h2{font-size:18px;margin:0}.transcript h2{font-size:13px}.transcript h2 span{font-size:10px;color:var(--muted);font-weight:400;margin-left:6px}.transcript-head button{font-size:10px;padding:6px 8px}#sentences{max-height:290px;overflow-y:auto}.sentence{padding:12px 14px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:55px 1fr 22px;gap:8px;align-items:start}.sentence.active{background:#233122;box-shadow:inset 3px 0 var(--accent)}.sentence button.seek-sentence{background:transparent;border:0;padding:3px 0;font:10px ui-monospace,monospace;color:var(--accent)}.sentence textarea{resize:vertical;min-height:36px;border:1px solid transparent;padding:4px 6px;background:transparent;margin:0;width:100%;font-size:12px}.sentence textarea:focus{border-color:var(--line)}.sentence .delete-sentence{padding:1px 4px;background:transparent;border:0;color:var(--muted)}.sentence-meta{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:10px;margin-top:5px;flex-wrap:wrap}.sentence-meta input[type=number]{width:58px;font-size:10px;padding:2px 4px}.sentence-meta label{display:flex;align-items:center;gap:4px}.sentence-big{font-size:10px;color:var(--accent);padding:4px 6px}#transcript-empty{text-align:center;padding:20px;color:var(--muted);font-size:12px}#transcript-empty small{display:block;font-size:10px;margin:6px 0 12px}.inspector{border-left:1px solid var(--line);background:#14191f;padding:28px 24px 60px;min-width:0}.pane{display:none}.pane.active{display:block}.intro{font-size:12px;color:var(--muted);margin:6px 0 22px}.field{display:flex;flex-direction:column;gap:7px;margin:16px 0;font-size:12px;color:#c2cbd6}.field output{color:var(--accent);font:11px ui-monospace,monospace}.field input:not([type=range]):not([type=checkbox]),.field select,.field textarea,.sentence input,.sentence textarea{border-radius:7px;background:#202730;color:var(--text);border:1px solid var(--line);padding:8px;min-width:0}.field input[type=color]{width:100%;height:34px;padding:3px}.field input[type=range]{width:100%;accent-color:var(--accent)}.field textarea{resize:vertical}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field.check{flex-direction:row;align-items:center}.check input{accent-color:var(--accent)}.dropzone{border:1px dashed #516047;border-radius:10px;padding:20px 12px;display:block;text-align:center;color:var(--accent);font-size:12px;cursor:pointer;background:#1b261b}.dropzone small{display:block;font-size:10px;color:var(--muted);margin-top:6px;overflow-wrap:anywhere}.dropzone.over{border-color:var(--accent);background:#30402b}.field-title{font-size:12px;color:#c2cbd6;margin:22px 0 10px}.template{width:100%;text-align:left;margin-bottom:9px;padding:11px 12px;display:flex;gap:10px;align-items:center}.template .swatch{width:22px;height:30px;border-radius:4px;border:1px solid #ffffff22;flex-shrink:0}.template b{display:block;font-size:12px}.template small{display:block;font-size:10px;color:var(--muted);margin-top:2px}.template.selected{border-color:#819d5f;background:#253020}.full{width:100%;font-size:12px}.switch{display:flex;padding:4px;background:#0e1115;border:1px solid var(--line);border-radius:9px;gap:4px}.switch button{flex:1;border:0;background:transparent;color:var(--muted);font-size:12px}.switch button.active{background:#2b3825;color:var(--accent)}.position-presets{display:flex;gap:7px}.position-presets button{flex:1;font-size:12px}details{font-size:11px;color:var(--muted);margin:20px 0}summary{cursor:pointer}details p{line-height:1.8}.muted{font-size:11px;color:var(--muted);overflow-wrap:anywhere}.divider{border-top:1px solid var(--line);margin:25px 0}.quality-card{padding:15px;background:#243120;border:1px solid #3b5033;border-radius:10px;font-size:12px}.quality-card b{color:var(--accent)}.quality-card ul{padding-left:16px;font-size:11px;color:#bbc9b6;line-height:2;margin-bottom:0}.connection-card{border:1px solid var(--line);border-radius:9px;padding:10px;margin:20px 0}.connection-card>div{display:flex;align-items:center;gap:7px;font-size:10px;padding:5px 0}.connection-card span:last-child{margin-left:auto;color:var(--muted)}.status-dot{width:6px;height:6px;border-radius:50%;background:#b89c69}#cta-overlay{display:none;position:absolute;inset:0;z-index:8;text-align:center;padding:25px;align-items:center;justify-content:center;flex-direction:column;background:#142119}#cta-overlay h2{font-size:18px;overflow-wrap:anywhere}#cta-overlay p{font-size:11px}#cta-overlay small{position:absolute;bottom:25px;font-size:9px;color:#ffffff66}footer{min-height:45px;border-top:1px solid var(--line);background:#11161b;display:flex;justify-content:space-between;align-items:center;padding:10px 24px;font-size:10px;color:var(--muted)}footer b{font-weight:500;color:#c5cfd7}#validation{color:#ffd166}#toast{position:fixed;bottom:65px;left:50%;transform:translateX(-50%);padding:10px 18px;border-radius:9px;background:#30402a;color:#e7f8db;box-shadow:0 5px 30px #0005;z-index:100;font-size:12px;max-width:90%;display:none}@keyframes ec-pop{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes ec-fade{from{opacity:0}to{opacity:1}}@keyframes ec-slide{from{transform:translateY(15px);opacity:0}to{transform:none;opacity:1}}.effect-pop{animation:ec-pop .3s ease-out}.effect-fade{animation:ec-fade .5s ease-out}.effect-slide{animation:ec-slide .35s ease-out}@media(min-width:1500px){.workspace{grid-template-columns:220px minmax(340px,1fr) 380px}.preview-wrap{padding:24px}#stage{width:270px}}@media(max-width:1100px){.workspace{grid-template-columns:172px minmax(300px,1fr) 290px}.center{padding:24px 20px}.inspector{padding:26px 16px}.brand small{display:none}.transcript-head{align-items:start;flex-direction:column}}@media(max-width:800px){header{padding:0 14px;height:65px}.brand{font-size:18px}.version,#save-state{display:none}.header-actions{gap:5px}.header-actions button{font-size:10px;padding:7px}.workspace{grid-template-columns:1fr}.sidebar{border-right:0;padding:14px;border-bottom:1px solid var(--line)}.sidebar .eyebrow,.sidebar-note{display:none}nav{display:flex;overflow:auto;gap:5px}nav button{white-space:nowrap;font-size:11px;padding:8px}.quiet{margin-top:8px;align-self:start}.center{padding:20px 16px}.section-heading h1{font-size:20px}.inspector{border-left:0;border-top:1px solid var(--line);padding:24px 20px}.preview-wrap{padding:15px}#stage{width:200px}.transcript-head{flex-direction:row}.transcript-head button{font-size:9px}footer{flex-direction:column;align-items:start;gap:5px}.badge{font-size:9px}.field{margin:15px 0}}
:root{scrollbar-color:#4a5944 #171c22}
@media(max-width:800px){.workspace{grid-template-columns:minmax(0,1fr)}.sidebar{min-width:0}nav{min-width:0;max-width:100%}.section-heading>div{min-width:0}.section-heading .badge{display:none}.transcript-head{flex-wrap:wrap}.transcript-head>div{display:flex;flex-wrap:wrap;gap:5px}.transport{gap:8px}.transport output{font-size:9px}}