:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);--panel:#f5f5f2;--ink:#1d1d1b;--ink-2:#63635f;--line:#d9d9d4;--track:#cbcbc5;--fill:#1d1d1b;--thumb:#fff;--btn:#e6e6e1;--btn-hover:#dcdcd6;--focus:#c25a1c;--err:#b8361a;--stage:#111;--stage-ink:#d8d8d4}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--panel:#1f1f1e;--ink:#e9e9e5;--ink-2:#9a9a94;--line:#333331;--track:#3d3d3a;--fill:#e9e9e5;--thumb:#f4f4f0;--btn:#2c2c2a;--btn-hover:#383835;--focus:#f09a5c;--err:#ff9d80}}:root[data-theme=dark]{--panel:#1f1f1e;--ink:#e9e9e5;--ink-2:#9a9a94;--line:#333331;--track:#3d3d3a;--fill:#e9e9e5;--thumb:#f4f4f0;--btn:#2c2c2a;--btn-hover:#383835;--focus:#f09a5c;--err:#ff9d80}html{scroll-padding-top:env(safe-area-inset-top,0px)}html,body{height:100%;margin:0}#root{height:100%}body{background:var(--panel);color:var(--ink);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;font-family:Schibsted Grotesk,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.4}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.app{grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr) 344px 52px;height:100%;min-height:0;display:grid}.bar{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:12px;padding:10px 14px;line-height:20px;display:flex}.brand{letter-spacing:.01em;margin-right:4px;font-size:15px;font-weight:600}.bar .grow{flex:1;min-width:0}.meta{color:var(--ink-2);white-space:nowrap;text-overflow:ellipsis;max-width:100%;overflow:hidden}.meta.err{color:var(--err)}.stage{background:var(--stage);color:var(--stage-ink);flex-direction:column;min-width:0;min-height:0;display:flex;position:relative}.view{flex:1;min-height:0;padding:24px;display:flex;overflow:auto}.view:has(>canvas.actual){padding:0}.view canvas{background:#000;max-width:100%;max-height:100%;margin:auto;display:block}.view canvas.actual{max-width:none;max-height:none}.drop{z-index:5;pointer-events:none;background:#111111e0;justify-content:center;align-items:center;font-size:20px;font-weight:500;display:none;position:absolute;inset:0}.stage.dragging .drop{display:flex}.panel{border-left:1px solid var(--line);background:var(--panel);flex-direction:column;min-height:0;display:flex}.scroll{flex:1;min-height:0;overflow:auto}.panel select,.export select{font:inherit;background:var(--btn);color:var(--ink);border:0;border-radius:6px;padding:6px 8px}.scroll[hidden]{display:none}.looks{padding:6px 8px 14px}.looks h2{margin:12px 8px 6px;font-size:15px;font-weight:600}.look{text-align:left;background:0 0;border:0;border-radius:6px;width:100%;padding:7px 8px;display:block}.look:hover{background:var(--btn)}.look[aria-pressed=true]{background:var(--btn-hover);font-weight:600}.rail{border-left:1px solid var(--line);background:var(--panel);flex-direction:column;align-items:center;gap:6px;padding:10px 0;display:flex}.rail button{width:38px;height:38px;color:var(--ink-2);background:0 0;border:0;border-radius:8px;place-items:center;display:grid}.rail button:hover{color:var(--ink)}.rail button[aria-selected=true]{background:var(--btn);color:var(--ink)}details{border-bottom:1px solid var(--line)}summary{cursor:pointer;justify-content:space-between;align-items:center;padding:13px 16px;font-size:15px;font-weight:600;list-style:none;display:flex}summary::-webkit-details-marker{display:none}summary:after{content:"";border-right:1.5px solid var(--ink-2);border-bottom:1.5px solid var(--ink-2);width:7px;height:7px;margin-right:3px;transition:transform .12s;transform:rotate(45deg)}details[open] summary:after{transform:rotate(-135deg)}.note{color:var(--ink-2);max-width:60ch;margin:-4px 16px 6px;font-size:13px}.ctls{gap:9px;padding:4px 16px 14px;display:grid}.ctl{grid-template-columns:1fr auto;align-items:center;row-gap:1px;display:grid}.ctl label{color:var(--ink-2);-webkit-user-select:none;user-select:none}.ctl output{color:var(--ink);text-align:right;min-width:3.2em}.ctl input{appearance:none;background:0 0;grid-column:1/-1;width:100%;height:20px;margin:0}.ctl input::-webkit-slider-runnable-track{background:var(--tk);border-radius:2px;height:4px}.ctl input::-moz-range-track{background:var(--tk);border-radius:2px;height:4px}.ctl input::-webkit-slider-thumb{-webkit-appearance:none;background:var(--thumb);border:1px solid var(--ink-2);border-radius:50%;width:14px;height:14px;margin-top:-5px}.ctl input::-moz-range-thumb{background:var(--thumb);border:1px solid var(--ink-2);border-radius:50%;width:12px;height:12px}.ctl.color input::-webkit-slider-runnable-track{border-radius:3px;height:6px}.ctl.color input::-moz-range-track{border-radius:3px;height:6px}.ctl.color input::-webkit-slider-thumb{margin-top:-4px}.btn{background:var(--btn);border:0;border-radius:6px;padding:7px 12px}.btn:hover{background:var(--btn-hover)}.btn[aria-pressed=true]{background:var(--ink);color:var(--panel)}.btn.primary{background:var(--ink);color:var(--panel);font-weight:500}.btn.primary:hover{opacity:.88}.btn[disabled]{opacity:.5;cursor:progress}.rowbtns{flex-wrap:wrap;gap:8px;display:flex}.btn.icon{align-items:center;gap:6px;display:inline-flex}.export{border:1px solid var(--line);background:var(--panel);width:360px;max-width:calc(100vw - 32px);color:var(--ink);border-radius:10px;padding:0;box-shadow:0 16px 48px #00000059}.export::backdrop{background:#00000080}.export form{gap:12px;padding:14px 16px 16px;display:grid}.export header{justify-content:space-between;align-items:center;display:flex}.export h2{margin:0;font-size:15px;font-weight:600}.export .close{width:28px;height:28px;color:var(--ink-2);background:0 0;border:0;border-radius:6px;font-size:20px;line-height:1}.export .close:hover{background:var(--btn);color:var(--ink)}.export .line{align-items:center;gap:8px;display:flex}.export .ctl{flex:1}.export .ctl[hidden]{display:none}.export .rowbtns{justify-content:flex-end}.fine{color:var(--ink-2);margin:0;font-size:12.5px}@media (width<=860px){html,body{height:auto}.app{grid-template-rows:auto auto auto;grid-template-columns:1fr;height:auto}.stage{height:62svh}.view{padding:12px}.panel{border-left:0;border-top:1px solid var(--line)}.scroll{overflow:visible}}
