.editor-state{padding:26px;text-align:left;min-width:0}
.editor-state[hidden],.editor-state [hidden]{display:none!important}
.editor-heading,.editor-toolbar,.editor-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}
.editor-heading h2{margin:0;font-size:22px}
.editor-state .text-button{border:0;background:none;color:#355d4c;font:inherit;font-size:13px;cursor:pointer;padding:10px;min-height:44px;text-decoration:none;white-space:nowrap}
.editor-state .text-button:hover{text-decoration:underline;text-underline-offset:4px}
.editor-state button:focus-visible,.editor-state summary:focus-visible,.trim-track:focus-visible{outline:3px solid #688950;outline-offset:3px}
.editor-screen{display:flex;justify-content:center;background:#e6e9e2;border-radius:12px;padding:24px;margin-top:20px;overflow:hidden}
.editor-stage{position:relative;overflow:hidden;flex:none;max-width:100%;background:#121912}
.editor-stage.is-cropping{overflow:visible}
.editor-stage video{position:absolute;display:block;object-fit:fill;max-width:none}
#crop-box{position:absolute;border:2px solid #efffd9;box-shadow:0 0 0 2000px #10221ba8;cursor:move;touch-action:none;box-sizing:border-box}
#crop-box:focus-visible{outline:3px solid #bddf8e;outline-offset:3px}
.crop-handle{position:absolute;width:44px;height:44px;padding:0;border:0;background:transparent;touch-action:none;z-index:1}
.crop-handle:after{content:'';position:absolute;width:9px;height:9px;left:17px;top:17px;background:white;border:1px solid #234539;border-radius:2px;box-shadow:0 1px 4px #10221b40}
.crop-handle.nw{top:-22px;left:-22px;cursor:nwse-resize}.crop-handle.ne{top:-22px;right:-22px;cursor:nesw-resize}.crop-handle.sw{bottom:-22px;left:-22px;cursor:nesw-resize}.crop-handle.se{bottom:-22px;right:-22px;cursor:nwse-resize}
.crop-handle.n{top:-22px;left:calc(50% - 22px);cursor:ns-resize}.crop-handle.s{bottom:-22px;left:calc(50% - 22px);cursor:ns-resize}.crop-handle.w{left:-22px;top:calc(50% - 22px);cursor:ew-resize}.crop-handle.e{right:-22px;top:calc(50% - 22px);cursor:ew-resize}
.editor-toolbar{margin:12px 0;flex-wrap:wrap}
.editor-toolbar .button,.crop-controls .button{padding:10px 15px;font-size:13px;min-height:44px}
.editor-tools{display:flex;align-items:center;gap:2px}
.editor-tools [aria-expanded=true]{background:#e8edde;border-radius:8px}
.editor-hint{font-size:12px;line-height:1.6;color:#69756c;margin:10px 0}
.crop-controls{padding:0 0 14px;margin-bottom:16px;border-bottom:1px solid #dce1d6;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.crop-controls>div{display:flex;align-items:center;gap:6px}
#trim-panel{padding-top:6px;border-top:1px solid #dce1d6}
.trim-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:14px 0;font-size:12px;color:#637268;font-variant-numeric:tabular-nums}
#trim-duration{font-weight:600;color:#34583f}
.trim-track{position:relative;height:64px;background:#bac4b7;border-radius:5px;touch-action:none;margin:0 22px;cursor:crosshair}
#trim-thumbs{display:flex;height:100%;overflow:hidden;border-radius:5px;opacity:.65;pointer-events:none}
#trim-thumbs canvas{width:12.5%;height:100%;object-fit:cover}
#trim-selection{position:absolute;top:0;height:100%;border:3px solid #34583f;background:#d3ee951c;box-sizing:border-box;cursor:grab;min-width:3px}
#trim-selection button{position:absolute;top:-3px;height:64px;width:44px;background:transparent;border:0;cursor:ew-resize;touch-action:none;border-radius:4px;padding:0}
#trim-selection button:before{content:'';position:absolute;top:0;bottom:0;width:14px;left:15px;border-radius:4px;background:#34583f}
#trim-selection button:after{content:'';position:absolute;left:21px;top:22px;height:20px;width:2px;background:white}
#trim-start-handle{left:-25px}#trim-end-handle{right:-25px}
#trim-playhead{position:absolute;top:4px;bottom:4px;width:2px;background:white;box-shadow:0 0 0 1px #27463355;pointer-events:none}
.trim-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:7px}
.trim-caption .editor-hint{margin:0}
#trim-precise{margin:6px 0 12px;color:#637268;font-size:12px}
#trim-precise summary{padding:12px 0;min-height:20px;cursor:pointer;width:fit-content}
.time-fields{display:flex;align-items:end;gap:12px;margin:2px 0 12px}
.time-fields label{font-size:12px;color:#637268}
.time-fields input{display:block;width:110px;max-width:100%;padding:11px;border:1px solid #cbd3c8;border-radius:7px;font:inherit;font-size:16px;font-variant-numeric:tabular-nums;background:white;color:#243a2c;margin-top:6px}
.time-fields>span{padding-bottom:12px;font-size:12px;color:#637268}
.editor-summary{font-size:12px;line-height:1.6;color:#69756c;margin:16px 0 0;font-variant-numeric:tabular-nums}
.editor-actions{border-top:1px solid #dce1d6;padding-top:18px;margin-top:18px}
.editor-actions>span{font-size:12px;color:#6f7b70}
.editor-actions .button:disabled{opacity:.45;cursor:wait}
#editor-message{font-size:13px;line-height:1.6;color:#a34b2a}
.editor-state .filename{margin-top:8px}
.editor-state .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body[data-state=editor] .intro{margin-bottom:22px}body[data-state=editor] .intro h1{font-size:36px}body[data-state=editor] .eyebrow{display:none}
@media(max-width:540px){
  .editor-state{padding:16px 12px}.editor-heading{gap:6px}.editor-heading h2{font-size:19px;line-height:1.4}.editor-heading .text-button{font-size:12px;padding-inline:6px}
  .editor-screen{padding:22px;margin-top:16px}.editor-toolbar{gap:4px}.editor-toolbar .button{padding-inline:12px}.editor-tools .text-button{font-size:12px;padding-inline:9px}
  .editor-actions{align-items:center;flex-direction:column;gap:10px}.editor-actions .button{width:100%}.editor-actions>span{font-size:11px;text-align:center}
  .editor-hint{font-size:11px}.trim-heading{font-size:11px}.trim-caption{align-items:flex-start;gap:5px}.trim-caption .editor-hint{margin-top:9px}.trim-caption .text-button{font-size:12px;padding-inline:5px}
  .time-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 12px}.time-fields input{box-sizing:border-box;width:100%}.time-fields>span{display:none}
  .crop-controls{align-items:flex-start;gap:0}.crop-controls>div{margin-left:auto}.crop-controls .editor-hint{margin:10px 0 0}
}