*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--panel-bg: #100E0F;--panel-border: #1a1a1a;--surface: #141414;--surface-2: #1a1a1e;--surface-3: #222226;--text: #e0e0e0;--text-dim: #6b6b78;--pink: #E74694;--purple: #9061F9;--accent: #9061F9;--accent-hover: #a87bff;--grad: linear-gradient(135deg, #E74694, #9061F9);--grad-h: linear-gradient(135deg, #f05aa6, #a87bff);--danger: #c0392b;--danger-hover: #e74c3c;--radius: 8px;--radius-sm: 6px;--panel-width: 248px;--section-bg: #111114;--section-border: #1e1e24;--slider-track-h: 28px;--slider-track-r: 14px;--slider-thumb: 22px;--slider-thumb-r: 8px;--slider-compact-track-h: 22px;--slider-compact-track-r: 11px;--slider-compact-thumb: 16px;--slider-compact-thumb-r: 6px;--slider-ease: cubic-bezier(.22, .68, 0, 1.12);--slider-ease-out: cubic-bezier(.2, .8, .2, 1);--slider-duration: .16s;--slider-duration-snap: 80ms;--slider-duration-release: .32s;--slider-fill-opacity: .18;--slider-fill-color: rgba(144, 97, 249, var(--slider-fill-opacity));--slider-glow: rgba(144, 97, 249, .25);--slider-glow-strong: rgba(144, 97, 249, .4);--slider-glow-pink: rgba(231, 70, 148, .35);--slider-shadow: 0 2px 8px rgba(144, 97, 249, .3);--slider-shadow-hover: 0 2px 12px rgba(144, 97, 249, .45);--slider-shadow-active: 0 2px 16px rgba(231, 70, 148, .4);--tooltip-bg: rgba(17, 17, 20, .92);--tooltip-border: rgba(144, 97, 249, .25);--tooltip-text: #e0e0e0}html,body{height:100%;overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;color:var(--text);background:#100e0f}body{display:flex;flex-direction:column}.app-body{display:flex;flex:1;min-height:0}.top-bar{height:44px;background:var(--panel-bg);border-bottom:1px solid var(--panel-border);display:flex;align-items:center;padding:0 16px;flex-shrink:0;z-index:100;gap:4px}.top-bar__logo{height:22px;width:auto;margin-right:8px;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.top-bar__btn{display:flex;align-items:center;gap:6px;padding:6px 16px;border:1px solid var(--section-border);border-radius:var(--radius);background:var(--surface-2);color:var(--text-dim);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;cursor:pointer;font-family:inherit;transition:all .15s ease}.top-bar__btn:hover{background:var(--surface-3);border-color:#2e2e36;color:var(--text)}.top-bar__btn[data-firm-cat=cfd]{background:linear-gradient(135deg,#e74694,#9061f9);border-color:transparent;color:#fff}.top-bar__btn[data-firm-cat=cfd]:hover{background:linear-gradient(135deg,#f05aa6,#a87bff)}.top-bar__btn[data-firm-cat=futures]{background:linear-gradient(135deg,#ff5a1f,#9061f9);border-color:transparent;color:#fff}.top-bar__btn[data-firm-cat=futures]:hover{background:linear-gradient(135deg,#ff7340,#a87bff)}.top-bar__btn[data-firm-cat=crypto]{background:linear-gradient(135deg,#84e1bc,#057a55);border-color:transparent;color:#fff}.top-bar__btn[data-firm-cat=crypto]:hover{background:linear-gradient(135deg,#9aeacc,#069964)}.top-bar__btn[data-firm-cat=platforms]{background:linear-gradient(135deg,#60a5fa,#6366f1);border-color:transparent;color:#fff}.top-bar__btn[data-firm-cat=platforms]:hover{background:linear-gradient(135deg,#7bb8fc,#818cf8)}.top-bar__arrow{font-size:10px;transition:transform .2s ease}.top-bar__btn.active{box-shadow:0 0 0 2px #ffffff40}.top-bar__btn.active .top-bar__arrow{transform:rotate(180deg)}.top-bar__spacer{flex:1}.top-bar__render-wrap{position:relative}.top-bar__render-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid rgba(144,97,249,.3);border-radius:var(--radius);background:#9061f91a;color:var(--purple);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;font-family:inherit;transition:all .15s ease}.top-bar__render-btn:hover{background:#9061f92e;border-color:#9061f980;color:var(--accent-hover)}.top-bar__render-caret{transition:transform .15s ease}.top-bar__render-wrap.open .top-bar__render-caret{transform:rotate(180deg)}.top-bar__render-menu{position:absolute;top:calc(100% + 6px);right:0;width:200px;padding:8px;background:#111114f5;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.06);border-radius:10px;box-shadow:0 8px 32px #00000080;display:flex;flex-direction:column;gap:6px;visibility:hidden;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .12s ease,transform .12s ease,visibility 0s .12s;z-index:200}.top-bar__render-wrap.open .top-bar__render-menu{visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto;transition:opacity .12s ease,transform .12s ease,visibility 0s}.render-menu__row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:var(--text-dim)}.render-menu__row select{width:auto;min-width:90px;padding:4px 8px;font-size:11px}.render-menu__divider{height:1px;background:#ffffff0f;margin:2px 0}.render-menu__export{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:8px;border:none;border-radius:var(--radius-sm);background:var(--grad);color:#fff;font-size:11px;font-weight:600;cursor:pointer;font-family:inherit;transition:opacity .15s ease}.render-menu__export:hover{opacity:.88}.render-menu__export:disabled{opacity:.5;cursor:not-allowed}.btn--action-export{background:var(--grad);border-color:transparent;color:#fff}.btn--action-export svg{opacity:1}.btn--action-export:hover{background:var(--grad-h);border-color:transparent;color:#fff;opacity:.92}.btn--action-export:active{opacity:.85}.btn--action-export:disabled{opacity:.5;cursor:not-allowed}.top-bar__upload{display:flex;align-items:center;gap:5px;padding:6px 14px;border:1px dashed #2a2a30;border-radius:var(--radius);background:var(--surface-2);color:var(--text-dim);font-size:11px;font-weight:500;cursor:pointer;transition:all .15s ease}.top-bar__upload:hover{border-color:var(--purple);color:var(--purple);background:#9061f90d}.firm-sidebar{position:relative;width:0;flex-shrink:0;background:var(--panel-bg);border-left:1px solid var(--panel-border);overflow:hidden;display:flex;flex-direction:column;transition:width .25s cubic-bezier(.16,1,.3,1)}.firm-sidebar.open{width:144px}.firm-sidebar__collapse{position:absolute;top:6px;left:-20px;width:20px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--panel-bg);border:1px solid var(--section-border);border-right:none;border-radius:var(--radius-sm) 0 0 var(--radius-sm);color:var(--text-dim);font-size:10px;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .2s ease,color .15s ease,background .15s ease;z-index:1;padding:0;font-family:inherit}.firm-sidebar.open .firm-sidebar__collapse{opacity:1;pointer-events:auto}.firm-sidebar__collapse:hover{color:var(--text);background:var(--surface-2)}.firm-sidebar__search{width:calc(100% - 12px);margin:6px 6px 0;padding:6px 10px;border:1px solid var(--section-border);border-radius:var(--radius);background:var(--surface-2);color:var(--text);font-size:11px;font-family:inherit;outline:none;flex-shrink:0;transition:border-color .15s ease}.firm-sidebar__search::placeholder{color:var(--text-dim)}.firm-sidebar__search:focus{border-color:var(--purple)}.firm-sidebar__grid{width:144px;padding:6px;overflow-x:hidden;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;align-content:start;overflow-y:auto;flex:1;min-height:0}.firm-sidebar__grid::-webkit-scrollbar{width:4px}.firm-sidebar__grid::-webkit-scrollbar-track{background:transparent}.firm-sidebar__grid::-webkit-scrollbar-thumb{background:#2a2a30;border-radius:2px}.firm-logo-btn{position:relative;display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;padding:3px;border:1px solid transparent;border-radius:var(--radius-sm);background:#ffffff08;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .12s ease;font-family:inherit}.firm-logo-btn:hover{background:#9061f914;border-color:#9061f94d;transform:scale(1.06)}.firm-logo-btn:active{transform:scale(.95)}.firm-logo-btn.active{background:#9061f91f;border-color:var(--purple)}.firm-logo-btn img{width:100%;height:100%;object-fit:contain;border-radius:3px}.firm-logo-btn[data-tooltip]:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(4px);padding:4px 8px;background:#141414f2;border:1px solid #2a2a30;border-radius:var(--radius-sm);color:var(--text);font-size:10px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s ease,transform .15s ease;z-index:10}.firm-logo-btn:hover[data-tooltip]:after{opacity:1;transform:translate(-50%) translateY(0)}.panel{width:var(--panel-width);flex-shrink:0;background:var(--panel-bg);border-color:var(--panel-border);padding:16px 14px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}.panel--left{border-right:1px solid var(--panel-border)}.panel--right{border-left:1px solid var(--panel-border);gap:10px}.panel--right h2,.panel--right h3{margin-bottom:2px}.panel--right .divider{margin:4px 0}.panel--right #environmentControls,.panel--right #coinLayoutControls{display:flex;flex-direction:column;gap:10px}.viewport{flex:1;position:relative;background:#100e0f}.viewport.transparent-bg{background:repeating-conic-gradient(#1a1a1a,#1a1a1a 25%,#141414 0%,#141414 50%) 50% / 20px 20px}.viewport canvas{display:block;width:100%!important;height:100%!important}.viewport-toolbar{position:absolute;top:12px;right:12px;z-index:10;display:flex;gap:6px}.btn--icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:1px solid #2a2a30;border-radius:var(--radius);background:#141414cc;color:var(--text-dim);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:all .15s ease}.btn--icon:hover{background:#1e1e1ee6;border-color:#3a3a42;color:var(--text)}.btn--icon.flash{background:var(--grad);border-color:transparent;color:#fff}.viewport-extrude{position:absolute;bottom:68px;left:50%;transform:translate(-50%);z-index:10;display:none;align-items:center;gap:16px;padding:10px 20px;background:#0d0d0dcc;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.06);border-radius:12px;box-shadow:0 4px 24px #0006;white-space:nowrap;min-width:420px}.viewport-extrude .control{display:flex;align-items:center;gap:8px;margin:0;padding:0;flex:1;min-width:0}.viewport-extrude .control>span{font-size:11px;color:var(--text-dim);white-space:nowrap;min-width:fit-content}.viewport-extrude .control input[type=range]{flex:1;min-width:80px}.extrude-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;padding-right:12px;border-right:1px solid rgba(255,255,255,.08)}.extrude-toggle input{display:none}.extrude-toggle__track{position:relative;width:40px;height:22px;border-radius:11px;background:#ffffff1a;border:1px solid rgba(255,255,255,.12);transition:background .2s ease,border-color .2s ease,box-shadow .2s ease}.extrude-toggle__knob{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--text-dim);transition:transform .2s cubic-bezier(.22,.68,0,1.12),background .2s ease,box-shadow .2s ease}.extrude-toggle input:checked~.extrude-toggle__track{background:linear-gradient(135deg,var(--pink),var(--purple));border-color:#9061f980;box-shadow:0 0 10px #e746944d}.extrude-toggle input:checked~.extrude-toggle__track .extrude-toggle__knob{transform:translate(18px);background:#fff;box-shadow:0 1px 4px #0000004d}.extrude-toggle__label{font-size:11px;font-weight:600;color:var(--text-dim);letter-spacing:.5px;text-transform:uppercase;transition:color .2s ease}.extrude-toggle input:checked~.extrude-toggle__label{color:#fff}.extrude-toggle:hover .extrude-toggle__track{border-color:#9061f966;box-shadow:0 0 8px #9061f933}.viewport-actions{position:absolute;bottom:16px;left:50%;transform:translate(-50%);z-index:10;display:flex;align-items:center;gap:4px;padding:4px;background:#0d0d0dbf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.06);border-radius:12px;box-shadow:0 4px 24px #0006}.action-divider{width:1px;height:20px;background:#ffffff14;margin:0 2px}.btn--action{display:flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text-dim);font-size:11px;font-weight:500;font-family:inherit;cursor:pointer;white-space:nowrap;transition:background .15s ease,color .15s ease,border-color .15s ease}.btn--action:hover{background:#ffffff0f;border-color:#ffffff14;color:var(--text)}.btn--action:active{background:#ffffff1a}.btn--action.active{background:#9061f926;border-color:#9061f94d;color:#fff}.btn--action-danger:hover{color:var(--danger-hover);background:#e74c3c1a;border-color:#e74c3c33}.btn--action kbd{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 4px;border-radius:4px;background:#ffffff14;border:1px solid rgba(255,255,255,.1);font-family:SF Mono,Fira Code,monospace;font-size:10px;font-weight:600;color:inherit;line-height:1}.btn--action svg{flex-shrink:0;opacity:.7}.btn--action:hover svg{opacity:1}h2{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.8px;color:var(--text-dim);margin-bottom:2px}h3{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.8px;color:var(--text-dim)}.panel>h2,.panel>h3{padding:0 2px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border:1px solid var(--section-border);border-radius:var(--radius);background:var(--surface-2);color:var(--text);font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;transition:all .15s ease}.btn:hover{background:var(--surface-3);border-color:#2e2e36}.btn--danger{border-color:var(--danger);color:var(--danger)}.btn--danger:hover{background:var(--danger);border-color:var(--danger);color:#fff}.btn--preset{flex:1;padding:6px 10px;font-size:11px;text-transform:uppercase;letter-spacing:.5px}.btn--preset.active{background:var(--grad);border-color:transparent;color:#fff;font-weight:700}.preset-row{display:flex;gap:6px}.upload-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:2px dashed #2a2a30;border-radius:var(--radius);background:var(--surface-2);color:var(--text-dim);font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.upload-btn:hover{border-color:var(--purple);color:var(--purple);background:#9061f90d}.file-name{font-size:11px;color:var(--purple);word-break:break-all;min-height:0}.file-name:empty{display:none}.control--check{flex-direction:row;align-items:center;gap:8px;cursor:pointer}.control--check input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border:1px solid #3a3a42;border-radius:4px;background:var(--surface-2);cursor:pointer;flex-shrink:0;position:relative;transition:all .15s ease}.control--check input[type=checkbox]:checked{background:var(--grad);border-color:transparent}.control--check input[type=checkbox]:checked:after{content:"";position:absolute;left:4px;top:1px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}.control--check span{color:var(--text-dim);font-size:12px}.preview{display:none;width:80px;height:80px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--section-border)}.control{display:flex;flex-direction:column;gap:4px}.control span{display:flex;justify-content:space-between;font-size:11px;color:var(--text-dim)}.val{font-family:SF Mono,Fira Code,monospace;font-size:11px;color:var(--text)}input[type=range]{--fill: 0%;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:var(--slider-track-h);background:transparent;outline:none;cursor:pointer;margin:0}input[type=range]::-webkit-slider-runnable-track{height:var(--slider-track-h);border-radius:var(--slider-track-r);background:linear-gradient(to right,var(--slider-fill-color) var(--fill),var(--surface-2) var(--fill));border:1px solid var(--section-border);transition:box-shadow var(--slider-duration) var(--slider-ease-out),border-color var(--slider-duration) var(--slider-ease-out)}input[type=range]:hover::-webkit-slider-runnable-track{box-shadow:0 0 8px var(--slider-glow)}input[type=range]:active::-webkit-slider-runnable-track,input[type=range].dragging::-webkit-slider-runnable-track{box-shadow:0 0 12px var(--slider-glow-strong);border-color:#9061f94d}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:var(--slider-thumb);height:var(--slider-thumb);border-radius:var(--slider-thumb-r);background:var(--grad);border:none;margin-top:2px;box-shadow:var(--slider-shadow);transition:transform var(--slider-duration-release) var(--slider-ease),box-shadow var(--slider-duration-release) var(--slider-ease);cursor:pointer}input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.1);box-shadow:var(--slider-shadow-hover);transition:transform var(--slider-duration) var(--slider-ease-out),box-shadow var(--slider-duration) var(--slider-ease-out)}input[type=range]:active::-webkit-slider-thumb,input[type=range].dragging::-webkit-slider-thumb{transform:scale(1.18);box-shadow:var(--slider-shadow-active);transition:transform var(--slider-duration-snap) ease-out,box-shadow var(--slider-duration-snap) ease-out}input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--panel-bg),0 0 0 4px var(--purple)}input[type=range]::-moz-range-track{height:var(--slider-track-h);border-radius:var(--slider-track-r);background:var(--surface-2);border:1px solid var(--section-border);transition:box-shadow var(--slider-duration) var(--slider-ease-out),border-color var(--slider-duration) var(--slider-ease-out)}input[type=range]::-moz-range-progress{height:var(--slider-track-h);border-radius:var(--slider-track-r);background:var(--slider-fill-color)}input[type=range]:hover::-moz-range-track{box-shadow:0 0 8px var(--slider-glow)}input[type=range]:active::-moz-range-track,input[type=range].dragging::-moz-range-track{box-shadow:0 0 12px var(--slider-glow-strong);border-color:#9061f94d}input[type=range]::-moz-range-thumb{width:var(--slider-thumb);height:var(--slider-thumb);border-radius:var(--slider-thumb-r);background:var(--grad);border:none;box-shadow:var(--slider-shadow);cursor:pointer;transition:width var(--slider-duration-release) var(--slider-ease),height var(--slider-duration-release) var(--slider-ease),box-shadow var(--slider-duration-release) var(--slider-ease)}input[type=range]:hover::-moz-range-thumb{width:24px;height:24px;box-shadow:var(--slider-shadow-hover);transition:width var(--slider-duration) var(--slider-ease-out),height var(--slider-duration) var(--slider-ease-out),box-shadow var(--slider-duration) var(--slider-ease-out)}input[type=range]:active::-moz-range-thumb,input[type=range].dragging::-moz-range-thumb{width:26px;height:26px;background:var(--grad-h);box-shadow:var(--slider-shadow-active);transition:width var(--slider-duration-snap) ease-out,height var(--slider-duration-snap) ease-out,box-shadow var(--slider-duration-snap) ease-out}input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 2px var(--panel-bg),0 0 0 4px var(--purple)}input[type=range]:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}input[type=range]:disabled::-webkit-slider-thumb{background:#3a3a42;box-shadow:none}input[type=range]:disabled::-webkit-slider-runnable-track{background:var(--surface-2);box-shadow:none}input[type=range]:disabled::-moz-range-thumb{background:#3a3a42;box-shadow:none}input[type=range]:disabled::-moz-range-track{box-shadow:none}input[type=range]:disabled::-moz-range-progress{background:transparent}.control:has(input:disabled) span{opacity:.5}.slider-tooltip{position:fixed;z-index:10000;padding:3px 8px;background:var(--tooltip-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--tooltip-border);border-radius:var(--radius-sm);color:var(--tooltip-text);font-family:SF Mono,Fira Code,monospace;font-size:11px;line-height:1.4;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .1s ease,transform .1s ease}.slider-tooltip.visible{opacity:1;transform:translateY(0)}.preset-slots{position:relative;display:flex;gap:4px;margin-top:2px;align-items:center}.btn--slot{flex:1;padding:6px 4px;font-size:11px;font-weight:600;border:1px solid var(--section-border);border-radius:var(--radius);background:var(--surface-2);color:var(--text-dim);cursor:pointer;font-family:inherit;transition:all .15s ease}.btn--slot:hover{background:var(--surface-3);border-color:#2e2e36;color:var(--text)}.btn--slot.active{background:var(--grad);border-color:transparent;color:#fff}.btn--slot.saved{border-color:#3a3a42;color:var(--text)}.slot-popover{display:none;position:absolute;z-index:200;background:var(--surface-2);border:1px solid var(--section-border);border-radius:var(--radius);padding:4px;min-width:110px;box-shadow:0 4px 12px #00000073}.slot-popover.open{display:flex;flex-direction:column}.slot-popover:after{content:"";position:absolute;bottom:-5px;left:50%;transform:translate(-50%) rotate(45deg);width:8px;height:8px;background:var(--surface-2);border-right:1px solid var(--section-border);border-bottom:1px solid var(--section-border)}.slot-popover__item{display:block;width:100%;padding:6px 10px;font-size:11px;font-weight:500;background:none;border:none;border-radius:calc(var(--radius) - 2px);color:var(--text);cursor:pointer;text-align:left;font-family:inherit;transition:background .12s ease}.slot-popover__item:hover{background:var(--surface-3)}select{width:100%;padding:7px 10px;border:1px solid var(--section-border);border-radius:var(--radius);background:var(--surface-2);color:var(--text);font-size:12px;font-family:inherit;cursor:pointer;outline:none;transition:border-color .15s ease}select:hover{border-color:#2e2e36}select:focus{border-color:var(--purple)}.view-presets{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.save-view-popover{display:none;position:absolute;z-index:200;top:calc(100% + 8px);right:0;background:var(--surface-2);border:1px solid var(--section-border);border-radius:var(--radius);padding:6px;gap:4px;box-shadow:0 4px 12px #00000073;grid-column:1 / -1}.save-view-popover.open{display:flex;align-items:center}.save-view-popover:before{content:"";position:absolute;top:-5px;right:14px;transform:rotate(-135deg);width:8px;height:8px;background:var(--surface-2);border-right:1px solid var(--section-border);border-bottom:1px solid var(--section-border)}.save-view-popover input{flex:1;min-width:0;padding:4px 8px;font-size:11px;font-family:inherit;color:var(--text);background:var(--surface-1);border:1px solid var(--section-border);border-radius:calc(var(--radius) - 2px);outline:none;transition:border-color .15s ease}.save-view-popover input:focus{border-color:var(--purple)}.save-view-popover .btn--view{flex-shrink:0;white-space:nowrap}.btn--view{padding:7px 4px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.btn--view.active{background:var(--grad);border-color:transparent;color:#fff;font-weight:700}.bloom-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.btn--bloom{padding:7px 4px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.btn--bloom.active{background:var(--grad);border-color:transparent;color:#fff;font-weight:700}.anim-presets{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}.btn--anim{padding:7px 4px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.btn--anim.active{background:var(--grad);border-color:transparent;color:#fff;font-weight:700}.anim-curve-editor{display:flex;flex-direction:column;gap:8px}.curve-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.btn--curve{padding:7px 4px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.btn--curve.active{background:var(--grad);border-color:transparent;color:#fff;font-weight:700}#curveCanvas{width:100%;aspect-ratio:1;border:1px solid var(--section-border);border-radius:var(--radius);cursor:crosshair;touch-action:none}.color-presets{display:flex;gap:8px}.swatch{width:36px;height:36px;border-radius:50%;border:2px solid #2a2a30;cursor:pointer;transition:all .15s ease;padding:0;background:none}.swatch:hover{transform:scale(1.1);border-color:#555}.swatch.active{border-color:#fff;box-shadow:0 0 0 2px #ffffff26}.swatch[data-color]{background-color:attr(data-color)}.gradient-controls{display:none;flex-direction:column;gap:10px}.gradient-controls.visible{display:flex}.vec-pad{position:relative;width:100%;aspect-ratio:1;background:var(--surface-2);border:1px solid var(--section-border);border-radius:var(--radius);cursor:crosshair;touch-action:none;overflow:hidden}.vec-pad__crosshair{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.vec-pad__crosshair:before,.vec-pad__crosshair:after{content:"";position:absolute;background:#2a2a30}.vec-pad__crosshair:before{left:50%;top:0;width:1px;height:100%}.vec-pad__crosshair:after{top:50%;left:0;height:1px;width:100%}.vec-pad__dot{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--grad);border:2px solid #000;transform:translate(-50%,-50%);left:50%;top:50%;pointer-events:none;transition:box-shadow .15s ease;box-shadow:0 0 0 2px #9061f940}.collapsible{border:1px solid var(--section-border);border-radius:var(--radius);background:var(--section-bg)}.collapsible__toggle{cursor:pointer;padding:10px 12px;list-style:none;display:flex;align-items:center;justify-content:space-between}.collapsible__toggle::-webkit-details-marker{display:none}.collapsible__toggle h2{margin:0}.collapsible__toggle:after{content:"";width:6px;height:6px;border-right:2px solid var(--text-dim);border-bottom:2px solid var(--text-dim);transform:rotate(-45deg);transition:transform .15s ease;flex-shrink:0}.collapsible[open]>.collapsible__toggle:after{transform:rotate(45deg)}.collapsible__body{display:flex;flex-direction:column;gap:8px;padding:0 12px 12px}.collapsible__body .control{gap:2px}.collapsible__body input[type=range]{height:var(--slider-compact-track-h)}.collapsible__body input[type=range]::-webkit-slider-runnable-track{height:var(--slider-compact-track-h);border-radius:var(--slider-compact-track-r)}.collapsible__body input[type=range]::-webkit-slider-thumb{width:var(--slider-compact-thumb);height:var(--slider-compact-thumb);border-radius:var(--slider-compact-thumb-r);margin-top:2px}.collapsible__body input[type=range]::-moz-range-track{height:var(--slider-compact-track-h);border-radius:var(--slider-compact-track-r)}.collapsible__body input[type=range]::-moz-range-progress{height:var(--slider-compact-track-h);border-radius:var(--slider-compact-track-r)}.collapsible__body input[type=range]::-moz-range-thumb{width:var(--slider-compact-thumb);height:var(--slider-compact-thumb);border-radius:var(--slider-compact-thumb-r)}.collapsible__body input[type=range]:hover::-moz-range-thumb{width:18px;height:18px}.collapsible__body input[type=range]:active::-moz-range-thumb,.collapsible__body input[type=range].dragging::-moz-range-thumb{width:19px;height:19px}.divider{height:1px;background:var(--section-border);margin:2px 0}.panel::-webkit-scrollbar{width:4px}.panel::-webkit-scrollbar-track{background:transparent}.panel::-webkit-scrollbar-thumb{background:#2a2a30;border-radius:2px}.color-swatch{display:flex;align-items:center;gap:8px;width:100%;height:34px;padding:3px;border:1px solid var(--section-border);border-radius:var(--radius);background:var(--surface-2);cursor:pointer;transition:border-color .15s ease;font-family:inherit}.color-swatch:hover{border-color:#2e2e36}.color-swatch:focus-visible{outline:2px solid var(--purple);outline-offset:1px}.color-swatch__preview{width:26px;height:26px;border-radius:var(--radius-sm);flex-shrink:0;border:1px solid rgba(255,255,255,.06)}.color-swatch__hex{font-family:SF Mono,Fira Code,monospace;font-size:11px;color:var(--text-dim)}.irid-palette{display:flex;gap:6px;padding:4px 0}.irid-chip{width:24px;height:24px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:border-color .15s ease,transform .1s ease;box-shadow:0 0 0 1px #ffffff14}.irid-chip:hover{transform:scale(1.15);border-color:#ffffff4d}.irid-chip.active{border-color:var(--purple);box-shadow:0 0 0 1px var(--purple)}.color-popup{position:fixed;z-index:1000;width:224px;padding:12px;background:#111114f5;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.06);border-radius:12px;box-shadow:0 12px 40px #0000008c,0 0 0 1px #0003,inset 0 1px #ffffff0a;flex-direction:column;gap:10px;display:flex;visibility:hidden;opacity:0;transform:translateY(-4px) scale(.97);pointer-events:none;transition:opacity .15s ease,transform .15s ease,visibility 0s .15s}.color-popup.open{visibility:visible;opacity:1;transform:translateY(0) scale(1);pointer-events:auto;transition:opacity .15s ease,transform .15s ease,visibility 0s}.color-popup__sv{width:200px;height:200px;border-radius:8px;cursor:crosshair;touch-action:none}.color-popup__hue{width:200px;height:14px;cursor:pointer;touch-action:none}.color-popup__fields{display:flex;flex-direction:column;gap:6px}.color-popup__hex-row{display:flex;align-items:center;gap:6px}.color-popup__hex-row label{font-size:10px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;width:24px;flex-shrink:0}.color-popup__hex-row input{flex:1;height:26px;padding:0 6px;border:1px solid var(--section-border);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--text);font-family:SF Mono,Fira Code,monospace;font-size:11px;outline:none;transition:border-color .12s ease}.color-popup__hex-row input:focus{border-color:var(--purple)}.color-popup__rgb-row{display:flex;gap:4px}.color-popup__rgb-row label{flex:1;display:flex;align-items:center;gap:4px;font-size:10px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px}.color-popup__rgb-row input{width:100%;height:26px;padding:0 4px;border:1px solid var(--section-border);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--text);font-family:SF Mono,Fira Code,monospace;font-size:11px;outline:none;-moz-appearance:textfield;transition:border-color .12s ease}.color-popup__rgb-row input::-webkit-inner-spin-button,.color-popup__rgb-row input::-webkit-outer-spin-button{-webkit-appearance:none}.color-popup__rgb-row input:focus{border-color:var(--purple)}.top-bar__help-btn{width:28px;height:28px;border-radius:50%;border:1px solid var(--section-border);background:var(--surface-2);color:var(--text-dim);font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;flex-shrink:0}.top-bar__help-btn:hover{background:var(--surface-3);border-color:#2e2e36;color:var(--text)}.tutorial-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20000;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .25s ease,visibility 0s .25s}.tutorial-overlay.open{visibility:visible;opacity:1;pointer-events:auto;transition:opacity .25s ease,visibility 0s}.tutorial-spotlight{position:fixed;border-radius:var(--radius);box-shadow:0 0 0 2px #e74694,0 0 16px 2px #e7469473,0 0 36px 4px #9061f940,0 0 0 9999px #000000bf;transition:top .35s ease,left .35s ease,width .35s ease,height .35s ease,border-radius .35s ease;pointer-events:none;z-index:20000}.tutorial-card{position:fixed;z-index:20001;width:280px;padding:20px;background:var(--surface-2);border:1px solid rgba(144,97,249,.25);border-radius:12px;box-shadow:0 12px 40px #00000080;display:flex;flex-direction:column;gap:8px;transition:top .35s ease,left .35s ease}.tutorial-card:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,#e74694,#9061f9,#e74694);background-size:200% 200%;animation:tutorialGlow 3s ease infinite;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.7}.tutorial-card:after{content:"";position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;border-radius:16px;background:linear-gradient(135deg,#e7469426,#9061f926,#e7469426);background-size:200% 200%;animation:tutorialGlow 3s ease infinite;filter:blur(12px);pointer-events:none;z-index:-1}@keyframes tutorialGlow{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.tutorial-card__step{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--text-dim)}.tutorial-card__title{font-size:15px;font-weight:700;color:var(--text);margin:0;line-height:1.3}.tutorial-card__desc{font-size:12px;color:#fff;line-height:1.55;margin:0}.tutorial-card__nav{display:flex;gap:8px;margin-top:6px}.tutorial-card__hint{display:flex;align-items:center;justify-content:center;gap:5px;font-size:10px;color:var(--text-dim);opacity:.55}.tutorial-card__hint kbd{display:inline-block;padding:1px 6px;font-size:10px;font-family:inherit;color:var(--text-dim);background:var(--surface-3);border:1px solid var(--section-border);border-radius:4px;line-height:1.5}.tutorial-card__btn{flex:1;padding:8px 12px;font-size:12px;font-weight:600;border:1px solid var(--section-border);border-radius:var(--radius);background:var(--surface-3);color:var(--text);cursor:pointer;font-family:inherit;transition:all .15s ease}.tutorial-card__btn:hover{background:#2a2a30;border-color:#3a3a42}.tutorial-card__btn--primary{background:var(--grad);border-color:transparent;color:#fff}.tutorial-card__btn--primary:hover{filter:brightness(1.1);background:var(--grad);border-color:transparent}
