:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--paper:var(--lightningcss-light,#f5f4ef)var(--lightningcss-dark,#131720);--ink:var(--lightningcss-light,#1e2836)var(--lightningcss-dark,#e7e6df);--primary:var(--lightningcss-light,#33518a)var(--lightningcss-dark,#8fb0f0);--secondary:var(--lightningcss-light,#4a6491)var(--lightningcss-dark,#9db2d6);--accent:var(--lightningcss-light,#dd9a35)var(--lightningcss-dark,#ffbe63);--line:var(--lightningcss-light,#dcd9cf)var(--lightningcss-dark,#2b3446);--soft:var(--lightningcss-light,#eceae3)var(--lightningcss-dark,#1c2534);--surface:var(--lightningcss-light,#fffdf8)var(--lightningcss-dark,#192436);--surface-2:var(--lightningcss-light,#f2f0e9)var(--lightningcss-dark,#1f2b3f);--page-glow:var(--lightningcss-light,#e6ecf5)var(--lightningcss-dark,#17233a);--button-fg:var(--lightningcss-light,#fff)var(--lightningcss-dark,#0e1622);--text-muted:var(--lightningcss-light,#4d5560)var(--lightningcss-dark,#b7bfca);--text-subtle:var(--lightningcss-light,#6a727c)var(--lightningcss-dark,#9aa4b0);--border-emphasis:var(--lightningcss-light,#9aa6b8)var(--lightningcss-dark,#5c6a80);--danger:var(--lightningcss-light,#a33d27)var(--lightningcss-dark,#ff9b83);--shadow-card:var(--lightningcss-light,#33518a12)var(--lightningcss-dark,#05090f5c);--shadow-raised:var(--lightningcss-light,#33518a24)var(--lightningcss-dark,#05090f7a);--marker:#e0483d;--stage-bg:#000;color:var(--ink);background:var(--paper);font-family:Arial,Noto Sans TC,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{max-width:100%;height:100%;margin:0}body{background:radial-gradient(circle at 100% 0, var(--page-glow) 0, transparent 30rem), var(--paper);-webkit-font-smoothing:antialiased;min-height:100%}button,input{font:inherit}button{cursor:pointer;background:var(--primary);color:var(--button-fg);border:0;border-radius:999px;padding:.55rem .95rem;font-weight:700}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-root{flex-direction:column;min-height:100%;display:flex}.site-header{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 1.4rem;display:flex}.brand{color:var(--primary);letter-spacing:-.01em;white-space:nowrap;align-items:center;gap:.55rem;font-size:1.05rem;font-weight:800;display:inline-flex}.brand span{background:var(--primary);width:1.7rem;height:1.7rem;color:var(--paper);border-radius:.5rem;place-items:center;font-size:1rem;display:inline-grid}.header-actions{flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.9rem;display:flex}.btn-ghost{color:var(--ink);border:1px solid var(--line);background:0 0;padding:.45rem .85rem;font-weight:700;transition:background .15s,border-color .15s}.btn-ghost:hover:not(:disabled){background:var(--surface-2);border-color:var(--border-emphasis)}.btn-primary{background:var(--primary);color:var(--button-fg)}label.btn-ghost{cursor:pointer;align-items:center;display:inline-flex}.theme-toggle{width:2.1rem;height:2.1rem;color:var(--ink);border:1px solid var(--line);background:0 0;place-items:center;padding:0;font-size:1rem;line-height:1;display:grid}.theme-toggle:hover{background:var(--surface-2)}.status-pill{border:1px solid var(--line);color:var(--text-subtle);border-radius:999px;padding:.3rem .6rem;font-size:.72rem;font-weight:700}.status-pill[data-status=syncing]{border-color:var(--secondary);color:var(--secondary)}.status-pill[data-status=saved]{border-color:var(--accent);color:var(--accent)}.status-pill[data-status=offline]{color:var(--text-subtle);font-style:italic}.settings-panel{border-bottom:1px solid var(--line);background:var(--surface);padding:1.1rem 1.4rem}.settings-inner{flex-direction:column;gap:.8rem;max-width:44rem;font-size:.9rem;display:flex}.field{flex-direction:column;gap:.3rem;display:flex}.field-label{letter-spacing:.04em;color:var(--text-subtle);font-size:.74rem;font-weight:700}.settings-actions{align-items:center;gap:.6rem;display:flex}.link-btn{color:var(--text-subtle);background:0 0;padding:.5rem .3rem}.link-btn:hover{color:var(--ink)}.text-input{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:.6rem;outline:none;padding:.6rem .75rem}.text-input:focus{border-color:var(--primary)}.text-input:disabled{opacity:.45}.workspace{flex:1;min-height:0;display:flex}.player{flex-direction:column;flex:1;align-items:center;gap:1rem;min-width:0;padding:1.6rem;display:flex}.eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--secondary);font-size:.72rem;font-weight:800}.dropzone{aspect-ratio:16/9;text-align:center;border:1px dashed var(--border-emphasis);width:100%;max-width:48rem;color:var(--text-subtle);background:var(--surface);border-radius:1.1rem;place-items:center;padding:1rem;font-size:.95rem;transition:background .15s,border-color .15s;display:grid}.dropzone.is-drag{border-color:var(--primary);background:var(--surface-2)}.stage{background:var(--stage-bg);-webkit-user-select:none;user-select:none;aspect-ratio:16/9;width:100%;max-width:48rem;box-shadow:0 1rem 3rem var(--shadow-card);border-radius:1.1rem;position:relative;overflow:hidden}.stage .video{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}.stage .draw-canvas{cursor:crosshair;width:100%;height:100%;position:absolute;inset:0}.progress-wrap{width:100%;max-width:48rem}.progress-bar{background:var(--soft);border:1px solid var(--line);cursor:pointer;border-radius:999px;height:.65rem;position:relative}.progress-fill{inset-block:0;background:var(--secondary);pointer-events:none;border-radius:999px;position:absolute;left:0}.marker{border:2px solid var(--surface);background:var(--accent);width:.8rem;height:.8rem;box-shadow:0 0 0 1px var(--shadow-raised);border-radius:999px;padding:0;position:absolute;top:50%;transform:translate(-50%,-50%)}.marker.is-selected{background:var(--primary)}.controls{flex-wrap:wrap;align-items:center;gap:.7rem;width:100%;max-width:48rem;font-size:.9rem;display:flex}.control-group{align-items:center;gap:.35rem;display:flex}.btn-step{color:var(--ink);border:1px solid var(--line);font-variant-numeric:tabular-nums;background:0 0;padding:.4rem .6rem}.btn-step:hover{background:var(--surface-2)}.time-display{font-variant-numeric:tabular-nums;color:var(--text-muted)}.video-name{color:var(--text-subtle);text-overflow:ellipsis;white-space:nowrap;max-width:16rem;overflow:hidden}.annot-input-row{align-items:center;gap:.55rem;width:100%;max-width:48rem;display:flex}.annot-input-row .text-input{flex:1;font-size:.9rem}.annot-at{color:var(--text-subtle);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.74rem}.hint{color:var(--text-subtle);text-align:center;font-size:.78rem;line-height:1.6}.sidebar{border-left:1px solid var(--line);background:var(--surface);flex-direction:column;flex-shrink:0;width:20rem;min-height:0;display:flex}.panel{border-bottom:1px solid var(--line)}.panel-head{color:var(--text-muted);justify-content:space-between;align-items:center;padding:.75rem 1rem;font-size:.82rem;font-weight:700;display:flex}.panel-count{font-variant-numeric:tabular-nums}.panel-empty{color:var(--text-subtle);padding:0 1rem .8rem;font-size:.76rem}.version-list{max-height:10rem;margin:0;padding:0 0 .5rem;list-style:none;overflow-y:auto}.version-item{text-align:left;width:100%;color:var(--ink);background:0 0;border-radius:0;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.85rem;font-weight:500;display:flex}.version-item:hover{background:var(--surface-2)}.version-item.is-active{background:var(--surface-2);font-weight:800}.version-item .name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.version-item .num{color:var(--text-subtle);font-variant-numeric:tabular-nums;font-size:.74rem}.load-hint{color:var(--primary);padding:0 1rem .8rem;font-size:.76rem}.notes-row{align-items:center;gap:.5rem;padding:0 1rem .6rem;display:flex}.notes-row .text-input{flex:1;padding:.45rem .6rem;font-size:.85rem}.notes-list{flex-direction:column;gap:.4rem;margin:0;padding:0 1rem .8rem;list-style:none;display:flex}.note-item{background:var(--surface-2);border-radius:.5rem;justify-content:space-between;align-items:flex-start;gap:.5rem;padding:.4rem .55rem;font-size:.85rem;display:flex}.note-item span{overflow-wrap:anywhere;flex:1}.icon-btn{color:var(--text-subtle);background:0 0;padding:.1rem .3rem;font-size:.74rem;font-weight:600}.icon-btn:hover{color:var(--ink)}.annot-scroll{flex:1;overflow-y:auto}.annot-items{margin:0;padding:0;list-style:none}.annot-item{border-bottom:1px solid var(--line);cursor:pointer;padding:.75rem 1rem;transition:background .12s}.annot-item:hover,.annot-item.is-selected{background:var(--surface-2)}.annot-row{gap:.7rem;display:flex}.annot-thumb{border:1px solid var(--line);object-fit:cover;border-radius:.5rem;flex-shrink:0;width:5rem;height:auto}.annot-body{flex:1;min-width:0}.annot-head{justify-content:space-between;align-items:center;display:flex}.annot-time-label{color:var(--text-subtle);font-variant-numeric:tabular-nums;font-size:.74rem}.annot-text{overflow-wrap:anywhere;margin:.25rem 0 0;font-size:.88rem}.annot-text .muted{color:var(--text-subtle);font-style:italic}.stroke-badge{color:var(--secondary);font-size:.68rem}