:root{--bg:#fbfbfc;--panel:#fff;--fill:#f2f3f5;--fill-strong:#e7e9ec;--wash:#eef0f4;--line:#e8e9ec;--line-strong:#d7d9de;--ink:#14161a;--ink-2:#565b64;--ink-3:#8b909a;--accent:#2c63e5;--accent-weak:#2c63e51a;--block:#b4b9c2;--block-alt:#c9ced6;--block-gap:#e4e6ea;--font-ui:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Inter, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--r-sm:5px;--r-md:8px;--topbar-h:52px;--transport-h:58px;--rail-w:336px;--gutter:32px;--ease:cubic-bezier(.2, 0, 0, 1);font-family:var(--font-ui);color:var(--ink);background:var(--bg);font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}*{box-sizing:border-box}body{min-width:320px;height:100dvh;margin:0;font-size:13px;line-height:1.5;overflow:hidden}button,input,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}.label{letter-spacing:.01em;color:var(--ink-3);font-size:11px;font-weight:500}.app{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--topbar-h) auto minmax(0, 1fr) auto;background:var(--bg);height:100dvh;display:grid}.app-browse,.app-plain{grid-template-rows:var(--topbar-h) minmax(0, 1fr)}.topbar,.timeline,.workspace,.transport,.library{min-width:0}audio{display:none}.topbar{padding:0 var(--gutter);border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap;align-items:center;gap:14px;display:flex}.brand{letter-spacing:-.01em;white-space:nowrap;align-items:center;gap:9px;font-size:13px;font-weight:600;display:flex}.brand i{background:var(--ink);width:21px;height:21px;color:var(--panel);letter-spacing:.02em;border-radius:6px;place-items:center;font-size:9px;font-style:normal;font-weight:600;display:grid}.crumb{align-items:center;gap:10px;min-width:0;display:flex}.crumb:before{content:"";background:var(--line-strong);width:1px;height:16px}.crumb-name{text-overflow:ellipsis;white-space:nowrap;color:var(--ink-2);font-size:13px;font-weight:500;overflow:hidden}.spacer{flex:1}.btn{border-radius:var(--r-sm);height:30px;color:var(--ink-2);white-space:nowrap;transition:background .12s var(--ease), color .12s var(--ease);align-items:center;gap:6px;padding:0 10px;font-size:12px;font-weight:500;display:inline-flex}.btn:hover{background:var(--fill);color:var(--ink)}.btn.on{background:var(--fill);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.field{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);width:210px;height:30px;color:var(--ink-3);transition:border-color .14s var(--ease), background .14s var(--ease), width .18s var(--ease);align-items:center;gap:7px;padding:0 10px;display:flex}.field:focus-within{border-color:var(--line-strong);background:var(--panel);width:280px}.field input{width:100%;min-width:0;color:var(--ink);background:0 0;border:0;outline:0;font-size:12px}.field input::placeholder{color:var(--ink-3)}.field svg{opacity:.75;flex:none}.select{border-radius:var(--r-sm);height:30px;color:var(--ink-2);cursor:pointer;appearance:none;background:0 0;background-image:linear-gradient(45deg, transparent 50%, var(--ink-3) 50%), linear-gradient(135deg, var(--ink-3) 50%, transparent 50%);background-position:calc(100% - 12px) 13px,calc(100% - 8px) 13px;background-repeat:no-repeat;background-size:4px 4px,4px 4px;border:0;padding:0 22px 0 8px;font-size:12px;font-weight:500}.btn-search{display:none}.select:hover{background-color:var(--fill)}.select-lang{width:92px}.select-rate{width:66px}.timeline{padding:14px var(--gutter) 12px;border-bottom:1px solid var(--line);background:var(--panel)}.timeline-head{justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:9px;display:flex}.timeline-hint{color:var(--ink-3);opacity:0;transition:opacity .18s var(--ease);font-size:11px}.timeline:hover .timeline-hint{opacity:1}.track{border-radius:var(--r-sm);background:var(--bg);height:40px;box-shadow:inset 0 0 0 1px var(--line);cursor:crosshair;touch-action:none;position:relative;overflow:hidden}.track.zoomed{cursor:grab}.track.zoomed:active{cursor:grabbing}.blk{background:var(--block);height:24px;transition:background .1s var(--ease);border-radius:2px;position:absolute;top:8px}.blk.alt{background:var(--block-alt)}.blk.gap{background:var(--block-gap);height:4px;top:18px}.blk:hover{background:var(--ink-2)}.blk.gap:hover{background:var(--line-strong)}.blk.on{background:var(--accent)}.run{background:var(--block);pointer-events:none;border-radius:1px;height:24px;position:absolute;top:8px}.run.gap{background:var(--block-gap);height:4px;top:18px}.playhead{background:var(--accent);pointer-events:none;width:1px;position:absolute;top:0;bottom:0}.playhead:before{content:"";background:var(--accent);border-radius:0 0 2px 2px;width:5px;height:5px;position:absolute;top:0;left:-2px}.ticks{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-3);justify-content:space-between;margin-top:6px;font-size:10px;display:flex}.workspace{grid-template-columns:minmax(0, 1fr) var(--rail-w);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"doc stage""doc rail";min-height:0;display:grid}.doc{grid-area:doc}.stage{grid-area:stage}.rail{grid-area:rail}.doc{overscroll-behavior:contain;scroll-behavior:smooth;min-width:0;overflow-y:auto}.doc-inner{max-width:780px;padding:30px var(--gutter) 80px;margin:0 auto}.reading{color:var(--ink);letter-spacing:-.003em;font-size:19px;line-height:1.76}.reading p{margin:0 0 20px}.sentence{border-radius:4px;scroll-margin:30vh}.sentence.here{background:var(--wash);box-shadow:0 0 0 3px var(--wash)}.w{transition:background .1s var(--ease), color .1s var(--ease);border-radius:4px;margin:0 -.5px;padding:1px 1.5px;display:inline}.w:hover{background:var(--fill-strong)}.w.hit{background:var(--fill-strong);box-shadow:inset 0 -1px 0 var(--line-strong)}.w.picked{box-shadow:inset 0 -1.5px 0 var(--ink)}.w.on{background:var(--accent);color:#fff}.punc{color:var(--ink-2);margin-left:-2px}.reading .nb{white-space:nowrap}.gapmark{vertical-align:1px;font-family:var(--font-mono);color:var(--ink-3);opacity:.7;transition:background .1s var(--ease), color .1s var(--ease);background:0 0;border-radius:3px;margin:0 2px;padding:0 3px;font-size:10px;display:inline-block}.gapmark:hover{background:var(--fill-strong);color:var(--ink-2);opacity:1}.gapmark.on{background:var(--accent-weak);color:var(--accent);opacity:1}.rail{overscroll-behavior:contain;border-left:1px solid var(--line);flex-direction:column;min-height:0;display:flex;overflow-y:auto}.rail section{border-bottom:1px solid var(--line);padding:18px 22px}.rail section:last-child{border-bottom:0}.rail .label{margin-bottom:12px;display:block}.stage{border-bottom:1px solid var(--line);justify-content:center;line-height:0;display:flex}.stage video{background:#111319;width:auto;max-width:100%;height:182px;display:block}.stage.off{border-bottom:0;height:0;overflow:hidden}.kv{grid-template-columns:auto 1fr;gap:9px 14px;margin:0;display:grid}.kv dt{color:var(--ink-3);white-space:nowrap;font-size:12px}.kv dd{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink);text-align:right;overflow-wrap:anywhere;margin:0;font-size:12px}.kv dd em{color:var(--ink-3);margin-top:2px;font-size:10px;font-style:normal;display:block}.pick-head{justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:13px;display:flex}.pick-word{letter-spacing:-.02em;overflow-wrap:anywhere;font-size:19px;font-weight:600}.pick-empty{color:var(--ink-3);font-size:12px;line-height:1.7}.src-name{overflow-wrap:anywhere;margin-bottom:5px;font-size:12px;font-weight:500}.src-path{font-family:var(--font-mono);color:var(--ink-3);overflow-wrap:anywhere;margin-bottom:11px;font-size:10px;line-height:1.6;display:block}.tags{flex-wrap:wrap;gap:5px;display:flex}.tags span{background:var(--fill);font-family:var(--font-mono);color:var(--ink-2);border-radius:3px;padding:2px 7px;font-size:10px}.rail-foot{padding:16px 22px 24px}.rail-foot p{font-family:var(--font-mono);color:var(--ink-3);margin:0 0 5px;font-size:10px;line-height:1.6}.transport{grid-template-columns:auto auto minmax(0, 1fr) var(--rail-w);height:var(--transport-h);padding-left:var(--gutter);border-top:1px solid var(--line);background:var(--panel);align-items:center;gap:16px;display:grid;box-shadow:0 -1px 24px #14161a0a}.transport-plain{padding:0 var(--gutter);display:flex}.transport-side{border-left:1px solid var(--line);align-items:center;gap:14px;height:100%;padding:0 22px;display:flex}.play{background:var(--ink);width:30px;height:30px;color:var(--panel);transition:transform .12s var(--ease), background .12s var(--ease);border-radius:50%;flex:none;place-items:center;font-size:9px;line-height:1;display:grid}.play:hover{background:#000}.play:active{transform:scale(.94)}.clock{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-2);white-space:nowrap;font-size:11px}.clock b{color:var(--ink);font-weight:500}.scrub{cursor:pointer;flex:1;align-items:center;height:16px;display:flex;position:relative}.scrub i{background:var(--fill-strong);width:100%;height:3px;transition:height .12s var(--ease);border-radius:2px;display:block;position:relative}.scrub:hover i{height:5px}.scrub i:before{content:"";width:var(--p,0%);background:var(--accent);border-radius:2px;position:absolute;inset:0 auto 0 0}.toggle{color:var(--ink-2);cursor:pointer;white-space:nowrap;align-items:center;gap:6px;font-size:12px;display:inline-flex}.toggle input{accent-color:var(--accent);cursor:pointer;width:13px;height:13px;margin:0}.toggle:hover{color:var(--ink)}.transport-note{color:var(--ink-3);font-size:12px}.library{overflow-y:auto}.library-inner{max-width:1080px;padding:56px var(--gutter) 72px;margin:0 auto}.library h1{letter-spacing:-.025em;margin:0 0 10px;font-size:26px;font-weight:600}.library-hint{max-width:560px;color:var(--ink-2);margin:0 0 18px;font-size:13px;line-height:1.7}.library-meta{border-bottom:1px solid var(--line);font-family:var(--font-mono);color:var(--ink-3);flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:26px;padding-bottom:22px;font-size:11px;display:flex}.library-meta span{overflow-wrap:anywhere}.library-roots{flex-direction:column;gap:4px;min-width:0;display:flex}.library-meta em{color:var(--ink-2);border-left:1px solid var(--line-strong);padding-left:10px;font-style:normal}.grid{grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:10px;display:grid}.item{border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);text-align:left;min-height:108px;transition:border-color .14s var(--ease), background .14s var(--ease);flex-direction:column;gap:6px;padding:16px 17px;display:flex}.item:hover:enabled{border-color:var(--line-strong);background:var(--bg)}.item:disabled{cursor:default;background:0 0}.item strong{letter-spacing:-.01em;overflow-wrap:anywhere;font-size:14px;font-weight:600}.item:disabled strong{color:var(--ink-2)}.item-time{font-family:var(--font-mono);color:var(--ink-3);font-size:10px}.item-stat{font-family:var(--font-mono);color:var(--ink-2);margin-top:auto;font-size:11px}.item-stat.void{color:var(--ink-3)}.item-none{color:var(--ink-3);margin-top:auto;font-size:11px}.item-empty{color:var(--ink-3);padding:60px 0;font-size:13px}.state{text-align:center;place-content:center;justify-items:center;gap:6px;height:100%;padding:40px;display:grid}.state h1{letter-spacing:-.01em;margin:0;font-size:15px;font-weight:600}.state p{color:var(--ink-2);max-width:460px;margin:0;font-size:13px;line-height:1.7}.state small{color:var(--ink-3);max-width:460px;font-size:11px;line-height:1.7}.state .btn{border:1px solid var(--line);margin-top:14px}.spinner{border:1.5px solid var(--line-strong);border-top-color:var(--ink-2);border-radius:50%;width:15px;height:15px;margin-bottom:10px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1180px){:root{--gutter:24px;--rail-w:300px}}@media (width<=780px){.workspace{grid-template:"stage""doc""rail"/minmax(0,1fr);overflow-y:auto}.doc{overflow:visible}.doc-inner{padding-bottom:40px}.stage{border-left:0}.rail{border-left:0;border-top:1px solid var(--line);overflow:visible}.rail .kv{max-width:520px}.transport{grid-template-columns:auto auto minmax(0,1fr) auto}.transport-side{padding:0 var(--gutter) 0 4px;border-left:0}}@media (width<=860px){:root{--gutter:16px}.app{grid-template-rows:auto auto minmax(0,1fr) auto}.topbar{padding:8px var(--gutter);gap:8px 10px}.brand span,.btn-back span{display:none}.btn-back{padding:0 8px}.crumb{gap:8px}.timeline{padding:10px var(--gutter) 8px}.timeline-hint{display:none}.track{height:34px}.blk,.run{height:22px;top:6px}.blk.gap,.run.gap{height:4px;top:15px}.doc-inner{padding:22px var(--gutter) 34px}.reading{font-size:17px;line-height:1.85}.reading .w{padding:2px 1.5px}.reading .gapmark{margin:0 3px;padding:3px 7px}.stage video{height:112px}.rail section{padding:16px var(--gutter)}.rail-foot{padding:14px var(--gutter) 20px}.library-inner{padding:28px var(--gutter) 44px}.library h1{font-size:22px}.library-hint{font-size:13px}.item{min-height:0}}@media (width<=620px){.btn-search{display:inline-flex}.topbar .field,.btn-pauses{display:none}.topbar.searching:after{content:"";flex-basis:100%;order:9}.topbar.searching .field{flex:auto;order:10;width:auto;display:flex}.topbar.searching .field:focus-within{width:auto}.topbar.searching .btn-pauses{order:11;display:inline-flex}.transport{height:auto;padding:8px var(--gutter) calc(8px + env(safe-area-inset-bottom,0px));flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.play{width:34px;height:34px}.scrub{flex:90px;height:22px}.transport-side{border-left:0;flex:100%;gap:12px;height:auto;padding:0}.transport-side .select{background-position:calc(100% - 10px) 13px,calc(100% - 6px) 13px;width:56px;padding-right:18px}.grid{grid-template-columns:1fr}}@media (height<=520px){.timeline{padding:6px var(--gutter) 4px}.track{height:26px}.blk,.run{height:18px;top:4px}.blk.gap,.run.gap{height:4px;top:11px}.ticks{margin-top:3px;font-size:9px}.stage video{height:88px}.doc-inner{padding:14px var(--gutter) 24px}.transport{padding-top:6px;padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))}}@media (width<=380px){.clock em{display:none}.topbar{gap:8px}.crumb:before{display:none}.crumb-name{min-width:0;max-width:72px}.select-lang{width:78px;padding-right:20px}}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}.doc{scroll-behavior:auto}}
