@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Fira+Code:wght@400;500&display=swap";:root{--bg-primary:#090d16;--bg-secondary:#111827;--card-bg:#11182799;--card-border:#ffffff0f;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--color-cyan:#06b6d4;--color-cyan-glow:#06b6d466;--color-blue:#3b82f6;--color-blue-glow:#3b82f666;--color-green:#10b981;--color-green-glow:#10b9814d;--color-red:#f43f5e;--color-red-glow:#f43f5e4d;--color-orange:#f59e0b;--color-orange-glow:#f59e0b4d;--color-purple:#8b5cf6;--font-sans:"Inter", sans-serif;--font-mono:"Fira Code", monospace;--transition-fast:.15s ease;--transition-normal:.3s ease;--schematic-margin:1.25rem}*{box-sizing:border-box;margin:0;padding:0}html{width:100%;height:100%;height:-webkit-fill-available;overflow:hidden}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);width:100%;min-height:100dvh;flex-direction:column;height:100dvh;min-height:-webkit-fill-available;display:flex;overflow:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--card-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}main{flex:1 1 0;width:100%;min-height:0;display:flex;overflow:hidden}.viewport-panel{-webkit-overflow-scrolling:touch;box-sizing:border-box;width:100%;min-height:0;padding:max(var(--schematic-margin), env(safe-area-inset-top)) max(var(--schematic-margin), env(safe-area-inset-right)) max(var(--schematic-margin), env(safe-area-inset-bottom)) max(var(--schematic-margin), env(safe-area-inset-left));background:radial-gradient(circle,#111a2e 0%,#090d16 100%);flex-direction:column;flex:1 1 0;display:flex;overflow:hidden}.schematic-frame{flex:1 1 0;justify-content:center;align-items:center;width:100%;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}#schematic-svg{flex:none;max-width:100%;max-height:100%;display:block}@media (width<=640px){:root{--schematic-margin:.65rem}}.pipe-bg{stroke:#1f2937;stroke-width:8px;fill:none;stroke-linecap:butt;stroke-linejoin:miter}#plumbing-bg line{stroke:#1f2937;stroke-width:6px;stroke-linecap:square}#plumbing-bg .pipe-fresh-bg{stroke:#14532d}#plumbing-bg .pipe-recirc-bg{stroke:#1f2937}#plumbing-bg .pipe-path{stroke:#1f2937;stroke-width:6px;fill:none;stroke-linecap:square;stroke-linejoin:miter}.pipe-fluid{stroke:var(--color-cyan);stroke-width:4px;fill:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:8 12;opacity:0;transition:opacity .5s}.pipe-active{opacity:1;animation:1.5s linear infinite march-flow}.pipe-active.pipe-reverse{animation-direction:reverse}.pipe-recirc,.pipe-watering{stroke:var(--color-cyan)}.pipe-freshwater{stroke:var(--color-green)}.valve-body{cursor:pointer;transition:all var(--transition-normal)}.valve-circle{fill:#111827;stroke:var(--color-red);stroke-width:2.5px;transition:all var(--transition-normal)}.valve-open .valve-circle{stroke:var(--color-green);filter:drop-shadow(0 0 4px var(--color-green-glow))}.valve-handle{stroke:var(--color-red);stroke-width:2.5px;stroke-linecap:butt;transform-origin:0 0;transition:transform .4s cubic-bezier(.4,0,.2,1),stroke .4s}.valve-vertical .valve-handle{transform:rotate(0)}.valve-vertical.valve-open .valve-handle{stroke:var(--color-green);transform:rotate(90deg)}.valve-horizontal .valve-handle{transform:rotate(0)}.valve-horizontal.valve-open .valve-handle{stroke:var(--color-green);transform:rotate(90deg)}.pump-container{cursor:pointer}.pump-casing{fill:#1f2937;stroke:#4b5563;stroke-width:2.5px;transition:stroke var(--transition-normal)}.pump-active .pump-casing{stroke:var(--color-cyan);filter:drop-shadow(0 0 6px var(--color-cyan-glow))}.pump-rotor{fill:none;stroke:#9ca3af;stroke-width:2px;stroke-linecap:round;transition:stroke var(--transition-normal)}#svg-pump-rotor-group{transform-origin:0 0}.pump-active .pump-rotor{stroke:var(--color-cyan)}.tank-bg{fill:#111827cc;stroke:#4b5563;stroke-width:3px;rx:4;ry:4}.tank-glass{fill:none;stroke:#ffffff0d;stroke-width:1px}.tank-water{fill:url(#water-grad);rx:3;ry:3;transition:height .1s linear,y .1s linear}.tank-water-empty{fill:#0000}.tank-label{fill:var(--text-primary);text-anchor:middle;font-size:11px;font-weight:600}.tank-volume{fill:var(--text-secondary);font-size:10px;font-family:var(--font-mono);text-anchor:middle}.plant-soil{fill:#3e2723;stroke:#1f0f0c;stroke-width:1.5px}.plant-stem{stroke:#81c784;stroke-width:3px;stroke-linecap:round;fill:none;transition:stroke var(--transition-normal)}.plant-leaf{fill:#4caf50;transition:fill var(--transition-normal)}.plant-dry .plant-stem{stroke:#a1887f}.plant-dry .plant-leaf{fill:#8d6e63}.plant-healthy .plant-leaf{fill:var(--color-green);filter:drop-shadow(0 0 2px var(--color-green-glow))}.plant-dead .plant-stem{stroke:#5d4037}.plant-dead .plant-leaf{fill:#4e342e;opacity:.65}.plant-thirst-bg{fill:#1f2937;stroke:#374151;stroke-width:.5px}.plant-thirst-fill{fill:#0ea5e9;transition:width .35s}.plant-dry .plant-thirst-fill{fill:#f59e0b}.plant-dead .plant-thirst-fill{fill:#6b7280}.pot-drips{pointer-events:none;visibility:hidden;opacity:0}.pot-drips.is-active,.plant-overwatered .pot-drips{visibility:visible!important;opacity:1!important}.plant-overwatered .plant-pot{filter:brightness(.92)saturate(1.15)}.plant-overwatered .plant-soil{fill:#2d4a3e}.plant-overwatered .plant-thirst-fill,.plant-overwatered .plant-status-label{fill:#38bdf8}.pot-puddle{fill:#06b6d48c;stroke:#22d3eebf;stroke-width:.8px}.pot-drip-streak{stroke:#22d3ee}.pot-drip{fill:#22d3ee;stroke:#67e8f9;stroke-width:.6px}.plant-status-label{fill:var(--text-muted);font-family:var(--font-sans);font-weight:600}.plant-dry .plant-status-label{fill:#fbbf24}.plant-healthy .plant-status-label{fill:#34d399}.plant-dead .plant-status-label{fill:#f87171}.spray-droplet{fill:var(--color-cyan);opacity:0}.spraying .spray-droplet{animation:.8s linear infinite spray-droplets}@keyframes march-flow{to{stroke-dashoffset:-40px}}@keyframes spin-pump{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spray-droplets{0%{opacity:0;transform:translateY(0)scale(.2)}30%{opacity:.8}to{transform:translateY(22px) translateX(var(--spray-x,0)) scale(.8);opacity:0}}@keyframes pulse-orange{0%,to{box-shadow:0 0 4px var(--color-orange-glow);border-color:#f59e0b33}50%{box-shadow:0 0 12px var(--color-orange-glow);border-color:#f59e0b80}}@keyframes pulse-red{0%,to{box-shadow:0 0 4px var(--color-red-glow);border-color:#f43f5e33}50%{box-shadow:0 0 14px var(--color-red-glow);border-color:#f43f5e80}}[data-tooltip]{position:relative}[data-tooltip]:before{content:attr(data-tooltip);border:1px solid var(--card-border);color:var(--text-primary);white-space:nowrap;opacity:0;pointer-events:none;z-index:100;background-color:#030712f2;border-radius:4px;padding:4px 8px;font-size:.7rem;transition:opacity .2s;position:absolute;bottom:125%;left:50%;transform:translate(-50%)}[data-tooltip]:hover:before{opacity:1}