/* Application layouts and controls. Visual foundation: bundled Tabler 1.6.1.
   Legacy Supabase/industrial/dashboard themes are deliberately not loaded. */
:root{color-scheme:light;--canvas:#f4f6f8;--surface:#fff;--surface-muted:#f0f4f8;--text:#152235;--muted:#586678;--line:#dce3ea;--accent:#2563eb;--accent-soft:#eff6ff;--good:#137a56;--good-bg:#e9f7f0;--warn:#9a5b0a;--warn-bg:#fff5df;--danger:#c43636;--danger-bg:#fff0ef;--radius:12px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;color:var(--text);background:var(--canvas);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}a{color:var(--accent)}button,input,select,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #89b3ff;outline-offset:3px}button{color:inherit}h1,h2,h3,p{margin:0}h1{font-size:28px;line-height:1.28;font-weight:650;letter-spacing:-.6px}h2{font-size:21px;line-height:1.35;font-weight:650;letter-spacing:-.3px}h3{font-size:16px;line-height:1.4;font-weight:650}p{line-height:1.5}strong{font-weight:650}[hidden]{display:none!important}.muted{color:var(--muted)}.eyebrow{font-size:12px;line-height:1.5;letter-spacing:1.15px;font-weight:650;color:var(--muted);margin-bottom:8px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap}.skip-link{position:fixed;left:16px;top:-100px;z-index:30;background:white;padding:12px;border:2px solid var(--accent)}.skip-link:focus{top:12px}.button{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;border-radius:7px;padding:9px 14px;font-size:13px;font-weight:600;line-height:1.4;text-decoration:none;background:transparent;white-space:nowrap}.button.primary{background:var(--accent);color:#fff}.button.primary:hover{background:#1d4ed8}.button.secondary{background:var(--surface);border-color:var(--line)}.button.secondary:hover{background:var(--surface-muted);border-color:#aebbc9}.button.quiet{color:var(--muted)}.button.quiet:hover{background:var(--surface-muted);color:var(--text)}.button.small{min-height:34px;padding:6px 10px;font-size:12px}.button.full{width:100%}.brand{display:flex;align-items:center;gap:10px;font-size:19px;line-height:1.15;font-weight:700;letter-spacing:-.3px;flex-shrink:0}.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:38px;border-radius:8px;background:var(--accent);color:white;font-size:25px;line-height:1;font-weight:700}.brand-caption{display:block;font-size:12px;line-height:1.6;letter-spacing:.35px;color:var(--muted);font-weight:500}.brand-button{border:0;background:none;text-align:left;padding:0}.topbar{height:76px;padding:0 32px;display:flex;align-items:center;gap:40px;background:var(--surface);border-bottom:1px solid var(--line)}.main-nav{display:flex;align-self:stretch;gap:24px}.nav-link{border:0;background:none;position:relative;padding:0 2px;font-size:13px;font-weight:550;color:var(--muted)}.nav-link.is-active{color:var(--accent)}.nav-link.is-active:after{content:"";height:2px;background:var(--accent);position:absolute;bottom:0;left:0;right:0}.topbar-meta{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:12px;color:var(--muted)}.local-time{font-variant-numeric:tabular-nums;color:var(--text)}.timezone{border-right:1px solid var(--line);padding-right:16px}.user-name{max-width:160px;overflow:hidden;text-overflow:ellipsis}.workspace{max-width:1600px;margin:auto;padding:32px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.page-heading .muted{margin-top:7px;font-size:13px}.refresh-area{display:flex;align-items:center;gap:14px;flex-shrink:0}.refresh-state{font-size:12px;color:var(--muted)}.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:30px}.summary-card{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);padding:18px 20px;min-width:0}.summary-label{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;font-weight:500}.summary-card>div{display:flex;align-items:baseline;gap:7px;margin:12px 0 9px;line-height:1}.summary-card strong{font-size:30px;font-weight:650;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.summary-denominator{font-size:19px;color:#85909e}.summary-unit{font-size:14px;color:var(--muted)}.summary-foot{color:var(--muted);font-size:12px;line-height:1.4}.dot{width:6px;height:6px;border-radius:50%;display:inline-block;background:#8b98a8;flex:none}.dot.online{background:var(--good)}.dot.offline{background:var(--danger)}.dot.warning{background:var(--warn)}.fleet-toolbar{display:flex;gap:16px;align-items:center;justify-content:space-between;margin-bottom:18px}.site-filter{display:flex;gap:5px;flex-wrap:wrap}.site-button{border:1px solid transparent;border-radius:7px;padding:9px 13px;background:transparent;font-size:13px;color:var(--muted);min-height:38px;display:flex;gap:9px;align-items:center;white-space:nowrap}.site-button span{font-size:12px;padding:2px 5px;min-width:19px;text-align:center;background:#e5eaf0;border-radius:4px;font-variant-numeric:tabular-nums}.site-button:hover{background:#e9eef4}.site-button[aria-pressed=true]{background:var(--surface);border-color:var(--line);color:var(--text);font-weight:600;box-shadow:0 1px 2px #15223505}.site-button[aria-pressed=true] span{background:var(--accent-soft);color:var(--accent)}.fleet-count{font-size:12px;color:var(--muted);white-space:nowrap}.fleet-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.unit-card{display:block;min-width:0;min-height:274px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;text-align:left;box-shadow:0 1px 2px #15223503;transition:border-color .15s,box-shadow .15s}.unit-card:hover{border-color:#9cb6db;box-shadow:0 3px 12px #15223508}.unit-card>span{display:block}.card-top{display:flex!important;justify-content:space-between;gap:12px;align-items:flex-start}.card-name{display:block;font-size:18px;font-weight:650;line-height:1.4;letter-spacing:-.2px}.card-site{display:block;font-size:12px;color:var(--muted);margin-top:3px}.card-arrow{font-size:20px;line-height:1;color:#9ba8b8}.card-statuses{display:flex!important;flex-wrap:wrap;gap:6px;margin:15px 0 18px}.badge{display:inline-flex;align-items:center;gap:6px;max-width:100%;font-size:12px;line-height:1.45;font-weight:550;border-radius:5px;padding:4px 7px;background:var(--surface-muted);color:var(--muted)}.badge:before{content:"";width:5px;height:5px;flex:none;border-radius:50%;background:currentColor}.badge.online,.badge.good{color:var(--good);background:var(--good-bg)}.badge.stale,.badge.waiting,.badge.warning{color:var(--warn);background:var(--warn-bg)}.badge.offline,.badge.error,.badge.invalid{color:var(--danger);background:var(--danger-bg)}.badge.unconfigured,.badge.neutral,.badge.missing,.badge.unavailable{background:var(--surface-muted);color:var(--muted)}.card-power{display:flex!important;align-items:baseline;gap:8px}.card-power .metric-value{font-size:38px;line-height:44px;font-weight:650;letter-spacing:-1.1px}.card-power .metric-unit{font-size:15px;color:var(--muted)}.card-power-label{font-size:12px;color:var(--muted);margin-top:1px}.card-metrics{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;border-top:1px solid #edf0f4;margin-top:19px;padding-top:15px}.card-mini{display:block;min-width:0}.card-mini-label{font-size:12px;line-height:1.4;color:var(--muted);display:block;margin-bottom:5px}.card-mini-reading{display:block;white-space:nowrap;font-variant-numeric:tabular-nums;line-height:1.3}.card-mini .metric-value{font-size:19px;font-weight:600;letter-spacing:-.2px}.card-mini .metric-unit{font-size:12px;color:var(--muted);margin-left:3px}.card-footer{border-top:1px solid #edf0f4;margin-top:17px;padding-top:12px;display:flex!important;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px;line-height:1.4}.quality-stale .metric-value{color:var(--warn)}.quality-invalid .metric-value{color:var(--danger)}.quality-missing .metric-value,.quality-unavailable .metric-value{color:#8f9baa}.metric-quality{font-size:12px;color:var(--muted);line-height:1.5}.quality-stale .metric-quality{color:var(--warn)}.quality-invalid .metric-quality{color:var(--danger)}.data-note{font-size:12px;color:var(--muted);margin-top:16px;max-width:860px}.connections-section{margin-top:44px;scroll-margin-top:24px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.receiver-strip{display:flex;justify-content:space-between;gap:24px;border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;background:#eaf0f6;margin-bottom:18px}.receiver-strip h3{font-size:14px}.receiver-strip p{font-size:12px;color:var(--muted);margin-top:5px;max-width:720px}.receiver-address{display:flex;flex-direction:column;gap:7px;max-width:40%;min-width:200px}.receiver-address>span{font-size:12px;color:var(--muted)}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;overflow-wrap:anywhere}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);min-width:0}.panel-head{padding:20px 22px 17px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #edf0f4}.panel-head h3{font-size:15px}.panel-head p{font-size:12px;color:var(--muted);margin-top:5px}.small-count{background:var(--surface-muted);padding:3px 7px;border-radius:5px;color:var(--muted);font-size:12px}.empty-inline{display:flex;flex-direction:column;gap:7px;padding:25px 22px;color:var(--muted);font-size:12px;line-height:1.5}.empty-inline strong{color:var(--text);font-size:13px;font-weight:550}.pending-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 22px;border-bottom:1px solid #edf0f4}.pending-row:last-child{border-bottom:0}.pending-row>div{min-width:0}.pending-id{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;overflow-wrap:anywhere}.pending-meta{font-size:12px;color:var(--muted);margin-top:5px}.event-list{list-style:none;margin:0;padding:0;max-height:350px;overflow:auto}.event-row{display:grid;grid-template-columns:6px minmax(0,1fr) auto;gap:10px;padding:17px 22px;border-bottom:1px solid #edf0f4;align-items:start}.event-row:last-child{border-bottom:0}.event-row .dot{margin-top:6px}.event-message{font-size:12px;overflow-wrap:anywhere}.event-device{font-size:12px;color:var(--muted);margin-top:4px}.event-row time{font-size:12px;white-space:nowrap;color:var(--muted);padding-top:2px}.page-footer{display:flex;gap:16px;justify-content:space-between;color:#768495;font-size:12px;line-height:1.5;border-top:1px solid var(--line);padding:21px 0 0;margin-top:40px}.unit-breadcrumb{display:flex;align-items:center;gap:13px;color:var(--muted);font-size:12px;margin-bottom:25px}.back-link{color:var(--muted);border:0;padding:5px 0;background:none;display:inline-flex;gap:8px;align-items:center;font-size:12px}.back-link:hover{color:var(--accent)}.unit-breadcrumb select{margin-left:auto;width:auto;max-width:310px;min-width:170px;height:36px;font-size:12px}.unit-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.unit-heading h1{font-size:30px;letter-spacing:-.6px}.unit-heading-meta{display:flex;align-items:center;gap:18px;color:var(--muted);font-size:12px}.status-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.unit-tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin-bottom:24px;overflow-x:auto;scrollbar-width:none}.unit-tabs button{position:relative;white-space:nowrap;border:0;background:none;padding:0 0 15px;font-size:14px;font-weight:550;color:var(--muted)}.unit-tabs button[aria-selected=true]{color:var(--accent)}.unit-tabs button[aria-selected=true]:after{position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent);content:""}.instrument-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.metric-tile{display:flex;flex-direction:column;align-items:stretch;text-align:left;padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);min-width:0;min-height:159px;transition:border-color .15s}.metric-tile:hover{border-color:#9cb6db}.metric-label{font-size:12px;font-weight:550;color:var(--muted);line-height:1.5;display:flex;justify-content:space-between;gap:10px}.metric-label:after{content:"↗";color:#9ba8b8}.metric-reading{display:flex;align-items:baseline;gap:8px;white-space:nowrap;margin:15px 0 7px;font-variant-numeric:tabular-nums;min-width:0}.metric-reading .metric-value{font-size:40px;line-height:1.2;letter-spacing:-1px;font-weight:650}.metric-reading .metric-unit{font-size:14px;color:var(--muted)}.metric-tile .metric-quality{margin-top:auto}.metric-tile.is-selected{border-color:#89acf0;box-shadow:0 0 0 1px #d8e6ff;background:#fbfdff}.section-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;margin-bottom:20px}.measure-panel{padding:20px 22px}.measure-panel>h3{font-size:15px;margin-bottom:18px}.phase-section+.phase-section{border-top:1px solid #edf0f4;margin-top:20px;padding-top:18px}.phase-label{font-size:12px;color:var(--muted);margin-bottom:12px}.phase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.phase-cell{border:0;border-radius:7px;background:var(--surface-muted);text-align:left;padding:12px;min-width:0}.phase-cell:hover{background:var(--accent-soft)}.phase-name{font-size:12px;color:var(--muted)}.phase-reading{display:flex;align-items:baseline;gap:5px;margin-top:8px;font-variant-numeric:tabular-nums}.phase-reading .metric-value{font-size:25px;font-weight:600;line-height:1.2;letter-spacing:-.5px}.phase-reading .metric-unit{font-size:12px;color:var(--muted)}.phase-cell .metric-quality{display:block;margin-top:7px;font-size:12px}.compact-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}.compact-metrics .metric-tile{min-height:140px}.compact-metrics .metric-reading .metric-value{font-size:30px}.controller-list{display:flex;flex-direction:column;gap:0}.controller-row{padding:14px 0;border-bottom:1px solid #edf0f4;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:12px;color:var(--muted)}.controller-row:first-child{padding-top:0}.controller-row:last-child{border-bottom:0;padding-bottom:0}.controller-row strong{font-size:14px;color:var(--text);font-weight:550;text-align:right;overflow-wrap:anywhere}.panel-note{font-size:12px;color:var(--muted);margin-top:17px;line-height:1.5}.metric-instruction{font-size:12px;color:var(--muted);margin:0 0 17px}.unit-section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:16px}.unit-section-heading p{font-size:12px;color:var(--muted)}.connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.detail-list{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;margin:0}.detail-list>div{padding:14px 0;border-bottom:1px solid #edf0f4;min-width:0}.detail-list>div:nth-child(odd){padding-right:16px}.detail-list dt{font-size:12px;color:var(--muted);margin-bottom:6px}.detail-list dd{font-size:13px;line-height:1.5;overflow-wrap:anywhere;margin:0}.connection-action{display:flex;align-items:center;gap:15px;margin-top:20px}.catalog-list{list-style:none;margin:0;padding:0;max-height:440px;overflow:auto}.catalog-list li{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #edf0f4;font-size:12px}.catalog-list li:last-child{border:0}.catalog-list .badge{font-size:12px;flex-shrink:0}.history-panel{margin-top:24px;padding:23px 24px}.history-heading{display:flex;gap:16px;align-items:center;justify-content:space-between}.history-heading h2{font-size:18px}.history-heading .eyebrow{font-size:12px}.history-controls{display:flex;align-items:flex-end;gap:14px;margin:21px 0 18px}.history-controls>div:first-child{min-width:250px}.history-controls label{margin:0 0 6px;font-size:12px;color:var(--muted)}.history-controls select{height:38px;font-size:12px}.history-controls p{font-size:12px;color:var(--muted);margin-left:auto;margin-bottom:9px;text-align:right}.chart-container{min-height:236px;position:relative}.chart-empty{height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px dashed var(--line);border-radius:8px;background:linear-gradient(#fff,#fbfcfe);color:var(--muted);padding:28px;gap:9px}.chart-empty strong{font-size:14px;color:var(--text);font-weight:550}.chart-empty span{max-width:430px;font-size:12px;line-height:1.6}.chart-empty-icon{font-size:24px;color:#9eacc0;letter-spacing:5px}.history-chart{display:block;width:100%;height:260px;overflow:visible}.history-chart text{fill:var(--muted);font-family:inherit;font-size:12px}.history-chart line{stroke:var(--line)}.history-chart .chart-line{stroke:var(--accent);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.history-chart .chart-point{fill:var(--accent)}.history-chart .chart-focus{fill:var(--accent);stroke:white;stroke-width:2}.history-chart .chart-crosshair{stroke:#8096b8;stroke-dasharray:3 4}.chart-tooltip{background:var(--text);color:white;font-size:12px;padding:8px 12px;border-radius:6px;position:absolute;top:5px;right:8px;pointer-events:none}.chart-caption{font-size:12px;color:var(--muted);margin-top:10px}.notice{border:1px solid #f4baba;background:var(--danger-bg);border-radius:8px;padding:13px 16px;margin-bottom:22px;font-size:13px;line-height:1.6;overflow-wrap:anywhere}.warning-notice{border-color:#ebd7a5;background:var(--warn-bg);color:var(--warn)}.loading-panel,.empty-state{padding:50px 24px;text-align:center;color:var(--muted);background:white;border:1px solid var(--line);border-radius:var(--radius);line-height:1.6}.empty-state strong{display:block;color:var(--text);margin-bottom:8px}.fetch-stale .refresh-state{color:var(--danger)}.fetch-stale .unit-card{border-color:#e2cda3}.boot{min-height:100vh;display:flex;align-items:center;justify-content:center;gap:16px;color:var(--muted)}.login-view{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;background:var(--surface)}.login-story{background:#152235;color:white;padding:48px 11% 30px;display:flex;flex-direction:column}.brand-light .brand-caption{color:#a9b6c8}.login-intro{margin:auto 0;padding:70px 0 55px}.login-intro .eyebrow{color:#92a7c5}.login-intro h1{font-size:clamp(34px,3.3vw,52px);line-height:1.14;letter-spacing:-1.6px}.login-intro>p:last-child{color:#aebcce;margin-top:24px;line-height:1.7}.plant-map{display:flex;gap:25px;padding-top:28px;border-top:1px solid #344153;justify-content:space-between}.plant-map>div{display:flex;flex-direction:column;gap:12px}.plant-map span{font-size:12px;color:#aebcce}.plant-map strong{font-size:28px}.plant-map small{font-size:12px;font-weight:400;color:#aebcce}.login-foot{font-size:12px;color:#8194ae;margin-top:50px}.login-access{display:flex;align-items:center;justify-content:center;padding:56px}.login-form-wrap{width:100%;max-width:360px}.login-form-wrap h2{font-size:27px;letter-spacing:-.5px;margin-bottom:12px}.login-form-wrap>.muted{font-size:13px}.login-form-wrap form{margin-top:32px}.login-form-wrap .button{margin-top:24px;min-height:44px}.login-note{font-size:12px;line-height:1.7;color:var(--muted);margin-top:27px;border-top:1px solid var(--line);padding-top:23px}label{display:block;font-size:12px;font-weight:550;margin:18px 0 7px}input,select{width:100%;height:42px;border:1px solid #cbd5df;border-radius:6px;background:var(--surface);color:var(--text);padding:9px 11px;min-width:0;max-width:100%}input:hover,select:hover{border-color:#9eafc2}input:focus,select:focus{border-color:var(--accent)}.form-error{margin:15px 0 0;color:var(--danger);font-size:12px;line-height:1.6}dialog{border:1px solid var(--line);border-radius:14px;width:540px;max-width:calc(100% - 32px);max-height:calc(100% - 40px);padding:27px;color:var(--text);overflow:auto;box-shadow:0 18px 70px #1522352b}dialog::backdrop{background:#15223570;backdrop-filter:blur(2px)}.dialog-heading{display:flex;gap:18px;align-items:flex-start;justify-content:space-between}.dialog-heading h2{font-size:22px}.dialog-heading .eyebrow{font-size:12px}.icon-button{border:0;background:var(--surface-muted);width:30px;height:30px;flex:none;border-radius:6px;color:var(--muted);font-size:23px;line-height:1}.dialog-description{font-size:12px;line-height:1.7;margin-top:17px}.form-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field-help{font-size:12px;line-height:1.5;color:var(--muted);margin-top:6px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:26px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:50;max-width:calc(100% - 32px);background:var(--text);color:#fff;border-radius:8px;padding:13px 20px;font-size:13px;line-height:1.5;box-shadow:0 8px 30px #15223526}.noscript{padding:20px;text-align:center}.unit-events .event-list{max-height:600px}.unit-events .empty-inline{min-height:180px;justify-content:center}.equipment-note{font-size:12px;color:var(--muted);line-height:1.6;margin:18px 0 0}
@media(min-width:1700px){.workspace{max-width:1600px}.unit-card{min-height:294px;padding:24px}.card-power{margin-top:3px}.card-metrics{margin-top:22px}.card-footer{margin-top:20px}}
@media(max-width:1199px){.fleet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{gap:28px;padding:0 24px}.workspace{padding:26px 24px}.summary-grid{gap:12px}.summary-card{padding:17px 16px}.instrument-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-grid{grid-template-columns:1.2fr 1fr}.unit-heading-meta{flex-direction:column;align-items:flex-end;gap:10px}.history-controls p{max-width:240px}.login-story{padding-left:10%;padding-right:10%}.login-access{padding:40px}.plant-map{gap:16px}}
@media(max-width:767px){h1{font-size:25px}.topbar{height:66px;padding:0 16px;gap:22px}.brand{font-size:17px;gap:8px}.brand-mark{width:30px;height:33px;font-size:23px}.brand-caption{font-size:12px}.main-nav{gap:16px}.nav-link{font-size:12px}.topbar-meta{gap:5px}.local-time,.timezone,.user-name{display:none}.topbar-meta .button{padding:6px 4px}.workspace{padding:24px 16px}.page-heading{align-items:flex-start;gap:12px;margin-bottom:21px}.page-heading .eyebrow{font-size:12px;letter-spacing:.8px}.page-heading .muted{font-size:12px;max-width:220px}.refresh-area{flex-direction:column-reverse;align-items:flex-end;gap:9px}.refresh-state{font-size:12px;max-width:100px;text-align:right;line-height:1.4}.refresh-area .button{min-height:35px;padding:7px 10px;font-size:12px}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:25px}.summary-card{padding:15px 14px}.summary-label{font-size:12px;gap:5px;line-height:1.5;min-height:30px;align-items:flex-start}.summary-label .dot{margin-top:5px}.summary-card>div{margin:8px 0 10px}.summary-card strong{font-size:28px}.summary-denominator{font-size:17px}.summary-unit{font-size:12px}.summary-foot{font-size:12px;min-height:28px}.fleet-toolbar{display:block;margin-bottom:15px}.site-filter{gap:5px;display:grid;grid-template-columns:1fr 1fr}.site-button{justify-content:space-between;padding:9px 11px;font-size:12px;min-height:38px}.fleet-count{display:block;margin-top:13px;font-size:12px}.fleet-grid{grid-template-columns:minmax(0,1fr);gap:14px}.unit-card{padding:20px;min-height:282px}.card-name{font-size:18px}.card-statuses{margin:14px 0 17px}.card-power .metric-value{font-size:36px;line-height:42px}.card-metrics{gap:12px;margin-top:18px;padding-top:15px}.card-mini .metric-value{font-size:21px}.card-mini .metric-unit{font-size:12px}.card-footer{margin-top:18px}.data-note{font-size:12px;margin-top:14px;line-height:1.6}.connections-section{margin-top:35px}.section-heading{gap:12px}.section-heading h2{font-size:20px}.section-heading .eyebrow{font-size:12px}.receiver-strip{flex-direction:column;gap:16px;padding:18px}.receiver-address{max-width:none;min-width:0;border-top:1px solid #d5dfe9;padding-top:13px}.receiver-strip p{font-size:12px}.bottom-grid{grid-template-columns:1fr;gap:14px}.panel-head{padding:18px}.panel-head p{font-size:12px}.empty-inline{padding:22px 18px}.event-row,.pending-row{padding:16px 18px}.event-row{grid-template-columns:6px minmax(0,1fr);gap:8px}.event-row time{grid-column:2}.page-footer{margin-top:30px;flex-wrap:wrap;gap:8px 18px;font-size:12px;padding-top:18px}.page-footer>span:nth-child(2){order:3;width:100%}.unit-breadcrumb{flex-wrap:wrap;gap:9px;font-size:12px;margin-bottom:21px}.unit-breadcrumb select{width:100%;max-width:none;margin:6px 0 0;height:40px}.unit-heading{align-items:flex-start;gap:8px;margin-bottom:23px}.unit-heading h1{font-size:27px}.unit-heading .eyebrow{font-size:12px;letter-spacing:.7px}.unit-heading-meta{max-width:115px;font-size:12px;text-align:right;gap:11px;line-height:1.5}.unit-heading-meta .button{font-size:12px;min-height:35px;padding:7px 10px}.status-row{gap:5px}.unit-tabs{gap:22px;margin-bottom:19px}.unit-tabs button{font-size:12px;padding-bottom:13px;min-height:37px}.instrument-grid{gap:10px;margin-bottom:16px}.metric-tile{padding:16px 13px;min-height:153px}.metric-label{font-size:12px;line-height:1.5;min-height:32px}.metric-label:after{display:none}.metric-reading{gap:5px;margin:10px 0 9px}.metric-reading .metric-value{font-size:34px;line-height:1.25;letter-spacing:-.8px}.metric-reading .metric-unit{font-size:12px}.metric-quality{font-size:12px;line-height:1.5}.section-grid,.connection-grid{grid-template-columns:minmax(0,1fr);gap:16px;margin-bottom:16px}.measure-panel{padding:18px}.measure-panel>h3{font-size:14px;margin-bottom:16px}.phase-grid{gap:8px}.phase-cell{padding:11px 9px}.phase-reading{gap:4px}.phase-reading .metric-value{font-size:23px}.phase-reading .metric-unit{font-size:12px}.phase-cell .metric-quality{font-size:12px}.compact-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:16px}.compact-metrics .metric-tile:last-child:nth-child(odd){grid-column:1/-1}.compact-metrics .metric-tile{min-height:130px}.compact-metrics .metric-reading .metric-value{font-size:29px}.panel-note{font-size:12px;margin-top:15px}.controller-row{font-size:12px;gap:12px}.controller-row strong{font-size:12px}.unit-section-heading{align-items:flex-start}.unit-section-heading h2{font-size:19px}.unit-section-heading p{font-size:12px;max-width:160px;text-align:right}.history-panel{padding:19px 16px;margin-top:20px}.history-heading h2{font-size:17px}.history-heading .eyebrow{font-size:12px;letter-spacing:.7px}.history-heading .button{font-size:12px;padding:7px 10px;min-height:35px}.history-controls{flex-wrap:wrap;gap:12px;margin-top:18px}.history-controls>div:first-child{min-width:0;flex:1 1 58%}.history-controls>div:nth-child(2){flex:1 1 32%}.history-controls p{max-width:none;text-align:left;margin:0;width:100%;font-size:12px}.history-controls select{padding:8px;font-size:12px}.chart-container{min-height:205px}.history-chart{height:220px}.chart-empty{height:220px;padding:20px}.chart-empty strong{font-size:13px}.chart-empty span{font-size:12px}.chart-caption{font-size:12px;line-height:1.5}.chart-tooltip{font-size:12px;padding:6px 9px;right:0;max-width:100%}.metric-instruction{font-size:12px;line-height:1.6}.detail-list{gap:0 10px}.detail-list dt{font-size:12px}.detail-list dd{font-size:12px}.catalog-list li{font-size:12px;gap:8px}.catalog-list .badge{font-size:12px}.connection-action{align-items:flex-start;flex-direction:column;gap:10px}.login-view{grid-template-columns:1fr}.login-story{padding:23px 24px 20px}.login-story .brand{margin-bottom:28px}.login-intro{padding:0}.login-intro .eyebrow{font-size:12px}.login-intro h1{font-size:28px;letter-spacing:-.7px}.login-intro>p:last-child{display:none}.plant-map{padding-top:17px;margin-top:24px;gap:14px}.plant-map span{font-size:12px}.plant-map strong{font-size:22px}.plant-map>div{gap:8px}.login-foot{display:none}.login-access{padding:34px 24px 40px}.login-form-wrap{max-width:400px}.login-form-wrap>.eyebrow{font-size:12px}.login-form-wrap h2{font-size:24px}.login-form-wrap form{margin-top:24px}.login-note{margin-top:23px;font-size:12px}dialog{padding:22px 19px;max-width:calc(100% - 24px);max-height:calc(100% - 24px)}.dialog-heading h2{font-size:20px}.dialog-heading .eyebrow{font-size:12px;letter-spacing:.7px}.dialog-description{font-size:12px}.form-columns{gap:12px}.dialog-actions{gap:8px}.dialog-actions .button{font-size:12px;padding:9px 10px;white-space:normal}.notice{font-size:12px;padding:12px 14px}.toast{font-size:12px;padding:12px 16px}.equipment-note{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

textarea{display:block;width:100%;resize:vertical;min-height:100px;font:inherit;font-size:13px;line-height:1.5;padding:11px;border:1px solid #cbd5df;border-radius:6px;background:var(--surface);color:var(--text)}textarea:focus-visible{outline:3px solid #89b3ff;outline-offset:3px}.card-maintenance{display:block!important;color:var(--muted);font-size:12px;line-height:1.5;margin-top:10px}.quality-warning{color:var(--warn)}.journal-toolbar{display:flex;gap:14px;align-items:flex-end;margin-bottom:20px}.journal-toolbar>div{min-width:180px;max-width:300px}.journal-toolbar label{font-size:12px;color:var(--muted);margin-top:0}.journal-toolbar .journal-toolbar-actions{margin-left:auto;display:flex;gap:10px;max-width:none;min-width:0}.journal-list{display:flex;flex-direction:column;gap:13px}.journal-entry{padding:21px 23px}.journal-entry-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.journal-entry-heading{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.journal-entry h3{font-size:16px;font-weight:600;line-height:1.4;margin:12px 0 7px}.journal-date{font-size:12px;color:var(--muted)}.journal-device{font-size:12px;color:var(--muted);margin-top:6px}.journal-details{font-size:13px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;max-width:980px}.journal-reason{font-size:13px;color:var(--warn);margin-top:10px;padding:9px 12px;background:var(--warn-bg);border-radius:6px;overflow-wrap:anywhere}.journal-entry-foot{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px;color:var(--muted);font-size:12px}.journal-result-count{font-size:12px;color:var(--muted);margin:0 0 14px}.journal-summary{margin-bottom:20px}.journal-summary h3{font-size:14px;margin-bottom:8px}.journal-summary p{font-size:13px;color:var(--muted)}.journal-load-more{margin:18px auto 0;display:flex}.journal-note{font-size:12px;color:var(--muted);line-height:1.6;margin-top:17px}.journal-empty{padding:38px 24px}.journal-empty .button{margin-top:14px}#journal-dialog{width:620px}.journal-no-data{font-size:12px;color:var(--muted);padding:26px 0}.journal-entry .badge{font-size:12px}
@media(max-width:767px){.topbar{height:auto;min-height:106px;flex-wrap:wrap;gap:0 18px;padding-top:13px}.main-nav{order:3;width:100%;height:44px;gap:22px;margin-top:6px}.topbar-meta{margin-left:auto}.nav-link{font-size:12px}.unit-tabs{gap:22px}.journal-toolbar{flex-wrap:wrap;gap:12px}.journal-toolbar>div{flex:1 1 45%;min-width:0;max-width:none}.journal-toolbar .journal-toolbar-actions{width:100%;justify-content:space-between;margin-left:0;flex-basis:100%}.journal-toolbar select{font-size:12px}.journal-entry{padding:18px}.journal-entry-head{gap:10px}.journal-entry h3{font-size:15px}.journal-entry-heading{gap:8px}.journal-date,.journal-device,.journal-entry-foot{font-size:12px}.journal-entry-head .button{font-size:12px;padding:6px 8px}.journal-entry-heading .badge{font-size:12px}.journal-details,.journal-reason{font-size:12px}.journal-summary{padding:17px}.journal-summary p{font-size:12px}#journal-view .page-heading{flex-direction:column;gap:18px}#journal-view .page-heading .button{width:100%}.form-columns:has(input[type=datetime-local]){grid-template-columns:1fr}input,select,textarea{font-size:16px}.history-controls select,.unit-breadcrumb select,.journal-toolbar select{font-size:14px}.card-mini .metric-unit{font-size:12px}.phase-cell .metric-quality{font-size:12px}.phase-grid{gap:7px}.phase-cell{padding:11px 8px}.phase-reading{gap:3px}.phase-reading .metric-value{font-size:23px}.phase-reading .metric-unit{font-size:12px}.history-chart text{font-size:13px}.card-footer{font-size:12px}.summary-foot{font-size:12px}.summary-label{min-height:34px;font-size:12px}.summary-card>div{margin-top:10px}.card-maintenance{font-size:12px}.unit-heading-meta{font-size:12px;max-width:115px}.unit-heading h1{font-size:26px}}

.nav-link{flex-shrink:0;white-space:nowrap}.main-nav{overflow-x:auto;scrollbar-width:none}.notification-panel{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:22px}.notification-panel h3{margin-bottom:7px}.notification-panel p{font-size:12px;line-height:1.6;color:var(--muted)}.notification-panel .badge{flex-shrink:0}.alerts-counts{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin-bottom:20px}.alerts-counts strong{color:var(--text);font-variant-numeric:tabular-nums}.alert-repeats{font-size:12px;color:var(--muted);background:var(--surface-muted);padding:3px 7px;border-radius:5px}.alert-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}.alert-details>div{min-width:0}.alert-details dt{color:var(--muted);font-size:12px;margin-bottom:5px}.alert-details dd{margin:0;color:var(--text);font-size:12px;line-height:1.5;overflow-wrap:anywhere}.unit-errors{margin-bottom:26px}.unit-errors h2{font-size:20px;margin-bottom:8px}.unit-errors>p{font-size:12px;color:var(--muted);margin-bottom:18px}.alert-ack{margin-top:16px}.main-nav::-webkit-scrollbar{display:none}@media(max-width:767px){.main-nav{gap:19px}.notification-panel{align-items:flex-start;padding:18px;flex-direction:column;gap:12px}.alert-details{grid-template-columns:1fr 1fr;gap:15px}.alert-details>div:last-child{grid-column:1/-1}.alerts-counts{gap:10px 16px}.alert-details dt,.alert-details dd{font-size:12px}.alerts-toolbar>div{flex-basis:100%}.journal-entry-head{flex-wrap:wrap}.alert-ack{width:100%;justify-content:flex-start}.nav-link{font-size:12px}}

/* Energy counters and load history extend the existing operator workspace. */
.card-energy{display:grid!important;grid-template-columns:1fr auto;gap:5px 12px;margin-top:15px;padding-top:13px;border-top:1px solid var(--line);align-items:baseline}.card-energy-label{font-size:12px;color:var(--muted)}.card-energy-reading{display:flex;align-items:baseline;justify-content:flex-end;gap:5px;flex-wrap:wrap;font-variant-numeric:tabular-nums;min-width:0}.card-energy .metric-value{font-size:17px;font-weight:600;white-space:nowrap;letter-spacing:-.25px}.card-energy .metric-unit{font-size:11px;color:var(--muted);white-space:nowrap}.card-energy .metric-quality{grid-column:1/-1;font-size:11px}.unit-analytics{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(295px,1fr);gap:20px;margin:0 0 23px;align-items:start}.analytics-history-slot{min-width:0}.analytics-history-slot .history-panel{margin-top:0;min-height:100%;padding:23px 21px}.analytics-history-slot .history-controls{flex-wrap:wrap;gap:12px}.analytics-history-slot .history-controls>div:first-child{min-width:0;flex:1 1 55%}.analytics-history-slot .history-controls>div:nth-child(2){flex:1 1 25%;min-width:110px}.analytics-history-slot .history-controls p{width:100%;max-width:none;text-align:left;margin:0}.history-quick-periods,.energy-period{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.history-quick-periods{margin:0 0 16px}.history-quick-periods button,.energy-period button{border:1px solid transparent;background:transparent;color:var(--muted);font-size:12px;font-weight:550;line-height:1.4;border-radius:5px;padding:7px 10px;min-height:33px}.history-quick-periods button[aria-pressed=true],.energy-period button[aria-pressed=true]{background:var(--accent-soft);border-color:#b8d5c3;color:var(--accent)}.history-quick-periods button:hover,.energy-period button:hover{background:var(--surface-muted)}.energy-panel{padding:23px 21px;min-width:0}.energy-heading .eyebrow{font-size:10px;margin-bottom:6px}.energy-heading h2{font-size:19px;line-height:1.35}.energy-counter{border:0;background:transparent;padding:20px 0 18px;text-align:left;display:block;width:100%;min-width:0}.energy-counter .metric-label{font-size:12px;line-height:1.5;min-height:0;color:var(--muted)}.energy-counter .metric-reading{display:flex;flex-wrap:wrap;gap:3px 8px;white-space:normal;margin:10px 0 7px}.energy-counter .metric-value{font-size:34px;line-height:1.25;letter-spacing:-1px;font-weight:600;white-space:nowrap}.energy-counter.long-value .metric-value{font-size:28px;letter-spacing:-.7px}.energy-counter .metric-unit{font-size:13px;white-space:nowrap}.energy-counter .metric-quality{display:block;font-size:11px}.energy-counter-time{display:block;font-size:11px;color:var(--muted);margin-top:6px}.energy-period{padding:11px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.energy-period button{flex:1;padding-inline:5px}.energy-summary{padding-top:18px}.energy-delta-caption{font-size:12px;color:var(--muted);line-height:1.5}.energy-delta-reading{display:flex;gap:7px;align-items:baseline;flex-wrap:wrap;margin:9px 0 11px;font-variant-numeric:tabular-nums}.energy-delta-reading strong{font-size:29px;line-height:1.3;letter-spacing:-.7px;font-weight:600;white-space:nowrap}.energy-delta-reading strong.long-value{font-size:25px}.energy-delta-reading>span{font-size:12px;color:var(--muted);white-space:nowrap}.energy-description{font-size:12px;color:var(--muted);line-height:1.6;margin-top:10px;overflow-wrap:anywhere}.energy-details{margin:17px 0 0;border-top:1px solid var(--line);padding-top:4px}.energy-details>div{display:flex;gap:12px;justify-content:space-between;padding-top:12px;align-items:flex-start}.energy-details dt{font-size:11px;line-height:1.5;color:var(--muted);max-width:45%}.energy-details dd{margin:0;font-size:12px;line-height:1.6;text-align:right;font-variant-numeric:tabular-nums;min-width:0;overflow-wrap:anywhere}.energy-details dd strong{font-size:12px;font-weight:550}.energy-details dd span{display:block;font-size:11px;color:var(--muted)}.energy-method{font-size:11px;line-height:1.6;color:var(--muted);border-top:1px solid var(--line);padding-top:13px;margin-top:15px}
.card-runtime{margin-top:7px;padding-top:7px;border-top:0}.runtime-counter{display:block;width:100%;text-align:left;border:0;border-top:1px solid var(--line);background:transparent;padding:13px 0 15px}.runtime-counter .metric-label{display:block;font-size:12px;color:var(--muted)}.runtime-counter .metric-reading{display:flex;align-items:baseline;gap:7px;margin:6px 0 3px}.runtime-counter .metric-value{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}.runtime-counter .metric-unit,.runtime-counter .metric-quality{font-size:11px;color:var(--muted)}.runtime-counter.quality-good .metric-quality{color:var(--good)}
@media(max-width:1199px){.unit-analytics{grid-template-columns:minmax(0,1fr)}.energy-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:26px}.energy-heading{grid-column:1}.energy-counter{grid-column:1;align-self:start}.energy-period{grid-column:1;align-self:start}.energy-summary{grid-column:2;grid-row:1/4;padding:0;border-left:1px solid var(--line);padding-left:24px}.energy-counter .metric-value{font-size:36px}.energy-counter.long-value .metric-value{font-size:29px}}
@media(max-width:767px){.card-energy{grid-template-columns:minmax(0,1fr) auto;gap:5px 8px}.card-energy-label{font-size:11px}.card-energy .metric-value{font-size:17px}.unit-analytics{gap:15px;margin-bottom:19px}.analytics-history-slot .history-panel{padding:21px 17px}.analytics-history-slot .history-controls{gap:12px}.analytics-history-slot .history-controls>div:nth-child(2){min-width:95px}.analytics-history-slot .history-controls select{font-size:13px}.analytics-history-slot .history-heading{align-items:flex-start;gap:9px}.analytics-history-slot .history-heading h2{font-size:18px}.analytics-history-slot .history-heading .button{font-size:11px;padding:7px 8px}.history-quick-periods{gap:3px}.history-quick-periods button{flex:1;font-size:11px;padding:7px 6px}.energy-panel{display:block;padding:21px 18px}.energy-heading h2{font-size:19px}.energy-counter{padding:20px 0}.energy-counter .metric-value{font-size:35px}.energy-counter.long-value .metric-value{font-size:29px}.energy-counter .metric-unit{font-size:13px}.energy-summary{border-left:0;padding:18px 0 0}.energy-delta-reading strong{font-size:30px}.energy-delta-reading strong.long-value{font-size:26px}.energy-description{font-size:12px}.energy-details dt,.energy-details dd,.energy-details dd strong{font-size:12px}.energy-details dd span,.energy-method,.energy-counter-time{font-size:11px}}

/* Tabler light shell. Only application-specific geometry lives here. */
:root { --canvas:#f6f8fb; --surface:#fff; --surface-muted:#f1f5f9; --text:#182433; --muted:#667382; --line:#e6e7e9; --accent:#206bc4; --accent-soft:#eaf2fc; --good:#2b8a3e; --good-bg:#e9f5ec; --radius:8px; color-scheme:light; font-family:var(--tblr-font-sans-serif); }
body { background:var(--tblr-body-bg,#f6f8fb); color:var(--text); font-family:var(--tblr-font-sans-serif); }
h1,h2,h3 { color:var(--text); letter-spacing:-.025em; }
h1 { font-size:28px; font-weight:650; }
.eyebrow { font-size:11px; letter-spacing:.06em; font-weight:600; }
.topbar { height:72px; min-height:72px; padding:0 32px; box-shadow:none; border-bottom:1px solid var(--line); gap:36px; background:#fff; }
.brand { font-size:20px; letter-spacing:-.03em; }
.brand-mark { width:34px; height:34px; border-radius:7px; background:#206bc4; font-size:24px; }
.brand-caption { color:var(--muted); letter-spacing:0; font-size:11px; }
.main-nav { gap:8px; align-items:center; align-self:stretch; }
.nav-link { display:flex; align-items:center; gap:9px; padding:9px 13px; border-radius:6px; font-size:13px; font-weight:500; }
.nav-link.is-active { background:#eaf2fc; color:#206bc4; }
.nav-link.is-active::after { display:none; }
.nav-icon { display:block; width:19px; height:19px; opacity:.8; }
.topbar-meta { gap:12px; }
.workspace { max-width:1392px; padding:28px 32px 48px; }
.page-heading { margin:0 0 23px; }
.page-heading .muted { margin-top:5px; font-size:12px; }
.page-title { font-size:28px; font-weight:650; }
.fleet-eyebrow { display:none; }
.refresh-state { font-size:11px; }
.button.btn { border-radius:6px; box-shadow:0 1px 2px #18243305; font-weight:500; font-size:13px; min-height:38px; }
.button.primary { background:var(--accent); color:#fff; }
.button.secondary { background:#fff; border-color:#dadfe5; }
.button.quiet { box-shadow:none; }
.site-overview { margin-bottom:24px; }
.site-overview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.site-overview-card.card { position:relative; display:block; text-align:left; padding:0; min-width:0; border-color:var(--tblr-border-color,#e6e7e9); border-radius:var(--tblr-border-radius,8px); background:#fff; box-shadow:var(--tblr-shadow-card,0 1px 2px #18243305); transition:border-color .15s,box-shadow .15s; overflow:hidden; }
.site-overview-card:hover { border-color:#8eb2de; box-shadow:0 4px 16px #1824330c; }
.site-overview-body.card-body { display:flex; flex-direction:column; padding:23px; }
.site-overview-top { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.site-overview-name { font-size:18px; font-weight:600; line-height:1.3; letter-spacing:-.025em; }
.site-overview-state { display:inline-flex; align-items:center; gap:6px; color:#667382; font-size:11px; font-weight:500; white-space:nowrap; }
.site-overview-state::before { content:""; width:7px; height:7px; border-radius:50%; background:#b5bdc7; flex:none; }
[data-state=running] .site-overview-state { color:#2b8a3e; }
[data-state=running] .site-overview-state::before { background:#2fb344; }
[data-state=generating] .site-overview-state { color:#206bc4; }
[data-state=generating] .site-overview-state::before { background:#206bc4; }
.site-overview-main { display:flex; flex-direction:column; margin:24px 0 18px; }
.site-overview-power { color:#182433; font-size:38px; line-height:1.1; font-weight:600; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.site-overview-power-label { font-size:12px; color:#667382; margin-top:6px; }
.site-overview-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; color:#667382; font-size:11px; }
.site-overview-count { font-weight:500; color:#364152; }
.site-overview-units { display:none; }
.site-overview-action { display:block; border-top:1px solid #edf0f3; margin:18px -23px -23px; padding:12px 23px; color:#206bc4; font-size:12px; background:#fcfdfe; }
.summary-grid { gap:16px; margin-bottom:28px; }
.summary-card.card { padding:18px; border-radius:8px; box-shadow:0 1px 2px #18243303; }
.summary-card strong { font-size:28px; letter-spacing:-.03em; font-weight:600; }
.summary-label { font-size:12px; }
.summary-foot { font-size:11px; }
.summary-card>div { margin:10px 0 8px; }
.summary-denominator { font-size:17px; }
.summary-unit { font-size:12px; }
.fleet-toolbar { padding-top:8px; }
.site-button { padding:9px 12px; }
.site-button[aria-pressed=true] { color:#206bc4; background:#eaf2fc; border-color:transparent; box-shadow:none; }
.site-button span { background:#e9edf2; }
.fleet-grid { display:block; scroll-margin-top:24px; }
.site-cluster { margin-bottom:28px; }
.site-cluster-heading { display:flex; align-items:center; justify-content:space-between; margin:21px 0 14px; gap:15px; }
.site-cluster-title { font-size:19px; font-weight:600; }
.site-cluster-copy { font-size:12px; color:var(--muted); margin-top:4px; }
.site-cluster-stats { display:flex; gap:8px; color:var(--muted); font-size:11px; }
.site-stat { padding:5px 8px; background:#eaf0f7; border-radius:5px; }
.site-stat-power { color:#206bc4; }
.site-cluster-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.unit-card.card { display:block; padding:21px; min-height:0; border-radius:8px; box-shadow:0 1px 2px #18243303; }
.unit-card:hover { border-color:#8eb2de; }
.card-name { font-size:17px; }
.card-site { font-size:11px; }
.card-power .metric-value { font-size:36px; font-weight:600; }
.card-statuses { margin:13px 0 18px; }
.badge { border:0; font-weight:500; letter-spacing:0; padding:4px 7px; border-radius:4px; font-size:11px; }
.card-load { display:block; margin:17px 0; }
.card-load-header { display:flex; justify-content:space-between; font-size:11px; color:var(--muted); }
.card-load-track { display:block; height:4px; border-radius:3px; background:#e9edf2; margin-top:8px; overflow:hidden; }
.card-load-fill { display:block; height:100%; width:var(--load,0%); background:#206bc4; }
.card-load-note { display:block; font-size:10px; color:var(--muted); margin-top:5px; }
.card-metrics { gap:12px; border-color:var(--line); padding-top:15px; margin-top:18px; }
.card-mini-label { font-size:11px; }
.card-mini .metric-value { font-size:20px; font-weight:550; }
.card-mini .metric-unit { font-size:10px; }
.card-energy { font-size:12px; }
.card-energy.quality-good .metric-quality { display:none; }
.card-footer { padding:12px 0 0; background:transparent; font-size:10px; }
.card-maintenance { font-size:11px; }
.card-quality { display:none; }
.unit-breadcrumb { margin-bottom:22px; }
.unit-heading { margin-bottom:22px; }
.unit-heading h1 { font-size:30px; }
.unit-heading .eyebrow { text-transform:none; font-size:12px; font-weight:400; letter-spacing:0; }
.unit-tabs.nav-tabs { gap:22px; border:0; border-bottom:1px solid var(--line); background:none; border-radius:0; padding:0; margin-bottom:23px; }
.unit-tabs button { padding:12px 0; font-size:13px; font-weight:500; }
.unit-tabs button[aria-selected=true] { color:#206bc4; }
.metric-tile.card { display:flex; padding:20px; min-height:142px; border-radius:8px; box-shadow:0 1px 2px #18243303; }
.metric-label { font-size:12px; font-weight:500; }
.metric-reading { margin:12px 0 5px; }
.metric-reading .metric-value { font-size:34px; font-weight:600; letter-spacing:-.035em; }
.metric-tile.is-selected { background:#fff; border-color:#206bc4; box-shadow:inset 0 2px #206bc4; }
.metric-tile.quality-good .metric-quality { color:#2b8a3e; font-size:11px; }
.panel.card { border-radius:8px; box-shadow:0 1px 2px #18243303; }
.phase-cell { background:#f6f8fb; }
.phase-reading .metric-value { font-size:24px; }
.history-panel .eyebrow { display:none; }
.history-heading h2 { font-size:18px; }
.history-controls { margin-top:18px; }
.history-controls label { font-weight:400; }
.history-quick-periods button[aria-pressed=true],.energy-period button[aria-pressed=true] { border-color:#b8d0ef; }
.energy-counter .metric-value { font-size:32px; }
.energy-period button { font-size:11px; }
.journal-entry.card { display:block; }
input,select,textarea { background:#fff; border-color:#dadfe5; border-radius:6px; color:#182433; }
.notice { border-radius:6px; }
.chart-empty { background:#fbfcfe; }
.connections-section { margin-top:32px; }
.receiver-strip { background:#f0f5fc; }
.page-footer { font-size:11px; }
.login-view { background:#f6f8fb; grid-template-columns:1fr; align-items:center; padding:40px 20px; }
.login-story { display:none; }
.login-access { padding:0; }
.login-form-wrap { max-width:400px; padding:32px; border:1px solid var(--line); border-radius:8px; background:#fff; box-shadow:0 2px 6px #18243306; }
.login-form-wrap h2 { font-size:24px; }
.login-form-wrap>.eyebrow { color:#206bc4; }
.login-note { font-size:11px; }
@media(min-width:1500px) { .workspace { padding-top:38px; } }
@media(max-width:1100px) { .topbar { gap:18px; padding-inline:24px; } .topbar-meta .local-time,.topbar-meta .timezone { display:none; } .nav-link { padding-inline:9px; } .site-cluster-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .site-overview-name { font-size:17px; } .site-overview-body.card-body { padding:20px; } .site-overview-action { margin:18px -20px -20px; padding-inline:20px; } .site-overview-top { flex-wrap:wrap; gap:8px; } }
@media(max-width:767px) {
 .topbar { height:64px; min-height:64px; padding:0 17px; gap:10px; flex-wrap:nowrap; }
 .brand { font-size:20px; } .brand-mark { width:33px; height:33px; } .brand-caption { font-size:10px; }
 .topbar-meta .button { font-size:12px; padding:7px; }
 .main-nav { position:fixed; inset:auto 0 0; z-index:30; height:auto; min-height:64px; margin:0; padding:7px 7px calc(7px + env(safe-area-inset-bottom,0px)); background:#fff; border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px; overflow:visible; }
 .main-nav .nav-link { display:flex; flex-direction:column; gap:3px; justify-content:center; padding:6px 1px; min-height:49px; border-radius:6px; font-size:10px; white-space:nowrap; }
 .nav-icon { display:block; width:21px; height:21px; }
 .workspace { padding:20px 16px calc(95px + env(safe-area-inset-bottom,0px)); }
 .page-heading { gap:12px; align-items:flex-start; margin-bottom:20px; }
 .page-title { font-size:26px; line-height:1.2; }
 .page-heading .muted { font-size:11px; line-height:1.5; max-width:225px; margin-top:5px; }
 .refresh-area { gap:4px; }
 .refresh-area .button { font-size:11px; min-height:32px; padding:5px 9px; }
 .refresh-state { font-size:10px; white-space:nowrap; max-width:none; }
 .site-overview { margin-bottom:22px; }
 .site-overview-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
 .site-overview-body.card-body { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"top top" "main meta" "action action"; gap:0 15px; padding:17px 18px; }
 .site-overview-top { grid-area:top; flex-wrap:nowrap; align-items:center; gap:10px; }
 .site-overview-name { font-size:18px; }
 .site-overview-state { font-size:10px; }
 .site-overview-main { grid-area:main; margin:15px 0 0; }
 .site-overview-power { font-size:30px; white-space:nowrap; letter-spacing:-.04em; }
 .site-overview-power-label { font-size:10px; margin-top:4px; }
 .site-overview-meta { grid-area:meta; display:flex; flex-direction:column; gap:4px; align-items:flex-end; margin-top:15px; font-size:10px; }
 .site-overview-count { font-size:12px; }
 .site-overview-action { grid-area:action; margin:15px -18px -17px; padding:9px 18px; font-size:11px; }
 .summary-grid { gap:10px; margin-bottom:22px; }
 .summary-card.card { padding:14px; }
 .summary-label { min-height:31px; font-size:11px; }
 .summary-card strong { font-size:27px; }
 .summary-foot { min-height:0; font-size:10px; }
 .site-filter { display:flex; flex-wrap:nowrap; overflow-x:auto; gap:4px; scrollbar-width:none; padding-bottom:2px; }
 .site-button { padding:8px 10px; font-size:11px; }
 .fleet-count { font-size:11px; margin-top:8px; }
 .site-cluster-heading { margin:20px 0 12px; }
 .site-cluster-title { font-size:19px; }
 .site-cluster-copy { font-size:11px; }
 .site-cluster-stats { display:none; }
 .site-cluster-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
 .unit-card.card { padding:20px; }
 .card-power .metric-value { font-size:36px; }
 .card-mini .metric-value { font-size:21px; }
 .card-mini .metric-unit { font-size:10px; }
 .card-metrics { gap:8px; }
 .card-energy-label { font-size:11px; }
 .card-energy .metric-value { font-size:17px; }
 .data-note { font-size:11px; }
 .unit-breadcrumb { font-size:11px; margin-bottom:19px; }
 .unit-breadcrumb select { font-size:14px; height:39px; }
 .unit-heading { margin-bottom:18px; }
 .unit-heading h1 { font-size:28px; }
 .unit-heading .eyebrow { font-size:11px; }
 .unit-heading-meta { font-size:10px; }
 .unit-heading-meta .button { font-size:11px; }
 .unit-tabs.nav-tabs { gap:22px; overflow:auto; flex-wrap:nowrap; margin-bottom:18px; }
 .unit-tabs button { font-size:12px; padding:11px 0; }
 .instrument-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .metric-tile.card { padding:15px; min-height:137px; }
 .metric-label { font-size:11px; min-height:31px; }
 .metric-reading { gap:4px; }
 .metric-reading .metric-value { font-size:29px; }
 .metric-reading .metric-unit { font-size:10px; }
 .metric-quality { font-size:10px; }
 .metric-instruction { display:none; }
 .analytics-history-slot .history-panel { padding:18px 15px; }
 .history-heading h2 { font-size:17px; }
 .history-heading .button.btn { font-size:10px; padding:6px; min-height:32px; }
 .history-controls select { font-size:13px; }
 .phase-reading .metric-value { font-size:23px; }
 .phase-cell .metric-quality { font-size:10px; }
 .energy-panel { padding:20px 17px; }
 .journal-entry.card { padding:18px; }
 .journal-entry-head .button { font-size:11px; }
 dialog { border-radius:8px; }
 .toast { bottom:90px; }
 .page-footer { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { * { transition:none!important; } }
/* Tabler page-header and card-body have their own direction/last-child rules. */
.page-heading.page-header { flex-direction:row; }
@media(max-width:767px) {
 .site-overview-body.card-body { padding:16px 18px 0; }
 .site-overview-main { margin-top:12px; }
 .site-overview-meta { margin-top:12px; }
 .site-overview-action { margin:13px -18px 0; padding:9px 18px; }
 .page-heading .muted { max-width:225px; }
 .refresh-area { flex-shrink:0; }
}

/* Status-tinted Tabler cards: requested depth without changing data semantics. */
:root { --card-shadow:0 2px 3px #18243305,0 7px 18px -7px #26364b30; }
.site-overview-card.card,.unit-card.card { --state-color:#dc861d; --state-wash:#fffbf5; --state-border:#eedfca; background:var(--state-wash); border-color:var(--state-border); border-radius:11px; box-shadow:var(--card-shadow),inset 0 1px 0 #fff; position:relative; overflow:hidden; }
.site-overview-card[data-state=running],.unit-card[data-operating=running] { --state-color:#329b59; --state-wash:#f2faf4; --state-border:#cfe5d6; }
.site-overview-card[data-state=generating],.unit-card[data-operating=generating] { --state-color:#4387ba; --state-wash:#f4f8fd; --state-border:#d4e2f2; }
.site-overview-card::before,.unit-card::before { content:""; position:absolute; inset:0 0 auto; height:3px; background:var(--state-color); opacity:.8; }
.site-overview-card:hover,.unit-card:hover { border-color:var(--state-color); box-shadow:0 3px 5px #18243308,0 12px 27px -10px #26364b40; }
.site-overview-state { color:#9b5b10; background:#f9eddb; border-radius:20px; padding:5px 8px; font-size:11px; line-height:1.2; }
.site-overview-state::before { background:#db8a27; }
[data-state=running] .site-overview-state { color:#257c43; background:#e1f1e6; }
[data-state=running] .site-overview-state::before { background:#329b59; }
[data-state=generating] .site-overview-state { color:#246799; background:#e6eff9; }
.site-overview-power { display:flex; align-items:baseline; gap:7px; }
.site-power-unit { color:#667382; font-size:17px; font-weight:450; letter-spacing:0; }
.site-overview-action { color:#566477; background:#ffffff73; border-color:var(--state-border); }
.site-overview-action::after { content:""; }
.unit-card .card-load-track { background:#e5e9e4; }
.unit-card .card-load-fill { background:var(--state-color); }
.card-top,.card-power { position:relative; }
.summary-card.card,.metric-tile.card,.panel.card { box-shadow:0 2px 4px #18243304,0 6px 14px -8px #26364b25; }
.metric-tile.is-selected { box-shadow:inset 0 2px #206bc4,0 4px 12px -5px #206bc42a; }
@media(max-width:767px) {
 .site-overview-grid { gap:15px; }
 .site-overview-body.card-body { padding-top:18px; }
 .site-overview-state { font-size:10px; padding:4px 7px; }
 .site-overview-main { margin-top:14px; }
 .site-overview-power { font-size:32px; gap:6px; }
 .site-power-unit { font-size:14px; }
 .site-overview-meta { margin-top:14px; }
 .site-overview-action { padding-top:10px; padding-bottom:10px; }
 .site-overview-coverage { font-size:10px; }
}

/* Expanded read-only instruments and analysis, using the same Tabler cards. */
.telemetry-section { margin:26px 0; }
.telemetry-section-title { font-size:18px; line-height:1.4; font-weight:600; margin:0 0 14px; }
.phase-readings { margin:0 0 24px; }
.phase-readings .phase-section + .phase-section { margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }
.phase-readings .phase-cell { display:flex; flex-direction:column; min-width:0; }
.phase-readings .metric-label { min-height:0; }
.phase-readings .metric-reading { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px; margin:8px 0 5px; }
.phase-readings .metric-reading .metric-value { font-size:25px; letter-spacing:-.025em; }
.phase-readings .metric-unit { font-size:12px; }
.phase-readings .metric-quality { font-size:11px; }
.metric-tile:not(button) { cursor:default; }
.io-table { margin-top:20px; }
.io-row { display:grid; grid-template-columns:minmax(60px,.65fr) repeat(2,minmax(0,1fr)); gap:12px; padding:14px 0; align-items:center; border-bottom:1px solid var(--line); }
.io-head { color:var(--muted); font-size:12px; padding-top:0; }
.io-row strong { font-size:13px; font-weight:500; }
.io-state { display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
.io-state-badge { padding:5px 8px; border-radius:5px; font-size:12px; line-height:1.3; }
.io-active { background:#e7f0fc; color:#1e5c9b; }
.io-inactive { background:#f1f3f5; color:#606d7a; }
.io-unknown { background:#fcf4e8; color:#8d6425; }
.io-quality { font-size:10px; color:var(--muted); line-height:1.3; }
.analytics-toolbar { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:18px; }
.analytics-toolbar .button { flex-shrink:0; }
.analytics-toolbar .telemetry-section-title { margin-bottom:7px; }
.analytics-toolbar .metric-instruction { margin-bottom:0; max-width:650px; }
.analysis-comparison { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:23px 0 16px; }
.analysis-comparison > div { display:flex; flex-direction:column; gap:7px; }
.analysis-comparison span { color:var(--muted); font-size:12px; }
.analysis-comparison strong { font-size:30px; font-weight:600; font-variant-numeric:tabular-nums; }
.analysis-comparison small { font-size:13px; font-weight:400; color:var(--muted); }
.analysis-time { font-size:11px; color:var(--muted); line-height:1.6; margin:10px 0 0; }
.analysis-rules { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.analysis-rule { padding:21px; }
.analysis-rule h3,.analysis-event h3 { font-size:15px; line-height:1.4; margin:0 0 8px; }
.analysis-rule p { font-size:13px; line-height:1.6; color:var(--muted); margin:0; }
.analysis-rule .analysis-rule-timing { margin-top:14px; border-top:1px solid var(--line); padding-top:12px; font-size:11px; }
.analysis-delivery { color:#52647d; background:#edf3fb; border:1px solid #dbe6f4; line-height:1.6; }
.analysis-events-heading { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:14px; }
.analysis-events-heading h2 { margin:0; }
.analysis-event-list { display:grid; gap:12px; }
.analysis-event { display:block; padding:18px 21px; }
.analysis-event h3 { margin-top:11px; }
.analysis-event p { margin:0; font-size:12px; color:var(--muted); }
.unit-card-shell { min-width:0; display:flex; flex-direction:column; border-radius:11px; box-shadow:var(--card-shadow); --planned-border:#eedfca; }
.unit-card-shell[data-operating=running] { --planned-border:#cfe5d6; }
.unit-card-shell[data-operating=generating] { --planned-border:#d4e2f2; }
.unit-card-shell .unit-card.card { width:100%; flex:1; box-shadow:none; border-radius:11px 11px 0 0; border-bottom:0; }
.unit-card-shell:focus-within { outline:2px solid #8db9ea; outline-offset:3px; }
.planned-stop-control { padding:12px 20px 14px; border:1px solid var(--planned-border,#dce3eb); border-top:1px solid var(--line); border-radius:0 0 11px 11px; background:#fff; display:flex; flex-direction:column; align-items:flex-start; gap:7px; }
.planned-stop-button { width:100%; font-size:12px; min-height:38px; }
.planned-stop-note { display:block; font-size:10px; line-height:1.5; color:var(--muted); }
.planned-stop-status { color:#946315; font-size:12px; line-height:1.4; }
.planned-stop-control[data-planned-status=armed],.planned-stop-control[data-planned-status=stopped] { background:#fff9ee; }
.planned-stop-detail { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px 22px; padding:14px 17px; border:1px solid var(--line); border-radius:8px; margin-bottom:22px; }
.planned-stop-detail .planned-stop-button { grid-column:2; grid-row:1/3; width:auto; min-width:180px; }
.planned-stop-detail .planned-stop-note { grid-column:1; font-size:11px; max-width:680px; }
@media(max-width:767px) {
 .unit-tabs.nav-tabs { gap:20px; padding-right:18px; }
 .telemetry-section { margin:22px 0; }
 .telemetry-section-title { font-size:16px; }
 .phase-readings .metric-reading .metric-value { font-size:21px; }
 .phase-readings .metric-unit { font-size:11px; }
 .phase-readings .metric-quality { font-size:10px; }
 .io-row { grid-template-columns:58px repeat(2,minmax(0,1fr)); gap:8px; padding:12px 0; }
 .io-head { font-size:10px; }
 .io-state-badge { font-size:11px; padding:5px 6px; }
 .analytics-toolbar { flex-direction:column; gap:12px; }
 .analysis-comparison { gap:13px; }
 .analysis-comparison strong { font-size:26px; }
 .analysis-comparison small { font-size:11px; }
 .analysis-rules { grid-template-columns:minmax(0,1fr); gap:12px; }
 .analysis-rule { padding:18px; }
 .analysis-events-heading { align-items:flex-start; }
 .analysis-events-heading .button { font-size:11px; white-space:nowrap; }
 .planned-stop-button { min-height:44px; }
 .planned-stop-detail { display:flex; flex-direction:column; gap:9px; padding:13px 15px; margin-bottom:18px; }
 .planned-stop-detail .planned-stop-button { order:0; width:100%; }
 .planned-stop-detail .planned-stop-note { order:1; }
}
.metric-tile[data-kind=state] .metric-value { font-size:21px; line-height:1.45; white-space:normal; overflow-wrap:anywhere; }
.unit-tabs.nav-tabs { flex-wrap:nowrap; overflow-x:auto; max-width:100%; }

/* Quick service entry on a phone; persistent actions around a scrollable form. */
.maintenance-quick-button { width:100%; min-height:44px; font-size:13px; color:#206bc4; border-color:#cbddee; background:#f5f9fe; white-space:normal; }
.planned-stop-button { min-height:44px; }
.planned-stop-detail .maintenance-quick-button { grid-column:2; grid-row:3; width:auto; min-width:220px; }
#journal-dialog { padding:0; max-height:calc(100dvh - 32px); }
#journal-dialog[open] { display:flex; flex-direction:column; }
#journal-dialog .dialog-heading { padding:20px 22px 16px; border-bottom:1px solid var(--line); flex:none; }
#journal-dialog .icon-button { min-width:44px; min-height:44px; }
#journal-dialog-title { outline:none; }
#journal-form { display:flex; flex-direction:column; min-height:0; }
.journal-form-body { padding:0 22px 20px; overflow-y:auto; min-height:0; overscroll-behavior:contain; }
.journal-form-body input,.journal-form-body select { min-height:44px; min-width:0; max-width:100%; }
.journal-form-body label { font-size:13px; }
.journal-form-body textarea { min-height:78px; }
.journal-form-footer { flex:none; padding:14px 22px max(14px,env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#fff; }
.journal-form-footer .dialog-actions { margin:0; }
.journal-form-footer .form-error { margin:0 0 12px; }
.journal-form-footer .button { min-height:46px; }
.journal-use-hours { margin-top:8px; min-height:44px; width:100%; font-size:13px; white-space:normal; }
.journal-extra { margin:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:0 0 2px; }
.journal-extra[open] { padding-bottom:16px; }
.journal-extra summary { min-height:48px; padding:14px 0; cursor:pointer; color:#206bc4; font-size:13px; }
@media(max-width:767px) {
 .planned-stop-detail .maintenance-quick-button { grid-column:auto; grid-row:auto; min-width:0; width:100%; }
 #journal-dialog { width:calc(100% - 16px); max-width:calc(100% - 16px); max-height:calc(100dvh - 16px); border-radius:16px; }
 #journal-dialog .dialog-heading { padding:16px; }
 #journal-dialog .dialog-heading h2 { font-size:20px; }
 .journal-form-body { padding:0 16px 16px; }
 #journal-dialog input,#journal-dialog select,#journal-dialog textarea { font-size:16px; }
 .journal-form-footer { padding-inline:16px; }
 .journal-form-footer .dialog-actions { display:grid; grid-template-columns:auto minmax(0,1fr); }
 .journal-form-footer .button { font-size:14px; }
}

/* One task per screen: choose a site, then a unit. Receiver diagnostics have their own nav. */
#fleet-view[data-mode=overview] .fleet-toolbar,
#fleet-view[data-mode=overview] #fleet-grid,
#fleet-view[data-mode=overview] > .data-note,
#fleet-view[data-mode=overview] #fleet-empty,
#fleet-view:not([data-mode=connections]) .connections-section { display:none; }
#fleet-view[data-mode=site] .site-overview,
#fleet-view[data-mode=site] .summary-grid,
#fleet-view[data-mode=connections] > :not(.connections-section) { display:none; }
#fleet-view[data-mode=connections] .connections-section { margin-top:0; }
#fleet-view[data-mode=site] .site-cluster-heading { display:none; }
.fleet-back { min-height:44px; margin-bottom:4px; }
#fleet-page-title { outline:none; }
.unit-actions { margin:0 0 18px; background:#fff; border:1px solid var(--line); border-radius:8px; }
.unit-actions > summary { cursor:pointer; padding:13px 16px; min-height:48px; color:#385c87; font-size:13px; }
.unit-actions .planned-stop-detail { border:0; border-top:1px solid var(--line); margin:0; border-radius:0 0 8px 8px; }
.unit-section-picker { display:none; }
.journal-edit { min-height:44px; }
#journal-target:disabled { background-image:none; opacity:1; color:#182433; background-color:#f3f6fa; }
@media(max-width:767px) {
 .unit-section-picker { display:block; margin:0 0 18px; }
 .unit-section-picker label { margin:0 0 7px; font-size:12px; color:var(--muted); }
 .unit-section-picker select { min-height:44px; font-size:16px; }
 #unit-tabs { display:none; }
 .planned-stop-note { font-size:12px; }
 .journal-entry-head .journal-edit { font-size:12px; padding:10px 12px; }
 .journal-toolbar > div:first-child:has(#journal-filter-device) { grid-column:1/-1; flex:1 1 100%; }
 .journal-toolbar select,.history-controls select { min-height:44px; font-size:16px; }
 .site-button { min-height:44px; }
 #journal-create { min-height:46px; }
}
@media(max-width:767px) and (max-height:700px) {
 .site-overview-grid { gap:10px; }
 .site-overview-body.card-body { padding:12px 15px; }
 .site-overview-main,.site-overview-meta { margin-top:10px; }
 .site-overview-action { display:none; }
 .site-overview-name { font-size:17px; }
 .site-overview-power { font-size:29px; }
}

/* Operator service workflow: readings first, one visible service cycle per machine. */
.service-block { padding:18px 20px; background:#fff; border:1px solid #d9e3eb; border-radius:12px; min-width:0; }
.service-heading { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:10px; }
.service-heading h3 { font-size:14px; margin:0; }
.service-interval { color:#657587; font-size:12px; white-space:nowrap; }
.service-remaining { font-size:23px; font-weight:650; letter-spacing:-.5px; color:#273e51; line-height:1.3; }
.service-track { height:5px; border-radius:6px; background:#e8edf1; overflow:hidden; margin-top:12px; }
.service-track span { display:block; width:var(--service-progress,0%); height:100%; border-radius:6px; background:#5387a6; }
.service-progress-note { margin-top:7px; color:#657587; font-size:12px; line-height:1.5; }
.service-dates { display:grid; grid-template-columns:1fr; gap:7px; margin:14px 0 0; font-size:12px; }
.service-dates>div { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.service-dates dt { color:#657587; font-weight:400; }
.service-dates dd { color:#243d51; text-align:right; margin:0; font-variant-numeric:tabular-nums; font-weight:550; }
.service-forecast-note { font-size:11px; margin-top:6px; color:#657587; }
.service-actions { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:15px; }
.service-actions .button { min-height:44px; font-size:12px; padding:9px 8px; white-space:normal; }
.service-complete { background:#edf4fa!important; border-color:#c9dae8!important; color:#235779; }
.service-block[data-urgency=soon] .service-remaining,.service-block[data-urgency=urgent] .service-remaining { color:#925605; }
.service-block[data-urgency=soon] .service-track span,.service-block[data-urgency=urgent] .service-track span { background:#d58b29; }
.service-block[data-urgency=urgent] { border-color:#e1b26f; background:#fffcf6; }
.service-block[data-status=needs_setup] .service-remaining,.service-block[data-status=data_unavailable] .service-remaining,.service-block[data-status=counter_reset] .service-remaining { font-size:19px; }
.unit-card-shell .service-block { border-radius:0; border-color:var(--planned-border); border-block:0; padding:16px 22px; background:#fff; }
.unit-card-shell .service-heading { border-top:1px solid #e5ebef; padding-top:15px; }
.unit-card-shell .unit-card.card { min-height:0; padding-bottom:0; flex:none; }
.unit-card-shell .card-load,.unit-card-shell .card-maintenance,.unit-card-shell .card-quality { display:none!important; }
.unit-card-shell .card-statuses { margin:10px 0 12px; }
.unit-card-shell .card-metrics { margin-top:13px; padding-top:13px; }
.unit-card-shell .card-energy { margin-top:10px; padding-top:10px; }
.unit-card-shell .card-runtime { margin-top:5px; padding-top:0; border:0; }
.unit-card-shell .card-footer { border:0; margin-top:12px; padding-top:0; }
.unit-card-shell .planned-stop-control { padding-top:8px; }
.unit-summary { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:18px; margin-bottom:18px; }
.unit-power-hero.metric-tile { min-height:0; padding:24px; margin:0; background:#eef7f2; border-color:#cce3d5; box-shadow:0 3px 10px #294e3710; justify-content:center; }
.unit-power-hero .metric-label { font-size:14px; }
.unit-power-hero .metric-reading .metric-value { font-size:58px; }
.unit-power-hero.quality-good .metric-quality { display:none; }
.unit-power-hero:not(.quality-good) { background:#fff9ee; border-color:#e8d4b4; }
.unit-breadcrumb { margin-bottom:10px; }
.unit-breadcrumb > span { display:none; }
.unit-heading { margin-bottom:16px; }
.unit-heading .status-row { margin-top:7px; }
.unit-heading-meta { flex-direction:column; align-items:flex-end; gap:5px; }
.unit-heading-meta .button { min-height:40px; }
.unit-actions { margin-bottom:16px; }
.unit-actions > summary { min-height:44px; padding-block:11px; }
#service-dialog { padding:0; max-height:calc(100dvh - 32px); width:510px; }
#service-dialog[open] { display:flex; flex-direction:column; }
#service-dialog .dialog-heading { padding:18px 22px; border-bottom:1px solid var(--line); margin:0; flex:none; }
#service-dialog .icon-button { min-width:44px; min-height:44px; }
#service-dialog-title { outline:none; }
#service-form { display:flex; flex-direction:column; min-height:0; }
.service-form-intro { font-size:13px; color:#526578; margin:16px 0 0; }
.service-save-preview { padding:12px; background:#eef5fa; border-radius:8px; margin-top:18px; font-size:13px; }
.service-save-preview p { margin-top:5px; font-size:12px; color:#526578; }
@media(max-width:767px) {
 .unit-breadcrumb { flex-direction:row; flex-wrap:nowrap; gap:8px; align-items:center; margin:0 0 12px; }
 .unit-breadcrumb .back-link { font-size:13px; min-height:44px; white-space:nowrap; }
 .unit-breadcrumb select { width:142px; min-width:0; max-width:48%; margin:0 0 0 auto; font-size:13px; min-height:44px; }
 .unit-heading { align-items:flex-start; gap:6px; margin-bottom:14px; }
 .unit-heading h1 { font-size:26px; }
 .unit-heading-meta { font-size:10px; max-width:48%; }
 .unit-heading-meta .button { font-size:12px; min-height:40px; padding:7px 10px; }
 .unit-summary { grid-template-columns:1fr; gap:12px; margin-bottom:12px; }
 .unit-power-hero.metric-tile { padding:16px 20px; min-height:120px; }
 .unit-power-hero .metric-reading { margin:8px 0 0; }
 .unit-power-hero .metric-reading .metric-value { font-size:45px; }
 .service-block { padding:17px 18px; }
 .service-remaining { font-size:22px; }
 .service-actions .button { font-size:12px; }
 .unit-card-shell .service-block { padding-inline:20px; }
 #service-dialog { width:calc(100% - 16px); max-width:calc(100% - 16px); max-height:calc(100dvh - 16px); border-radius:14px; }
 #service-dialog .dialog-heading { padding:14px 16px; }
 #service-dialog h2 { font-size:20px; }
 #service-dialog input,#service-dialog select,#service-dialog textarea { font-size:16px; }
 .unit-section-picker { margin-bottom:16px; }
 .unit-section-picker label { display:none; }
}
.service-extra { border-top:1px solid #e5ebef; margin-top:12px; font-size:12px; }
.service-extra summary { cursor:pointer; min-height:44px; padding-top:13px; color:#566e82; }
.service-extra p { margin:0 0 8px; color:#657587; }
.service-extra .button { min-height:44px; font-size:12px; }
.unit-summary:has(.unit-power-hero[hidden]) { grid-template-columns:1fr; }

/* Operator instruments: state first, then the reading and its short trend. */
.site-overview-card.card {
 border-left:5px solid var(--state-color,#ce882c);
 box-shadow:0 2px 5px #1824330a,0 12px 25px -17px #233b5360;
}
.site-overview-card::before { display:none; }
.site-overview-card[data-state=running] {
 --state-color:#248950;
 --state-wash:#f1f9f3;
 --state-border:#c7e4ce;
}
.site-overview-card[data-state=partial] {
 --state-color:#d08b29;
 --state-wash:#f1f9f3;
 --state-border:#d8e5d2;
}
.site-overview-card[data-state=unreadable],
.site-overview-card[data-state=stopped],
.site-overview-card[data-state=unknown] {
 --state-color:#c47d20;
 --state-wash:#fffbf4;
 --state-border:#edddc5;
}
.site-overview-card[data-state=offline] {
 --state-color:#82909c;
 --state-wash:#f4f6f8;
 --state-border:#dce3ea;
}
.site-overview-state { font-weight:650; }
.site-overview-card[data-state=partial] .site-overview-state,
.site-overview-card[data-state=unreadable] .site-overview-state,
.site-overview-card[data-state=stopped] .site-overview-state,
.site-overview-card[data-state=unknown] .site-overview-state { color:#865111; background:#fff0d8; }
.site-overview-card[data-state=partial] .site-overview-state::before,
.site-overview-card[data-state=unreadable] .site-overview-state::before,
.site-overview-card[data-state=stopped] .site-overview-state::before,
.site-overview-card[data-state=unknown] .site-overview-state::before { background:#c47d20; }
.site-overview-card[data-state=offline] .site-overview-state { color:#52616e; background:#e7ecf0; }
.site-overview-card[data-state=offline] .site-overview-state::before { background:#82909c; }
.site-overview-power { font-weight:730; }
.site-overview-power-label,.site-overview-coverage { color:#566574; }
.unit-card.card { border-left:5px solid var(--state-color,#ce882c); }

.summary-grid { gap:10px; }
.summary-card.card { padding:14px 16px; }
.summary-card > div { margin:7px 0 4px; }
.summary-card strong { font-weight:720; }
.summary-label { font-weight:450; }
.summary-icon {
 display:inline-flex;
 align-items:center;
 justify-content:center;
 width:23px;
 height:23px;
 border-radius:7px;
 background:#eaf1f8;
 color:#37648d;
 flex:none;
}
.summary-icon svg { width:15px; height:15px; }
.summary-card.has-alerts .summary-icon { background:#fff0ed; color:#b94c39; }

.metric-label,.phase-name,.phase-label { color:#667483; font-weight:400; }
.metric-reading { gap:4px; }
.metric-reading .metric-value,
.phase-reading .metric-value,
.card-mini .metric-value { font-weight:700; font-variant-numeric:tabular-nums; }
.metric-reading .metric-unit,.phase-reading .metric-unit { margin-left:0; font-weight:450; }
.metric-tile.quality-good > .metric-quality,
.phase-cell.quality-good > .metric-quality { display:none; }
.metric-tile.card { padding:15px 17px; min-height:112px; }
.compact-metrics { gap:10px; }
.compact-metrics .metric-tile.card { min-height:104px; }
.metric-tile .metric-reading { margin:9px 0 2px; }
.metric-tile button,.phase-cell { min-height:44px; }
.metric-tile.quality-stale,.metric-tile.quality-invalid,
.metric-tile.quality-missing { border-color:#dfbb87; }
.metric-tile.quality-invalid { border-color:#e0a3a0; background:#fff8f7; }

.unit-summary { grid-template-columns:minmax(0,1.2fr) minmax(290px,.8fr); gap:14px; align-items:start; }
.unit-live { display:grid; gap:10px; min-width:0; }
.unit-power-hero.metric-tile { padding:19px 22px; min-height:0; }
.unit-power-hero .metric-label { font-weight:450; }
.unit-power-hero .metric-reading { gap:6px; margin:7px 0 0; }
.unit-power-hero .metric-reading .metric-value { font-weight:730; }
.metric-sparkline { display:block; width:100%; height:50px; margin-top:7px; color:#3b82ad; }
.metric-sparkline svg { display:block; width:100%; height:100%; overflow:visible; }
.metric-sparkline path,.metric-sparkline polyline { fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.metric-sparkline .sparkline-fill { fill:#4c9cc01a; stroke:none; }
.sparkline-caption,.metric-empty-trend { color:#718090; font-size:11px; line-height:1.35; }
.metric-empty-trend { margin-top:8px; }
.load-context { margin-top:9px; width:100%; }
.load-context-label { display:flex; justify-content:space-between; gap:8px; color:#566574; font-size:11px; line-height:1.4; }
.load-meter { display:block; height:5px; margin-top:6px; overflow:hidden; background:#dce9e1; border-radius:8px; }
.load-meter > span { display:block; height:100%; width:0; border-radius:inherit; background:#31895a; transition:width .25s ease; }
.load-meter[data-level=elevated] > span { background:#cb8a29; }
.load-meter[data-level=high] > span { background:#bf4b3f; }
.load-meter[data-level=unknown] { background:#e2e8ed; }
.load-meter[data-level=unknown] > span { width:0!important; }
.unit-engine-strip.compact-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:0; }
.unit-engine-strip .metric-tile.card { min-height:98px; padding:12px 13px; }
.unit-engine-strip .metric-label { min-height:32px; font-size:11px; line-height:1.35; }
.unit-engine-strip .metric-reading { flex-wrap:wrap; row-gap:0; }
.unit-engine-strip .metric-reading .metric-value { font-size:25px; }
.unit-engine-strip .metric-reading .metric-unit { font-size:11px; }
.unit-engine-strip .metric-sparkline { height:30px; margin-top:3px; }
.unit-engine-strip .sparkline-caption { display:none; }
.unit-summary:has(.unit-live[hidden]) { grid-template-columns:1fr; }

.electrical-panel .phase-section + .phase-section,
.phase-readings .phase-section + .phase-section { margin-top:13px; padding-top:13px; }
.electrical-panel .phase-grid,.phase-readings .phase-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border:1px solid #e2e8ec; border-radius:8px; overflow:hidden; }
.electrical-panel .phase-cell,.phase-readings .phase-cell { background:#fff; border:0; border-radius:0; padding:10px 12px; min-height:58px; }
.electrical-panel .phase-cell + .phase-cell,
.phase-readings .phase-cell + .phase-cell { border-left:1px solid #e2e8ec; }
.electrical-panel .phase-cell:hover,.phase-readings .phase-cell:hover { background:#f5f9fc; }
.electrical-panel .phase-reading,.phase-readings .metric-reading { margin:4px 0 0; gap:3px; }
.electrical-panel .phase-reading .metric-value,.phase-readings .metric-reading .metric-value { font-size:22px; }
.electrical-panel .phase-name,.phase-readings .metric-label { font-size:11px; }

@media(max-width:900px) {
 .unit-summary { grid-template-columns:1fr; }
}
@media(max-width:767px) {
 .summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:16px; }
 .summary-card.card { padding:10px 12px; }
 .summary-card strong { font-size:23px; }
 .summary-label { min-height:0; font-size:10px; line-height:1.25; }
 .summary-foot { font-size:10px; line-height:1.3; }
 .summary-icon { width:20px; height:20px; border-radius:6px; }
 .site-overview-grid { gap:9px; }
 .site-overview-body.card-body { padding:13px 15px 0; }
 .site-overview-main,.site-overview-meta { margin-top:10px; }
 .site-overview-action { margin-top:10px; }
 .site-overview-name { font-size:17px; }
 .site-overview-power { font-size:30px; }
 .site-overview-coverage { font-size:10px; }
 .metric-tile.card { min-height:110px; padding:12px 13px; }
 .compact-metrics,.instrument-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 .compact-metrics .metric-tile.card { min-height:104px; }
 .metric-tile .metric-label { min-height:0; font-size:11px; line-height:1.35; }
 .metric-tile .metric-reading { flex-wrap:wrap; row-gap:0; }
 .metric-tile .metric-reading .metric-value { font-size:25px; }
 .metric-tile .metric-reading .metric-unit { font-size:11px; }
 .unit-power-hero.metric-tile { padding:16px 18px; }
 .unit-power-hero .metric-reading .metric-value { font-size:43px; }
 .unit-engine-strip.compact-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
 .unit-engine-strip .metric-tile.card { padding:10px; min-height:95px; }
 .unit-engine-strip .metric-reading .metric-value { font-size:22px; }
 .unit-engine-strip .metric-reading .metric-unit { font-size:10px; }
 .unit-engine-strip .metric-sparkline { height:25px; }
 .electrical-panel.measure-panel,.phase-readings.measure-panel { padding:16px 14px; }
 .electrical-panel .phase-cell,.phase-readings .phase-cell { padding:8px 7px; }
 .electrical-panel .phase-reading .metric-value,.phase-readings .metric-reading .metric-value { font-size:19px; }
 .phase-readings .metric-reading .metric-unit { font-size:10px; }
 .unit-summary .service-block { padding:17px 18px; }
 .unit-summary .service-dates { margin-top:11px; }
 .unit-summary .service-actions { margin-top:12px; }
}
@media(max-width:359px) {
 .workspace { padding-inline:12px; }
 .site-overview-body.card-body { padding-inline:12px; }
 .site-overview-action { margin-inline:-12px; padding-inline:12px; }
 .site-overview-top { gap:5px; }
 .site-overview-state { max-width:54%; white-space:normal; text-align:center; font-size:10px; }
 .site-overview-power { font-size:27px; }
 .site-overview-meta { font-size:10px; }
 .unit-engine-strip .metric-tile.card { padding:9px 7px; }
 .unit-engine-strip .metric-reading .metric-value { font-size:20px; }
 .unit-engine-strip .metric-reading .metric-unit { font-size:10px; }
 .service-actions { gap:5px; }
}

/* The graph and its caption occupy their own space in a metric button. */
.metric-sparkline { height:auto; min-height:64px; }
.metric-sparkline svg { height:44px; }
.sparkline-caption { display:block; margin-top:3px; }
.unit-engine-strip .metric-sparkline { height:auto; min-height:25px; }
.unit-engine-strip .metric-sparkline svg { height:25px; }
.load-meter[data-level=neutral] > span { background:#3b82ad; }
.optional-readings { margin:12px 0 18px; }
.optional-readings > summary { min-height:44px; padding:12px 0; cursor:pointer; color:#566574; font-size:13px; }
.summary-label { display:flex; align-items:center; gap:7px; }

.site-overview-card[data-state=waiting] { --state-color:#82909c; --state-wash:#f4f6f8; --state-border:#dce3ea; }
.site-overview-card[data-state=waiting] .site-overview-state { color:#52616e; background:#e7ecf0; }
.site-overview-card[data-state=waiting] .site-overview-state::before { background:#82909c; }
.site-overview-card[data-state=generating],.site-overview-card[data-state=delayed] { --state-color:#c47d20; --state-wash:#fffbf4; --state-border:#edddc5; }
.site-overview-card[data-state=generating] .site-overview-state,.site-overview-card[data-state=delayed] .site-overview-state { color:#865111; background:#fff0d8; }
.unit-engine-strip.compact-metrics .metric-tile:last-child:nth-child(odd) { grid-column:auto; }

/* Iteration 2: a compact operator view with room for the power trend. */
.site-overview-body.card-body {
 display:grid;
 grid-template-columns:minmax(0,1.1fr) minmax(108px,.9fr);
 grid-template-areas:"top top" "main meta";
 column-gap:12px;
 padding:20px 21px 16px;
}
.site-overview-top { grid-area:top; min-width:0; flex-wrap:nowrap; align-items:flex-start; }
.site-overview-name { min-width:0; overflow-wrap:anywhere; }
.site-overview-name::after { content:"↗"; margin-left:6px; color:#8a9aa7; font-size:14px; font-weight:450; }
.site-overview-state { max-width:60%; white-space:normal; text-align:right; justify-content:flex-end; flex:none; }
.site-overview-main { grid-area:main; min-width:0; margin:20px 0 0; }
.site-overview-power { font-size:clamp(27px,2.8vw,39px); line-height:1.08; white-space:nowrap; }
.site-overview-power-label { margin-top:6px; }
.site-overview-meta {
 grid-area:meta;
 align-self:end;
 display:flex;
 flex-direction:column;
 align-items:flex-end;
 justify-content:flex-end;
 gap:5px;
 min-width:0;
 margin:20px 0 0;
 text-align:right;
 line-height:1.35;
}
.site-overview-coverage { overflow-wrap:anywhere; }
.site-overview-action { display:none; }

.unit-power-hero.metric-tile {
 justify-content:flex-start;
 gap:0;
 padding:23px 25px 22px;
}
.unit-power-hero .metric-reading { margin:12px 0 0; }
.unit-power-hero .load-context { margin-top:18px; }
.unit-power-hero .load-meter { height:7px; margin-top:8px; background:#dde9e8; }
.unit-power-hero .metric-sparkline { height:auto; min-height:0; margin-top:17px; }
.unit-power-hero .metric-sparkline svg { height:56px; }
.unit-power-hero .sparkline-caption { margin-top:6px; }
.metric-sparkline .sparkline-line { stroke-width:1.8; }
.load-meter[data-level=low] > span { background:#6c9eb9; }
.load-meter[data-level=normal] > span { background:#329764; }
.load-meter[data-level=high] > span,
.load-meter[data-level=optimal] > span { background:#178572; }
.load-meter[data-level=overload] > span { background:#c3433d; }
.load-meter[data-level=neutral] > span { background:#3b82ad; }

.history-chart .chart-area { stroke:none; pointer-events:none; }
.history-chart .chart-line { stroke-width:1.7; vector-effect:non-scaling-stroke; }
.history-chart .chart-point { vector-effect:non-scaling-stroke; }

.electrical-panel.measure-panel,.phase-readings.measure-panel { padding:17px 19px; }
.electrical-panel.measure-panel > h3,.phase-readings.measure-panel > h3 { margin-bottom:10px; }
.electrical-matrix {
 width:100%;
 table-layout:fixed;
 border-collapse:separate;
 border-spacing:0;
 border:1px solid #e1e8ed;
 border-radius:8px;
 overflow:hidden;
 font-variant-numeric:tabular-nums;
}
.electrical-matrix th,.electrical-matrix td { padding:0; min-width:0; }
.electrical-matrix thead th {
 height:29px;
 padding:5px 6px;
 color:#647587;
 font-size:11px;
 line-height:1.3;
 font-weight:550;
 text-align:center;
 background:#f4f7f9;
}
.electrical-matrix thead th:first-child { width:88px; }
.electrical-matrix tbody tr:nth-child(even) { background:#f8fafb; }
.electrical-matrix tbody tr + tr > * { border-top:1px solid #e8eef2; }
.electrical-matrix tbody th {
 padding:7px 8px;
 color:#536477;
 font-size:11px;
 line-height:1.25;
 font-weight:550;
 text-align:left;
 overflow-wrap:anywhere;
}
.electrical-matrix .matrix-label,.electrical-matrix .matrix-unit { display:block; }
.electrical-matrix .matrix-unit { margin-top:2px; color:#8391a0; font-size:10px; font-weight:450; }
.electrical-matrix td + td { border-left:1px solid #edf1f4; }
.electrical-matrix .matrix-empty { display:block; padding:14px 3px; color:#9aabba; text-align:center; }
.electrical-matrix .matrix-cell {
 display:flex;
 flex-direction:column;
 justify-content:center;
 align-items:center;
 gap:1px;
 width:100%;
 min-width:0;
 min-height:46px;
 padding:5px 4px;
 border:0;
 background:transparent;
 text-align:center;
 font-variant-numeric:tabular-nums;
}
.electrical-matrix .matrix-cell:hover { background:#eaf3f8; }
.electrical-matrix .matrix-cell .metric-value { font-size:18px; line-height:1.2; font-weight:680; letter-spacing:-.025em; }
.electrical-matrix .matrix-phase { color:#748292; font-size:10px; line-height:1.1; white-space:nowrap; }
.electrical-matrix .matrix-cell .metric-quality { color:#a06315; font-size:10px; line-height:1.15; }
.electrical-matrix .matrix-cell.quality-invalid .metric-quality { color:#bf4b43; }
.electrical-matrix .matrix-cell.quality-good .metric-quality { display:none; }

@media(max-width:767px) {
 .site-overview-body.card-body { grid-template-columns:minmax(0,1fr) minmax(95px,.84fr); padding:15px 16px 14px; column-gap:10px; }
 .site-overview-main,.site-overview-meta { margin-top:14px; }
 .site-overview-power { font-size:32px; }
 .site-overview-state { max-width:58%; }
 .site-overview-action { margin:15px -16px 0; padding:10px 16px; }
 .unit-power-hero.metric-tile { padding:20px 21px; }
 .unit-power-hero .metric-reading { margin-top:11px; }
 .unit-power-hero .load-context { margin-top:17px; }
 .unit-power-hero .metric-sparkline { margin-top:15px; }
 .unit-power-hero .metric-sparkline svg { height:52px; }
 .electrical-panel.measure-panel,.phase-readings.measure-panel { padding:14px 13px; }
 .electrical-matrix thead th:first-child { width:72px; }
 .electrical-matrix .matrix-cell .metric-value { font-size:17px; }
}
@media(max-width:359px) {
 .site-overview-body.card-body { grid-template-columns:minmax(0,1fr) minmax(86px,.78fr); padding-inline:12px; }
 .site-overview-action { margin-inline:-12px; padding-inline:12px; }
 .site-overview-state { max-width:52%; }
 .site-overview-power { font-size:27px; }
 .electrical-matrix thead th:first-child { width:66px; }
 .electrical-matrix tbody th { padding-inline:5px; font-size:10px; }
 .electrical-matrix .matrix-cell { padding-inline:2px; }
 .electrical-matrix .matrix-cell .metric-value { font-size:15px; }
 .electrical-matrix .matrix-phase { font-size:9px; }
}

/* Operator polish: separate production from missing observations. */
.site-overview-card[data-state=partial] { --state-color:#329b59; --state-border:#d4e5d8; }
.site-overview-card .site-overview-state[data-tone=good] { color:#197448; background:#e2f3e8; }
.site-overview-card .site-overview-state[data-tone=good]::before { background:#329b59; }
.site-overview-coverage[data-tone=warning] { color:#8b5c16; background:#fff2dc; border-radius:5px; padding:3px 6px; }
.summary-card.attention-summary { text-align:left; color:inherit; align-items:stretch; }
.attention-summary:hover { border-color:#a8bdcc; }
.attention-panel { margin:0 0 24px; padding:17px 20px 8px; }
#fleet-view:not([data-mode=overview]) .attention-panel { display:none; }
.attention-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.attention-heading h2 { font-size:17px; margin:0; font-weight:650; }
#attention-title { outline:none; }
#attention-title:focus-visible { outline:2px solid #206bc4; outline-offset:4px; }
#attention-count { color:#6b7885; font-size:12px; }
.attention-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.attention-item { display:flex; align-items:center; justify-content:space-between; gap:10px; text-align:left; background:#fffaf2; border:1px solid #f0e4ce; border-radius:7px; padding:12px; min-height:88px; color:#25384a; }
.attention-item:hover { background:#fff4e1; border-color:#d4b982; }
.attention-copy { min-width:0; display:flex; flex-direction:column; gap:4px; }
.attention-device { font-size:11px; color:#6c7580; }
.attention-title { font-size:14px; font-weight:600; line-height:1.3; }
.attention-detail,.attention-extra { font-size:11px; line-height:1.4; color:#687786; }
.attention-extra { color:#82622f; }
.attention-arrow { color:#8c9cab; flex:none; }
#attention-more>summary { min-height:44px; display:flex; align-items:center; gap:6px; color:#34658c; font-size:13px; cursor:pointer; }
#attention-more>summary::after { content:"⌄"; }
#attention-more[open]>summary::after { content:"⌃"; }
.attention-journal { font-size:12px; min-height:44px; padding:8px 0; margin-top:3px; }
.attention-empty { font-size:13px; color:#647482; margin:0; padding:10px 0; }
@media(max-width:767px) {
 .attention-panel { padding:15px 15px 5px; }
 .attention-list { grid-template-columns:1fr; gap:0; }
 .attention-item { min-height:80px; padding:12px 0; border:0; border-radius:0; background:transparent; }
 .attention-item+.attention-item { border-top:1px solid #edf0f2; }
 .attention-item:hover { background:#f8fafb; }
 .attention-title { font-size:14px; }
 .attention-detail,.attention-extra { font-size:12px; }
}
.service-block .service-remaining { font-size:25px; letter-spacing:-.6px; line-height:1.25; }
.service-block .service-dates { row-gap:9px; }
.service-block .service-next { font-weight:600; }
.service-block .service-forecast-note { font-size:12px; line-height:1.45; }
.service-actions .service-complete { color:#206bc4; border-color:#b9d0ea; background:#f1f6fd; }
@media(max-width:767px) {
 .service-block .service-remaining { font-size:24px; }
 .service-block[data-status=needs_setup] .service-remaining,.service-block[data-status=data_unavailable] .service-remaining,.service-block[data-status=counter_reset] .service-remaining { font-size:19px; }
 .service-actions .button { min-height:44px; }
}
.chart-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0 7px; }
.chart-summary-item { min-width:0; padding:8px 9px; background:#f4f8fb; border-radius:7px; }
.chart-summary-label { font-size:11px; color:#647482; font-weight:400; }
.chart-summary-value { margin:4px 0 0; display:flex; flex-wrap:wrap; align-items:baseline; column-gap:3px; font-size:15px; line-height:1.4; font-weight:650; font-variant-numeric:tabular-nums; }
.chart-summary-value>span { white-space:nowrap; }
.chart-summary-unit { font-size:10px; color:#7b8794; font-weight:400; }
@media(max-width:359px) { .chart-summary { gap:5px; }.chart-summary-item { padding:7px 6px; }.chart-summary-value { font-size:12px; } }

/* Night mode keeps the operator layout and status meanings of the light theme. */
.theme-toggle {
 display:inline-flex;
 align-items:center;
 justify-content:center;
 flex:none;
 width:44px;
 height:44px;
 min-width:44px;
 min-height:44px;
 padding:10px;
 border:1px solid var(--line);
 border-radius:9px;
 background:var(--surface);
 color:var(--muted);
}
.theme-toggle:hover { color:var(--text); background:var(--surface-muted); }
.theme-toggle svg { display:block; width:21px; height:21px; }
.theme-toggle .theme-icon-sun { display:none; }
:root[data-theme="dark"] .theme-toggle .theme-icon-sun { display:block; }
:root[data-theme="dark"] .theme-toggle .theme-icon-moon { display:none; }
.login-theme-toggle { position:absolute; top:18px; right:18px; }
.login-view { position:relative; }

:root[data-theme="dark"] {
 color-scheme:dark;
 --canvas:#10171f;
 --surface:#18232f;
 --surface-muted:#202e3d;
 --text:#e1e9f1;
 --muted:#a2b0bf;
 --line:#344555;
 --accent:#8bbaf2;
 --accent-soft:#233d58;
 --good:#85cea4;
 --good-bg:#203e31;
 --warn:#ebbf7d;
 --warn-bg:#3b3020;
 --danger:#f29b95;
 --danger-bg:#442b2d;
 --night-running:#182e27;
 --night-running-border:#38584a;
 --night-warning:#2c2922;
 --night-warning-border:#5b4931;
 --night-neutral:#1c2834;
 --card-shadow:0 2px 4px #0002,0 8px 18px -9px #0008;
 --tblr-body-bg:var(--canvas);
 --tblr-body-color:var(--text);
 --tblr-secondary-color:var(--muted);
 --tblr-muted:var(--muted);
 --tblr-border-color:var(--line);
 --tblr-bg-surface:var(--surface);
 --tblr-bg-surface-secondary:var(--surface-muted);
 --tblr-primary:var(--accent);
 --tblr-link-color:var(--accent);
 --tblr-link-hover-color:#b5d6ff;
 --tblr-card-bg:var(--surface);
 --tblr-shadow-card:var(--card-shadow);
 background:var(--canvas);
 color:var(--text);
}
:root[data-theme="dark"] body { background:var(--canvas); color:var(--text); }
:root[data-theme="dark"] :is(.topbar,.main-nav,.panel,.summary-card,.metric-tile,.login-form-wrap,.loading-panel,.empty-state,.unit-actions,.journal-form-footer,.planned-stop-control,dialog) {
 background:var(--surface);
 border-color:var(--line);
}
:root[data-theme="dark"] :is(.panel.card,.summary-card.card,.metric-tile.card,.login-form-wrap) { box-shadow:var(--card-shadow); }
:root[data-theme="dark"] :is(.login-view,.boot) { background:var(--canvas); }
:root[data-theme="dark"] :is(.skip-link,.button.secondary) { background:var(--surface); border-color:var(--line); }
:root[data-theme="dark"] .button.secondary:hover { background:var(--surface-muted); border-color:#6d87a0; }
:root[data-theme="dark"] .button.primary { background:#326ba9; border-color:#477fb9; color:#f2f7fc; }
:root[data-theme="dark"] .button.primary:hover { background:#3e79b8; }
:root[data-theme="dark"] .brand-mark { background:#326ba9; color:#f2f7fc; }
:root[data-theme="dark"] :is(.nav-link.is-active,.site-button[aria-pressed=true],.site-button[aria-pressed=true] span) { background:var(--accent-soft); color:var(--accent); }
:root[data-theme="dark"] :is(.site-button span,.site-stat,.summary-icon) { background:var(--surface-muted); color:var(--muted); }
:root[data-theme="dark"] .site-button:hover { background:var(--surface-muted); }
:root[data-theme="dark"] :is(.site-stat-power,.summary-icon,.unit-tabs button[aria-selected=true],.login-form-wrap>.eyebrow,.journal-extra summary,.unit-actions>summary,.service-extra summary,.optional-readings>summary,#attention-more>summary) { color:var(--accent); }
:root[data-theme="dark"] :is(.site-overview-power,.site-overview-count,.service-remaining,.service-dates dd) { color:var(--text); }
:root[data-theme="dark"] :is(.site-overview-power-label,.site-overview-meta,.site-overview-coverage,.site-power-unit,.metric-label,.phase-name,.phase-label,.load-context-label,.sparkline-caption,.metric-empty-trend,.service-interval,.service-progress-note,.service-dates dt,.service-forecast-note,.service-extra p,.service-form-intro,.service-save-preview p,.attention-device,.attention-detail,.attention-empty,#attention-count,.page-footer,.chart-summary-label,.chart-summary-unit) { color:var(--muted); }
:root[data-theme="dark"] :is(.card-arrow,.attention-arrow,.summary-denominator,.chart-empty-icon),
:root[data-theme="dark"] .metric-label::after,
:root[data-theme="dark"] .site-overview-name::after { color:#8ea2b5; }
:root[data-theme="dark"] :is(.quality-missing,.quality-unavailable) .metric-value { color:#95a7b8; }
:root[data-theme="dark"] :is(.card-metrics,.card-footer,.panel-head,.pending-row,.event-row,.phase-section+.phase-section,.controller-row,.detail-list>div,.catalog-list li,.service-extra,.unit-card-shell .service-heading) { border-color:var(--line); }
:root[data-theme="dark"] :is(input,select,textarea) { background-color:#15202b; border-color:#425568; color:var(--text); }
:root[data-theme="dark"] :is(input,textarea)::placeholder { color:#879bad; opacity:1; }
:root[data-theme="dark"] :is(input,select,textarea):hover { border-color:#6d87a0; }
:root[data-theme="dark"] :is(input,select,textarea):focus { border-color:var(--accent); }
:root[data-theme="dark"] #journal-target:disabled { background-color:var(--surface-muted); color:var(--muted); }
:root[data-theme="dark"] input:autofill { box-shadow:0 0 0 100px #203448 inset; -webkit-text-fill-color:var(--text); }
:root[data-theme="dark"] dialog { color:var(--text); box-shadow:0 18px 70px #0009; }
:root[data-theme="dark"] dialog::backdrop { background:#050a10b3; }
:root[data-theme="dark"] .toast { color:var(--text); background:#263a4d; border:1px solid #4d6780; box-shadow:0 8px 30px #0008; }

/* Colored edges indicate machine state without illuminating the whole screen. */
:root[data-theme="dark"] :is(.site-overview-card.card,.unit-card.card) {
 --state-color:#cc9b55;
 --state-wash:var(--night-warning);
 --state-border:var(--night-warning-border);
 background:var(--state-wash);
 border-color:var(--state-border);
 border-left-color:var(--state-color);
 box-shadow:var(--card-shadow);
}
:root[data-theme="dark"] :is(.site-overview-card[data-state=running],.site-overview-card[data-state=partial],.unit-card[data-operating=running]) {
 --state-color:#6ab587;
 --state-wash:var(--night-running);
 --state-border:var(--night-running-border);
}
:root[data-theme="dark"] .unit-card[data-operating=generating] {
 --state-color:#71a9d8;
 --state-wash:#1b2d3c;
 --state-border:#3b536b;
}
:root[data-theme="dark"] :is(.site-overview-card[data-state=offline],.site-overview-card[data-state=waiting]) {
 --state-color:#8096a8;
 --state-wash:var(--night-neutral);
 --state-border:var(--line);
}
:root[data-theme="dark"] :is(.site-overview-card:hover,.unit-card:hover) { border-color:var(--state-color); box-shadow:0 4px 20px #0005; }
:root[data-theme="dark"] .site-overview-card .site-overview-state { background:var(--warn-bg); color:var(--warn); }
:root[data-theme="dark"] .site-overview-card .site-overview-state::before { background:currentColor; }
:root[data-theme="dark"] :is(.site-overview-card[data-state=running] .site-overview-state,.site-overview-card .site-overview-state[data-tone=good]) { color:var(--good); background:var(--good-bg); }
:root[data-theme="dark"] :is(.site-overview-card[data-state=offline] .site-overview-state,.site-overview-card[data-state=waiting] .site-overview-state) { color:var(--muted); background:var(--surface-muted); }
:root[data-theme="dark"] .site-overview-coverage[data-tone=warning] { color:var(--warn); background:var(--warn-bg); }
:root[data-theme="dark"] .site-overview-action { color:var(--muted); background:#0001; border-color:var(--state-border); }
:root[data-theme="dark"] .unit-card-shell { --planned-border:var(--night-warning-border); }
:root[data-theme="dark"] .unit-card-shell[data-operating=running] { --planned-border:var(--night-running-border); }
:root[data-theme="dark"] .unit-card-shell[data-operating=generating] { --planned-border:#3b536b; }
:root[data-theme="dark"] .unit-card-shell .unit-card.card { box-shadow:none; }
:root[data-theme="dark"] .unit-card-shell :is(.service-block,.planned-stop-control) { background:var(--surface); border-color:var(--planned-border); }
:root[data-theme="dark"] :is(.card-load-track,.unit-card .card-load-track,.load-meter,.unit-power-hero .load-meter,.load-meter[data-level=unknown],.service-track) { background:#30463f; }
:root[data-theme="dark"] .load-meter[data-level=unknown] { background:var(--surface-muted); }
:root[data-theme="dark"] .load-meter[data-level=low]>span { background:#759fb8; }
:root[data-theme="dark"] .load-meter[data-level=normal]>span { background:#67b488; }
:root[data-theme="dark"] :is(.load-meter[data-level=high],.load-meter[data-level=optimal])>span { background:#61baa6; }
:root[data-theme="dark"] .load-meter[data-level=overload]>span { background:#df8881; }
:root[data-theme="dark"] .load-meter[data-level=neutral]>span { background:#80b3d6; }
:root[data-theme="dark"] .load-meter[data-level=elevated]>span { background:#d3a667; }
:root[data-theme="dark"] .unit-power-hero.metric-tile { background:var(--night-running); border-color:var(--night-running-border); }
:root[data-theme="dark"] .unit-power-hero:not(.quality-good) { background:var(--night-warning); border-color:var(--night-warning-border); }
:root[data-theme="dark"] .metric-tile.is-selected { background:#1c3043; border-color:#73a4d8; box-shadow:inset 0 2px #73a4d8; }
:root[data-theme="dark"] :is(.metric-tile.quality-stale,.metric-tile.quality-missing) { border-color:#79613c; }
:root[data-theme="dark"] .metric-tile.quality-invalid { border-color:#8e5650; background:#342527; }
:root[data-theme="dark"] .metric-tile.quality-good .metric-quality { color:var(--good); }

/* Readings, history and status details share the same quiet dark surfaces. */
:root[data-theme="dark"] :is(.phase-cell,.electrical-panel .phase-cell,.phase-readings .phase-cell,.chart-summary-item,.service-save-preview) { background:var(--surface-muted); }
:root[data-theme="dark"] :is(.phase-cell:hover,.electrical-panel .phase-cell:hover,.phase-readings .phase-cell:hover,.electrical-matrix .matrix-cell:hover) { background:var(--accent-soft); }
:root[data-theme="dark"] :is(.electrical-panel .phase-grid,.phase-readings .phase-grid,.electrical-panel .phase-cell+.phase-cell,.phase-readings .phase-cell+.phase-cell,.electrical-matrix,.electrical-matrix tbody tr+tr>*,.electrical-matrix td+td) { border-color:var(--line); }
:root[data-theme="dark"] .electrical-matrix thead th { color:var(--muted); background:var(--surface-muted); }
:root[data-theme="dark"] .electrical-matrix tbody tr:nth-child(even) { background:#1c2937; }
:root[data-theme="dark"] .electrical-matrix :is(tbody th,.matrix-unit,.matrix-phase,.matrix-empty) { color:var(--muted); }
:root[data-theme="dark"] .electrical-matrix .matrix-cell .metric-quality { color:var(--warn); }
:root[data-theme="dark"] .electrical-matrix .matrix-cell.quality-invalid .metric-quality { color:var(--danger); }
:root[data-theme="dark"] :is(.io-active,.analysis-delivery,.receiver-strip) { color:var(--accent); background:#203449; border-color:#3b526a; }
:root[data-theme="dark"] .io-inactive { color:var(--muted); background:var(--surface-muted); }
:root[data-theme="dark"] .io-unknown { color:var(--warn); background:var(--warn-bg); }
:root[data-theme="dark"] :is(.history-quick-periods button[aria-pressed=true],.energy-period button[aria-pressed=true]) { border-color:#526f8e; }
:root[data-theme="dark"] .chart-empty { background:#15202b; border-color:#425568; }
:root[data-theme="dark"] .metric-sparkline { color:#89bada; }
:root[data-theme="dark"] .metric-sparkline .sparkline-fill { fill:#80bce21a; }
:root[data-theme="dark"] .history-chart stop { stop-color:#89bada; }
:root[data-theme="dark"] .history-chart .chart-focus { stroke:var(--surface); }
:root[data-theme="dark"] .history-chart .chart-crosshair { stroke:#829ab2; }
:root[data-theme="dark"] .chart-tooltip { background:#2b4359; color:var(--text); border:1px solid #66829d; }
:root[data-theme="dark"] .notice { border-color:#85534f; }
:root[data-theme="dark"] .warning-notice { border-color:#75603d; }
:root[data-theme="dark"] .fetch-stale .unit-card { border-color:#79613c; }
:root[data-theme="dark"] .summary-card.has-alerts .summary-icon { background:var(--danger-bg); color:var(--danger); }

/* Service actions and exceptions remain legible at night, including dialogs. */
:root[data-theme="dark"] .service-block { background:var(--surface); border-color:var(--line); }
:root[data-theme="dark"] .service-track { background:var(--surface-muted); }
:root[data-theme="dark"] .service-track span { background:#79a6c4; }
:root[data-theme="dark"] :is(.service-block[data-urgency=soon],.service-block[data-urgency=urgent]) .service-remaining { color:var(--warn); }
:root[data-theme="dark"] :is(.service-block[data-urgency=soon],.service-block[data-urgency=urgent]) .service-track span { background:#d3a667; }
:root[data-theme="dark"] .service-block[data-urgency=urgent] { background:var(--night-warning); border-color:var(--night-warning-border); }
:root[data-theme="dark"] .service-complete { background:#233d58!important; border-color:#476889!important; color:var(--accent); }
:root[data-theme="dark"] .maintenance-quick-button { background:#203449; border-color:#3b526a; color:var(--accent); }
:root[data-theme="dark"] .planned-stop-status { color:var(--warn); }
:root[data-theme="dark"] :is(.planned-stop-control[data-planned-status=armed],.planned-stop-control[data-planned-status=stopped]) { background:var(--night-warning); }
:root[data-theme="dark"] .attention-item { color:var(--text); background:var(--night-warning); border-color:var(--night-warning-border); }
:root[data-theme="dark"] .attention-item:hover { background:#373024; border-color:#9b7b49; }
:root[data-theme="dark"] .attention-extra { color:var(--warn); }
:root[data-theme="dark"] .attention-summary:hover { border-color:#6d87a0; }
@media(max-width:767px) {
 .topbar-meta .theme-toggle { width:44px; height:44px; min-height:44px; padding:10px; }
 :root[data-theme="dark"] .attention-item { background:transparent; }
 :root[data-theme="dark"] .attention-item+.attention-item { border-color:var(--line); }
 :root[data-theme="dark"] .attention-item:hover { background:var(--surface-muted); }
}

/* Site cards: one operating statement; technical diagnostics are inside the site. */
.site-overview-body.card-body {
 grid-template-columns:minmax(0,1fr) auto;
 grid-template-areas:"top top" "main meta";
 column-gap:14px;
 row-gap:17px;
 padding:19px 20px;
 min-height:137px;
}
.site-overview-top { align-items:center; justify-content:space-between; }
.site-overview-name::after { content:none; }
.site-overview-arrow { color:var(--muted); font-size:19px; font-weight:400; line-height:1; }
.site-overview-main,.site-overview-meta { margin:0; align-self:center; }
.site-overview-meta { gap:5px; max-width:150px; }
.site-overview-state { max-width:none; padding:0; border-radius:0; font-size:13px; font-weight:650; line-height:1.4; white-space:normal; }
:root[data-theme] .site-overview-card .site-overview-state[data-tone] { background:transparent; color:var(--muted); }
:root[data-theme] .site-overview-card .site-overview-state[data-tone=good] { color:var(--good); }
:root[data-theme] .site-overview-card .site-overview-state[data-tone=warning] { color:var(--warn); }
:root[data-theme] .site-overview-card .site-overview-state[data-tone]::before { background:currentColor; width:6px; height:6px; }
:root[data-theme] .site-overview-coverage[data-tone] { background:transparent; padding:0; font-size:12px; line-height:1.4; color:var(--warn); }
.site-overview-power-label { font-size:11px; }
@media(max-width:767px) {
 .site-overview-body.card-body { padding:17px 16px; min-height:125px; column-gap:10px; row-gap:17px; }
 .site-overview-power { font-size:30px; }
 .site-overview-meta { max-width:140px; }
 .site-overview-state { max-width:none; font-size:13px; text-align:right; }
}
@media(max-width:359px) {
 .site-overview-body.card-body { padding:15px 12px; min-height:117px; column-gap:8px; }
 .site-overview-name { font-size:17px; }
 .site-overview-power { font-size:25px; }
 .site-overview-meta { max-width:126px; }
 .site-overview-state { max-width:none; font-size:12px; }
 :root[data-theme] .site-overview-coverage[data-tone] { font-size:11px; }
}