@import url("https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&display=swap");:root{--bg:#050506;--panel:#0a0a0d;--panel-border:#1d1d24;--text:#c9c9d1;--muted:#6f6f79;--gold:#e0b24a;--neon-green:#5f5}.sandbox-container{box-sizing:border-box;margin:0;height:100vh;height:100dvh;width:100%;background:var(--bg);color:var(--text);font-family:VT323,monospace;overflow:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none}.sandbox-container.light{--bg:#e9e5da;--panel:#f1eee4;--panel-border:#d6d0c0;--text:#232320;--muted:#7c7768}.sandbox-container.light .hint{color:#bcb6a4}.sandbox-container.light button{background:#faf8f2;color:#2b2b28;border-color:#d6d0c0}.app-layout{display:flex;flex-direction:column;height:100%;width:100%}.canvas-wrap{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#000;position:relative;padding:4px;overflow:hidden}#sim{image-rendering:pixelated;image-rendering:crisp-edges;background:#08080a;box-shadow:0 0 0 2px var(--panel-border),0 0 60px rgba(0,0,0,.7);cursor:crosshair;touch-action:none}#sim.no-border{box-shadow:none}.hint{top:50%;left:50%;transform:translate(-50%,-50%);font-family:Press Start\ 2P,monospace;font-size:10px;color:#444450;letter-spacing:1px;text-align:center;line-height:1.8}.canvas-wrap.clouds:before,.hint{position:absolute;pointer-events:none}.canvas-wrap.clouds:before{content:"";inset:0;background:radial-gradient(ellipse 300px 80px at 20% 15%,hsla(0,0%,100%,.06),transparent 60%),radial-gradient(ellipse 260px 70px at 70% 25%,hsla(0,0%,100%,.045),transparent 60%),radial-gradient(ellipse 320px 90px at 45% 10%,hsla(0,0%,100%,.04),transparent 60%);background-repeat:no-repeat;animation:driftClouds 50s linear infinite alternate}@keyframes driftClouds{0%{transform:translateX(0)}to{transform:translateX(40px)}}.inspect-overlay{position:absolute;top:14px;left:14px;background:rgba(10,10,15,.88);border:1px solid #333340;border-radius:4px;padding:8px 12px;font-family:VT323,monospace;font-size:17px;color:#e0e0ea;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);max-width:280px;z-index:10;box-shadow:0 4px 14px rgba(0,0,0,.6)}.inspect-title{font-family:Press Start\ 2P,monospace;font-size:10px;color:var(--gold);margin-bottom:4px}.presets-tray{position:absolute;top:10px;left:50%;transform:translateX(-50%);display:flex;gap:5px;flex-wrap:nowrap;overflow-x:auto;max-width:90%;z-index:10;padding:6px 28px;background:rgba(8,8,14,.8);border:1px solid rgba(50,50,70,.5);border-radius:8px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);scrollbar-width:thin;scrollbar-color:rgba(224,178,74,.4) transparent;mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 24px),transparent)}.presets-tray::-webkit-scrollbar{height:4px}.presets-tray::-webkit-scrollbar-track{background:transparent}.presets-tray::-webkit-scrollbar-thumb{background:rgba(224,178,74,.35);border-radius:4px}.presets-tray::-webkit-scrollbar-thumb:hover{background:rgba(224,178,74,.6)}.preset-btn{font-family:Press Start\ 2P,monospace!important;font-size:7.5px!important;padding:6px 9px!important;background:rgba(22,22,32,.9)!important;border:1px solid #2a2a3a!important;color:#a0a0b8!important;border-radius:6px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:all .15s ease;position:relative;overflow:hidden}.preset-btn:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,hsla(0,0%,100%,.05),transparent 60%);pointer-events:none;border-radius:inherit}.preset-btn:hover{background:rgba(40,40,60,.95)!important;color:#fff!important;border-color:#e0b24a!important;box-shadow:0 0 12px rgba(224,178,74,.25),inset 0 0 6px rgba(224,178,74,.08)!important;transform:translateY(-1px)}.preset-btn:active{transform:translateY(0)!important;box-shadow:0 0 6px rgba(224,178,74,.15)!important}.statbar{display:flex;align-items:center;gap:16px;padding:4px 14px;background:var(--panel);border-top:1px solid var(--panel-border);border-bottom:1px solid var(--panel-border);font-size:19px;color:var(--muted)}.statbar span{white-space:nowrap}.env-pill{display:inline-flex;align-items:center;gap:6px;background:#14141c;padding:2px 8px;border-radius:3px;border:1px solid #22222e;font-size:16px}.statbar-right{margin-left:auto;display:flex;align-items:center;gap:12px}.logo{font-size:12px;letter-spacing:2px;display:flex}.gearbtn,.logo{font-family:Press Start\ 2P,monospace}.gearbtn{background:#141419;border:1px solid #27272f;color:var(--text);font-size:14px;padding:5px 8px;border-radius:4px;cursor:pointer;line-height:1}.gearbtn:hover{filter:brightness(1.2)}.main-workspace{flex:1;min-height:0;display:flex;flex-direction:row;width:100%;overflow:hidden}.dock{width:360px;min-width:320px;max-width:380px;height:100%;background:var(--panel);border-right:1px solid var(--panel-border);padding:8px;flex-direction:column;gap:6px;overflow-y:auto;box-sizing:border-box;flex-shrink:0}.dock,.row{display:flex;align-items:center}.row{flex-wrap:wrap;gap:4px;justify-content:center;width:100%}.sandbox-container button{font-family:Press Start\ 2P,monospace;font-size:8.5px;padding:7px 9px;border-radius:4px;border:1px solid #27272f;background:#141419;color:#d2d2d9;cursor:pointer;letter-spacing:.5px;transition:transform .05s ease,filter .1s ease,background .1s ease}.sandbox-container button:hover{filter:brightness(1.15)}.sandbox-container button:active{transform:translateY(1px)}.tbtn.tool{border-color:var(--tc,#333);color:var(--tc,#d2d2d9)}.tbtn.tool.active{background:var(--tc,#333);color:#0a0a0c;box-shadow:0 0 8px var(--tc,#333)}.tbtn.play.active{background:#3c3c48}.ticon{display:none}.dock.show-icons .ticon{display:inline-block;margin-right:5px}.brushsize{min-width:38px;text-align:center;font-family:Press Start\ 2P,monospace;font-size:11px;color:var(--gold)}.brush-shape-btn{font-size:11px!important;padding:5px 8px!important;min-width:26px}.brush-shape-btn.active{background:#e0b24a!important;color:#000!important}.groups-container{background:#000;border:1px solid #26262e;border-radius:4px;padding:3px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;width:100%}.gbtn-retro{background:transparent!important;border:1px solid transparent!important;color:#fff!important;font-family:Press Start\ 2P,monospace!important;font-size:8px!important;padding:5px 7px!important;letter-spacing:.8px!important;border-radius:3px!important;white-space:nowrap}.gbtn-retro:hover{background:#1f1f26!important}.gbtn-retro.active{background:#3a3a42!important;border:1px solid #5a5a66!important;border-top:2.5px solid #5f5!important;box-shadow:inset 1px 1px 0 hsla(0,0%,100%,.25),inset -1px -1px 0 rgba(0,0,0,.4);color:#fff!important}.elements-container{display:flex;flex-wrap:wrap;gap:5px 5px;align-items:flex-start;align-content:flex-start;justify-content:center;width:100%;flex:1;min-height:120px;overflow-y:auto;padding:4px 0}.ebtn-retro{position:relative;font-family:Press Start\ 2P,monospace!important;font-size:8px!important;padding:6px 8px!important;border-radius:4px!important;color:#fff!important;text-shadow:1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000!important;background-color:var(--mat-bg,#444)!important;border:1px solid rgba(0,0,0,.85)!important;box-shadow:inset 1px 1px 1px hsla(0,0%,100%,.4),inset -1px -1px 2px rgba(0,0,0,.65),0 1px 2px rgba(0,0,0,.5)!important;letter-spacing:.4px;white-space:nowrap}.ebtn-retro:hover{filter:brightness(1.25)!important}.ebtn-retro[data-element=bead],.ebtn-retro[data-element=colorsand],.ebtn-retro[data-element=coral],.ebtn-retro[data-element=dye],.ebtn-retro[data-element=glitter],.ebtn-retro[data-element=petal],.ebtn-retro[data-element=rainbow],.ebtn-retro[data-element=stainedglass]{background:linear-gradient(90deg,#ff2a2a,#ff7f00,#ff0,#05ff55,#00cfff,#9b00ff)!important}.ebtn-retro[data-element=gold],.ebtn-retro[data-element=goldcoin]{background:linear-gradient(135deg,#d4af37,#fff7a0,#aa7810,gold)!important;color:#fff!important}.ebtn-retro[data-element=metalscrap],.ebtn-retro[data-element=silver]{background:linear-gradient(135deg,#99a0a8,#fff,#606870,#c8d0d8)!important;color:#000!important;text-shadow:none!important}.ebtn-retro[data-element=firefly],.ebtn-retro[data-element=godray],.ebtn-retro[data-element=light]{background:linear-gradient(135deg,#998810,#ffff70,#540)!important}.ebtn-retro[data-element=coldfire],.ebtn-retro[data-element=freezeray]{background:linear-gradient(135deg,#08f,#80e0ff,#0040aa)!important}.ebtn-retro[data-element=fire],.ebtn-retro[data-element=heatray],.ebtn-retro[data-element=lava],.ebtn-retro[data-element=magma]{background:linear-gradient(135deg,#f40,#fb0,#900)!important}.ebtn-retro[data-element=incinerate],.ebtn-retro[data-element=plague],.ebtn-retro[data-element=plasma]{background:linear-gradient(135deg,#b000ee,#ff80ff,#5000aa)!important}.ebtn-retro[data-element=acid],.ebtn-retro[data-element=cell],.ebtn-retro[data-element=poison]{background:linear-gradient(135deg,#70d000,#b5ff20,#308000)!important}.ebtn-retro[data-element=blood],.ebtn-retro[data-element=ketchup]{background:linear-gradient(135deg,#d00000,#f44,#600000)!important}.ebtn-retro[data-element=diamond]{background:linear-gradient(135deg,#30b5e0,#e0f8ff,#106090)!important}.ebtn-retro.active{outline:2px solid var(--neon-green)!important;box-shadow:0 0 8px var(--neon-green),inset 1px 1px 1px hsla(0,0%,100%,.5)!important;z-index:2}.info-strip{flex-direction:column;gap:5px;padding:6px 8px;background:#0f0f15;border:1px solid #1c1c24;border-radius:4px;font-size:15px;color:#a0a0b0;width:100%;text-align:center}.info-strip,.info-strip-main{display:flex;align-items:center;justify-content:center}.info-strip-main{flex-wrap:wrap;gap:6px}.info-tag{background:#1c1c28;padding:1px 6px;border-radius:3px;font-size:14px;color:var(--gold)}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.72);display:none;align-items:center;justify-content:center;z-index:50;padding:16px}.modal-overlay.open{display:flex}.modal-panel{background:#0a0a0d;border:1px solid #222228;border-radius:8px;width:100%;max-width:480px;max-height:88vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.75)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #1d1d24;position:sticky;top:0;background:#0a0a0d;z-index:1}.modal-title{font-size:14px;letter-spacing:1px}.modal-close,.modal-title{font-family:Press Start\ 2P,monospace}.modal-close{background:#7a2020!important;border:1px solid #a33333!important;color:#fff!important;width:28px;height:26px;font-size:11px;border-radius:3px;padding:0}.modal-body{padding:4px 16px 18px}.srow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 0;border-bottom:1px solid #17171b}.slabel{font-size:16px}.snumber,.sselect{background:#101014;border:1px solid #26262e;color:var(--text);font-family:VT323,monospace;font-size:18px;padding:6px 10px;border-radius:4px;min-width:140px;max-width:60%}.scolor{width:34px;height:30px;border-radius:4px;border:1px solid #26262e;background:none;padding:0;cursor:pointer}.toggle-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.toggle-btn{background:#101014;border:1px solid #2c2c33;color:#84848c;font-family:Press Start\ 2P,monospace;font-size:9px;padding:10px 8px;border-radius:4px;text-align:center}.toggle-btn.on{border-color:#3ea25a;color:#4dbb6c}.danger-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.danger-btn{background:#1a0f0f!important;border:1px solid #7a2b2b!important;color:#d97a7a!important;font-family:Press Start\ 2P,monospace;font-size:9px;padding:10px 8px;border-radius:4px;text-align:center}.danger-btn:disabled{opacity:.35;cursor:not-allowed;filter:none}.linklike{background:none!important;border:none!important;color:var(--muted)!important;font-family:VT323,monospace!important;font-size:15px!important;text-decoration:underline;padding:6px 0 2px!important;cursor:pointer;display:block;letter-spacing:0!important}@media (max-width:768px){.main-workspace{flex-direction:column}.dock{width:100%;min-width:100%;max-width:100%;height:auto;max-height:48vh;border-right:none;border-top:1px solid var(--panel-border);order:2}.canvas-wrap{order:1;flex:1}.statbar{font-size:14px;gap:8px;padding:3px 8px}.sandbox-container button{font-size:8px;padding:6px 7px}.logo{font-size:10px}.ebtn-retro{font-size:8px!important;padding:6px 8px!important}.presets-tray{display:none}}