@font-face{font-family:Departure Mono;src:url(/fonts/DepartureMono-Regular.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Switzer;src:url(/fonts/Switzer-Variable.ttf) format("truetype-variations");font-weight:100 900;font-style:normal;font-display:block}:root{--bg: #050608;--bg-elev: rgba(14, 16, 20, .78);--line: rgba(255, 255, 255, .08);--line-strong: rgba(255, 255, 255, .18);--fg: #e7ecee;--fg-dim: #8a929a;--accent: #7cffb2;--mono: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;--panel-font: "Departure Mono", ui-monospace, "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;width:100%;background:var(--bg);color:var(--fg);font-family:var(--mono);font-size:13px;overflow:hidden;overscroll-behavior:none;-webkit-font-smoothing:antialiased}#stage{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:crosshair;background:radial-gradient(ellipse at center,#0a0c10,#050608 65%,#000)}.raw-view{position:fixed;inset:0;background:#000;z-index:5;display:none;overflow:auto;padding:24px}.raw-view.is-active{display:block}.raw-ascii{margin:0;padding:0;font-family:Departure Mono,ui-monospace,JetBrains Mono,SF Mono,Menlo,Consolas,monospace;line-height:1;letter-spacing:0;white-space:pre;color:#e7ecee;-webkit-user-select:text;user-select:text;cursor:text;text-rendering:geometricPrecision}.raw-copy{position:fixed;bottom:18px;left:18px;z-index:6;font-family:var(--panel-font);font-size:11px;letter-spacing:.08em;padding:8px 14px;border-radius:3px;border:1px solid var(--line-strong);background:#000000a6;color:var(--fg);cursor:pointer;backdrop-filter:blur(4px);transition:color .12s ease,border-color .12s ease,background .12s ease}.raw-copy:hover{border-color:var(--accent);color:var(--accent)}.raw-copy.is-copied{color:var(--bg);background:var(--accent);border-color:var(--accent)}.raw-hint{position:fixed;bottom:22px;left:100px;z-index:6;font-family:var(--panel-font);font-size:10px;letter-spacing:.06em;color:var(--fg-dim);pointer-events:none}.drop-hint{position:fixed;inset:0;display:grid;place-items:center;pointer-events:auto;z-index:10;transition:opacity .36s ease,transform .36s ease}.drop-hint.is-hidden{opacity:0;pointer-events:none;transform:scale(.98)}.drop-hint.is-drag{background:#7cffb20f}.drop-hint__inner{border:1px dashed var(--line-strong);padding:28px 40px;border-radius:4px;background:#00000059;backdrop-filter:blur(4px);text-align:center;letter-spacing:.08em;text-transform:lowercase;font-family:var(--panel-font)}.drop-hint__title{font-size:18px;color:var(--fg);margin-bottom:6px;text-transform:uppercase}.drop-hint__sub{font-size:11px;color:var(--fg-dim)}#file-input{position:absolute;inset:0;opacity:0;cursor:pointer}.panel{position:fixed;top:16px;right:16px;width:260px;background:var(--bg-elev);border:1px solid var(--line);border-radius:6px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:20;font-family:var(--panel-font);box-shadow:0 8px 32px #0006}.panel input,.panel select,.panel button{font-family:var(--panel-font)}.panel__head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--line);cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none}.panel.is-dragging,.panel.is-dragging .panel__head{cursor:grabbing}.panel.is-dragging{user-select:none}.panel__title:before{content:":: ";color:var(--fg-dim);letter-spacing:-.05em;margin-right:4px;opacity:.7}.panel__title{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-dim)}.panel__toggle{background:transparent;border:1px solid var(--line);color:var(--fg-dim);font-family:var(--mono);font-size:11px;width:22px;height:22px;border-radius:3px;cursor:pointer;line-height:1}.panel__toggle:hover{color:var(--fg);border-color:var(--line-strong)}.panel__body{padding:10px 14px 14px;display:flex;flex-direction:column;gap:8px}.panel.is-collapsed .panel__body{display:none}.panel__hint{margin-top:4px;padding-top:8px;border-top:1px solid var(--line);font-size:10px;color:var(--fg-dim);letter-spacing:.05em;text-align:center}.ctl{display:grid;grid-template-columns:88px 1fr 36px;align-items:center;column-gap:20px;row-gap:8px;font-size:11px;color:var(--fg-dim)}.ctl__label{text-transform:uppercase;letter-spacing:.06em}.ctl__value{text-align:right;color:var(--fg);font-variant-numeric:tabular-nums}.ctl input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;width:100%;margin:0}.ctl input[type=range]::-webkit-slider-runnable-track{height:2px;background:var(--line-strong);border-radius:1px}.ctl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--accent);margin-top:-5px;box-shadow:0 0 8px #7cffb299}.ctl input[type=range]::-moz-range-track{height:2px;background:var(--line-strong);border-radius:1px}.ctl input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;border:0;background:var(--accent);box-shadow:0 0 8px #7cffb299}.ctl select,.ctl__btn{grid-column:2 / 4;background:#0006;color:var(--fg);border:1px solid var(--line);border-radius:3px;padding:5px 8px;font-family:var(--mono);font-size:11px;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--fg-dim) 50%),linear-gradient(135deg,var(--fg-dim) 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 10px) 50%;background-size:4px 4px;background-repeat:no-repeat}.ctl__btn{background-image:none;text-align:center;letter-spacing:.08em}.ctl__btn:hover{border-color:var(--line-strong);color:var(--accent)}.ctl__toggle[aria-pressed=true]{color:var(--bg);background:var(--accent);border-color:var(--accent);box-shadow:0 0 12px #7cffb273}.ctl select:focus,.ctl input:focus,.ctl__btn:focus{outline:none;border-color:var(--accent)}.ctl input[type=color]{grid-column:2 / 4;width:100%;height:22px;padding:0;border:1px solid var(--line);border-radius:3px;background:transparent;cursor:pointer}.ctl--accent.is-hidden{display:none}.ctl-readouts{display:flex;gap:20px}.ctl-readouts .ctl--readout{flex:1}.ctl--readout{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.ctl--readout .ctl__value{text-align:left}@media (max-width: 640px){.panel{width:calc(100% - 24px);right:12px;top:12px}.drop-hint__inner{padding:20px 28px}}