:root{color-scheme:dark;--ink:#101014;--paper:#f2f1ee;--grey:#a9a8a4;--line:#343438;--orange:#ff4d00;--gap:10px;font:11px/1.4 'Geist Mono',Consolas,'SFMono-Regular',monospace}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper)}button,input{font:inherit}button{min-height:28px;padding:0 8px;background:var(--ink);color:var(--paper);border:1px solid var(--line);border-radius:0;cursor:pointer;white-space:nowrap;transition:background 120ms,color 120ms}button:hover,button.active{background:var(--paper);color:var(--ink)}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,#stage:focus-visible{outline:1px solid var(--paper);outline-offset:2px}.icon{width:28px;padding:0;text-align:center;font-size:16px}.small{width:24px}.right{margin-left:auto}.row{display:flex;align-items:center;gap:var(--gap);min-width:0}.row.right{gap:var(--gap)}.wordmark{width:112.5px;height:28.8px;object-fit:contain;object-position:left top}.trial-label{color:var(--grey);font-size:10px;letter-spacing:1px;margin-left:20px}#app{display:flex;flex-direction:column;height:100dvh;min-height:540px}header{display:flex;align-items:center;gap:10px;padding:10px;border-bottom:1px solid var(--line)}nav{display:flex;gap:10px;margin-left:auto}.workspace{display:flex;flex:1;min-height:0}#stage{position:relative;flex:1;min-width:0;overflow:hidden;background:#000;touch-action:none;outline:none}#video{position:absolute;max-width:none;max-height:none;transform-origin:center;pointer-events:none}#overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#selection{fill:none;stroke:var(--paper);stroke-width:1;display:none}#outline{fill:none;stroke:var(--orange);stroke-width:1;stroke-dasharray:4 3;display:none}.dotted-orange{fill:none;stroke:var(--orange);stroke-width:1;stroke-dasharray:2 2}#empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}#empty p{margin:0;color:var(--grey);letter-spacing:1.5px}#empty small{color:var(--grey);font-size:10px}.drop-open{font-size:14px;letter-spacing:2px;border:0;padding:12px}#drop-cue{position:absolute;inset:10px;align-content:center;text-align:center;border:1px solid var(--paper);background:#101014d9;letter-spacing:3px;font-size:16px}#sidebar{width:240px;flex-shrink:0;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;border-left:1px solid var(--line);background:var(--ink)}#sidebar::-webkit-scrollbar{width:12px}#sidebar::-webkit-scrollbar-track{background:var(--ink)}#sidebar::-webkit-scrollbar-thumb{background:#68686b;border:3px solid var(--ink)}section{padding:10px;border-bottom:1px solid var(--line)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px}h2{margin:0;font-size:11px;font-weight:500;letter-spacing:1.2px}.collapse{width:24px;min-height:24px;padding:0;font-size:11px}.module-body{margin-top:8px}.module-body>.row+.row{margin-top:8px}.collapsed .module-body{display:none}#zoom-value{font-size:12px;flex-shrink:0}.presets{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:8px}.presets button{padding:0 2px;font-size:9px}.presets .control-wrap{min-width:0}.presets .control-wrap>button{width:100%}#speed-value{width:32px;flex-shrink:0;font-size:11px}input[type=range]{appearance:none;-webkit-appearance:none;height:20px;border:0;border-radius:0;background:transparent;min-width:0;flex:1;width:100%;margin:0;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:1px;background:var(--line)}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:3px;height:14px;margin-top:-6px;background:var(--paper);border:0;border-radius:0}input[type=range]::-moz-range-track{height:1px;background:var(--line)}input[type=range]::-moz-range-thumb{width:3px;height:14px;background:var(--paper);border:0;border-radius:0}input[type=range]:disabled{opacity:.4}#zoom{margin:8px 0}#overview{display:block;width:100%;height:110px;cursor:crosshair;touch-action:none}#overview-screen{fill:#000;stroke:var(--paper);stroke-width:1;vector-effect:non-scaling-stroke}#overview-crop{fill:#f2f1ee14;stroke:var(--paper);stroke-width:1;vector-effect:non-scaling-stroke}.jump{color:var(--grey)}input[type=number]{width:27px;color:var(--paper);background:transparent;border:0;text-align:right;padding:0;appearance:textfield;-moz-appearance:textfield}input::-webkit-inner-spin-button{appearance:none}.precise{border:0;color:var(--grey);padding:0;text-align:left;margin-top:3px}.orientation .icon{width:24px}.value-note{color:var(--grey);margin:8px 0 0;font-size:10px}.slider-label{display:flex;align-items:center;justify-content:space-between;margin-top:10px;color:var(--grey)}.slider-label output{color:var(--paper)}footer{padding:10px;border-top:1px solid var(--line)}.timeline-wrap{position:relative;margin-bottom:10px}#ab-marks{height:12px;position:relative;color:var(--grey);font-size:10px}#ab-marks span{position:absolute;top:0}#timeline{display:block}.transport{display:flex;align-items:center;gap:10px;min-width:0}.transport-buttons,.audio{display:flex;gap:10px;align-items:center}.transport-gap{width:10px}#clock{white-space:nowrap;margin-left:20px;flex-shrink:0;font-size:12px}#filename{margin-left:10px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Inter,system-ui,sans-serif;font-size:12px;color:var(--grey)}.audio{margin-left:auto;flex-shrink:0}.audio input{width:80px}.footnote{display:flex;justify-content:space-between;color:#77777c;font-size:9px;letter-spacing:.5px;margin-top:8px}#playing-dot{display:inline-block;width:4px;height:4px;background:#68686b;margin-right:6px;vertical-align:middle}#playing-dot.on{background:var(--orange)}#preview{position:absolute;bottom:24px;width:168px;padding:3px;background:var(--ink);border:1px solid var(--line);pointer-events:none;z-index:5}#preview canvas{display:block;width:160px;height:90px;background:#000}#preview-time{display:block;text-align:center;padding:3px;font-size:10px}.control-wrap{display:inline-flex;flex-direction:column;align-items:stretch;flex-shrink:0;vertical-align:middle}.key-hint{min-height:16px;height:16px;border:0;font-size:9px;padding:0;color:#ffe45b;background:transparent;overflow:hidden;text-overflow:ellipsis;max-width:85px}.key-hint:hover{color:#ffe45b;background:#29292c}.section-head .control-wrap{align-items:center}#key-status,#message{color:var(--grey);padding:5px 0;font-size:10px}#key-status{color:#ffe45b}.aux-video{position:fixed;left:-10px;bottom:0;width:1px;height:1px;opacity:0;pointer-events:none}[hidden]{display:none!important}.sidebar-hidden #sidebar{display:none}@media(max-width:760px){.trial-label{display:none}#clock{margin-left:5px;font-size:10px}.audio input{width:50px}.transport{gap:6px}.transport-buttons{gap:6px}#filename{max-width:130px}.footnote{font-size:8px}}@media(max-width:570px){#sidebar{width:210px}.audio input{display:none}#filename{display:none}#clock{font-size:9px}.transport-gap{display:none}.presets{gap:5px}.row{gap:7px}section{padding:8px}.footnote span:last-child{display:none}}@media(prefers-reduced-motion:reduce){button{transition:none}}

@media(max-width:570px){section[data-module=zoom] .row{gap:6px}section[data-module=zoom] button[data-action=tracker],section[data-module=zoom] button[data-action=zoomReset]{font-size:10px;padding:0 6px}#zoom-value{font-size:11px}}
/* The web module layout follows the current FRAME instrument panel. */
.section-head{cursor:pointer;min-height:28px}.section-head h2{flex:1}.section-head em{color:var(--orange);font-style:normal}.collapse{width:30px;min-height:30px}.tracking-row{gap:7px}.tracking-row> .control-wrap:first-child{flex-shrink:1;min-width:0}.tracking-row button[data-action=tracker]{padding:0 6px}.mode-label{font-size:9px;color:var(--grey);white-space:nowrap;margin-left:auto}.mode-controls{display:flex;gap:5px}.mode-controls button{min-width:27px;min-height:29px;padding:0;font-size:13px}.track-tools{margin-top:8px}.track-tools .right{margin-left:auto}.zoom-row{margin-top:8px}.zoom-row #zoom-value{width:43px}.zoom-row #zoom{margin:0}.upscale-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:8px 0;color:var(--grey);font-size:9px}.upscale-row .row{gap:5px}.upscale-row button{min-height:23px;font-size:9px;padding:0 5px}.loop-buttons{gap:5px}.loop-buttons>.control-wrap{min-width:0;flex:1}.loop-buttons>.control-wrap>button{width:100%;padding:0 3px}.loop-buttons>.control-wrap:last-child{flex:0 0 30px}.loop-export{margin-top:10px}.loop-export .right{margin-left:auto}.timeline-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}.timeline-wrap{flex:1;min-width:0;margin:0}.timeline-zoom{display:flex;align-items:center;gap:8px;flex-shrink:0}.timeline-zoom .wide{width:42px;font-size:18px}.timeline-zoom button{min-height:30px}.timeline-wrap #ab-marks{height:18px}.timeline-wrap #ab-marks button{position:absolute;z-index:4;top:0;min-height:17px;min-width:19px;padding:0 3px;transform:translateX(-50%);border-color:var(--paper);font-size:10px}.timeline-wrap #timeline{margin-top:1px}.filter-defs{position:absolute;width:0;height:0;overflow:hidden}.precise{border:0;margin-top:10px;display:flex;align-items:center;gap:9px;min-height:30px;background:transparent}.precise::before{content:'';display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid var(--line);color:var(--paper)}.precise.active{background:transparent;color:var(--grey)}.precise.active::before{content:'×';font-size:22px}.precise:hover{background:transparent;color:var(--paper)}.key-hint,#key-status{color:var(--orange);font-size:12px}.key-hint{min-height:20px;height:20px;font-size:12px;font-weight:600;max-width:100%;letter-spacing:.3px}.key-hint:hover{color:var(--orange)}.control-wrap{min-width:0}.section-head .control-wrap{flex:none}.fullscreen #app>header{transform:translateY(-100%);opacity:0}.fullscreen #app>footer{transform:translateY(100%);opacity:0}.fullscreen #sidebar{transform:translateX(100%);opacity:0}.fullscreen .workspace{position:absolute;inset:0}.fullscreen #stage{width:100vw;height:100vh}.fullscreen #sidebar{position:absolute;right:0;top:0;bottom:0;z-index:6;pointer-events:none}.fullscreen header,.fullscreen footer{position:absolute;left:0;right:0;z-index:7;transition:transform 120ms,opacity 120ms;pointer-events:none}.fullscreen header{top:0}.fullscreen footer{bottom:0}.fullscreen body{overflow:hidden}
#sidebar{width:320px}.tracking-row>.control-wrap:first-child{flex:none}.tracking-row .mode-controls{margin-left:2px}.tracking-row .mode-label{margin-left:auto}.timeline-wrap #ab-marks .marker[hidden]{display:none}@media(max-width:570px){#sidebar{width:min(285px,66vw)}.tracking-row{flex-wrap:wrap}.tracking-row .mode-label{margin-left:0}.mode-controls{margin-left:auto!important}}
header{height:50px;min-height:50px}header nav .control-wrap{position:relative}header nav .key-hint{position:absolute;top:100%;left:0;right:0;z-index:10;background:var(--ink)}.mode-controls button{min-width:32px;min-height:32px}
