body{color:#fff;background-color:#000;flex-direction:column;height:100dvh;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:flex;overflow:hidden}*{box-sizing:border-box}#root{flex-direction:column;width:100%;height:100%;display:flex}:root{--btn-height:44px}.app-container{flex-direction:column;width:100%;height:100dvh;transition:padding-right .35s cubic-bezier(.25,.8,.25,1);display:flex}.header{text-align:center;z-index:10;background:#111;border-bottom:1px solid #333;justify-content:space-between;align-items:center;padding:8px 10px;display:flex}.header-text{flex-grow:1}.stats{color:#00e5ff;margin-bottom:2px;font-family:monospace;font-size:15px;font-weight:700}.info{color:#aaa;font-size:10px;line-height:1.3}.hamburger{cursor:pointer;-webkit-user-select:none;user-select:none;padding:0 15px;font-size:26px;transition:all .2s}.hamburger:active{color:#00e5ff;transform:scale(.8)}.chaos-bar{z-index:10;background:#151515;border-top:1px solid #333;flex-shrink:0;align-items:center;gap:8px;padding:6px 8px;display:flex}.chaos-bar select{color:#fff;background:#222;border:1px solid #444;border-radius:4px;flex-grow:1;height:28px;margin:0;padding:4px;font-size:12px}.canvas-container{touch-action:none;background:#050505;flex-grow:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.modifiers-panel{color:#ccc;z-index:10;background:#1a1a1a;border-top:1px solid #333;flex-wrap:wrap;flex-shrink:0;justify-content:center;align-items:center;gap:12px;padding:3px 10px;font-size:11px;display:flex}.mod-checkbox{cursor:pointer;align-items:center;gap:4px;display:flex}.mod-checkbox input{accent-color:#00e5ff;margin:0}.btn-tune{color:#ffbc00;cursor:pointer;background:#222;border:1px solid #ffbc00;border-radius:4px;align-items:center;gap:4px;padding:2px 8px;font-size:11px;font-weight:700;display:flex}.btn-tune.active{color:#fff;background:#f33;border-color:#f33}.transformer-box{z-index:10;background:#111;border-top:1px solid #333;flex-shrink:0;height:75px;position:relative;overflow:hidden}.transformer-track{width:100%;height:100%;transition:transform .3s cubic-bezier(.25,.8,.25,1);display:flex}.quick-adjust,.live-formula-panel{box-sizing:border-box;flex:0 0 100%;width:100%;height:100%;position:relative}.switch-btn{cursor:pointer;color:#888;z-index:5;-webkit-user-select:none;user-select:none;background:#ffffff05;justify-content:center;align-items:center;width:35px;height:100%;font-size:20px;font-weight:700;transition:all .1s;display:flex;position:absolute;top:0}.switch-btn:hover{color:#fff;background:#ffffff0d}.switch-btn:active{color:#00e5ff;background:#ffffff1a}.switch-btn.right{border-left:1px solid #222;right:0}.switch-btn.left{border-right:1px solid #222;left:0}.quick-adjust{grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;padding:8px 40px 8px 10px;display:grid}.live-formula-panel{background:#0a0a0a;flex-direction:column;justify-content:center;display:flex}.live-formula-scroll{white-space:nowrap;scrollbar-width:none;flex-grow:1;align-items:center;gap:6px;padding:6px 10px 6px 45px;font-family:monospace;font-size:11px;display:flex;overflow-x:auto}.live-formula-scroll::-webkit-scrollbar{display:none}.formula-slider-panel{box-sizing:border-box;background:#151515;border-top:1px dashed #333;flex-shrink:0;align-items:center;gap:8px;height:32px;padding:4px 10px 4px 45px;display:flex}.formula-slider-panel input[type=range]{accent-color:#ffbc00;cursor:pointer;flex-grow:1;height:6px;margin:0}.quick-group-left,.quick-group-right{flex-direction:column;justify-content:center;gap:10px;display:flex}.quick-col{align-items:center;gap:8px;width:100%;display:flex}.quick-col input[type=range]{cursor:pointer;accent-color:#00e5ff;width:100%;min-width:0;margin:0}.reset-btn{color:#fff;cursor:pointer;background:#333;border:1px solid #555;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;padding:0;font-size:18px;display:flex}.reset-btn:active{background:#555}.math-term{background:#151515;border:1px solid #333;border-radius:6px;align-items:center;padding:4px 6px;transition:all .2s;display:inline-flex}.math-term.tuning{background:#ffbc001a;border-color:#ffbc00}.math-val{cursor:pointer;color:#ffbc00;-webkit-user-select:none;user-select:none;background:#ffbc001a;border-bottom:1px solid #0000;border-radius:4px;margin:0 2px;padding:2px 4px;transition:all .1s}.math-val:hover{background:#ffbc004d;border-bottom:1px solid #ffbc00}.math-val.active{color:#000;background:#ffbc00;font-weight:700;transform:scale(1.05)}.math-plus{color:#555;font-size:12px;font-weight:700}.small-tool-btn{color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;background:#222;border:1px solid #444;border-radius:4px;justify-content:center;align-items:center;width:26px;height:22px;padding:0;font-size:11px;display:flex}.small-tool-btn:active{background:#444}button.paused{border-color:#f33;color:#fff!important;background:#f33!important}canvas{aspect-ratio:1;object-fit:contain;cursor:crosshair;background-color:#000;width:100%;max-width:900px;max-height:100%;box-shadow:0 0 30px #00e5ff0d}.controls{padding:8px 8px calc(8px + env(safe-area-inset-bottom)) 8px;z-index:10;background:#111;border-top:1px solid #333;flex-shrink:0;grid-template-columns:repeat(3,1fr);gap:6px;display:grid}button{height:var(--btn-height);color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;text-align:center;background:#222;border:1px solid #444;border-radius:8px;justify-content:center;align-items:center;padding:0 4px;font-size:12px;font-weight:600;transition:all .1s;display:flex}button:active{background:#444;transform:scale(.95)}#btn-rand{background:linear-gradient(135deg,#ff007f,#7f00ff);border:none;font-size:13px}#btn-tpl{color:#000;background:linear-gradient(135deg,#0f8,#08f);border:none;font-size:13px}#btn-final{color:#f0f;border-color:#f0f;font-size:11px}#btn-color{color:#00e5ff;border-color:#00e5ff}#btn-sym{color:#ffbc00;border-color:#ffbc00}#btn-zoom{color:#0f8;border-color:#0f8}#btn-pause{color:#f33;border-color:#f33}#btn-save-json{color:#aaa;border-color:#aaa}#btn-save-img{color:#0cf;border-color:#0cf}.settings-menu{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:2000;background:#0c0c0cf2;border-top:1px solid #444;flex-direction:column;width:100%;height:60dvh;transition:bottom .35s cubic-bezier(.25,.8,.25,1);display:flex;position:fixed;bottom:-65dvh;left:0;overflow-x:hidden;box-shadow:0 -10px 40px #000c}.settings-menu.open{bottom:0}.menu-top-bar{background:#0a0a0a;border-bottom:1px solid #333;justify-content:space-between;align-items:center;padding:10px 15px;display:flex}.menu-top-bar h2{color:#fff;letter-spacing:1px;margin:0;font-size:15px}.menu-close{cursor:pointer;color:#aaa;-webkit-user-select:none;user-select:none;padding:0 5px;font-size:24px;line-height:1}.menu-close:active{color:#fff;transform:scale(.9)}.menu-scroll-area{padding:15px;padding-bottom:calc(20px + env(safe-area-inset-bottom));flex-grow:1;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:15px;display:grid;overflow:hidden auto}.menu-section{background:#ffffff08;border:1px solid #222;border-radius:8px;align-self:start;padding:12px}.menu-section h3{color:#ffbc00;border-bottom:1px solid #333;margin:0 0 10px;padding-bottom:6px;font-size:12px}@media (width>=900px){.app-container.settings-open{padding-right:350px}.settings-menu{border-top:none;border-left:1px solid #444;width:350px;height:100dvh;top:0;right:-350px;box-shadow:-10px 0 40px #000c;bottom:0!important;left:auto!important}.settings-menu.open{right:0;bottom:0!important}.menu-scroll-area{grid-template-columns:1fr}}