*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;min-height:100%;background:#071012;color:#e8f4f3;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{min-height:100vh;background:radial-gradient(circle at top,#0d2023 0,#071012 45%,#04090a 100%)}button{font:inherit;color:inherit;background:#0d1c1f;border:1px solid #254348;border-radius:10px;padding:.68rem .8rem;cursor:pointer}button:hover,button:focus-visible{border-color:#4bb8b1;outline:none}button.primary{background:#123c3a;border-color:#48c7bd;color:#dffffb;font-weight:800}.sitebar{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,54px);border-bottom:1px solid #173136;background:#071012ee}.brand{color:#e8f4f3;font-size:20px;font-weight:800;text-decoration:none;letter-spacing:-.04em}.brand span{color:#52d6c7}.nav{display:flex;gap:18px}.nav a{color:#7f9b9c;text-decoration:none;font-size:13px}.nav a:hover{color:#e8f4f3}.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;border-bottom:1px solid #173136;background:#081416ee;backdrop-filter:blur(10px);position:sticky;top:0;z-index:20}.eyebrow{margin:0 0 .2rem;color:#6fa8a7;font:700 .68rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.13em}.topbar h1{margin:0;font-size:1.35rem;letter-spacing:-.02em}.sim-controls{display:flex;gap:.55rem}.app-shell{display:grid;grid-template-columns:220px minmax(0,1fr) 250px;gap:.8rem;padding:.8rem;min-height:calc(100vh - 130px)}.panel{background:#091719e8;border:1px solid #19373b;border-radius:16px;box-shadow:0 18px 60px #0005}.toolbox,.inspector{padding:.85rem}.panel-title{color:#77aaa9;font:800 .68rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.13em;margin:.15rem 0 .75rem}.toolbox{display:flex;flex-direction:column;gap:.5rem}.toolbox .tool{text-align:left}.toolbox .tool.active{background:#123b39;border-color:#4bc4bb}.divider{height:1px;background:#18363a;margin:.5rem 0}.hint{color:#719091;font-size:.78rem;line-height:1.45;margin:.3rem 0}.lab{display:flex;flex-direction:column;overflow:hidden;min-width:0}.lab-header{height:54px;display:flex;align-items:center;gap:1rem;padding:0 .9rem;border-bottom:1px solid #173438;color:#91aaa9;font:700 .72rem ui-monospace,SFMono-Regular,Consolas,monospace}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#738486;margin-right:.45rem}.status-dot.running{background:#5ee0d5;box-shadow:0 0 14px #5ee0d5}.status-dot.danger{background:#ff6b5f;box-shadow:0 0 16px #ff6b5f}.readout{margin-left:auto;display:flex;gap:.55rem;align-items:baseline}.readout+.readout{margin-left:0}.readout span{color:#5f7d7e}.readout strong{color:#d9f2ef}.canvas{position:relative;min-height:640px;overflow:hidden;touch-action:none;background-image:linear-gradient(#15303355 1px,transparent 1px),linear-gradient(90deg,#15303355 1px,transparent 1px),radial-gradient(circle at 50% 0,#14343733,transparent 55%);background-size:24px 24px,24px 24px,100% 100%}.pipe-layer{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.pipe{stroke:#31545a;stroke-width:7;fill:none;stroke-linecap:round}.pipe.flowing{stroke:#52bfff;stroke-dasharray:18 10;animation:flow .7s linear infinite;filter:drop-shadow(0 0 5px #52bfff88)}.pipe.danger{stroke:#ff735f}.pipe-preview{stroke:#49aaa4;stroke-width:3;stroke-dasharray:8 8;fill:none}@keyframes flow{to{stroke-dashoffset:-28}}.component{position:absolute;z-index:3;transform:translate(-50%,-50%);min-width:86px;min-height:62px;border:2px solid #426166;background:#0c1d20;color:#eaf7f5;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;box-shadow:0 10px 25px #0008;user-select:none;touch-action:none}.component:hover{border-color:#67bdb7}.component.selected{border-color:#6ee2d8;box-shadow:0 0 0 3px #6ee2d822,0 10px 25px #0008}.component.active{background:#11312f}.component.danger{border-color:#ff6e62;animation:alarm .7s infinite alternate}.component .symbol{font-size:1.45rem;font-weight:900;line-height:1}.component .name{font:800 .65rem ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em}.component .mini{font-size:.64rem;color:#81a3a3}.component.tank{min-width:92px;min-height:110px;border-radius:14px 14px 18px 18px;overflow:hidden}.tank-fill{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(#48b9e8aa,#2f86c8cc);height:40%;transition:height .25s;z-index:-1}.component.valve{min-width:72px;min-height:56px}.component.pump .symbol{border:2px solid #84b4b1;border-radius:50%;width:34px;height:34px;display:grid;place-items:center}.component.sink{border-style:dashed}.flood-layer{position:absolute;left:0;right:0;bottom:0;height:0;z-index:2;background:linear-gradient(#45b9e455,#176fac99);transition:height .8s;pointer-events:none}.event-banner{position:absolute;left:50%;top:1rem;transform:translateX(-50%) translateY(-20px);opacity:0;z-index:10;background:#401714e8;border:1px solid #ff6c61;color:#ffe6e2;padding:.65rem .9rem;border-radius:10px;font:800 .75rem ui-monospace,SFMono-Regular,Consolas,monospace;transition:.2s}.event-banner.show{opacity:1;transform:translateX(-50%) translateY(0)}@keyframes alarm{from{box-shadow:0 0 0 #ff6e6200}to{box-shadow:0 0 24px #ff6e6277}}.inspector-body{color:#9bb1b0;font-size:.84rem;line-height:1.5}.inspector-body h3{color:#ecf7f5;margin:.2rem 0 .5rem}.inspector-body .control-row{display:flex;gap:.5rem;align-items:center;justify-content:space-between;margin:.6rem 0}.event-log{margin:0;padding-left:1.25rem;display:flex;flex-direction:column;gap:.45rem;color:#85a09f;font-size:.74rem;max-height:390px;overflow:auto}.event-log .bad{color:#ff8d84}.event-log .good{color:#74d8d0}.mobile-tools{display:none}.danger-text{color:#ff8d84}.ok-text{color:#73d6ce}@media(max-width:980px){.app-shell{grid-template-columns:170px minmax(0,1fr)}.inspector{display:none}}@media(max-width:720px){.sitebar{height:50px}.topbar{padding:.75rem;align-items:flex-start}.topbar h1{font-size:1.05rem}.eyebrow{font-size:.58rem}.alpha-status-badge{display:none}.sim-controls button{padding:.55rem .62rem;font-size:.75rem}.app-shell{display:block;padding:.45rem 0 64px}.toolbox{display:none}.lab{border-radius:0;border-left:0;border-right:0}.lab-header{gap:.45rem;padding:0 .55rem}.readout{font-size:.62rem}.canvas{min-height:calc(100vh - 210px)}.component{min-width:76px;min-height:56px}.mobile-tools{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:0;right:0;bottom:0;z-index:30;padding:.45rem;background:#071214f2;border-top:1px solid #1e3d41;gap:.3rem}.mobile-tools button{font-size:.67rem;padding:.6rem .15rem;border-radius:8px}}@media(prefers-reduced-motion:reduce){.pipe.flowing{animation:none}.component.danger{animation:none}}
