@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{--bg: #0b1112;--bg-soft: #11191b;--surface: #151f21;--surface-elevated: #1b272a;--surface-border: #2c3b40;--surface-border-strong: #3a4d52;--text-strong: #f4f8f8;--text-medium: #c3cfd2;--text-subtle: #8d9ca0;--primary: #16ff00;--primary-strong: #13d700;--primary-soft: rgba(22, 255, 0, .16);--success: #41d995;--warning: #ffc857;--danger: #ff6d7a;--danger-soft: rgba(255, 109, 122, .14);--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--radius-xl: 24px;--shadow-sm: 0 4px 10px rgba(0, 0, 0, .24);--shadow-md: 0 12px 30px rgba(0, 0, 0, .3);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.45;background:radial-gradient(circle at top right,rgba(22,255,0,.08),transparent 32%),radial-gradient(circle at bottom left,rgba(22,255,0,.06),transparent 24%),var(--bg);color:var(--text-strong)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{border:0;background:transparent;cursor:pointer}:focus-visible{outline:2px solid rgba(22,255,0,.9);outline-offset:2px}.page{display:flex;flex-direction:column;gap:var(--space-6)}.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);flex-wrap:wrap}.page-title-block{display:flex;flex-direction:column;gap:var(--space-2)}.page-title{margin:0;font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.2;letter-spacing:-.02em;font-weight:800}.page-subtitle{margin:0;color:var(--text-subtle);font-size:.95rem}.page-actions{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.card{background:linear-gradient(180deg,#ffffff05,#ffffff03);background-color:var(--surface);border:1px solid var(--surface-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.card-body{padding:var(--space-6)}.toolbar-row{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap}.search-control{display:flex;align-items:center;gap:var(--space-2);background:var(--bg-soft);border:1px solid var(--surface-border);border-radius:var(--radius-md);padding:.7rem .9rem;min-width:min(100%,440px)}.search-control svg{color:var(--text-subtle)}.search-input{border:0;background:transparent;color:var(--text-strong);width:100%}.search-input::placeholder{color:var(--text-subtle)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border-radius:12px;border:1px solid transparent;font-weight:600;transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .12s ease;padding:.62rem .95rem;color:var(--text-strong)}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:var(--primary);color:#082006;border-color:#0003}.btn-primary:hover{background:var(--primary-strong)}.btn-secondary{background:var(--bg-soft);border-color:var(--surface-border)}.btn-secondary:hover{border-color:var(--surface-border-strong);background:var(--surface)}.btn-danger{background:var(--danger-soft);border-color:#ff6d7a59;color:#ffc3cb}.btn-danger:hover{background:#ff6d7a33}.btn-ghost{background:transparent;border-color:transparent;color:var(--text-medium)}.btn-ghost:hover{background:#ffffff0f;color:var(--text-strong)}.btn-icon{width:2.35rem;height:2.35rem;padding:0}.btn-sm{padding:.4rem .75rem;font-size:.82rem}.field-row,.form-grid{display:grid;gap:var(--space-4)}.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-field{display:flex;flex-direction:column;gap:.45rem}.form-label{font-size:.82rem;color:var(--text-medium);font-weight:600}.form-input,.form-select,.form-textarea{width:100%;border-radius:var(--radius-sm);border:1px solid var(--surface-border);background:var(--bg-soft);color:var(--text-strong);padding:.7rem .8rem;transition:border-color .2s ease,box-shadow .2s ease}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-subtle)}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:#16ff008c;box-shadow:0 0 0 3px #16ff0024}.alert{border-radius:var(--radius-md);border:1px solid;padding:.8rem .95rem;font-size:.9rem}.alert-error{border-color:#ff6d7a73;color:#ffb8c0;background:#ff6d7a14}.alert-success{border-color:#41d99573;color:#abf3d1;background:#41d99514}.alert-info{border-color:#16ff0061;color:#d6ffd1;background:#16ff0014}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:.24rem .55rem;font-size:.72rem;font-weight:700;border:1px solid var(--surface-border);color:var(--text-medium)}.badge-success{border-color:#41d99573;color:#aaf0cf;background:#41d99524}.badge-danger{border-color:#ff6d7a66;color:#ffb5be;background:#ff6d7a21}.chip{display:inline-flex;align-items:center;border:1px solid rgba(22,255,0,.35);color:#cbffc4;background:#16ff001f;border-radius:999px;padding:.2rem .55rem;font-size:.72rem;font-weight:600}.data-muted{color:var(--text-subtle)}.monospace{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.skeleton{border-radius:var(--radius-sm);background:linear-gradient(90deg,#ffffff0f,#ffffff24,#ffffff0f);background-size:240% 100%;animation:shimmer 1.2s infinite}.skeleton-line{height:14px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}.dashboard-shell{min-height:100vh;display:flex;background:var(--bg)}.dashboard-desktop-sidebar{width:270px;flex:0 0 270px;border-right:1px solid var(--surface-border);background:#0003}.dashboard-sidebar{height:100%;display:flex;flex-direction:column;padding:var(--space-6) var(--space-4);gap:var(--space-6)}.sidebar-brand{display:flex;align-items:center;gap:.75rem;width:100%;padding:.4rem;border-radius:var(--radius-md)}.sidebar-brand:hover{background:#ffffff0a}.brand-mark{width:2.35rem;height:2.35rem;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:var(--primary);color:#082006;font-weight:800}.brand-title{margin:0;font-size:1.05rem;font-weight:700}.brand-subtitle{margin:0;color:var(--text-subtle);font-size:.76rem}.sidebar-nav{display:flex;flex-direction:column;gap:.25rem}.sidebar-link{display:flex;align-items:center;gap:.65rem;border-radius:10px;padding:.62rem .75rem;color:var(--text-medium);border:1px solid transparent;transition:background-color .2s ease,color .2s ease,border-color .2s ease}.sidebar-link:hover{color:var(--text-strong);background:#ffffff0a}.sidebar-link.active{color:#d7ffd1;background:#16ff0024;border-color:#16ff0059}.sidebar-link-icon{flex:0 0 auto}.sidebar-footer{margin-top:auto}.sidebar-logout{width:100%;justify-content:flex-start}.dashboard-main{flex:1;min-width:0;padding:var(--space-8)}.page-container{width:min(1200px,100%);margin:0 auto}.dashboard-topbar{display:none}.topbar-title{margin:0;font-size:1rem;font-weight:700}.drawer-overlay,.drawer-panel{display:none}.metrics-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}.metric-card{padding:var(--space-5);display:flex;flex-direction:column;gap:.45rem}.metric-label{color:var(--text-subtle);font-size:.8rem;font-weight:600}.metric-value{font-size:clamp(1.6rem,2vw,2.05rem);letter-spacing:-.02em;font-weight:800}.metric-meta{color:var(--text-medium);font-size:.84rem}.table-shell{overflow:hidden}.data-table{width:100%;border-collapse:collapse}.data-table thead{background:#ffffff08}.data-table th{text-align:left;font-size:.75rem;color:var(--text-subtle);font-weight:600;padding:.8rem .95rem;border-bottom:1px solid var(--surface-border)}.data-table td{padding:.9rem .95rem;border-bottom:1px solid rgba(255,255,255,.06);vertical-align:middle}.data-table tbody tr:hover{background:#ffffff08}.row-title{font-weight:700}.row-subtitle{font-size:.82rem;color:var(--text-subtle)}.avatar{width:2.1rem;height:2.1rem;border-radius:999px;object-fit:cover;background:var(--bg-soft);border:1px solid var(--surface-border);display:inline-flex;align-items:center;justify-content:center;font-weight:700}.table-actions{display:inline-flex;align-items:center;gap:.4rem}.icon-btn{width:2rem;height:2rem;border-radius:8px;border:1px solid var(--surface-border);background:var(--bg-soft);color:var(--text-medium);display:inline-flex;align-items:center;justify-content:center}.icon-btn:hover{color:var(--text-strong);border-color:var(--surface-border-strong)}.icon-btn:disabled{opacity:.45;cursor:not-allowed}.icon-btn-danger{color:#ffb6c0;border-color:#ff6d7a73;background:#ff6d7a14}.desktop-only{display:block}.mobile-only{display:none}.account-cards{display:grid;gap:var(--space-3)}.account-card{padding:1rem;display:flex;flex-direction:column;gap:.75rem}.account-card-head{display:flex;justify-content:space-between;align-items:center;gap:.75rem}.account-card-meta{display:grid;gap:.2rem;color:var(--text-medium);font-size:.84rem}.modal-backdrop{position:fixed;inset:0;background:#000000a3;display:flex;justify-content:center;align-items:center;padding:var(--space-4);z-index:1000}.modal-panel{width:min(980px,100%);max-height:92vh;background:var(--surface);border:1px solid var(--surface-border-strong);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);display:flex;flex-direction:column}.modal-header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-5) var(--space-6) var(--space-3);border-bottom:1px solid var(--surface-border)}.modal-title{margin:0;font-size:1.15rem;font-weight:700}.modal-subtitle{margin:0;color:var(--text-subtle);font-size:.82rem}.modal-tabs{display:flex;gap:.5rem;padding:0 var(--space-6) var(--space-4)}.modal-tab{border-radius:999px;border:1px solid var(--surface-border);color:var(--text-medium);padding:.45rem .9rem;font-size:.8rem;font-weight:600}.modal-tab.active{color:#d4ffcf;border-color:#16ff0066;background:#16ff001f}.modal-body{padding:0 var(--space-6) var(--space-6);overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-4)}.section-card{border:1px solid var(--surface-border);border-radius:var(--radius-lg);background:#ffffff03;padding:var(--space-4);display:grid;gap:var(--space-4)}.section-title{margin:0;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--text-subtle)}.toggle-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}.toggle-card{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--surface-border);border-radius:var(--radius-sm);padding:.7rem .8rem;background:var(--bg-soft)}.toggle-card label{display:flex;flex-direction:column;gap:.15rem;font-size:.82rem;color:var(--text-medium)}.toggle-card input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--primary)}.valve-list{display:grid;gap:.6rem}.valve-item{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);border:1px solid var(--surface-border);border-radius:var(--radius-sm);padding:.7rem .8rem;background:var(--bg-soft)}.valve-item-main{display:flex;flex-direction:column;gap:.1rem}.valve-item-main strong{font-size:.92rem}.valve-item-main span{color:var(--text-subtle);font-size:.8rem}.valve-item-actions{display:flex;align-items:center;gap:.4rem}.inline-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}.hint-text{margin:0;color:var(--text-subtle);font-size:.82rem}.modal-footer{position:sticky;bottom:0;display:flex;gap:var(--space-3);justify-content:flex-end;padding-top:var(--space-2);background:linear-gradient(180deg,#151f2100,#151f21 22%)}.sensor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}.sensor-card{padding:var(--space-4);display:grid;gap:var(--space-3)}.sensor-top{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-2)}.sensor-title{margin:0;font-size:1rem;font-weight:700}.sensor-subtitle{margin:0;color:var(--text-subtle);font-size:.8rem}.sensor-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2)}.metric-tile{border-radius:var(--radius-sm);border:1px solid var(--surface-border);background:var(--bg-soft);padding:.6rem .7rem;display:flex;flex-direction:column;gap:.12rem}.metric-tile-label{color:var(--text-subtle);font-size:.72rem}.metric-tile-value{font-weight:700}.sensor-footer{display:flex;justify-content:space-between;align-items:center;gap:var(--space-2);padding-top:var(--space-2);border-top:1px solid rgba(255,255,255,.06);color:var(--text-subtle);font-size:.78rem}.two-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}.slider-field{display:flex;flex-direction:column;gap:.5rem}.slider-meta{display:flex;justify-content:space-between;color:var(--text-subtle);font-size:.78rem}.range-input{width:100%;accent-color:var(--primary)}.centered-page{width:min(680px,100%);margin-inline:auto}.segmented-control{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;background:var(--bg-soft);border:1px solid var(--surface-border);border-radius:var(--radius-md);padding:.35rem}.segmented-control button{border-radius:10px;padding:.55rem .7rem;color:var(--text-medium);font-size:.82rem;font-weight:600}.segmented-control button.active{background:#16ff0026;color:#d6ffd1;border:1px solid rgba(22,255,0,.34)}.otp-code-input{text-align:center;letter-spacing:.28em;font-size:1.5rem;font-weight:700}.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-6)}.auth-card{width:min(440px,100%);border-radius:var(--radius-xl);border:1px solid var(--surface-border-strong);background:var(--surface);padding:var(--space-8);box-shadow:var(--shadow-md);display:flex;flex-direction:column;gap:var(--space-5)}.auth-brand{display:flex;align-items:center;gap:.8rem}.auth-title{margin:0;font-size:1.42rem;font-weight:800}.auth-subtitle{margin:0;color:var(--text-subtle);font-size:.9rem}.auth-password-wrap{position:relative}.password-toggle{position:absolute;right:.45rem;top:50%;transform:translateY(-50%)}@media(max-width:1200px){.sensor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:1024px){.dashboard-shell{display:block}.dashboard-desktop-sidebar{display:none}.dashboard-topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);background:#0b1112eb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--surface-border);padding:.6rem var(--space-4)}.dashboard-main{padding:var(--space-5)}.drawer-overlay{display:block;position:fixed;inset:0;background:#00000094;z-index:70}.drawer-panel{display:block;position:fixed;top:0;left:0;height:100dvh;width:min(300px,82vw);transform:translate(-100%);transition:transform .2s ease;z-index:80;background:#10181a;border-right:1px solid var(--surface-border-strong);box-shadow:var(--shadow-md)}.drawer-panel.is-open{transform:translate(0)}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:900px){.desktop-only{display:none}.mobile-only{display:block}.form-grid.two,.form-grid.three,.inline-form-grid,.two-column,.toggle-grid,.sensor-grid,.metrics-grid{grid-template-columns:1fr}.modal-panel{width:100%;max-height:96vh}.modal-header,.modal-tabs,.modal-body{padding-left:var(--space-4);padding-right:var(--space-4)}}@media(max-width:640px){.page-header{gap:var(--space-3)}.page-actions,.page-actions .btn{width:100%}.auth-card{padding:var(--space-6)}.dashboard-main{padding:var(--space-4)}.modal-footer{flex-direction:column-reverse}.modal-footer .btn{width:100%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}