#monitor-open{border:1px solid #b8ccc3;border-radius:4px;padding:10px 14px;background:#eef3ec;color:#173e40}
.header-actions{display:flex;align-items:center;gap:18px}
#monitor-open[aria-current=page]{background:#173e40;color:#fff;border-color:#173e40}
#monitor-panel[hidden],#monitor-overlay[hidden]{display:none!important}
.monitor-active .explorer{grid-template-columns:342px minmax(0,1fr);height:calc(100dvh - 88px);min-height:650px}
.monitor-active .story-panel{display:none}
.monitor-active .viewport{min-width:0}
.monitor-active .viewport>.view-top,.monitor-active .viewport>.caption,.monitor-active .viewport>.layer-controls,.monitor-active .viewport>.legend,.monitor-active #labels-layer,.monitor-active #navigation-controls,.monitor-active .viewport>.view-bottom,.monitor-active .viewport>.render-status,.monitor-active .viewport>.quality-status{display:none!important}
.monitor-active .view-tools{top:193px;right:19px;z-index:6}
.monitor-active #view-side{display:none}
.monitor-active .location{display:none}
.monitor-active .masthead .header-actions{gap:18px}
#monitor-panel{overflow:auto;background:#f7f7f1;padding:28px 23px 22px;border-right:1px solid #d5dfd5;scrollbar-width:thin;scrollbar-color:#bdcfc4 transparent}
.monitor-heading h1{display:block;font:34px/1.05 var(--display);letter-spacing:-.035em;margin:14px 0 13px}
.monitor-heading h1 em{color:#2d7467;font-weight:400}
.monitor-heading p{font-size:11px;line-height:1.6;color:#647b72;margin:0 0 19px}
.monitor-eyebrow{font-size:8px;letter-spacing:.16em;font-weight:650;color:#61796e}
.monitor-mode{display:flex;gap:3px;padding:4px;border:1px solid #d4dfd5;border-radius:6px;background:#eaf0e7}
.monitor-mode button{flex:1;min-height:35px;background:transparent;font-size:11px;border-radius:3px}
.monitor-mode button[aria-pressed=true]{background:#fff;box-shadow:0 1px 4px #173e4012;font-weight:650}
.monitor-feed-status{font-size:8px;letter-spacing:.09em;color:#8a651e;line-height:1.6;margin:10px 0 25px;min-height:13px}
.monitor-section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.monitor-section-heading h2{font-size:12px;font-weight:650;margin:0}
#monitor-count{font-size:10px;background:#e2eade;border-radius:3px;padding:3px 7px}
.monitor-add{display:flex;gap:7px;margin:13px 0}
.monitor-add button{background:#e9efE5;border:1px solid #c7d7c9;border-radius:4px;min-height:39px;flex:1;font-size:11px}
#monitor-panel button:disabled,#monitor-overlay button:disabled,#monitor-overlay input:disabled{opacity:.45;cursor:default}
.monitor-empty{padding:28px 15px;text-align:center;border:1px dashed #bdcdbf;border-radius:6px;margin-bottom:22px}
.monitor-empty>span{font-size:32px;color:#478778;display:block;margin-bottom:12px}
.monitor-empty strong{font:23px var(--display);font-weight:400}
.monitor-empty p{font-size:11px;color:#657e70;line-height:1.65;margin:10px 0 19px}
.monitor-empty button{background:#173e40;color:#fff;border-radius:4px;padding:12px;font-size:10px;min-height:42px;width:100%}
.monitor-sensor-list{display:flex;flex-direction:column;gap:5px}
.monitor-sensor-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;padding:12px 10px;background:#fff9;border:1px solid #dce4d9;border-radius:5px;min-height:62px}
.monitor-sensor-row[aria-pressed=true]{background:#e2eee5;border-color:#6c9e8c}
.sensor-dot{height:7px;width:7px;display:inline-block;background:#187d78;border-radius:50%;box-shadow:0 0 0 3px #187d7815}
.sensor-dot.level{background:#377bd1;box-shadow:0 0 0 3px #377bd115}
.monitor-sensor-row strong{font-size:11px;font-weight:650;display:block;letter-spacing:.025em}
.monitor-sensor-row small{display:block;font-size:9px;color:#687f73;margin-top:5px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:172px}
.sensor-row-value{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
.monitor-detail{border-top:1px solid #d3ddd2;margin-top:22px;padding-top:20px}
.monitor-reading-status{font-size:7px;letter-spacing:.04em;color:#7d6b45;background:#ece4d1;padding:4px 6px;border-radius:3px;white-space:nowrap}
.monitor-reading-status[data-status=recent]{color:#315e5b;background:#d9e9e3}
#monitor-detail-name{font-size:10px;color:#5a7468;margin:9px 0 14px;overflow-wrap:anywhere}
.monitor-values{display:flex;gap:9px}
.monitor-values>div{flex:1;border:1px solid #d9e2d6;border-radius:4px;padding:11px 9px;background:#fff8}
.monitor-values span{display:block;font-size:9px;color:#61786c}
.monitor-values strong{display:block;margin-top:7px;font-size:20px;font-weight:500;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.monitor-chart-heading{display:flex;justify-content:space-between;gap:8px;font-size:8px;color:#6b8175;margin:17px 0 7px}
#monitor-chart{width:100%;height:86px;display:block}
#monitor-chart[hidden]{display:none}
#monitor-last-reading{display:block;color:#6a7f75;font-size:8px;line-height:1.6;margin:8px 0}
.monitor-detail-actions{display:flex;justify-content:space-between;gap:5px;margin:11px 0}
.monitor-detail-actions button{font-size:9px;padding:10px 6px;background:transparent;border-bottom:1px solid #c6d7ca;min-height:36px}
#sensor-delete{color:#8e5946}
.sensor-editor{margin-top:18px;background:#fff;border:1px solid #a5c1ae;border-radius:6px;padding:15px}
.sensor-editor label{display:block;font-size:9px;line-height:1.5;color:#577063;margin-top:13px}
.sensor-editor input,.sensor-editor select{display:block;margin-top:5px;width:100%;min-width:0;padding:10px 8px;background:#f5f7f0;border:1px solid #cddbcf;border-radius:3px;color:#173e40;font:12px system-ui}
.sensor-editor input:read-only{color:#718679}
.sensor-form-row{display:grid;grid-template-columns:1.1fr 1fr;gap:10px}
#sensor-cancel{background:none;font-size:24px;min-width:30px}
#sensor-pick{display:block;width:100%;background:#e6efe3;border:1px solid #c3d4c3;border-radius:4px;font-size:11px;padding:12px;margin-top:15px}
#sensor-pick[aria-pressed=true]{background:#173e40;color:#fff}
#sensor-position-status{font-size:9px;line-height:1.6;color:#637d6d;margin:9px 0}
#sensor-coordinates{margin:13px 0}
#sensor-coordinates summary{font-size:9px;color:#517262;cursor:pointer;min-height:25px}
.sensor-coordinate-grid{display:grid;grid-template-columns:1fr;gap:1px}
.sensor-coordinate-grid label{margin-top:5px}
#sensor-reference-field small{display:block;font-size:8px;color:#718276;line-height:1.5;margin-top:6px}
#sensor-reference-field[hidden]{display:none}
#sensor-form-error{font-size:10px;line-height:1.5;color:#a54c37}
#sensor-save{background:#173e40;color:#fff;border-radius:4px;min-height:42px;width:100%;font-size:11px}
.monitor-storage{padding-top:18px;border-top:1px solid #d7e1d5;margin-top:23px}
#monitor-save-status{display:block;font-size:9px;line-height:1.6;color:#607b6a}
#monitor-save-status[data-available=false]{color:#9a542c}
.monitor-storage>div{display:flex;gap:20px;margin:7px 0}
.monitor-storage button{font-size:10px;min-height:35px;background:none;padding:0;border-bottom:1px solid #cad8c9}
.monitor-storage>small{display:block;font-size:8px;line-height:1.65;color:#7a8c7e}
#monitor-message{font-size:10px;line-height:1.6;color:#417564;overflow-wrap:anywhere}
.monitor-back{display:inline-block;margin-top:6px;font-size:10px;padding:9px 0;color:#53786a;text-decoration:none}
#monitor-overlay{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.monitor-view-heading{position:absolute;top:25px;left:27px;right:27px;display:flex;justify-content:space-between;align-items:center;gap:14px}
.monitor-view-heading h2{font:30px var(--display);letter-spacing:-.025em;font-weight:400;margin:8px 0 0}
#monitor-view-badge{font-size:8px;letter-spacing:.1em;padding:8px 11px;background:#f7f2e4ed;color:#806231;border:1px solid #dccaa0;border-radius:4px;white-space:nowrap}
.monitor-kpis{position:absolute;top:109px;left:27px;right:75px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:760px;gap:10px}
.monitor-kpis>div{background:#f9faf3ed;border:1px solid #d4dfd4;border-radius:5px;padding:13px 16px;backdrop-filter:blur(8px)}
.monitor-kpis>div>span{display:block;font-size:9px;color:#637b6f}
.monitor-kpis strong{font:29px var(--display);font-variant-numeric:tabular-nums;letter-spacing:-.025em;display:block;margin:6px 0 3px}
.monitor-kpis strong small{font:17px var(--display);color:#557c72}
.monitor-kpis>div>small{font-size:8px;color:#6d8276;display:block;line-height:1.6}
#monitor-marker-layer{position:absolute;inset:0;pointer-events:none}
.monitor-marker{position:absolute;transform:translate(-50%,-100%);pointer-events:auto;white-space:nowrap;padding:9px 11px;min-height:36px;background:#f6fbf2;color:#11635b;border:1px solid #3c8a79;box-shadow:0 3px 12px #173e4024;border-radius:5px;font-size:10px;font-weight:650;letter-spacing:.025em}
.monitor-marker:after{content:'';position:absolute;bottom:-6px;left:calc(50% - 5px);width:8px;height:8px;transform:rotate(45deg);background:inherit;border-right:1px solid #3c8a79;border-bottom:1px solid #3c8a79}
.monitor-marker.level{color:#2e62a2;border-color:#5b88bf}
.monitor-marker.level:after{border-color:#5b88bf}
.monitor-marker[aria-pressed=true]{color:white;background:#17665b;z-index:2}
.monitor-marker.level[aria-pressed=true]{background:#3064a4}
.monitor-marker[hidden]{display:none}
.monitor-flow-card{position:absolute;right:27px;bottom:50px;width:334px;background:#f8faf2f5;border:1px solid #cddccf;border-radius:8px;padding:20px 21px;pointer-events:auto;box-shadow:0 8px 34px #1e433818;backdrop-filter:blur(10px)}
.monitor-flow-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}
.monitor-flow-heading h3{font:22px/1.15 var(--display);font-weight:400;letter-spacing:-.03em;margin:7px 0 0;max-width:225px}
#monitor-flow-output{font-size:13px;color:#52816b;white-space:nowrap;font-variant-numeric:tabular-nums}
#monitor-flow-range{width:100%;margin:18px 0 2px;height:20px;accent-color:#1c7467;cursor:pointer}
.monitor-flow-scale{display:flex;justify-content:space-between;font-size:8px;color:#6c8173}
.monitor-flow-actions{display:flex;gap:9px;margin-top:16px}
.monitor-flow-actions button{min-height:41px;font-size:10px;border-radius:4px;padding:10px 11px}
#monitor-flood{background:#173e40;color:#fff;flex:1}
#monitor-flow-reset{background:#e6eddf;color:#41614f}
#monitor-flow-note{font-size:9px;line-height:1.6;color:#758575;margin:11px 0 0}
.monitor-view-footer{position:absolute;bottom:22px;left:27px;right:27px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:.1em;color:#607c6c}
#monitor-pick-hint{position:absolute;top:220px;left:50%;transform:translateX(-50%);width:min(440px,calc(100% - 100px));padding:15px 18px;border-radius:5px;background:#173e40f0;color:#fff;line-height:1.6;font-size:12px;text-align:center;z-index:10;box-shadow:0 4px 20px #173e4030}
.monitor-picking #scene{cursor:crosshair}
.monitor-picking .monitor-marker{pointer-events:none}
.monitor-picking .monitor-flow-card{opacity:.3;pointer-events:none}
#monitor-panel button:focus-visible,#monitor-overlay button:focus-visible,#monitor-panel input:focus-visible,#monitor-panel select:focus-visible{outline:2px solid #ca9f53;outline-offset:3px}
@media(min-width:761px) and (max-height:850px){.monitor-heading h1{font-size:31px;margin:10px 0}.monitor-heading p{margin-bottom:13px}.monitor-feed-status{margin-bottom:17px}#monitor-panel{padding-top:22px}.monitor-sensor-row{min-height:55px;padding:9px}.monitor-flow-card{padding:16px 19px}}
@media(max-width:1100px) and (min-width:761px){.monitor-active .explorer{grid-template-columns:300px minmax(0,1fr)}#monitor-panel{padding-left:18px;padding-right:18px}.monitor-heading h1{font-size:32px}.monitor-kpis{left:18px;right:18px;gap:6px}.monitor-kpis>div{padding:10px}.monitor-kpis strong{font-size:25px}.monitor-flow-card{right:18px;width:300px}.monitor-view-heading{left:18px;right:18px}.monitor-view-heading h2{font-size:26px}.monitor-view-footer span:last-child{display:none}.monitor-active .header-actions{gap:10px!important}}
@media(max-width:760px){
  #monitor-open{padding:8px 6px;font-size:9px}.header-actions{gap:7px}
  #numbers-open,#sources-open{font-size:9px}
  #numbers-open span,#sources-open span{display:none}
  .monitor-active #numbers-open,.monitor-active #sources-open{display:none}
  .monitor-active .explorer{display:flex;flex-direction:column;min-height:0;height:auto}
  .monitor-active .viewport{order:0;height:730px;min-height:730px;border-bottom:1px solid #cfdbcd}
  #monitor-panel{order:1;overflow:visible;border:0;padding:25px 22px 32px}
  .monitor-heading h1{display:block;font-size:34px}
  .monitor-heading p{display:block}.monitor-heading h1 br{display:none}.monitor-heading h1 em{margin-left:5px}
  .monitor-view-heading{top:18px;left:17px;right:17px}
  .monitor-view-heading h2{font-size:24px;margin-top:7px}
  .monitor-view-heading .monitor-eyebrow{font-size:7px}
  #monitor-view-badge{font-size:7px;padding:7px}
  .monitor-kpis{top:86px;left:15px;right:15px;gap:5px;grid-template-columns:1.15fr .8fr 1.1fr}
  .monitor-kpis>div{padding:10px 8px}
  .monitor-kpis>div>span{font-size:8px;line-height:1.4;min-height:22px}
  .monitor-kpis strong{font-size:25px;margin:3px 0}
  .monitor-kpis>div>small{font-size:7px;min-height:23px}
  .monitor-active .view-tools{right:12px;top:208px;gap:4px}
  .monitor-active .view-tools button{width:34px;height:35px}
  .monitor-flow-card{left:15px;right:15px;bottom:38px;width:auto;padding:15px 16px}
  .monitor-flow-heading h3{font-size:21px;max-width:none}
  #monitor-flow-range{margin-top:13px}
  .monitor-flow-actions{margin-top:11px}
  .monitor-view-footer{left:17px;right:17px;bottom:15px;font-size:6px}
  .monitor-view-footer span:last-child{display:none}
  .monitor-marker{padding:8px;min-height:34px;font-size:9px}
  #monitor-pick-hint{top:212px;width:calc(100% - 95px);font-size:11px;padding:12px}
  .monitor-heading h1{max-width:400px}
  .monitor-sensor-row small{max-width:235px}
  .sensor-coordinate-grid{grid-template-columns:1fr 1fr}.sensor-coordinate-grid label:last-child{grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce){#monitor-panel *{scroll-behavior:auto!important}}
.monitor-detail-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.monitor-detail-actions button{border:1px solid #c6d7ca;border-radius:5px;background:#f6faf3;min-height:40px;font-size:10px;line-height:1.45;padding:9px}
#sensor-reposition{background:#226b52;color:white;border-color:#226b52}
#sensor-delete{color:#a33e36;border-color:#e6c8c2;background:#fff7f4}
.sensor-lifecycle-note{font-size:10px;line-height:1.65;color:#61796c;margin:9px 0 16px}
.sensor-removal-notice{margin:15px 0;padding:13px;border:1px solid #d6c993;border-radius:6px;background:#fff9e8;font-size:11px;line-height:1.65;color:#675a32}
.sensor-removal-notice button{display:block;margin-top:9px;padding:9px 12px;border:1px solid #c9b56e;border-radius:4px;background:white;color:#675a32;font-size:11px}
#monitor-open-storage{display:block;margin-top:10px;text-align:left;color:#226b52;font-weight:600}
