:root{color-scheme:dark;font-family:Helvetica Neue,Avenir Next,Segoe UI,sans-serif;line-height:1.4;font-weight:400;background:#0a0b0d;color:#f3efe7;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg: #0a0b0d;--panel: #111318;--panel-2: #171a20;--line: #2a2f38;--line-strong: #3a404c;--text: #f3efe7;--muted: #98958d;--accent: #ff6a2b;--accent-ink: #170c07;--accent-cool: #4b7cff}*{box-sizing:border-box}html,body{height:100%}body{margin:0;min-height:100vh;min-height:100svh;background:linear-gradient(rgba(35,39,48,.34) 1px,transparent 1px),linear-gradient(90deg,rgba(35,39,48,.34) 1px,transparent 1px),radial-gradient(circle at top left,rgba(255,106,43,.08),transparent 24rem),linear-gradient(180deg,#0c0d10,#08090b);background-size:32px 32px,32px 32px,auto,auto}button,input,label{font:inherit}button{border:0;cursor:pointer}.app-shell{position:relative;height:100vh;height:100svh;padding:1rem}.ambient{display:none}.stage-layout{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:.9rem;max-width:110rem;height:100%;margin:0 auto;min-height:0}.preview-card,.control-dock{background:var(--panel);border:1px solid var(--line);border-radius:.9rem;box-shadow:0 0 0 1px #ffffff04}.preview-card{display:flex;min-height:0;padding:.8rem}.canvas-frame{position:relative;flex:1;display:flex;align-items:center;justify-content:center;width:100%;min-height:0;overflow:hidden;border-radius:.55rem;border:1px solid var(--line-strong);background:linear-gradient(180deg,rgba(255,255,255,.015),transparent 20%),#050608}.canvas-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 14%),linear-gradient(90deg,rgba(255,106,43,.045),transparent 18%,transparent 82%,rgba(75,124,255,.04));pointer-events:none}#stageCanvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;touch-action:none}#stageCanvas.is-draggable{cursor:grab}#stageCanvas.is-dragging{cursor:grabbing}.control-dock{display:grid;grid-template-columns:auto auto minmax(13rem,19rem) auto;gap:.75rem;align-items:center;padding:.7rem}.control-dock.is-active{border-color:var(--accent);box-shadow:0 0 0 1px #ff6a2b3d}.control-group{display:flex;align-items:center;gap:.65rem;min-height:3.35rem;padding:.42rem .5rem;border:1px solid var(--line);border-radius:.7rem;background:#0d1014}.control-group-buttons{flex-wrap:wrap;justify-self:start}.control-group-scale{width:100%;justify-self:center;padding:.42rem .75rem .42rem .9rem}.control-group-template{justify-self:center;padding:.42rem .6rem .42rem .85rem;gap:.8rem}.control-button{display:inline-flex;align-items:center;justify-content:center;min-height:2.45rem;padding:0 .88rem;border:1px solid var(--line-strong);border-radius:.45rem;background:var(--panel-2);color:var(--text);font-size:.92rem;font-weight:600;transition:border-color .14s ease,background-color .14s ease,color .14s ease}.control-button:hover{border-color:var(--accent)}.control-button:focus-visible,.template-button:focus-visible,.toggle-switch:focus-within .toggle-slider,input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.upload-button{position:relative;overflow:hidden;background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.upload-button:hover{border-color:#ff8454;background:#ff7a45}.control-button-muted{color:var(--muted);background:transparent}.upload-button input{position:absolute;inset:0;opacity:0;cursor:pointer}.scale-field{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;width:100%;color:var(--text);font-size:.92rem}.scale-field span,.scale-field strong,.toggle-text,.control-meta,.template-button{font-family:SF Mono,IBM Plex Mono,Menlo,Monaco,monospace;letter-spacing:.02em}.scale-field span,.toggle-text,.control-meta{color:var(--muted);font-size:.74rem;text-transform:uppercase}.scale-field strong{color:var(--text);font-size:.94rem}.template-selector{display:inline-flex;align-items:center;gap:.24rem;padding:.24rem;border:1px solid var(--line-strong);border-radius:.5rem;background:var(--panel-2)}.template-button{min-width:2.1rem;min-height:1.9rem;padding:0 .56rem;border:1px solid transparent;border-radius:.32rem;background:transparent;color:var(--muted);font-size:.78rem;font-weight:600;line-height:1;transition:border-color .14s ease,background-color .14s ease,color .14s ease}.template-button:hover{border-color:var(--line-strong);color:var(--text)}.template-button.is-active{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}input[type=range]{width:100%;margin:0;appearance:none;background:transparent}input[type=range]::-webkit-slider-runnable-track{height:.22rem;background:#3a3f49;border-radius:0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:.84rem;height:.84rem;margin-top:-.31rem;border:2px solid #0e0f12;border-radius:.18rem;background:var(--accent);box-shadow:0 0 0 1px #ffffff14}input[type=range]::-moz-range-track{height:.22rem;background:#3a3f49;border:0;border-radius:0}input[type=range]::-moz-range-thumb{width:.84rem;height:.84rem;border:2px solid #0e0f12;border-radius:.18rem;background:var(--accent);box-shadow:0 0 0 1px #ffffff14}.toggle-switch{display:inline-flex;align-items:center;justify-content:space-between;gap:.85rem;min-height:3.35rem;min-width:8.6rem;padding:.42rem .6rem .42rem .85rem;border:1px solid var(--line);border-radius:.7rem;background:#0d1014;cursor:pointer;-webkit-user-select:none;user-select:none;justify-self:end}.toggle-switch input{position:absolute;opacity:0;pointer-events:none}.toggle-slider{position:relative;display:inline-flex;width:2.9rem;height:1.7rem;border:1px solid var(--line-strong);border-radius:.45rem;background:var(--panel-2);transition:background-color .14s ease,border-color .14s ease}.toggle-slider:after{content:"";position:absolute;top:.17rem;left:.17rem;width:1.18rem;height:1.18rem;background:var(--text);border-radius:.22rem;transition:transform .14s ease,background-color .14s ease}.toggle-switch input:checked+.toggle-slider{background:var(--accent);border-color:var(--accent)}.toggle-switch input:checked+.toggle-slider:after{transform:translate(1.16rem);background:#180c07}.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}@media(max-width:820px){.app-shell{padding:.7rem}.stage-layout{gap:.7rem}.control-dock{grid-template-columns:1fr;align-items:stretch}.control-group,.toggle-switch{width:100%;justify-self:stretch}.control-group-scale{min-width:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}