@font-face{font-family:"D-DIN";src:url("../separador-hmi/assets/fonts/d-din/D-DIN.otf") format("opentype");font-weight:400;font-display:swap}
@font-face{font-family:"D-DIN";src:url("../separador-hmi/assets/fonts/d-din/D-DIN-Bold.otf") format("opentype");font-weight:700;font-display:swap}
:root{--water-bg:#030810;--water-text:#f7f9ff;--water-line:rgba(217,255,245,.14);--water-mint:#72f8d3}
html,body{background:var(--water-bg);min-height:100%}
body{margin:0;color:var(--water-text);font-family:"D-DIN",Arial,sans-serif;background:radial-gradient(circle at 50% 45%,rgba(14,72,112,.22),transparent 45%),linear-gradient(125deg,#02070d,#06101d 55%,#030811)}
body>nav,.topline,.cards,.side,footer,.legend{display:none!important}
.app-toolbar{position:fixed;top:0;left:0;right:0;z-index:1000;height:92px!important;padding:0!important;border:0!important;border-bottom:1px solid var(--water-line)!important;background:linear-gradient(to bottom,rgba(4,8,7,.9),rgba(4,8,7,.68),rgba(4,8,7,.3))!important;backdrop-filter:blur(10px)}
.app-toolbar__rail{width:100%;height:100%;display:grid;grid-template-columns:minmax(170px,1fr) auto minmax(420px,1fr);align-items:center;gap:30px;padding:0 4.5vw}
.app-toolbar__brand{justify-self:start;display:inline-flex;align-items:center;text-decoration:none}.app-toolbar__logo{display:block;width:clamp(116px,12vw,174px);height:auto}
.water-title-block{text-align:left}.app-toolbar__title{display:block;color:#f1f7ff;font-size:27px;font-weight:700;letter-spacing:.27em;line-height:1;text-transform:uppercase;white-space:nowrap;text-shadow:0 0 20px rgba(104,215,255,.18)}
.water-title-sub{display:block;margin-top:7px;color:#8fa8be;font-size:10px;font-weight:700;letter-spacing:.42em;text-transform:uppercase;white-space:nowrap}.water-title-block>i{display:block;width:64px;height:3px;margin-top:8px;background:#58dfff;box-shadow:0 0 14px rgba(88,223,255,.55)}
.app-toolbar__actions{justify-self:end;display:inline-flex;align-items:center;gap:14px}.water-nav-divider{width:1px;height:28px;background:rgba(112,170,205,.36)}
.app-toolbar__status{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border:1px solid rgba(127,178,211,.34);border-radius:100px;background:rgba(4,16,28,.58);color:#eef7f4;font:bold 10px/1 Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;white-space:nowrap}.app-toolbar__status b{margin-left:12px;font-size:17px;color:#cce8fa}
main{padding:116px 2.6vw 28px!important;max-width:1800px;margin:0 auto}.workspace{display:block!important}.canvas{border-color:rgba(88,223,255,.28)!important;border-radius:8px!important;box-shadow:0 24px 80px rgba(0,0,0,.34),0 0 28px rgba(8,124,255,.08)}.canvasbar{padding:14px 18px!important;background:rgba(3,20,34,.84)!important;border-color:rgba(88,223,255,.22)!important;color:#f1f7ff!important}.canvas,.diagram{background:transparent!important}#processSvg>rect:first-of-type{fill:transparent!important}
@media(max-width:1050px){.app-toolbar__rail{grid-template-columns:160px 1fr auto;padding:0 22px}.app-toolbar__logo{width:140px}.app-toolbar__title{font-size:20px}.water-title-sub{display:none}.water-nav-divider,.app-toolbar__status{display:none}}
@media(max-width:650px){.app-toolbar{height:78px!important}.app-toolbar__rail{grid-template-columns:110px 1fr auto;gap:12px;padding:0 14px}.app-toolbar__logo{width:105px}.app-toolbar__title{font-size:13px;letter-spacing:.1em;white-space:normal}.water-title-block>i{margin-top:6px}main{padding:96px 10px 18px!important}}
.canvasbar{align-items:center}.canvasbar__actions{display:flex;align-items:center;gap:18px}.pump-toggle{display:inline-flex;align-items:center;gap:10px;padding:8px 13px;border:1px solid rgba(145,164,180,.48);border-radius:5px;background:rgba(35,43,49,.92);color:#cbd5dc;font:700 10px/1 "D-DIN",Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;transition:.2s}.pump-toggle::before{content:"";width:9px;height:9px;border-radius:50%;background:#87939b;box-shadow:0 0 0 3px rgba(135,147,155,.12)}.pump-toggle.is-on{border-color:rgba(89,210,165,.6);color:#8cf0cb}.pump-toggle.is-on::before{background:#59d2a5;box-shadow:0 0 12px #59d2a5}.pump-toggle b{color:inherit}.tank-liquid{fill:url(#tankWater);opacity:.78;transition:y .7s ease,height .7s ease}.tank-level-label{fill:#d9fbff;font:700 12px Arial,sans-serif;text-anchor:middle;paint-order:stroke;stroke:#13344b;stroke-width:3px;stroke-linejoin:round}@media(max-width:650px){.canvasbar__actions{gap:8px}.pump-toggle span{display:none}.pump-toggle{padding:8px}}
.language-toggle{display:inline-flex;align-items:center;gap:0;min-height:44px;padding:3px;border:1px solid rgba(135,157,181,.28);border-radius:999px;background:rgba(12,22,34,.94);box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 8px 22px rgba(0,0,0,.18)}.language-toggle__button{width:38px;height:36px;min-width:38px;min-height:36px;padding:0;border:0;border-radius:999px;background:transparent;color:#aeb9c8;font:500 12px/1 Arial,sans-serif;letter-spacing:0;cursor:pointer;transition:color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease}.language-toggle__button:hover,.language-toggle__button:focus-visible{color:#fff;outline:none}.language-toggle__button.is-active{background:#2f6fff;color:#fff;box-shadow:0 0 0 1px rgba(92,145,255,.72),0 5px 14px rgba(30,94,255,.35)}@media(max-width:650px){.language-toggle{display:inline-flex;align-items:center;gap:0;min-height:44px;padding:3px;border:1px solid rgba(135,157,181,.28);border-radius:999px;background:rgba(12,22,34,.94);box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 8px 22px rgba(0,0,0,.18)}.language-toggle__button{width:38px;height:36px;min-width:38px;min-height:36px;padding:0;border:0;border-radius:999px;background:transparent;color:#aeb9c8;font:500 12px/1 Arial,sans-serif;letter-spacing:0;cursor:pointer;transition:color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease}}.water-entering .app-toolbar{opacity:0;transform:translate3d(-110%,0,0);filter:blur(12px);transition:opacity .75s ease,transform .95s cubic-bezier(.16,.9,.18,1),filter .75s ease}.water-entering.is-header-ready .app-toolbar{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}.water-entering .water-title-block{opacity:0;transform:translate3d(-42px,0,0);filter:blur(8px);transition:opacity .68s ease,transform .86s cubic-bezier(.16,.9,.18,1),filter .68s ease}.water-entering.is-title-ready .water-title-block{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}.water-entering .canvas{opacity:0;transform:translate3d(0,28px,0) scale(.985);filter:blur(10px);transition:opacity .82s ease,transform 1s cubic-bezier(.16,.9,.18,1),filter .82s ease}.water-entering.is-process-ready .canvas{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}@media(prefers-reduced-motion:reduce){.water-entering .app-toolbar,.water-entering .water-title-block,.water-entering .canvas{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}}