@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.resize{resize:both}.border{border-style:var(--tw-border-style);border-width:1px}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.grayscale{--tw-grayscale:grayscale(100%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.sepia{--tw-sepia:sepia(100%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}:root{--bg-base:#141414;--bg-surface:#1c1c1c;--bg-elevated:#242424;--bg-hover:#2c2c2c;--border:#2e2e2e;--border-strong:#3a3a3a;--text-primary:#f0f0f0;--text-secondary:#888;--text-muted:#555;--accent:#3b82f6;--accent-dim:#3b82f61f;--accent-glow:#3b82f640;--danger:#ef4444;--success:#22c55e;--left-w:252px;--right-w:224px}*,:before,:after{box-sizing:border-box}html{font-size:14px}body{background:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-family:DM Sans,sans-serif;line-height:1.5;overflow:hidden}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:2px}input[type=range]{appearance:none;background:var(--border-strong);cursor:pointer;border-radius:2px;outline:none;width:100%;height:3px;display:block}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);cursor:pointer;border-radius:50%;width:14px;height:14px;transition:transform .15s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.25)}input[type=range]:focus{outline:none}textarea,input[type=text],input[type=number]{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);border-radius:6px;outline:none;min-width:0;font-family:DM Sans,sans-serif;transition:border-color .15s}textarea:focus,input[type=text]:focus,input[type=number]:focus{border-color:var(--accent)}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}select{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);border-radius:6px;outline:none;font-family:DM Sans,sans-serif}button{font-family:DM Sans,sans-serif}@keyframes fadeIn{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseGlow{0%,to{box-shadow:0 0 0 0 var(--accent-glow)}50%{box-shadow:0 0 10px 3px #3b82f61f}}.animate-fadein{animation:.2s both fadeIn}.btn-export{animation:3s infinite pulseGlow}.app-shell{flex-direction:column;height:100vh;display:flex;overflow:hidden}.topbar{background:var(--bg-surface);border-bottom:1px solid var(--border);z-index:50;flex-shrink:0;justify-content:space-between;align-items:center;gap:8px;height:48px;padding:0 14px;display:flex}.editor-layout{flex:1;min-height:0;display:flex;overflow:hidden}.panel-left{width:var(--left-w);background:var(--bg-surface);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;min-width:0;display:flex;overflow:hidden}.panel-right{width:var(--right-w);background:var(--bg-surface);border-left:1px solid var(--border);flex-direction:column;flex-shrink:0;min-width:0;display:flex;overflow:hidden}.canvas-center{flex-direction:column;flex:1;min-width:0;min-height:0;display:flex;overflow:hidden}@media (max-width:1280px){:root{--left-w:236px;--right-w:210px}}@media (max-width:1100px){:root{--left-w:228px}.panel-right{display:none}}@media (max-width:860px){:root{--left-w:210px}}@media (max-width:680px){body{overflow-y:auto}.app-shell{height:auto;min-height:100dvh;overflow:visible}.editor-layout{flex-direction:column;flex:none;height:auto;overflow:visible}.panel-left{border-right:none;border-bottom:1px solid var(--border);width:100%;max-height:45vh;overflow:hidden auto}.canvas-center{flex-shrink:0;height:60vw;min-height:220px;overflow:hidden}.panel-right{border-left:none;border-top:1px solid var(--border);width:100%;max-height:50vh;display:flex;overflow-y:auto}}@media (max-width:420px){html{font-size:13px}.topbar{gap:6px;padding:0 10px}.canvas-center{height:65vw}.panel-left{max-height:42vh}}@media (max-width:680px){button{min-height:38px}input[type=range]{height:5px}input[type=range]::-webkit-slider-thumb{width:18px;height:18px}.side-panel button{min-height:34px}}@media (max-width:560px){.topbar-title,.topbar-badge,.topbar-dims,.topbar-sep,.label-reset{display:none}}.panel-left *,.panel-right *{max-width:100%}.panel-left textarea,.panel-left input[type=text],.panel-left input[type=number],.panel-right textarea,.panel-right input[type=text],.panel-right input[type=number]{width:100%;max-width:100%}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}