:root{--bg:#050506;--panel:#121216b8;--panel-border:#ffffff12;--ink:#ededf2;--ink-dim:#8b8b96;--ink-faint:#5a5a64;--accent:#6ea8fe;--accent-soft:#6ea8fe24;--field:#ffffff0a;--field-hover:#ffffff14;--radius:14px;--font:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"SF Mono", ui-monospace, "Roboto Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}#app{grid-template-columns:1fr 340px;display:grid;position:fixed;inset:0}.stage{background:radial-gradient(circle at 50% 40%,#0e0e12 0%,#050506 70%);position:relative;overflow:hidden}#art{width:100%;height:100%;transition:opacity .42s cubic-bezier(.4,0,.2,1),transform .42s cubic-bezier(.4,0,.2,1);display:block;position:absolute;inset:0}#art.swapping{opacity:0;transform:scale(.985)}.stage-glow{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 180px 40px #0000008c}.panel{background:var(--panel);-webkit-backdrop-filter:blur(28px)saturate(1.4);border-left:1px solid var(--panel-border);flex-direction:column;gap:26px;padding:30px 26px;transition:transform .4s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow-y:auto}.panel-head h1{letter-spacing:-.01em;font-size:17px;font-weight:600}.panel-head p{color:var(--ink-faint);letter-spacing:.02em;margin-top:5px;font-size:12px}.group{flex-direction:column;gap:11px;display:flex}.group>label,.section-label{letter-spacing:.13em;text-transform:uppercase;color:var(--ink-faint);font-size:10.5px;font-weight:600}.algo-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.algo-btn{appearance:none;border:1px solid var(--panel-border);background:var(--field);color:var(--ink-dim);font-family:var(--font);cursor:pointer;text-align:left;border-radius:11px;padding:13px 10px;font-size:12px;font-weight:500;line-height:1.3;transition:all .18s}.algo-btn:hover{background:var(--field-hover);color:var(--ink)}.algo-btn.active{background:var(--accent-soft);color:#cfe1ff;border-color:#6ea8fe73}.seed-row{gap:8px;display:flex}.seed-row input{background:var(--field);border:1px solid var(--panel-border);min-width:0;color:var(--ink);font-family:var(--mono);border-radius:10px;flex:1;padding:11px 12px;font-size:13px;transition:border-color .18s}.seed-row input:focus{border-color:#6ea8fe80;outline:none}.icon-btn,.action{appearance:none;border:1px solid var(--panel-border);background:var(--field);color:var(--ink);font-family:var(--font);cursor:pointer;border-radius:10px;transition:all .18s}.icon-btn{place-items:center;width:42px;font-size:15px;display:grid}.icon-btn:hover,.action:hover{background:var(--field-hover)}.icon-btn:active,.action:active{transform:scale(.97)}.palette-grid{flex-direction:column;gap:7px;display:flex}.pal{cursor:pointer;border:1px solid #0000;border-radius:10px;align-items:center;gap:11px;padding:8px 10px;transition:all .16s;display:flex}.pal:hover{background:var(--field)}.pal.active{background:var(--field);border-color:#ffffff1f}.pal-swatch{border-radius:6px;flex:1;height:22px;display:flex;overflow:hidden}.pal-swatch span{flex:1}.pal-name{color:var(--ink-dim);width:78px;font-size:11.5px}.pal.active .pal-name{color:var(--ink)}.slider{flex-direction:column;gap:9px;display:flex}.slider-top{justify-content:space-between;font-size:11.5px;display:flex}.slider-top .name{color:var(--ink-dim)}.slider-top .val{font-family:var(--mono);color:var(--accent)}input[type=range]{appearance:none;cursor:pointer;background:#ffffff1a;border-radius:2px;width:100%;height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--ink);border:3px solid var(--bg);border-radius:50%;width:15px;height:15px;transition:transform .12s;box-shadow:0 0 0 1px #fff3}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}input[type=range]::-moz-range-thumb{background:var(--ink);border:3px solid var(--bg);border-radius:50%;width:15px;height:15px}.actions{flex-direction:column;gap:9px;margin-top:auto;padding-top:8px;display:flex}.action{justify-content:center;align-items:center;gap:8px;padding:13px;font-size:13px;font-weight:600;display:flex}.action.primary{background:var(--ink);color:#08080a;border-color:var(--ink)}.action.primary:hover{background:#fff}.action-row{gap:9px;display:flex}.action-row .action{flex:1}.panel-toggle{display:none}.toast{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--panel-border);color:var(--ink);opacity:0;pointer-events:none;z-index:50;background:#141418eb;border-radius:12px;padding:11px 20px;font-size:13px;transition:all .3s cubic-bezier(.4,0,.2,1);position:fixed;bottom:28px;left:50%;transform:translate(-50%)translateY(20px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}@media (width<=880px){#app{grid-template-columns:1fr}.panel{z-index:30;width:320px;position:fixed;top:0;bottom:0;right:0}.panel.hidden{transform:translate(100%)}.panel-toggle{z-index:40;background:var(--panel);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--panel-border);width:44px;height:44px;color:var(--ink);cursor:pointer;border-radius:12px;place-items:center;font-size:18px;display:grid;position:fixed;top:18px;right:18px}}