:root{color:#fff;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#000;font-family:Courier New,monospace}*{box-sizing:border-box}body{background:#000;min-height:100vh;margin:0}button,input,select,summary{font:inherit;color:inherit;background:#000}button,input[type=text]{border:1px solid #444;padding:.65rem .8rem}button{cursor:pointer}button:hover,button:focus-visible{border-color:#fff}button:disabled{opacity:.45;cursor:not-allowed}.toggle[aria-pressed=true]{color:#000;background:#fff;border-color:#fff}#app{width:min(1100px,100% - 2rem);margin:auto;padding:clamp(1rem,4vw,3rem) 0}h1{margin:0 0 2rem;font-size:clamp(1.35rem,3vw,2rem);font-weight:400}.drop{text-align:center;border:1px dashed #555;place-content:center;gap:1.5rem;min-height:360px;display:grid}.drop.drag{border-color:#fff}.drop input{display:none}.workspace{gap:1.25rem;display:grid}.preview{aspect-ratio:16/9;background:#000;border:1px solid #333;place-items:center;width:100%;display:grid;overflow:hidden}.preview canvas{object-fit:contain;width:100%;height:100%;display:block}.controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.field{grid-template-columns:9rem minmax(0,1fr);align-items:center;gap:.75rem;display:grid}.field>span:first-child{white-space:nowrap}.range-control{grid-template-rows:auto auto;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:.75rem;min-width:0;display:grid}.range-control input{grid-area:1/1/auto/-1}.range-control output{color:#888;grid-area:2/1/auto/-1;justify-self:end;min-height:1.2em;font-size:.78rem;line-height:1.2}.select-control{min-width:0;display:block;position:relative}.select-control:after{content:"⌄";color:#fff;pointer-events:none;position:absolute;top:50%;right:.7rem;translate:0 -58%}.select-control select{appearance:none;color:#fff;cursor:pointer;background:#000;border:1px solid #444;border-radius:0;width:100%;min-width:0;padding:.65rem 2rem .65rem .8rem}.select-control select:hover,.select-control select:focus-visible{border-color:#fff;outline:none}.select-control option{color:#fff;background:#000}.select-control option:disabled{color:#777}.export-field{grid-template-columns:auto minmax(12rem,18rem);align-items:center;gap:.75rem;width:max-content;max-width:100%;display:grid}.actions,.transport{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.transport input[type=range]{flex:1;min-width:10rem}.actions{justify-content:space-between}.status{color:#aaa;min-height:1.5em}details{border-top:1px solid #333;padding-top:1rem}summary{cursor:pointer}.progress{width:100%}input[type=range]{appearance:none;cursor:ew-resize;background:0 0;height:20px;padding:0}input[type=range]::-webkit-slider-runnable-track{background:#777;border:0;height:1px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#000;border:1px solid #fff;border-radius:0;width:9px;height:17px;margin-top:-8px}input[type=range]:focus-visible::-webkit-slider-thumb{background:#fff}input[type=range]:hover::-webkit-slider-thumb{background:#fff}input[type=range]::-moz-range-track{background:#777;border:0;height:1px}input[type=range]::-moz-range-thumb{background:#000;border:1px solid #fff;border-radius:0;width:8px;height:16px}input[type=range]:focus-visible::-moz-range-thumb{background:#fff}input[type=range]:hover::-moz-range-thumb{background:#fff}@media (width<=700px){.controls{grid-template-columns:1fr}.field{grid-template-columns:7rem minmax(0,1fr)}.field>span:first-child{white-space:normal}.export-field{grid-template-columns:1fr;width:100%}.drop{min-height:55vh}}
