:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#252829;font-synthesis:none;letter-spacing:0;--muted:#707677;--line:#e1e4e4;--accent:#1b725f;background:#fff;font-family:Segoe UI,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,select,input{font:inherit;letter-spacing:0;font-size:13px}button{cursor:pointer}button:disabled,input:disabled,select:disabled{cursor:default;opacity:.45}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button[hidden],[hidden]{display:none!important}#app{grid-template-rows:auto minmax(0,1fr) auto;height:100svh;min-height:400px;display:grid}.toolbar{border-bottom:1px solid var(--line);z-index:2;background:#fff;align-items:center;gap:24px;min-height:62px;padding:12px 24px;display:flex}h1{flex:1;margin:0;font-size:19px;font-weight:600;line-height:1.4}.view-selector{grid-template-columns:72px repeat(3,56px);gap:2px;display:grid}.view-selector button{color:#646c6c;white-space:nowrap;background:0 0;border:0;border-radius:4px;min-width:0;height:34px;padding:0 8px}.view-selector button:hover:not(:disabled),.icon-button:hover:not(:disabled){background:#f1f4f3}.view-selector button[aria-pressed=true],.icon-button[aria-pressed=true]{color:var(--accent);background:#e9f2ef}.toolbar-actions{align-items:center;gap:6px;display:flex}.icon-button{color:#4b5555;background:0 0;border:0;border-radius:4px;flex:0 0 36px;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:inline-flex;position:relative}.icon-button svg,.retry-button svg{stroke-width:1.75px;width:18px;height:18px}.icon-button[data-tooltip]:after{color:#fff;content:attr(data-tooltip);pointer-events:none;z-index:5;background:#2e3433;border-radius:4px;width:max-content;max-width:220px;padding:6px 9px;font-size:12px;line-height:1.4;display:none;position:absolute;top:calc(100% + 8px);right:0}.icon-button[data-tooltip]:hover:not(:disabled):after,.icon-button[data-tooltip]:focus-visible:after{display:block}.workbench{grid-template-columns:minmax(0,1fr);min-width:0;min-height:0;display:grid}.workbench.is-comparing{grid-template-columns:minmax(0,1fr) minmax(240px,34%)}.viewport{background:#fff;min-width:0;min-height:0;position:relative;overflow:hidden}.viewport canvas{touch-action:none;width:100%;height:100%;display:block}.status{text-align:center;z-index:1;background:#fff;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:28px;display:flex;position:absolute;inset:0}.status p{margin:0;font-size:14px;line-height:1.5}.status-icon svg{width:24px;height:24px;color:var(--muted);stroke-width:1.5px;display:block}.status.is-loading .status-icon{animation:1.2s linear infinite spin}.status progress{appearance:none;width:160px;height:4px;accent-color:var(--accent);background:#eef0ef;border:0;border-radius:2px;overflow:hidden}.status progress::-webkit-progress-bar{background:#eef0ef}.status progress::-webkit-progress-value{background:var(--accent)}.status .error-detail{max-width:420px;color:var(--muted);overflow-wrap:anywhere;font-size:12px}.retry-button{border:1px solid var(--line);color:#363e3c;background:#fff;border-radius:4px;align-items:center;gap:6px;min-height:34px;padding:6px 12px;display:inline-flex}.retry-button:hover{background:#f1f4f3}.reference{border-left:1px solid var(--line);background:#fafbfb;grid-template-rows:auto minmax(0,1fr);gap:12px;min-height:0;margin:0;padding:20px;display:grid}.reference figcaption{color:var(--muted);font-size:12px;line-height:1.5}.reference img{object-fit:contain;width:100%;min-width:0;height:100%;min-height:0;display:block}.playback-bar{border-top:1px solid var(--line);z-index:2;background:#fff;align-items:center;gap:28px;padding:14px 24px;display:flex}.clip-controls{flex:none;align-items:center;gap:10px;display:flex}.clip-label,.speed-control label{color:var(--muted);flex:none;font-size:12px}.clip-controls select{border:1px solid var(--line);color:#353c3b;background:#fff;border-radius:4px;width:134px;height:34px;padding:0 8px}.timeline-control{flex:180px;align-items:center;gap:14px;min-width:0;display:flex}input[type=range]{min-width:0;height:24px;accent-color:var(--accent);cursor:pointer;margin:0}.timeline-control input{flex:1;width:100%}.timeline-control output{text-align:right;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap;flex:0 0 109px;font-size:12px}.speed-control{flex:0 0 198px;align-items:center;gap:10px;display:flex}.speed-control input{width:100px}.speed-control output{font-variant-numeric:tabular-nums;color:var(--muted);flex:0 0 38px;font-size:12px}.playback-bar .icon-button[data-tooltip]:after{inset:auto auto calc(100% + 8px) 0}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=900px){.toolbar,.playback-bar{padding-left:16px;padding-right:16px}.playback-bar{flex-wrap:wrap;gap:10px 20px}.clip-controls{flex:auto}.timeline-control{flex-basis:100%;order:3}}@media (width<=600px){.toolbar{flex-wrap:wrap;gap:10px 12px;padding-top:10px;padding-bottom:10px}.view-selector{flex:1 0 100%;order:3;grid-template-columns:repeat(4,minmax(0,1fr))}.workbench.is-comparing{display:block;overflow-y:auto}.workbench.is-comparing .viewport{height:100%;min-height:280px}.workbench.is-comparing .reference{border-top:1px solid var(--line);border-left:0;height:70svh;min-height:320px}.playback-bar{padding-top:10px;padding-bottom:max(10px, env(safe-area-inset-bottom));gap:8px 16px}.clip-controls{gap:7px}.clip-label{display:none}.clip-controls select{width:112px}.speed-control{flex:0 0 112px;gap:7px}.speed-control input{width:50px}.speed-control label{display:none}.timeline-control{gap:12px}}@media (width<=360px){.speed-control label,.clip-label{display:none}.speed-control{flex-basis:112px}}@media (prefers-reduced-motion:reduce){.status.is-loading .status-icon{animation:none}}