:root{color-scheme:dark;--page:#0e120b;--surface:#1a2316;--raised:#222d1d;--forest:#1c261a;--clay:#b77d46;--lifted:#c8965f;--stone:#aabfa6;--text:#e9efe2;--muted:#a6bba1;--line:#394632;--success:#7faa74;--warning:#d2a85a;--danger:#d08a6f;--info:#8fb0c4;--radius:12px}
*{box-sizing:border-box}body{margin:0;background:var(--page);color:var(--text);font-family:'Libre Franklin',Arial,Helvetica,sans-serif;font-size:15px;line-height:1.5}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.46}button,a,input{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--lifted)}a{color:var(--stone)}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1{font-size:32px;line-height:1.22;letter-spacing:-.5px;margin:8px 0 12px}h2{font-size:20px;font-weight:600}h3{font-size:17px;font-weight:600;line-height:1.35}code,.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;overflow-wrap:anywhere}.skip{position:absolute;top:-80px;left:16px;padding:12px;background:var(--clay);color:var(--forest);z-index:100}.skip:focus{top:8px}.topbar{background:var(--forest);border-bottom:1px solid var(--line)}.topbar-inner{max-width:1248px;margin:auto;min-height:80px;display:flex;align-items:center;justify-content:space-between;padding:12px 24px;gap:16px}.brand{width:144px;height:52px;object-fit:contain;object-position:left center}.top-actions{display:flex;align-items:center;gap:24px}.status{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500}.muted{color:var(--muted)}.success{color:var(--success)}.warning{color:var(--warning)}.danger{color:var(--danger)}.info{color:var(--info)}.workspace{max-width:1248px;padding:32px 24px 0;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin:0 0 32px}.eyebrow{font-size:13px;color:var(--muted);font-weight:500}.subtitle{color:var(--muted);font-size:15px}.workspace-meta{display:flex;flex-direction:column;text-align:right;gap:4px;flex-shrink:0;padding-bottom:4px}.workspace-meta strong{font-size:13px;font-weight:500}.metadata{font-size:12px;color:var(--muted)}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:28px;padding-bottom:12px}.tabs button{background:transparent;color:var(--muted);border:1px solid transparent;border-radius:8px;min-height:48px;padding:10px 16px;display:flex;align-items:center;gap:8px;font-weight:600;font-size:15px}.tabs button:hover{background:var(--raised)}.tabs button[aria-selected=true]{background:var(--raised);color:var(--text);border-color:var(--line)}.tabs button[aria-selected=true] .tab-symbol{color:var(--lifted)}.tab-symbol{font-size:21px;line-height:1}.tab-count{font-size:12px;font-weight:500;min-width:20px;text-align:center;background:var(--page);border:1px solid var(--line);border-radius:5px;padding:0 4px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:20px}.section-heading p{color:var(--muted);margin-top:4px}.quiet-label{color:var(--muted);font-size:13px;white-space:nowrap}.sensor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;min-width:0}.sensor-card{padding:24px}.card-title{display:flex;align-items:start;justify-content:space-between;gap:16px}.card-title h3{margin-top:2px;overflow-wrap:anywhere}.card-title .metadata{display:block;margin-top:4px}.icon-button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--muted);flex-shrink:0}.icon-button:hover{background:var(--raised)}.icon-button svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6}.sensor-status{margin-top:24px}.level-value{display:flex;align-items:baseline;gap:8px;margin-top:8px;min-height:76px}.level-value .number{font-size:56px;line-height:1.2;letter-spacing:-2px;font-weight:500;font-variant-numeric:tabular-nums}.level-value .unit{font-size:22px;color:var(--muted);font-weight:400}.level-value .unavailable{font-size:28px;letter-spacing:-.5px;font-weight:500;padding-top:12px}.fill-track{height:8px;border-radius:4px;background:var(--page);overflow:hidden;margin:8px 0 24px}.fill-track span{height:100%;display:block;background:var(--stone);border-radius:4px}.metric-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:8px}.metric-row span:first-child{color:var(--muted);font-size:13px}.metric-row strong{font-weight:500;font-size:15px}.card-bottom{margin-top:24px;padding-top:16px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.card-bottom span:last-child{white-space:nowrap}.section-footnote{color:var(--muted);font-size:12px;margin:20px 0 24px;max-width:940px}.empty{grid-column:1/-1;border:1px dashed var(--line);border-radius:12px;padding:40px 24px;text-align:center}.empty p{color:var(--muted);max-width:540px;margin:12px auto 0}.button{min-height:44px;padding:10px 16px;border:1px solid transparent;border-radius:8px;font-weight:600;line-height:1.4;background:var(--clay);color:var(--forest);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:background 140ms ease}.button:hover:not(:disabled){background:var(--lifted)}.button.secondary{border-color:var(--line);color:var(--text);background:transparent}.button.secondary:hover:not(:disabled){background:var(--raised)}.button.small{font-size:13px}.button.danger-outline{border-color:var(--danger);color:var(--danger);background:transparent}.button.danger-outline:hover:not(:disabled){background:var(--raised)}.notice{border:1px solid var(--line);border-left:3px solid currentColor;border-radius:8px;background:var(--surface);padding:12px 16px;font-size:14px;margin:0 0 20px}.notice strong{font-weight:600}.notice a{color:inherit}.footer{margin-top:40px;padding:24px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;color:var(--muted);font-size:12px}.footer-divider{padding:0 8px;color:var(--line)}.gate-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(330px,1fr);gap:16px}.map-heading{padding:20px 24px;display:flex;justify-content:space-between;gap:16px;align-items:center}.map{height:364px;position:relative;overflow:hidden;background:#162012;touch-action:none;cursor:grab;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.map:active{cursor:grabbing}.map-layer{position:absolute;inset:0}.map-layer img{position:absolute;width:256px;height:256px;max-width:none;pointer-events:none}.map-tools{position:absolute;left:16px;top:16px;display:flex;flex-direction:column;gap:8px;z-index:3}.map-tools button{min-width:44px;height:44px;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:8px;font-size:24px;line-height:1}.map-tools button:hover{background:var(--raised)}.map-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;padding:32px 72px;text-align:center;color:var(--muted);font-size:14px;pointer-events:none}.map-empty strong{color:var(--text);font-size:17px}.map-status{position:absolute;bottom:34px;left:80px;right:12px;padding:8px 12px;background:var(--surface);border:1px solid var(--line);border-radius:8px;font-size:12px;color:var(--muted);z-index:3;pointer-events:none}.attribution{position:absolute;bottom:0;right:0;background:var(--page);padding:6px 8px;font-size:12px;z-index:4}.map-legend{display:flex;gap:20px;padding:16px 24px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.map-legend span{display:flex;align-items:center;gap:8px}.dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:currentColor}.gate-list{display:flex;flex-direction:column;gap:8px;margin-top:16px}.gate-list button{padding:16px 20px;min-height:72px;border-radius:12px;background:var(--surface);border:1px solid var(--line);text-align:left;color:var(--text);display:flex;align-items:center;justify-content:space-between;gap:16px}.gate-list button:hover{background:var(--raised)}.gate-list button.selected{border-color:var(--lifted)}.gate-list .gate-name{font-weight:600;display:block}.gate-list .metadata{display:block;margin-top:4px}.gate-list .status{font-size:12px;white-space:nowrap}.gate-detail>.card{padding:24px}.gate-detail h3{font-size:20px}.gate-state{margin:20px 0;display:flex;align-items:center;gap:8px;font-size:14px}.gate-metrics{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.gate-metrics span{display:block;color:var(--muted);font-size:12px}.gate-metrics strong{display:block;margin-top:4px;font-size:15px;font-weight:500}.gate-coordinates{margin-top:16px;display:flex;flex-direction:column;gap:4px;color:var(--muted);font-size:12px}.gate-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:24px}.gate-actions .primary-action{grid-column:1/-1}.gate-actions .button{font-size:14px;padding:12px 8px}.command-note{padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--page);margin-top:20px;font-size:13px}.command-note strong{display:block;font-size:14px;font-weight:600;margin-bottom:4px}.command-note p{color:var(--muted)}.gate-lock-note{font-size:12px;color:var(--muted);margin-top:12px}.history{margin-top:20px}.history summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--muted);font-size:13px}.history-item{padding:12px 0;border-top:1px solid var(--line);font-size:12px}.history-item strong{font-size:13px;font-weight:500}.history-item p{margin-top:4px;color:var(--muted)}.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.summary-stat{padding:20px 24px;background:var(--surface);border:1px solid var(--line);border-radius:12px}.summary-stat span{display:block;font-size:13px;color:var(--muted)}.summary-stat strong{display:block;font-size:22px;font-weight:500;margin-top:4px}.summary-stat .mono{font-size:15px}.table-card{margin-bottom:16px}.table-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px}.table-heading span{font-size:12px;color:var(--muted)}.table-scroll{overflow:auto;border-top:1px solid var(--line)}table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}th{color:var(--muted);font-weight:500;background:var(--raised);font-size:12px;white-space:nowrap;padding:12px 16px}td{padding:16px;border-top:1px solid var(--line);vertical-align:top;white-space:nowrap}td strong{font-weight:500}td .metadata{display:block;margin-top:4px}td.payload{min-width:260px;max-width:460px;white-space:normal;word-break:break-word;font-family:ui-monospace,Consolas,monospace;font-size:12px;line-height:1.6}.empty-row{text-align:center;padding:28px;color:var(--muted)}dialog{color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:16px;width:min(520px,calc(100vw - 32px));padding:0;max-height:calc(100dvh - 32px);overflow:auto}dialog::backdrop{background:#050804bd}.modal-header{padding:24px 24px 16px;display:flex;gap:16px;justify-content:space-between;align-items:start}.modal-header h2{font-size:20px;font-weight:600}.modal-header p{color:var(--muted);font-size:13px;margin-top:4px}.modal-header .icon-button{margin-top:-4px}.modal-body{padding:0 24px 24px}.modal-body p{color:var(--muted);margin-bottom:16px}.form-field{display:block;margin:16px 0}.form-field>span{display:block;font-size:13px;font-weight:500;margin-bottom:8px}.form-field input{display:block;min-height:48px;width:100%;padding:12px;background:var(--page);border:1px solid var(--line);border-radius:8px;color:var(--text)}.form-field small{display:block;color:var(--muted);font-size:12px;margin-top:8px}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}.check{display:flex;align-items:flex-start;gap:12px;min-height:44px;margin:20px 0 0;font-size:14px}.check input{margin:4px 0;min-width:20px;min-height:20px;accent-color:var(--clay)}.form-error{font-size:13px;color:var(--danger);margin-top:16px;min-height:0}.form-error:empty{display:none}.calibration-snapshot{padding:16px;background:var(--page);border:1px solid var(--line);border-radius:8px;margin:4px 0 20px}.calibration-snapshot strong{font-size:24px;display:block;font-weight:500;margin-top:4px}.calibration-snapshot span{color:var(--muted);font-size:12px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 32px);padding:16px 24px;background:var(--raised);border:1px solid var(--stone);border-radius:12px;z-index:100;box-shadow:0 4px 16px #0004;font-size:14px}.operator-info{border-top:1px solid var(--line);margin-top:20px;padding-top:16px}.operator-info .button{width:100%;margin-top:8px}
@media(min-width:1500px){.workspace{padding-top:40px}.map{height:400px}}@media(max-width:1000px){.sensor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gate-layout{grid-template-columns:minmax(0,1fr) minmax(310px,1fr)}.map-heading{align-items:start;flex-direction:column;gap:4px}.gate-list .status{white-space:normal}.top-actions{gap:16px}.map-legend{gap:12px}}@media(max-width:760px){.workspace{padding:24px 16px 0}.topbar-inner{padding:8px 16px;min-height:68px}.brand{width:120px;height:48px}.top-actions{gap:8px}.top-actions>.status{display:none}.page-heading{margin-bottom:24px;align-items:start}.workspace-meta{display:none}h1{font-size:28px;line-height:1.3;max-width:95%;letter-spacing:-.4px}.tabs{margin-bottom:24px;gap:8px}.tabs button{padding:8px 12px;font-size:13px;gap:6px;flex:1;white-space:nowrap;justify-content:center}.tab-symbol{display:none}.section-heading{gap:12px;align-items:start}.section-heading h2{font-size:18px}.section-heading p{font-size:14px}.quiet-label{display:none}.gate-layout{grid-template-columns:minmax(0,1fr)}.map{height:320px}.map-heading{flex-direction:row;align-items:center}.map-heading .metadata{font-size:12px}.sensor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sensor-card{padding:20px}.card-title{gap:8px}.level-value .number{font-size:48px}.card-bottom{flex-direction:column;align-items:start;gap:4px}.footer{flex-direction:column;gap:8px;margin-top:28px}.summary-grid{grid-template-columns:1fr;gap:8px}.summary-stat{padding:16px 20px;display:flex;justify-content:space-between;align-items:center}.summary-stat strong{margin:0;font-size:18px}.summary-stat .mono{font-size:13px}.gate-detail>.card{padding:24px}.table-heading{padding:16px 20px}.toast{bottom:16px}.section-footnote{font-size:12px}.map-empty{padding:24px 72px}}
@media(max-width:540px){.sensor-grid{grid-template-columns:1fr}.sensor-card{padding:24px}.card-bottom{flex-direction:row;align-items:center}.level-value .number{font-size:56px}.sensor-status{margin-top:20px}.level-value{min-height:76px}.map-heading{padding:16px 20px;flex-direction:column;align-items:start;gap:4px}.map-legend{padding:16px 20px}.tabs .tab-count{display:none}.modal-header{padding:20px 20px 16px}.modal-body{padding:0 20px 20px}.gate-list button{padding:16px}.gate-list .status{max-width:110px;text-align:right;justify-content:end}.map-status{left:72px;font-size:12px}.map-empty{padding-right:20px}.gate-actions{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Keep broken network tiles invisible, and preserve an explicit offline message. */
.map-layer img{visibility:hidden}.form-field input{border-color:#66765e}
@media(max-width:760px){.topbar{position:sticky;top:0;z-index:10}.tabs{position:sticky;top:68px;background:var(--page);z-index:9;padding-top:8px}.gate-layout{display:flex;flex-direction:column}.map-column{display:contents}.map-card{order:1}.gate-detail{order:2}.gate-list{order:3;margin-top:0}}

.attribution{min-height:44px;display:flex;align-items:center}.map-status{bottom:56px}.map-tools button{border-color:#66765e}
/* Lifted clay keeps small button labels above the AA contrast threshold. */
.button{background:var(--lifted)}.button:hover:not(:disabled){background:var(--stone)}


/* Map workspace: edge-to-edge below the tabs; only the left sidebar scrolls. */
.mobile-only{display:none}.map-workspace{display:grid;grid-template-columns:364px minmax(0,1fr);height:100%;width:100%;min-height:0;position:relative}
.map-sidebar{min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;background:var(--surface);border-right:1px solid var(--line);z-index:5}
.sidebar-heading{padding:20px 24px 16px;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:center;justify-content:space-between}.sidebar-heading h2{font-size:18px}.sidebar-heading .metadata{margin-top:4px}.sidebar-body{padding:16px 20px 24px}.map-intro{color:var(--muted);font-size:15px;margin:0 4px 20px}.list-category{display:flex;justify-content:space-between;font-size:15px;margin:24px 4px 12px}.list-category:first-child{margin-top:0}
.map-device-list{display:flex;flex-direction:column;gap:8px}.device-list-row{display:flex;gap:12px;align-items:center;width:100%;text-align:left;background:var(--page);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:12px 12px;min-height:92px}.device-list-row:hover{background:var(--raised)}.list-device-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.list-device-copy strong{font-size:15px;font-weight:600;overflow-wrap:anywhere}.list-device-copy .status{font-size:12px}.list-empty{margin:0 4px 12px}.sidebar-legend{display:grid;gap:12px;border-top:1px solid var(--line);padding-top:20px;margin:24px 4px 0;font-size:13px;color:var(--muted)}.sidebar-legend h3{font-size:15px;color:var(--text)}.sidebar-legend span{display:flex;align-items:center;gap:12px}.map-footnote{color:var(--muted);font-size:12px;line-height:1.6;margin:20px 4px 0}.back-button{width:100%;justify-content:flex-start;margin-bottom:16px}.map-sidebar .gate-detail>.card{padding:20px;border:0;background:var(--page)}.map-sidebar .gate-detail h3{font-size:20px}.map-sidebar .gate-metrics{gap:16px 12px}.map-sidebar .gate-metrics strong{font-size:14px;overflow-wrap:anywhere}.map-sidebar .gate-actions .button{font-size:14px;min-height:48px}.map-sidebar .gate-state{margin:16px 0}.sensor-location-row{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:20px}.sensor-coordinates{display:flex;flex-direction:column;gap:8px;margin-top:20px;overflow-wrap:anywhere}.sensor-coordinates span{font-size:12px;color:var(--muted)}.sensor-coordinates strong{font-size:13px}
/* Shared compact header for Sensors, Map and Technical. Only content scrolls. */
body{height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column}.topbar{flex:0 0 auto;position:relative;z-index:10}.topbar-inner{max-width:none;min-height:64px;padding:4px 24px}.brand{height:48px}main.workspace{flex:1;display:flex;flex-direction:column;min-height:0;max-width:none;width:100%;padding:0;margin:0}.page-heading{padding:12px 24px;margin:0;flex:0 0 auto}.page-heading h1{font-size:22px;margin:0;max-width:none;line-height:1.3}.page-heading .eyebrow,.page-heading .subtitle,.workspace-meta{display:none}.tabs{flex:0 0 auto;padding:4px 24px 12px;margin:0;position:relative;top:auto;background:var(--page)}/* The same full-width shell wraps all views; tables and cards scroll below it. */
.view-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain}
.view-content>.panel:not(#gates){max-width:1248px;margin:0 auto;padding:24px 24px 0}
.view-content>.footer{max-width:1200px;width:calc(100% - 48px);margin:40px auto 0}
.map-view .view-content{display:flex;overflow:hidden}
.map-view #gates{display:flex;flex:1;min-height:0}.map-view .footer{display:none}#preview-banner,#error-banner{flex:0 0 auto;margin:0 24px 8px;padding:8px 12px;font-size:12px}
.satellite-map{height:100%;width:100%;border:0;background:var(--page);min-height:0}.satellite-map .map-tools{left:auto;right:16px;top:16px}.map-view-label{position:absolute;left:16px;top:16px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:13px;z-index:3;pointer-events:none}.map-view-label span{color:var(--muted);padding:0 8px}.map-tools button{padding:0;min-width:44px;min-height:44px}.map-layer.pins{pointer-events:none;overflow:visible}.device-pin{position:absolute;width:48px;height:58px;min-height:44px;padding:0;border:0;border-radius:0;background:none!important;transform:translate(-50%,-100%);z-index:2;pointer-events:auto;overflow:visible;box-shadow:none;color:var(--forest)}.device-pin svg{display:block;width:48px;height:58px;overflow:visible}.pin-body{fill:var(--pin-color,var(--info));stroke:var(--forest);stroke-width:2;transition:fill 140ms ease}.pin-halo{fill:none;stroke:var(--text);stroke-width:7;visibility:hidden}.pin-symbol{fill:none;stroke:var(--forest);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.device-pin.selected,.device-pin:focus-visible{z-index:4}.device-pin.selected .pin-halo,.device-pin:hover .pin-halo,.device-pin:focus-visible .pin-halo{visibility:visible}.device-pin:focus-visible{outline-offset:6px;outline:2px solid var(--lifted);border-radius:8px}.pin-success{--pin-color:var(--success)}.pin-warning{--pin-color:var(--warning)}.pin-muted{--pin-color:var(--stone)}.pin-info{--pin-color:var(--info)}.pin-danger{--pin-color:var(--danger)}.pin-label{position:absolute;top:-36px;left:50%;transform:translateX(-50%);white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis;border:1px solid var(--line);border-radius:8px;padding:6px 10px;background:var(--surface);color:var(--text);font-size:12px;pointer-events:none;display:none}.device-pin.selected .pin-label,.device-pin:hover .pin-label,.device-pin:focus-visible .pin-label{display:block}.list-pin{flex-shrink:0;width:32px;height:40px;display:block}.list-pin svg{width:32px;height:40px;display:block}.map .attribution{font-size:12px;line-height:1.4;text-decoration:none;max-width:100%;min-height:44px;padding:8px 12px;border-top:1px solid var(--line);border-left:1px solid var(--line)}.map .attribution:hover{text-decoration:underline}.satellite-map .map-status{bottom:64px;left:16px;right:72px;background:var(--surface);line-height:1.4}.map-empty{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,calc(100% - 64px));padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:12px}.map-empty span{font-size:14px}
.settings-tabs{display:flex;gap:8px;margin:0 0 20px}.settings-tabs button{flex:1;font-size:14px;min-height:48px;padding:10px 8px}.settings-tabs [aria-selected=true]{background:var(--raised);border-color:var(--stone)}.location-help{font-size:14px;line-height:1.5}.location-picker{height:280px;border:1px solid #66765e;border-radius:12px;cursor:crosshair}.location-picker .map-tools{right:12px;left:auto;top:12px}.location-picker .map-status{bottom:70px;left:8px;right:8px;font-size:12px}.location-picker .attribution{font-size:12px;padding:6px 8px}.picker-crosshair{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:white;text-shadow:0 1px 2px black;font-size:24px;pointer-events:none;z-index:1}.coordinate-inputs{display:grid;grid-template-columns:1fr 1fr;gap:12px}.coordinate-inputs .form-field{margin:16px 0 8px;min-width:0}.coordinate-inputs input{min-width:0}.location-actions{justify-content:space-between}.location-actions button{font-size:14px;min-height:48px}.show-devices{position:absolute;top:16px;left:16px;z-index:4;box-shadow:0 1px 3px #0004}
@media(max-width:1050px) and (min-width:761px){.map-workspace{grid-template-columns:328px minmax(0,1fr)}.sidebar-body{padding:16px}.sidebar-heading{padding:16px}.map-view-label{max-width:calc(100% - 88px)}}
@media(max-width:760px){.map-workspace{display:block}.topbar-inner{padding:4px 16px;min-height:60px}.page-heading{padding:8px 16px}.page-heading h1{font-size:20px}.tabs{padding:4px 16px 8px}.tabs button{min-height:44px}#preview-banner,#error-banner{margin:0 16px 8px}.map-sidebar{position:absolute;left:0;top:0;bottom:0;width:min(364px,calc(100% - 44px));max-width:100%;visibility:hidden;transform:translateX(-100%);z-index:6;box-shadow:4px 0 12px #0005;transition:transform 140ms ease}.map-sidebar.is-open{visibility:visible;transform:translateX(0)}.sidebar-heading{padding:16px;gap:8px}.sidebar-heading h2{font-size:16px}.sidebar-body{padding:16px}.map-sidebar .gate-detail>.card{padding:16px}.map-sidebar .level-value .number{font-size:48px}.map-view-label{display:none}.mobile-only{display:inline-flex}.satellite-map{height:100%!important}.satellite-map .map-status{left:12px;right:12px;bottom:80px}.map .attribution{max-width:100%;font-size:12px}.satellite-map .map-tools{right:12px}.device-pin .pin-label{max-width:164px}.location-picker{height:252px}.location-actions{gap:8px}.location-actions button{padding:10px 12px}.sensor-location-row .button{font-size:13px}.map-sidebar .status{font-size:12px;white-space:normal}.map-sidebar .gate-actions{grid-template-columns:1fr}.map-sidebar .gate-actions .primary-action{grid-column:auto}}
@media(max-width:360px){.page-heading h1{font-size:18px}.settings-tabs button{font-size:13px}.coordinate-inputs{grid-template-columns:1fr;gap:0}.location-actions{flex-direction:column}.location-picker{height:244px}.sidebar-heading{padding:12px}.sidebar-body{padding:12px}.map-sidebar .gate-metrics{grid-template-columns:1fr}.map-sidebar .metric-row{gap:8px}.map-sidebar .metric-row strong{font-size:14px}.map-sidebar .level-value .unit{font-size:18px}}
/* The teardrop tip, rather than the icon's bounding box, is at the coordinate. */
.device-pin{transform:translate(-50%,calc(-100% + 4px))}

/* Content gutters change with screen size, never with the selected tab. */
@media(max-width:760px){
  .view-content>.panel:not(#gates){padding:24px 16px 0}
  .view-content>.footer{width:calc(100% - 32px);margin-top:28px}
}

/* Devices keeps the shared header. Categories and cards scroll independently. */
body.devices-view .view-content{display:flex;overflow:hidden}
body.devices-view .view-content>#sensors{display:flex;flex:1;width:100%;min-height:0;max-width:none;padding:0;margin:0}
body.devices-view .view-content>.footer{display:none}
.devices-workspace{display:grid;grid-template-columns:288px minmax(0,1fr);height:100%;width:100%;min-height:0;position:relative}
.category-sidebar{min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;background:var(--surface);border-right:1px solid var(--line)}
.category-navigation{padding:16px;display:flex;flex-direction:column;gap:8px}
.category-button{display:flex;align-items:center;gap:8px;width:100%;min-height:56px;padding:12px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);text-align:left;font-size:15px;line-height:1.4}
.category-button>span:nth-child(2){flex:1;min-width:0}
.category-button:hover{background:var(--raised)}
.category-button[aria-pressed=true]{background:var(--raised);border-color:var(--line);color:var(--text)}
.category-button[aria-pressed=true] .category-symbol{color:var(--lifted)}
.category-symbol{font-size:22px;width:24px;flex-shrink:0;text-align:center;line-height:1}
.category-count{font-size:12px;font-weight:500;min-width:24px;text-align:center;background:var(--page);border:1px solid var(--line);border-radius:5px;padding:2px 4px}
.category-note{padding:0 24px;margin:12px 0 24px;font-size:12px;color:var(--muted);line-height:1.6}
.devices-content{min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;padding:24px}
.devices-content .sensor-grid{grid-template-columns:repeat(auto-fit,minmax(min(288px,100%),1fr));align-items:start}
.devices-content .sensor-card{max-width:560px;width:100%}
.devices-content .section-heading{align-items:flex-start}
.gate-device-card{display:flex;flex-direction:column}
.gate-card-state{margin-top:24px;min-height:32px}
.gate-card-state .status{font-size:15px;align-items:baseline}
.gate-card-description{font-size:14px;color:var(--muted);line-height:1.6;margin:8px 0 20px;min-height:56px}
.location-source-note{border:1px solid var(--line);border-radius:8px;padding:12px;margin-bottom:16px;background:var(--page);font-size:13px}
.location-source-note p{margin:8px 0 0;color:var(--muted)}
select{font:inherit;color:var(--text);background:var(--page);border:1px solid #66765e;border-radius:8px;min-height:48px;width:100%;padding:10px 12px;outline-offset:4px}
select:focus-visible{outline:2px solid var(--lifted)}
.settings-tabs{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:8px}
.settings-tabs button{min-width:0;padding:10px 4px;font-size:14px}
@media(min-width:1600px){.devices-content .sensor-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1050px) and (min-width:761px){.devices-workspace{grid-template-columns:264px minmax(0,1fr)}.category-navigation{padding:12px}.category-sidebar .sidebar-heading{padding:20px 16px}.category-note{padding:0 16px}}
@media(max-width:760px){
 .devices-workspace{display:block}.devices-content{height:100%;padding:24px 16px}.devices-content .section-heading{gap:12px}.devices-content .section-heading p{font-size:14px}.devices-content .section-heading .button{flex-shrink:0;font-size:13px;padding:10px 12px}
 .category-sidebar{position:absolute;inset:0 auto 0 0;width:min(304px,calc(100% - 44px));max-width:100%;visibility:hidden;transform:translateX(-100%);z-index:6;box-shadow:4px 0 12px #0005;transition:transform 140ms ease}
 .category-sidebar.is-open{visibility:visible;transform:translateX(0)}
 .category-sidebar .sidebar-heading{padding:16px}.category-sidebar .sidebar-heading h2{font-size:18px}.category-sidebar .sidebar-heading .metadata{font-size:12px}
 .category-navigation{padding:12px}.category-button{min-height:56px;font-size:14px}.category-note{padding:0 20px}
 .devices-content .sensor-grid{grid-template-columns:1fr}.devices-content .sensor-card{max-width:none}.devices-content .section-footnote{margin-bottom:16px}
}
@media(max-width:360px){.devices-content .sensor-card{padding:16px}.settings-tabs button{font-size:13px;padding:10px 2px}.category-sidebar .sidebar-heading{padding:12px}.category-sidebar .sidebar-heading h2{font-size:16px}.category-sidebar .sidebar-heading .metadata{max-width:156px}.category-navigation{padding:8px}.category-button{padding:12px 8px}}

/* Requested bright-red alert treatment, deliberately stronger than brand danger. */
:root{--alert:#ff3b30;--alert-ink:#0e120b;--history-series:#6ea9a1}
.warning-icon{display:inline-flex;flex:0 0 auto;width:22px;height:22px;align-items:center;justify-content:center}
.warning-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.status.alert{color:var(--alert);font-weight:700}.pin-alert{--pin-color:var(--alert)}.dot.alert{background:var(--alert)}
.device-alert{display:flex;align-items:flex-start;gap:12px;padding:12px 0;margin-top:12px;border-bottom:1px solid #0e120b55}
.device-alert p{font-size:14px;margin-top:4px;line-height:1.45}.device-alert strong{font-size:16px}.device-alert .warning-icon{margin-top:2px;width:26px;height:26px}
.card.is-alert,.map-sidebar .gate-detail>.card.is-alert,.device-list-row.is-alert{background:var(--alert);border-color:var(--alert);color:var(--alert-ink);--muted:#1c261a;--text:#0e120b;--line:#0e120b55;--success:#0e120b;--warning:#0e120b;--danger:#0e120b;--info:#0e120b}
.is-alert .status.alert{color:var(--alert-ink)}.is-alert .button,.is-alert .icon-button{background:#0e120b;color:#fff;border-color:#0e120b}.is-alert .button:hover,.is-alert .icon-button:hover{background:#283022;color:#fff}.is-alert .fill-track{background:#0e120b33}.is-alert .fill-track span{background:#0e120b}.is-alert .command-note{background:#0e120b14;color:#0e120b}.is-alert button:focus-visible{outline-color:#fff}.is-alert .pin-symbol{stroke:#0e120b}.device-list-row.is-alert:hover{background:#f84c43}
.device-actions{display:flex;gap:8px;margin-top:16px}.history-button{width:100%;font-size:14px}.history-button svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.7}.attention-category .category-symbol{color:var(--alert)}
.alert-fields{border:0;border-top:1px solid var(--line);margin:24px 0 16px;padding:16px 0 0;min-width:0}.alert-fields legend{font-size:17px;font-weight:600;padding:0 12px 0 0}.threshold-inputs{display:grid;grid-template-columns:1fr 1fr;gap:16px}.threshold-inputs .form-field{min-width:0}.alert-fields .check{margin-top:16px}
#settings-general .form-actions{margin-top:24px}.settings-tabs{grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
dialog.history-modal{width:min(980px,calc(100vw - 32px));max-width:980px}.history-modal .modal-body{min-width:0}
.history-controls{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px}.history-ranges{display:flex;gap:8px;flex-wrap:wrap}.history-ranges button{font-size:14px;padding:10px 12px}.history-ranges [aria-pressed=true]{border-color:var(--stone);background:var(--raised);color:var(--text)}
.history-metric{display:flex;flex-direction:column;gap:8px;font-size:13px;min-width:180px}.history-metric select{border:1px solid #66765e;min-height:44px;padding:10px 12px;background:var(--page);color:var(--text);border-radius:8px;width:100%;font:inherit}
.history-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.history-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 16px}.history-summary>div{display:flex;flex-direction:column;gap:8px;min-width:0}.history-summary span{font-size:13px;color:var(--muted)}.history-summary strong{font-size:26px;font-weight:500;font-variant-numeric:tabular-nums}.history-summary small{font-size:14px;color:var(--muted);font-weight:400}.history-chart{width:100%;height:320px;min-width:0;margin-top:16px;touch-action:pan-y;border-radius:8px;background:var(--page);overflow:hidden}.history-chart svg{display:block;max-width:100%;font-family:'Libre Franklin',Arial,Helvetica,sans-serif}.history-chart:focus-visible{outline:2px solid var(--lifted);outline-offset:4px}
.chart-grid{stroke:var(--line);stroke-width:1}.chart-label{fill:var(--muted);font-size:12px}.chart-series{fill:none;stroke:var(--history-series);stroke-width:2;stroke-linejoin:round}.chart-point{fill:var(--history-series)}.chart-threshold{stroke:var(--alert);stroke-width:1.5;stroke-dasharray:7 5}.chart-threshold-label{fill:#ff817b;font-size:12px;paint-order:stroke;stroke:var(--page);stroke-width:4;stroke-linejoin:round}.chart-event{stroke:var(--info);stroke-width:1;stroke-dasharray:2 6;opacity:.8}.chart-crosshair{stroke:var(--text);stroke-width:1;stroke-dasharray:3 4}.chart-empty-text{fill:var(--text);font-size:14px}.history-inspect{min-height:48px;padding:12px 0;color:var(--text);font-size:13px}.chart-legend{display:flex;gap:12px 24px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.chart-legend>span{display:flex;align-items:center;gap:8px}.chart-legend i{width:20px;height:0;border-top:2px solid var(--history-series)}.chart-legend .threshold-line{border-color:var(--alert);border-top-style:dashed}.chart-legend .calibration-line{border-color:var(--info);border-top-style:dotted}.history-note{margin-top:16px;line-height:1.6}.history-data{margin-top:20px}.history-data summary{min-height:44px;cursor:pointer;padding:10px 0;font-size:14px}.history-event-list{font-size:12px;color:var(--muted);margin-bottom:12px}.history-event-list p{margin-top:4px}
@media(max-width:600px){dialog.history-modal{width:calc(100vw - 16px)}.history-controls{flex-direction:column;align-items:stretch;gap:16px}.history-ranges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.history-ranges button{padding:10px 6px;font-size:13px}.history-heading{align-items:flex-start;flex-direction:column;gap:4px}.history-summary{gap:8px}.history-summary strong{font-size:22px}.history-summary small{display:block;font-size:12px}.threshold-inputs{grid-template-columns:1fr;gap:0}.history-chart{height:260px}.history-inspect{min-height:60px}}
@media(prefers-reduced-motion:reduce){.pin-body,.button,.map-sidebar{transition:none}}

.is-alert .sensor-status{display:none}
.map-layer.tiles{z-index:0;isolation:isolate}.map-layer.pins{z-index:2}

/* Capacity and acknowledged alert presentation. */
.volume-settings{border-top:1px solid var(--line);margin-top:28px;padding-top:24px}
.volume-settings>h3{margin-bottom:8px}.capacity-inputs{display:grid;grid-template-columns:minmax(0,2fr) minmax(100px,1fr);gap:12px}.capacity-inputs>*{min-width:0}.capacity-inputs input{width:100%;min-width:0}
.dismiss-alert{margin-top:12px;min-height:44px}.dismissed-note{color:var(--muted);font-size:13px;margin-top:16px;border:1px solid var(--line);border-radius:8px;padding:8px 12px}
.dismissed-note summary{cursor:pointer;min-height:44px;display:flex;align-items:center}.dismissed-note p{margin-top:8px}
.alert-copy{min-width:0}.volume-caption{margin-top:-8px;margin-bottom:12px}.level-value{flex-wrap:wrap}.level-value .volume-number{font-size:clamp(28px,3.5vw,44px);letter-spacing:-1px;overflow-wrap:anywhere;min-width:0;max-width:100%}.level-value .unit{white-space:nowrap}
@media(max-width:380px){.capacity-inputs{grid-template-columns:minmax(0,1fr)}.volume-settings .button{width:100%}.map-sidebar .level-value .volume-number{font-size:32px}}

/* MapLibre controls the camera. Pins retain their state colour and real coordinate. */
.native-map-canvas{position:absolute;inset:0;z-index:0;width:100%;height:100%}
.native-marker{width:48px;height:58px;pointer-events:auto}
.native-marker .device-pin{position:relative;display:block;transform:none;top:auto;left:auto;min-width:48px}
.native-map-canvas .maplibregl-canvas{outline:none}.native-map-canvas .maplibregl-canvas:focus-visible{outline:2px solid var(--lifted);outline-offset:-4px}
.native-map-canvas .maplibregl-canvas-container{cursor:grab}.native-map-canvas .maplibregl-canvas-container:active{cursor:grabbing}

/* Reference UI refresh: light, map-first and field-readable. Behaviour stays unchanged. */
:root{
  color-scheme:light;
  --page:#f4f6f2;
  --surface:#ffffff;
  --raised:#eef1ec;
  --forest:#1c261a;
  --clay:#b77d46;
  --lifted:#9e6838;
  --stone:#aabfa6;
  --text:#1c261a;
  --muted:#5f6a5b;
  --line:#d8ded4;
  --success:#4f7046;
  --warning:#b77d46;
  --danger:#a85643;
  --info:#587b8d;
  --radius:14px;
  --shadow:0 2px 10px rgba(28,38,26,.10);
}
body{background:var(--page);color:var(--text)}
a{color:#355c45}
.topbar{background:var(--forest);border-bottom:0;box-shadow:0 1px 0 rgba(0,0,0,.18)}
.topbar .status{color:#e9efe2}.topbar .status.success{color:#d9efd3}.topbar .status.warning{color:#f2d6a4}.topbar .status.danger{color:#ffc1b6}
.topbar .button.secondary{background:#ffffff10;border-color:#ffffff35;color:#fff}.topbar .button.secondary:hover:not(:disabled){background:#ffffff1c}
.page-heading{background:var(--surface);border-bottom:1px solid var(--line);padding:12px 24px 10px}
.page-heading h1{font-family:'Libre Caslon Text',Georgia,'Times New Roman',serif!important;font-weight:400!important;color:var(--forest)}
.tabs{background:var(--surface);border-bottom:1px solid var(--line);padding:8px 24px 12px;gap:6px}
.tabs button{color:var(--muted);border-color:transparent;border-radius:10px}
.tabs button:hover{background:var(--raised)}
.tabs button[aria-selected=true]{background:#e7ece4;border-color:#ccd5c8;color:var(--forest)}
.tabs button[aria-selected=true] .tab-symbol{color:var(--clay)}
.tab-count,.category-count{background:#fff;border-color:var(--line);color:var(--muted)}
.view-content>.panel:not(#gates){max-width:1360px}
.card,.summary-stat{background:var(--surface);border-color:var(--line);box-shadow:0 1px 3px rgba(28,38,26,.05)}
.sensor-card{padding:20px}
.card-title h3{font-size:17px;color:var(--forest)}
.card-title .metadata{color:var(--muted)}
.icon-button{background:#fff;border-color:var(--line);color:#53604f;border-radius:999px}
.icon-button:hover{background:var(--raised);color:var(--forest)}
.button{background:var(--forest);color:#fff;border-radius:10px;box-shadow:none}
.button:hover:not(:disabled){background:#31432d}
.button.secondary{background:#fff;border-color:#cfd6cc;color:var(--forest)}
.button.secondary:hover:not(:disabled){background:var(--raised)}
.button:disabled{opacity:.48}
.status.success{color:#44653d}.status.warning{color:#986329}.status.danger{color:#944a3a}.status.info{color:#476d80}.status.muted{color:#6e796b}
.category-sidebar{background:#f8faf7;border-right:1px solid var(--line)}
.category-button{color:var(--muted);border-radius:10px}
.category-button:hover{background:#edf1eb}.category-button[aria-pressed=true]{background:#e4ebe1;border-color:#cdd7ca;color:var(--forest)}
.category-button[aria-pressed=true] .category-symbol{color:var(--clay)}
.devices-content{background:var(--page)}
.devices-content .sensor-grid{gap:16px}
.devices-content .sensor-card{max-width:620px}

/* Level cards follow the supplied circular-gauge / KPI-tile reference. */
.level-card-main{display:grid;grid-template-columns:132px minmax(0,1fr);gap:18px;align-items:center;margin-top:18px}
.level-gauge{position:relative;width:124px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;flex-shrink:0}
.level-gauge-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.level-gauge-ring circle{fill:none;stroke-width:14}
.level-gauge-track{stroke:#e8ece6;opacity:1}
.level-gauge-value{stroke:#485943;stroke-linecap:round;transition:stroke-dasharray 160ms ease}
.level-gauge-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:18px}
.level-gauge-inner strong{font-size:19px;line-height:1;font-weight:600;font-variant-numeric:tabular-nums;color:var(--forest);white-space:nowrap}
.level-gauge-inner span{font-size:11px;color:var(--muted);margin-top:6px}
.level-kpi-stack{display:grid;gap:10px;min-width:0}
.level-kpi,.device-kpi{background:#f0f3ef;border:1px solid #edf0eb;border-radius:12px;padding:12px 14px;min-width:0}
.level-kpi>span,.device-kpi>span{display:block;color:var(--muted);font-size:12px}
.level-kpi strong,.device-kpi strong{display:block;color:var(--forest);font-size:20px;line-height:1.2;font-weight:600;margin-top:4px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.level-kpi small{display:block;color:#71806d;font-size:11px;margin-top:5px;line-height:1.35}
.device-status-line{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:14px;margin-top:16px;min-height:44px}
.card-quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.card-quick-actions .history-button{margin:0}.card-quick-actions .button{width:100%}
.card-bottom{margin-top:12px;padding-top:12px}
.device-kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.device-kpi strong{font-size:18px}
.gate-card-state{margin-top:18px}.gate-card-description{min-height:0;margin:12px 0 8px;color:var(--muted)}

/* Map becomes the dominant surface, with a floating control panel like the references. */
.map-workspace{display:block;position:relative;height:100%;width:100%;min-height:0;background:#dfe4dc}
.satellite-map{position:absolute;inset:0;background:#d9dfd7}
.map-sidebar{position:absolute;z-index:6;left:16px;top:16px;bottom:16px;width:min(420px,calc(100% - 112px));min-width:0;overflow:auto;overscroll-behavior:contain;background:#fff;border:1px solid rgba(28,38,26,.16);border-radius:18px;box-shadow:0 8px 26px rgba(28,38,26,.18)}
.sidebar-heading{padding:18px 20px 14px;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:2;border-radius:18px 18px 0 0}
.sidebar-heading h2{font-family:'Libre Caslon Text',Georgia,'Times New Roman',serif;font-size:22px;font-weight:400;color:var(--forest)}
.sidebar-body{padding:14px 16px 20px;background:#fff}
.map-intro{font-size:14px;margin-bottom:16px}
.device-list-row{background:#fff;border-color:var(--line);min-height:78px;padding:10px 12px}
.device-list-row:hover{background:#f1f4ef}
.sidebar-legend{font-size:12px}.map-footnote{color:#6a7666}
.map-sidebar.has-selection .sidebar-heading{display:none}
.map-sidebar.has-selection .sidebar-body{padding:12px}
.map-sidebar.has-selection .back-button{width:auto;min-height:40px;margin:0 0 8px;padding:8px 12px;border-radius:999px;font-size:12px}
.map-sidebar .gate-detail>.card{background:#fff;padding:16px;border:0;border-radius:14px;box-shadow:none}
.map-sidebar .gate-detail h3{font-family:'Libre Caslon Text',Georgia,'Times New Roman',serif;font-size:26px;font-weight:400}
.map-view-label{background:#ffffffea;color:var(--forest);border-color:#d4dad1;box-shadow:var(--shadow);border-radius:12px}
.satellite-map .map-tools{right:18px;top:18px;gap:8px}
.map-tools button{background:#ffffffed;color:#263025;border-color:#cfd6cc;border-radius:14px;box-shadow:var(--shadow);font-size:26px}
.map-tools button:hover{background:#fff}
.map .attribution{background:#ffffffdf;color:#4f5e4b;border-color:#d4dad1}
.satellite-map .map-status{background:#ffffffeb;color:#596655;border-color:#d4dad1}
.show-devices{background:var(--success);color:#fff;border:0;width:56px;height:56px;border-radius:0 0 14px 14px;padding:0;box-shadow:0 4px 12px rgba(28,38,26,.18)}
.show-devices .menu-lines{font-size:30px;line-height:1}.show-devices-label{display:none}

/* Circular field markers derived from the supplied map reference. */
.native-marker{width:44px;height:44px}
.native-marker .device-pin,.device-pin{width:44px;height:44px;min-width:44px;min-height:44px;border-radius:50%;transform:none;padding:4px}
.device-pin svg{width:36px;height:36px}
.pin-body{fill:var(--pin-color,var(--info));stroke:#fff;stroke-width:2.3}
.pin-halo{fill:none;stroke:rgba(255,255,255,.95);stroke-width:6;visibility:hidden}
.pin-symbol{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.device-pin:focus-visible{outline:3px solid var(--clay);outline-offset:2px;border-radius:50%}
.pin-success{--pin-color:#58734c}.pin-warning{--pin-color:#a6723f}.pin-muted{--pin-color:#7f897c}.pin-info{--pin-color:#5e7f8f}.pin-danger{--pin-color:#a85643}
.pin-label{top:-30px;background:#fff;color:var(--forest);border-color:#cfd6cc;box-shadow:var(--shadow)}
.list-pin{width:30px;height:30px}.list-pin svg{width:30px;height:30px}
.device-pin[data-kind="pivot"] .pin-symbol{stroke-width:1.8}

/* Gate detail sheet mirrors the compact gate-open/schedule/device-details hierarchy. */
.gate-panel-card .card-title{padding-bottom:12px;border-bottom:1px solid var(--line)}
.gate-state-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}
.gate-state-banner .status{font-size:14px;color:var(--forest)}
.gate-schedule-section{padding:14px 0 4px}
.gate-section-label{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:#4d5849;margin-bottom:10px}
.schedule-row{width:100%;min-height:52px;border:1px solid var(--line);background:#f5f7f4;color:var(--forest);border-radius:12px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;font-weight:600}
.schedule-row:hover:not(:disabled){background:#edf1eb}.schedule-row:disabled{opacity:.45}
.gate-primary-actions{margin-top:12px}.gate-open-button{width:100%;min-height:50px;background:#4f7046}.gate-open-button:hover:not(:disabled){background:#405e39}
.gate-device-details{border-top:1px solid var(--line);margin-top:14px;padding-top:2px}
.gate-device-details>summary{list-style:none;cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:13px;color:var(--forest)}
.gate-device-details>summary::-webkit-details-marker{display:none}.gate-device-details>summary span:last-child{color:var(--muted);font-size:12px;text-align:right}
.gate-device-details>summary::after{content:'⌄';font-size:16px;color:var(--muted);margin-left:4px}.gate-device-details[open]>summary::after{content:'⌃'}
.gate-metrics{background:#f5f7f4;border:0;border-radius:12px;padding:12px;gap:12px;margin-top:8px}
.gate-metrics>div{padding:6px}.gate-metrics strong{color:var(--forest)}
.gate-coordinates{background:#f8faf7;border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.gate-secondary-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.gate-lock-note{line-height:1.45}
.command-note{background:#f5f7f4;border-color:var(--line)}

/* Modals use the white sheet treatment shown in the schedule references. */
dialog{color:var(--text);background:#fff;border:1px solid #cfd6cc;border-radius:18px;box-shadow:0 20px 60px rgba(28,38,26,.24);width:min(540px,calc(100vw - 24px))}
dialog::backdrop{background:rgba(20,29,18,.52)}
.modal-header{background:#fff;border-bottom:1px solid var(--line);padding:18px 20px 14px;position:sticky;top:0;z-index:2}
.modal-header h2{font-family:'Libre Caslon Text',Georgia,'Times New Roman',serif;font-size:25px;font-weight:400;color:var(--forest)}
.modal-body{padding:16px 20px 20px;background:#fff}
.modal-body p{color:var(--muted)}
.form-field input,select{background:#f5f7f4;color:var(--forest);border-color:#cfd6cc;border-radius:12px}
.form-field>span{color:#3e493a;font-weight:600}.form-field small{color:#6b7768}
.check{background:#f5f7f4;border:1px solid var(--line);border-radius:12px;padding:12px;margin-top:16px}.check input{accent-color:var(--success)}
.form-actions{position:sticky;bottom:-20px;background:#fff;border-top:1px solid var(--line);padding-top:12px;margin-top:18px}
.form-actions .button{min-width:160px;background:#4f7046}
.calibration-snapshot{background:#f5f7f4;border-color:var(--line)}
.toast{background:var(--forest);color:#fff;border-color:#3a4a35}
.settings-tabs [aria-selected=true]{background:#e5ece2;border-color:#bdc9b9}
.history-chart{background:#f8faf7}.chart-label{fill:#667263}.chart-threshold-label{stroke:#fff}.chart-series{stroke:#557b70}
th{background:#eef2ec;color:#5d6959}td{border-color:var(--line)}
.summary-stat strong{color:var(--forest)}

/* Alerts remain deliberately bright red, as previously requested. */
.card.is-alert,.map-sidebar .gate-detail>.card.is-alert,.device-list-row.is-alert{background:var(--alert);border-color:var(--alert);color:var(--alert-ink);--surface:#fff;--muted:#1c261a;--text:#0e120b;--line:#0e120b55}
.is-alert .level-gauge-track{stroke:#0e120b;opacity:.18}.is-alert .level-gauge-value{stroke:#0e120b}.is-alert .level-kpi,.is-alert .device-kpi{background:#ffffff42;border-color:#0e120b24}.is-alert .gate-device-details,.is-alert .gate-state-banner,.is-alert .gate-panel-card .card-title{border-color:#0e120b55}

@media(max-width:900px){
  .map-sidebar{width:min(360px,calc(100% - 96px))}
  .level-card-main{grid-template-columns:116px minmax(0,1fr)}.level-gauge{width:110px}
}
@media(max-width:760px){
  .topbar-inner{min-height:60px}.brand{width:112px;height:44px}
  .page-heading{padding:8px 16px}.tabs{padding:6px 12px 8px}
  .map-sidebar{left:12px;right:12px;top:12px;bottom:12px;width:auto;max-width:none;border-radius:18px;visibility:hidden;transform:translateY(18px);opacity:0;pointer-events:none;transition:transform 150ms ease,opacity 150ms ease}
  .map-sidebar.is-open{visibility:visible;transform:translateY(0);opacity:1;pointer-events:auto}
  .map-sidebar .mobile-only{display:inline-flex}.map-sidebar .sidebar-heading{padding:16px}
  .show-devices{top:0;left:50%;transform:translateX(-50%);display:inline-flex!important}
  .satellite-map .map-tools{right:12px;top:14px}
  .map-tools button{width:54px;height:54px;border-radius:14px}
  .map .attribution{font-size:10px;min-height:34px;padding:6px 8px}
  .level-card-main{grid-template-columns:112px minmax(0,1fr);gap:12px}.level-gauge{width:106px}.level-gauge-inner strong{font-size:17px}
  .map-level-main{grid-template-columns:104px minmax(0,1fr)}.map-level-main .level-gauge{width:98px}
  .gate-secondary-actions{grid-template-columns:1fr}
  dialog{max-height:calc(100dvh - 16px)}
}
@media(max-width:520px){
  .sensor-card{padding:16px}.level-card-main{grid-template-columns:100px minmax(0,1fr);gap:10px}.level-gauge{width:94px}.level-gauge-ring circle{stroke-width:13}.level-gauge-inner{padding:14px}.level-gauge-inner strong{font-size:15px}.level-gauge-inner span{font-size:10px}
  .level-kpi{padding:10px 11px}.level-kpi strong{font-size:17px}.level-kpi small{font-size:10px}
  .card-quick-actions{grid-template-columns:1fr 1fr}.card-quick-actions .button{font-size:12px;padding:9px 8px}
  .device-status-line{align-items:flex-start;flex-direction:column;gap:4px}
  .map-sidebar .gate-detail h3{font-size:24px}.gate-state-banner{align-items:flex-start;flex-direction:column;gap:6px}
  .form-actions .button{width:100%;min-width:0}
}
@media(max-width:360px){
  .level-card-main{grid-template-columns:1fr}.level-gauge{margin:0 auto}.level-kpi-stack{grid-template-columns:1fr 1fr}.level-kpi small{display:none}.level-kpi strong{font-size:15px}.card-quick-actions{grid-template-columns:1fr}
}

/* Pond volume model: known current volume + depth-to-volume relationship. */
.pond-curve-fields,.linear-capacity-fields{margin-top:14px}
.pond-curve-fields{display:grid;gap:14px}
.pond-curve-fields[hidden],.linear-capacity-fields[hidden]{display:none!important}
.equation-input{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-size:14px}
.form-field code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;background:#e8ece6;border-radius:5px;padding:1px 4px;color:var(--forest)}
.pond-model-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#f0f3ef;border:1px solid #e4e9e2;border-radius:12px;padding:12px 14px;margin:14px 0;color:var(--forest)!important}
.pond-model-summary strong{font-size:13px}.pond-model-summary span{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
@media(max-width:520px){.pond-model-summary{align-items:flex-start;flex-direction:column;gap:6px}.pond-model-summary span{font-size:17px}}

/* Restore the original hardware-testing dark palette. The supplied UI references
   guide component shape and interaction only; they do not replace the site colours. */
:root{
  color-scheme:dark;
  --page:#0e120b;
  --surface:#1a2316;
  --raised:#222d1d;
  --forest:#1c261a;
  --clay:#b77d46;
  --lifted:#c8965f;
  --stone:#aabfa6;
  --text:#e9efe2;
  --muted:#a6bba1;
  --line:#394632;
  --success:#7faa74;
  --warning:#d2a85a;
  --danger:#d08a6f;
  --info:#8fb0c4;
  --shadow:0 2px 10px rgba(0,0,0,.28);
}
body{background:var(--page);color:var(--text)}
a{color:var(--stone)}
.page-heading{background:var(--page);border-color:var(--line)}
.page-heading h1{color:var(--text)}
.tabs{background:var(--page);border-color:var(--line)}
.tabs button{color:var(--muted)}
.tabs button:hover{background:var(--raised)}
.tabs button[aria-selected=true]{background:var(--raised);border-color:var(--line);color:var(--text)}
.tabs button[aria-selected=true] .tab-symbol{color:var(--lifted)}
.tab-count,.category-count{background:var(--page);border-color:var(--line);color:var(--muted)}
.card,.summary-stat{background:var(--surface);border-color:var(--line);box-shadow:none}
.card-title h3{color:var(--text)}
.icon-button{background:transparent;border-color:var(--line);color:var(--muted)}
.icon-button:hover{background:var(--raised);color:var(--text)}
.button{background:var(--clay);color:var(--forest)}
.button:hover:not(:disabled){background:var(--lifted)}
.button.secondary{background:transparent;border-color:var(--line);color:var(--text)}
.button.secondary:hover:not(:disabled){background:var(--raised)}
.status.success{color:var(--success)}.status.warning{color:var(--warning)}.status.danger{color:var(--danger)}.status.info{color:var(--info)}.status.muted{color:var(--muted)}
.category-sidebar{background:var(--surface);border-color:var(--line)}
.category-button{color:var(--muted)}
.category-button:hover{background:var(--raised)}
.category-button[aria-pressed=true]{background:var(--raised);border-color:var(--line);color:var(--text)}
.category-button[aria-pressed=true] .category-symbol{color:var(--lifted)}
.devices-content{background:var(--page)}

/* Keep the new round level indicator on the original dark-green palette, with the Ag Assist clay accent. */
.level-gauge-track{stroke:#0e120b;opacity:.82}
.level-gauge-value{stroke:var(--clay)}
.level-gauge-inner strong{color:var(--text)}
.level-gauge-inner span{color:var(--muted)}
.level-kpi,.device-kpi{background:var(--raised);border-color:var(--line)}
.level-kpi>span,.device-kpi>span{color:var(--muted)}
.level-kpi strong,.device-kpi strong{color:var(--text)}
.level-kpi small{color:var(--muted)}

/* Dark treatment for the new map-first panels and controls. */
.map-workspace{background:var(--page)}
.map-sidebar{background:var(--surface);border-color:var(--line);box-shadow:0 8px 26px rgba(0,0,0,.35)}
.sidebar-heading{background:var(--surface);border-color:var(--line)}
.sidebar-heading h2{color:var(--text)}
.sidebar-body{background:var(--surface)}
.device-list-row{background:var(--surface);border-color:var(--line)}
.device-list-row:hover{background:var(--raised)}
.map-footnote{color:var(--muted)}
.map-sidebar .gate-detail>.card{background:var(--surface)}
.map-view-label{background:rgba(26,35,22,.94);color:var(--text);border-color:var(--line);box-shadow:var(--shadow)}
.map-tools button{background:rgba(26,35,22,.96);color:var(--text);border-color:var(--line);box-shadow:var(--shadow)}
.map-tools button:hover{background:var(--raised)}
.map .attribution{background:rgba(14,18,11,.92);color:var(--muted);border-color:var(--line)}
.satellite-map .map-status{background:rgba(26,35,22,.95);color:var(--muted);border-color:var(--line)}
.show-devices{background:var(--clay);color:var(--forest)}
.pin-label{background:var(--surface);color:var(--text);border-color:var(--line);box-shadow:var(--shadow)}

.gate-state-banner .status{color:var(--text)}
.gate-section-label{color:var(--muted)}
.schedule-row{background:var(--raised);color:var(--text);border-color:var(--line)}
.schedule-row:hover:not(:disabled){background:#2a3824}
.gate-open-button{background:var(--success);color:var(--forest)}
.gate-open-button:hover:not(:disabled){background:#91ba86}
.gate-device-details>summary{color:var(--text)}
.gate-metrics{background:var(--raised)}
.gate-metrics strong{color:var(--text)}
.gate-coordinates{background:var(--page);border-color:var(--line)}
.command-note{background:var(--page);border-color:var(--line)}

/* Dialogs and settings retain the new geometry but the original dark surfaces. */
dialog{color:var(--text);background:var(--surface);border-color:var(--line);box-shadow:0 20px 60px rgba(0,0,0,.55)}
dialog::backdrop{background:rgba(0,0,0,.65)}
.modal-header{background:var(--surface);border-color:var(--line)}
.modal-header h2{color:var(--text)}
.modal-body{background:var(--surface)}
.form-field input,select{background:var(--page);color:var(--text);border-color:var(--line)}
.form-field>span{color:var(--text)}.form-field small{color:var(--muted)}
.check{background:var(--page);border-color:var(--line)}.check input{accent-color:var(--clay)}
.form-actions{background:var(--surface);border-color:var(--line)}
.form-actions .button{background:var(--clay);color:var(--forest)}
.calibration-snapshot{background:var(--page);border-color:var(--line)}
.toast{background:var(--raised);color:var(--text);border-color:var(--line)}
.settings-tabs [aria-selected=true]{background:var(--raised);border-color:var(--line)}
.history-chart{background:var(--page)}.chart-label{fill:var(--muted)}.chart-threshold-label{stroke:var(--page)}.chart-series{stroke:var(--stone)}
th{background:var(--raised);color:var(--muted)}td{border-color:var(--line)}
.summary-stat strong{color:var(--text)}
.form-field code{background:var(--raised);color:var(--text)}
.pond-model-summary{background:var(--raised);border-color:var(--line);color:var(--text)!important}

/* Alert red remains intentionally high contrast. */
.card.is-alert,.map-sidebar .gate-detail>.card.is-alert,.device-list-row.is-alert{--surface:#fff;--muted:#1c261a;--text:#0e120b;--line:#0e120b55}

/* Pivot trackers */
.pin-symbol-fill{fill:#fff;stroke:none}
.pivot-card-state{margin-top:18px;min-height:32px}.pivot-card-state .status{font-size:15px}
.pivot-device-card .device-kpi-grid{margin-top:12px}
.pivot-position-note{display:flex;flex-direction:column;gap:4px;padding:12px 14px;margin:4px 0 16px;background:var(--raised);border:1px solid var(--line);border-radius:12px}
.pivot-position-note span,.pivot-position-note small{font-size:12px;color:var(--muted)}.pivot-position-note strong{font-size:14px;font-weight:600;color:var(--text);overflow-wrap:anywhere}
.pivot-map-readings{display:grid;gap:10px;margin-top:14px}.pivot-map-readings>div{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--raised)}.pivot-map-readings span,.pivot-map-readings small{display:block;color:var(--muted);font-size:12px}.pivot-map-readings strong{display:block;color:var(--text);font-size:14px;font-weight:600;margin-top:4px;overflow-wrap:anywhere}.pivot-map-readings small{margin-top:4px}
.pivot-legend-line{display:inline-block;width:24px;height:4px;border-radius:999px;background:var(--clay);box-shadow:0 0 0 2px var(--forest)}
@media(max-width:360px){.pivot-device-card .device-kpi-grid{grid-template-columns:1fr 1fr}.pivot-device-card .device-kpi strong{font-size:15px}}

.danger-action{border-color:var(--danger);color:var(--danger)}.location-actions{flex-wrap:wrap}.advanced-settings{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--raised)}.advanced-settings summary{cursor:pointer;font-weight:600}.advanced-settings[open] summary{margin-bottom:12px}

/* Keep destructive/location-secondary actions visually quieter than the primary save action. */
.form-actions .button.secondary{background:transparent;border-color:var(--line);color:var(--text)}
.form-actions .button.secondary:hover:not(:disabled){background:var(--raised)}
.form-actions .button.danger-action{background:transparent;border-color:var(--danger);color:var(--danger)}
.form-actions .button.danger-action:hover:not(:disabled){background:rgba(208,138,111,.12)}
.pivot-legend-line.on{background:#4eb9f0;box-shadow:0 0 0 2px var(--forest)}
.pivot-legend-line.off{background:#fff;box-shadow:0 0 0 2px var(--forest)}
