:root{--navy:#091a23;--blue:#d7b675;--water:#29b7e6;--bg:#07141c;--line:#34505d;--text:#edf3f5;--muted:#9bb0b9;--green:#35b485;--red:#e35561;--amber:#e2a13a;--hold:#15364a;--hold-line:#459ed0;--shadow:0 18px 45px rgba(0,0,0,.2)}
body{background:var(--bg);color:var(--text)}
.top{background:#0a171ef4;border-color:#ffffff17;backdrop-filter:blur(16px)}
.brand{background:transparent;border-radius:0;padding:0}.brand img{width:145px;height:42px;filter:drop-shadow(0 2px 4px #000a)}
.product{color:#b7c7ce;border-color:#ffffff20}.demo-tag{color:#e0c184;border-color:#8f7548;background:#281f12}.clock-live{color:#68d1a9}.lang{background:#101f28;border-color:#3c5561}.lang button{color:#aec0c7}.lang button.active{background:#d7b675;color:#102029}
.demo-tab{color:#b9c8cf;text-decoration:none;font-size:.72rem;white-space:nowrap}.demo-tab:hover{color:#e4c78f}
.demo-guide{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;background:linear-gradient(90deg,#211c13,#10232c);border-bottom:1px solid #6d593a;color:#dce7eb;position:relative;z-index:18}.demo-guide>div{display:flex;align-items:center;gap:12px;min-width:0}.demo-guide b{font-size:.68rem;letter-spacing:.09em;color:#e2c485;white-space:nowrap}.demo-guide span{font-size:.73rem;color:#b8cad1;line-height:1.4}.demo-guide button{border:1px solid #8c7448;border-radius:5px;background:#d7b675;color:#102029;padding:7px 11px;font-size:.7rem;font-weight:800;white-space:nowrap}.demo-guide #tourStop{background:#142832;color:#dce7eb;border-color:#57717d}
.layout{min-height:calc(100vh - 111px)}
.layout>nav{background:#0b202a}.layout>nav button.active,.layout>nav button:hover,.layout>nav a:hover{background:#d7b675;color:#102029}
.head h1{color:#f1f3ee}.head p{color:#9fb2bb}.controls button{background:#10232d;border-color:#36515e}.controls .primary{background:#d7b675;color:#102029;border-color:#d7b675}.controls .active{background:#16384a;border-color:#438fba;color:#bce9ff}
.metric,.network,aside{background:#0f2029;border-color:#35515e}.metric span{color:#95aab4}.metric strong{color:#eef3f4}
.alerts{background:#0f3028;border-color:#397e67;color:#84d7b8}.alerts.hold{background:#14364a;border-color:#438fba;color:#bce9ff}.alerts.protective{background:#3b2a12;border-color:#c3872d;color:#f4cc83}.alerts.fault{background:#42161b;border-color:#db4453;color:#ffd8dc}
.network-head,.scenarios,.legend{border-color:#35515e}.network-head span,.scenarios>span,.legend{color:#9eb1ba}.mode-switch{background:#0b1921;border-color:#385461}.mode-switch button{color:#9eb1ba}.mode-switch button.active{background:#d7b675;color:#102029}.scenario{background:#132731;border-color:#3b5865;color:#d8e3e7}.scenario:hover,.scenario.active{background:#d7b675;border-color:#d7b675;color:#102029}
.canvas-scroll{background:radial-gradient(ellipse at 50% 45%,#183540,#09171e 72%)}.pipe-base{stroke:#3e5b67}.field-card,.asset-panel,.pump-card,.sensor-pill,.valve-body{fill:#122832;stroke:#577482}.field.selected .field-card{fill:#15384a}.field.status-operating .field-card{fill:#10372c}.field.status-hold .field-card{fill:#14364a}.field-title,.asset-title,.valve-label{fill:#eef3f4}.field-line,.asset-data,.network-note{fill:#9db2bb}.furrow{stroke:#69805a}.valve-disc{fill:#173b4c}.handle{stroke:#e1c385}.handle-knob{fill:#e1c385}.pump-casing{fill:#143b4b;stroke:#38a4d0}.borewell-wall{fill:#263c45;stroke:#71848d}.flow-badge rect{fill:#d7b675}.flow-badge text{fill:#102029}.t-port,.port-label{stroke:#a88ee5;fill:#c8b9f0}.sensor-text{fill:#75cbed}
aside{border-color:#35515e}.aside-head h2{color:#f1f4ef}.section{border-color:#35515e}.section h3,.eyebrow,.itype,.prop span,.toggle-copy span,.field-btn span{color:#93a9b3}.schedule-card,.source-card,.asset-inspector{background:#0b1a22;border-color:#35515e}.schedule-state{background:#14364a;color:#bce9ff}.form-control input,.form-control select,.select{background:#102731;border-color:#3c5a67;color:#edf3f5}.day-btn,.field-btn,.mini-btn,.action.secondary{background:#122832;border-color:#3b5865;color:#dbe6e9}.day-btn.active,.field-btn.complete{background:#14364a;color:#bce9ff}.field-btn.active,.source-card.status-operating{background:#10372c;color:#a1e0c7}.source-data div{background:#ffffff0b}.action.primary,.mini-btn.primary{background:#d7b675;color:#102029}.toggle-copy strong,.source-name,.source-data strong,.ititle,.prop b{color:#eef3f4}.source-data span{color:#9db0b9}.state-box{background:#10372c}.safety-log{background:#10372c;border-color:#397e67;color:#9be0c5}.toast{background:#d7b675;color:#102029}
.tour-highlight{filter:drop-shadow(0 0 7px rgba(227,193,128,.9));outline:3px solid #dfbd79!important;outline-offset:2px;animation:tourPulse 1.3s ease-in-out infinite}
@keyframes tourPulse{50%{outline-offset:7px}}
@media(max-width:900px){.demo-guide{position:sticky;top:64px}.layout nav{top:111px}.top .demo-tab{display:none}}
@media(max-width:620px){.demo-guide{align-items:flex-start;flex-direction:column}.demo-guide>div{align-items:flex-start;flex-direction:column;gap:3px}.demo-guide b{white-space:normal}.demo-guide button{width:100%}.product{display:none}.brand img{width:120px}.demo-tag{display:none}}
@media(prefers-reduced-motion:reduce){.tour-highlight{animation:none}}