/* Shared operations workspace. Instrument and plot internals live in gauges/charts.css. */
body:has(#portal:not([hidden])){background:#f2f5f7;background-image:none;color:#192833}
#portal{--ink:#192833;--muted:#617381;--line:#dfe6eb;--teal:#a74816;--light:#f9eee7;--navy:#14212d;max-width:1440px;margin-top:28px;padding-inline:30px}
body:has(#portal:not([hidden])) .masthead{border-bottom-color:#dfe6eb;box-shadow:0 2px 12px #14212d03}
body:has(#portal:not([hidden])) .portal-label{color:#607280;border-color:#dfe6eb;letter-spacing:1.8px}
#portal .workspace-heading{position:relative;border:1px solid #253743;border-radius:20px;background:linear-gradient(115deg,#14212d,#1d303d);padding:30px 34px;box-shadow:0 10px 28px #14212d0b;overflow:hidden}
#portal .workspace-heading:before{content:"";position:absolute;inset-block:23px;inset-inline-start:0;width:3px;background:#df814a;border-radius:3px}
#portal .workspace-heading h1{color:#f4f7f9;font-size:34px;letter-spacing:-.8px}
#portal .workspace-heading .eyebrow{color:#e9aa7f;font-size:10px;letter-spacing:1.8px;margin-bottom:10px}
#portal .workspace-heading .muted,#portal .site-switch{color:#bbcad3}
#portal .workspace-heading .site-switch select{background:#223643;border-color:#42545f;color:#f4f7f9;min-height:44px}
#portal .workspace-heading .audience-switch{background:#0e1a2455;border-color:#40515e}
#portal .workspace-heading .audience-switch button{color:#c0cdd6;min-height:44px}
#portal .workspace-heading .audience-switch button[aria-pressed=true]{background:#eff4f6;color:#1b2a35;box-shadow:0 2px 8px #07141e40}
#portal .tabs{gap:30px;border-color:#d4dfe5;margin-bottom:22px}
#portal .tabs button{color:#576b79;font-size:14px;min-height:50px}
#portal .tabs button.selected{color:#963d10;border-color:#c65b20}
#portal .panel{border-color:#dfe6eb;background:#fff;border-radius:16px;box-shadow:0 3px 16px #16253004}
#portal .toolbar{padding:19px 24px;gap:22px}
#portal .toolbar h2{font-size:20px;color:#1b2b36}
#portal .toolbar .muted{color:#637582}
#portal .segmented{background:#edf2f5;border:1px solid #e1e8ed;border-radius:10px;padding:4px;gap:4px}
#portal .segmented button{color:#5f7180;min-height:38px;font-size:12px;border-radius:7px}
#portal .segmented button.selected{color:#fff;background:#243b4a;box-shadow:0 2px 5px #14212d14}
#portal input,#portal select,#portal textarea{border-color:#ccd7df;color:#213541;background:#fff}
#portal .date-controls input,#portal .date-controls .secondary{min-height:42px;border-radius:8px}
#portal .date-controls label{color:#627581}
#portal .secondary{color:#243b4a;background:#edf2f5;border:1px solid #dce5eb;border-radius:9px;min-height:42px}
#portal .secondary:hover{background:#e3ebf0;border-color:#b8c9d5}
#portal .text-button{color:#97400f}
#portal .text-button:hover{background:#f8eee7}
#portal .data-status{padding:7px 12px;margin:10px 0 24px;border:1px solid #e0e7ec;border-radius:10px;background:#eaf0f480;color:#536977;font-size:12px;line-height:1.7}
#portal .status-dot{box-shadow:0 0 0 3px #c18b3215;background:#b18434}
#portal .status-dot.live{box-shadow:0 0 0 3px #26847314;background:#268473}
#portal .energy-heading{margin-top:32px;margin-bottom:17px}
#portal .section-heading h2,#portal .chart-controls h2,#portal .summary-heading h2{color:#1a2a35;letter-spacing:-.45px}
#portal .section-heading .eyebrow{color:#a24b1d;font-size:10px;letter-spacing:1.5px}
#portal .section-heading .muted,#portal .chart-controls .muted,#portal .summary-heading .muted{color:#617381}
#portal .chart-controls{padding:22px 25px;gap:17px 25px;margin-top:30px}
#portal .chart-mode-select legend,#portal .module-select legend{color:#536a79;font-size:12px}
#portal .module-option{border-color:#d5e0e7;background:#fff;color:#243b4a;border-radius:10px;box-shadow:0 1px 3px #14212d03}
#portal .module-option:has(input:checked){background:#edf3f6;border-color:#7b99ad}
#portal .module-option input{accent-color:#a24b1d}
#portal .chart-controls-note{color:#627480;border-color:#e3eaee;line-height:1.7}
#portal .average-chart-legend,#portal .module-select #module-select-hint{color:#5d7382}
#portal .sensor-detail{border-color:#dce5eb;padding-top:22px;margin-top:28px}
#portal .sensor-detail>summary{color:#243b4a}
#portal .sensor-detail>summary:before{color:#b85825}
#portal .sensor-detail>summary .muted,#portal #chart-caption,#portal #period-chart-caption{color:#576b79}
#portal .chart-grid{gap:20px;align-items:start}
#portal .finance-card{background:#fff;border:1px solid #dfe6eb;border-radius:16px;box-shadow:0 3px 16px #14212d04;padding:24px 27px}
#portal .finance-card.charging{border-block-start:3px solid #3e88b5;background:#fff}
#portal .finance-card.steam{border-block-start:3px solid #c97742;background:#fff}
#portal .finance-card-heading h3{color:#263b48}
#portal .finance-badge{color:#536a7b;background:#f0f5f8;border-color:#dce6ee;border-radius:6px}
#portal .charging .finance-badge{color:#246080;background:#edf5fa;border-color:#cde0eb}
#portal .finance-value{color:#192c39}
#portal .charging .finance-value{color:#276b94}
#portal .finance-value strong{font-weight:700;letter-spacing:-1px}
#portal .finance-value>span,#portal .finance-status,#portal .finance-period{color:#607383}
#portal .finance-status.partial{color:#8a5c22}
#portal .finance-card-bottom{border-color:#e5ebef;color:#657887}
#portal .finance-method,#portal .economics-method{color:#576b79}
#portal .finance-details,#portal .economics-settings,#portal .data-details{border-color:#dfe6eb;background:#fff;border-radius:14px}
#portal .finance-details>summary,#portal .economics-settings>summary,#portal .data-details>summary{color:#2b414f}
#portal .finance-hour-controls{border-color:#e3eaef}
#portal .economics-card{border-color:#dfe6eb;background:#fff;border-radius:16px;box-shadow:0 3px 16px #14212d03}
#portal .economics-card.clean{background:#f4f9f7;border-color:#d1e4de}
#portal .economics-card.mazut{background:#edf2f5}
#portal .economics-label{color:#29404c}
#portal .economics-value{color:#233947}
#portal .economics-card.savings:not(.negative){background:#193b34;color:#f2faf7;border-color:#294b42}
#portal .economics-card.savings:not(.negative) .economics-value,#portal .economics-card.savings:not(.negative) .economics-label{color:inherit}
#portal .is-partial .economics-card.savings,#portal .economics-card.savings.negative{background:#fff5e7;border-color:#e6d1ac;color:#78551f}
#portal .is-partial .economics-card.savings .economics-value,#portal .is-partial .economics-card.savings .economics-label,#portal .economics-card.savings.negative .economics-value,#portal .economics-card.savings.negative .economics-label{color:inherit}
#portal .economics-card-footer{border-color:#dce6e9}
#portal .savings .economics-card-footer{border-color:#ffffff25}
#portal .is-partial .savings .economics-card-footer,#portal .savings.negative .economics-card-footer{border-color:#e6d1ac}
#portal .economics-warning{border-color:#e6d1ac;background:#fff8ec;color:#7f5921}
#portal .emissions-panel{background:#edf6f2;border-color:#cfe1d9;border-radius:17px}
#portal .emissions-intro h3{color:#254d41}
#portal .emissions-stat strong{color:#21634f}
#portal .emissions-stat.avoided{border-color:#c6dbd2}
#portal .emissions-status{border-color:#d0e2d9}
#portal .table-wrap,#portal .chart-table{border:1px solid #e1e8ed;border-radius:10px}
#portal th{background:#edf3f6;color:#536b7b;border-color:#dce6ed}
#portal td{border-color:#e7edf1}
#portal tbody tr:nth-child(even){background:#f8fafb}
#portal .financial-cell-note,#portal .financial-time{color:#576b79}
#portal .action-metric,#portal .mw-stat{border-color:#dfe6eb;background:#fff;box-shadow:0 3px 12px #14212d03}
#portal .action-metric.urgent,#portal .mw-stat.urgent{background:#fff7ee;border-color:#ead9c6}
#portal .action-metric.attention,#portal .mw-stat.attention{background:#213644;border-color:#213644;color:#fff}
#portal :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #bc6736;outline-offset:3px}
body:has(#portal:not([hidden])) .portal-footer{color:#637887;border-color:#dce5eb;max-width:1380px}
@media(min-width:1101px){#portal .toolbar{position:sticky;top:8px;z-index:15;box-shadow:0 5px 25px #14212d0b}#portal .chart-controls,#portal .chart-card{scroll-margin-top:165px}}
@media(max-width:1100px){#portal{padding-inline:24px}#portal .workspace-heading{padding:27px}#portal .workspace-heading h1{font-size:31px}}
@media(max-width:760px){#portal{padding-inline:16px;margin-top:18px}#portal .workspace-heading{padding:24px;border-radius:16px}#portal .workspace-heading h1{font-size:29px}#portal .tabs{gap:22px;margin-bottom:19px}#portal .tabs button{font-size:13px;min-height:47px}#portal .toolbar{padding:19px;gap:17px}#portal .segmented button{min-height:42px}#portal .date-controls input,#portal .date-controls .secondary{min-height:44px}#portal .data-status{padding:9px 10px;align-items:flex-start;font-size:11px;flex-wrap:wrap;gap:7px}#portal .status-dot{margin-top:7px}#portal #sync-message{flex:1;min-width:190px}#portal .data-status .text-button{min-height:40px;margin-inline-start:auto}#portal .chart-controls{padding:19px}#portal .finance-card{padding:21px}#portal .chart-grid{gap:16px}#portal .section-heading{gap:13px}#portal .energy-heading{margin-top:26px}}
@media(prefers-reduced-motion:reduce){#portal *,#portal *:before,#portal *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{body:has(#portal:not([hidden])){background:#fff}#portal{max-width:none;padding:0}#portal .toolbar{position:static;box-shadow:none}#portal .workspace-heading{background:#fff;border-color:#ccc;box-shadow:none}#portal .workspace-heading h1,#portal .workspace-heading .eyebrow,#portal .workspace-heading .muted{color:#17242c}#portal .workspace-heading:before{display:none}#portal .finance-card,#portal .economics-card,#portal .panel{box-shadow:none}}
@media(min-width:1101px){#portal .date-controls{flex-direction:row;align-items:flex-end;gap:18px}#portal .date-controls .segmented{margin-bottom:0}#portal .date-controls .segmented button{min-height:34px}#portal .toolbar{padding-block:16px}#portal .chart-controls,#portal .chart-card{scroll-margin-top:118px}}


/* Audience is a display preference; existing server permissions remain authoritative. */
body[data-audience="customer"] #operations-summary,body[data-audience="customer"] #journal-view,body[data-audience="customer"] #maintenance-view,body[data-audience="customer"] [data-view="journal"],body[data-audience="customer"] [data-view="maintenance"]{display:none!important}

/* Keep the instruments in the opening viewport without hiding controls. */
@media screen{
 body:has(#portal:not([hidden])) .masthead{height:58px;min-height:58px;padding-block:4px;gap:20px}
 body:has(#portal:not([hidden])) .masthead .logo img{width:145px}
 body:has(#portal:not([hidden])) .language-switch{flex-direction:row;align-items:center;gap:6px}
 body:has(#portal:not([hidden])) .language-switch select{min-height:36px;padding-block:5px}
 #portal{margin-top:10px}
 #portal .notice-ticker{margin:0 0 8px}
 #portal .workspace-heading{padding:12px 20px;gap:14px;margin-bottom:8px;border-radius:13px;overflow:clip}
 #portal .workspace-heading>div:first-child{min-width:0}
 #portal .workspace-heading:before{inset-block:13px}
 #portal .workspace-heading .eyebrow{font-size:8px;line-height:1.3;letter-spacing:1.25px;margin-bottom:3px}
 #portal .workspace-heading h1{font-size:24px;line-height:1.2;letter-spacing:-.4px;margin-bottom:3px}
 #portal .workspace-heading .muted{font-size:12px;line-height:1.4;margin:0}
 #portal .workspace-controls{flex-direction:row;align-items:flex-end;gap:14px;min-width:0;flex-shrink:0}
 #portal .site-switch{gap:7px;font-size:11px;align-items:center}
 #portal .workspace-heading .site-switch select{min-height:38px;min-width:110px;padding:7px 9px}
 #portal .audience-switch legend{font-size:10px;line-height:1.3;margin-bottom:3px}
 #portal .workspace-heading .audience-switch button{min-height:38px;font-size:12px;padding:7px 11px}
 #portal .tabs{gap:24px;margin:0 0 8px}
 #portal .tabs button{min-height:40px;padding:7px 3px;font-size:13px}
 #portal .toolbar{padding:10px 16px;gap:12px;border-radius:12px;align-items:center}
 #portal .toolbar h2{font-size:18px;line-height:1.25;margin-bottom:3px}
 #portal .toolbar .muted{font-size:11px;line-height:1.4;margin:0}
 #portal .date-controls{flex-direction:row;align-items:flex-end;gap:10px;min-width:0}
 #portal .date-controls form{gap:7px;min-width:0}
 #portal .date-controls label{font-size:10px;gap:3px;min-width:0}
 #portal .date-controls input,#portal .date-controls .secondary{min-height:36px;font-size:12px;padding:6px 8px}
 #portal .date-controls .segmented{padding:3px;gap:3px;margin:0}
 #portal .date-controls .segmented button{min-height:32px;padding:5px 10px;font-size:11px}
 #portal .data-status{padding:3px 9px;margin:6px 0;gap:8px;min-height:34px;font-size:11px;line-height:1.4;border-radius:7px}
 #portal .data-status .text-button{min-height:30px;font-size:11px;padding:4px 8px}
 #portal .energy-heading{margin:10px 0 9px;gap:12px}
 #portal .energy-heading>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;min-width:0}
 #portal .energy-heading .eyebrow{flex-basis:100%;font-size:8px;line-height:1.2;letter-spacing:1.2px;margin:0}
 #portal .energy-heading h2{font-size:22px;line-height:1.3;margin:0}
 #portal .energy-heading .muted{font-size:12px;line-height:1.4;margin:0}
 #portal .energy-heading .secondary{min-height:36px;padding:7px 11px;font-size:11px;flex-shrink:0}
}
@media screen and (min-width:1101px){
 #portal .chart-controls,#portal .chart-card{scroll-margin-top:94px}
}
@media screen and (min-width:761px) and (max-width:1100px){
 #portal .toolbar{display:grid;grid-template-columns:minmax(150px,1fr) auto}
 #portal .date-controls{display:grid;grid-template-columns:auto auto;gap:8px}
 #portal .site-switch{flex-direction:column;align-items:flex-start;gap:3px}
 #portal .workspace-controls{gap:10px}
 #portal .workspace-heading h1{font-size:22px}
 #portal .workspace-heading .muted{font-size:11px}
}
@media screen and (max-width:900px) and (min-width:761px){
 #portal .toolbar{grid-template-columns:1fr}
 #portal .date-controls{display:flex;justify-content:space-between;width:100%}
}
@media screen and (max-width:760px){
 body:has(#portal:not([hidden])) .masthead{height:auto;min-height:70px;padding:6px 14px;gap:10px}
 body:has(#portal:not([hidden])) .masthead .logo img{width:105px}
 body:has(#portal:not([hidden])) .language-switch select{min-height:40px}
 #portal{margin-top:8px;padding-inline:12px}
 #portal .notice-ticker{margin:0 0 7px}
 #portal .workspace-heading{padding:11px 14px;gap:9px;margin-bottom:6px;align-items:stretch}
 #portal .workspace-heading h1{font-size:23px;margin-bottom:2px}
 #portal .workspace-heading .eyebrow{font-size:8px;letter-spacing:.8px;margin-bottom:2px}
 #portal .workspace-heading .muted{font-size:11px;line-height:1.35}
 #portal .workspace-controls{justify-content:space-between;gap:8px;flex-wrap:wrap}
 #portal .site-switch{flex-direction:row;align-items:center;gap:6px;font-size:10px}
 #portal .workspace-heading .site-switch select{min-width:85px;width:90px;min-height:44px}
 #portal .workspace-heading .audience-switch button{min-height:44px;padding:7px 9px;font-size:11px}
 #portal .audience-switch legend{margin-bottom:2px;font-size:9px}
 #portal .tabs{gap:20px;margin-bottom:6px;flex-wrap:wrap}
 #portal .tabs button{min-height:44px;font-size:12px;padding:7px 1px}
 #portal .toolbar{display:grid;grid-template-columns:1fr;padding:10px 12px;gap:8px}
 #portal .toolbar>div:first-child{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 8px}
 #portal .toolbar h2{font-size:16px;line-height:1.3;margin:0}
 #portal .toolbar .muted{font-size:10px;line-height:1.3}
 #portal .date-controls{display:grid;grid-template-columns:1fr;gap:7px;width:100%;align-items:stretch}
 #portal .date-controls .segmented{display:flex}
 #portal .date-controls .segmented button{min-height:44px;flex:1;font-size:11px}
 #portal .date-controls form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:6px;width:100%;align-items:end}
 #portal .date-controls label{min-width:0;margin:0;font-size:10px}
 #portal .date-controls input{min-height:44px;min-width:0;width:100%;padding:7px 4px;font-size:12px}
 #portal .date-controls .secondary{min-height:44px;min-width:45px;padding:7px 9px}
 #portal .data-status{margin:5px 0;padding:3px 7px;gap:5px;font-size:10px;align-items:center}
 #portal .status-dot{margin-top:0;flex-shrink:0}
 #portal #sync-message{min-width:0;flex:1 1 160px}
 #portal .data-status .text-button{min-height:44px;font-size:10px;padding-inline:5px}
 #portal .energy-heading{margin:8px 0;gap:8px;align-items:center}
 #portal .energy-heading>div{gap:2px 7px}
 #portal .energy-heading h2{font-size:19px}
 #portal .energy-heading .eyebrow{font-size:7px}
 #portal .energy-heading .muted{font-size:11px;line-height:1.35}
 #portal .energy-heading .secondary{min-height:44px;max-width:120px;padding:7px 8px;font-size:10px;white-space:normal;line-height:1.35}
}
@media screen and (max-width:370px){
 #portal .site-switch>span{max-width:30px;line-height:1.3}
 #portal .workspace-heading .audience-switch button{padding-inline:6px;font-size:10px}
 #portal .workspace-heading .site-switch select{min-width:75px;width:75px}
 #portal .date-controls input{font-size:11px}
}

@media screen and (min-width:1101px){
 body:has(#portal:not([hidden])) .masthead{height:52px;min-height:52px;padding-block:3px}
 #portal{margin-top:7px}
 #portal .workspace-heading{padding:9px 17px;margin-bottom:4px;gap:12px}
 #portal .workspace-heading>div:first-child{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 12px}
 #portal .workspace-heading .eyebrow{flex-basis:100%;margin:0}
 #portal .workspace-heading h1{font-size:23px;margin:0}
 #portal .workspace-heading .muted{font-size:11px}
 #portal .tabs{margin-bottom:6px}
 #portal .tabs button{min-height:34px;padding-block:5px}
 #portal .toolbar{padding-block:7px}
 #portal .data-status{min-height:30px;padding-block:1px;margin-block:5px}
 #portal .data-status .text-button{min-height:28px}
 #portal .energy-heading{margin-block:7px}
}

@media screen and (max-width:760px){
 #portal .site-switch{flex-direction:column;align-items:flex-start;gap:2px}
 #portal .workspace-controls{flex-wrap:nowrap}
 #portal .workspace-heading .audience-switch{min-width:0}
 #portal .workspace-heading .audience-switch button{padding-inline:7px;font-size:10px}
 #portal .toolbar{grid-template-columns:minmax(0,1fr) auto;gap:7px 9px}
 #portal .toolbar>div:first-child{display:block;min-width:0}
 #portal .toolbar h2{font-size:14px;line-height:1.3;margin-bottom:2px}
 #portal .toolbar .muted{font-size:9px;line-height:1.3}
 #portal .date-controls{display:contents}
 #portal .date-controls .segmented button{padding-inline:8px;font-size:10px}
 #portal .date-controls form{grid-column:1/-1}
 #portal .energy-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
 #portal .energy-heading>div{width:auto;min-width:0}
 #portal .energy-heading .secondary{max-width:96px}
}
@media screen and (max-width:370px){
 #portal .workspace-heading .audience-switch button{padding-inline:5px;font-size:10px}
 #portal .workspace-heading .site-switch select{min-width:70px;width:70px}
 #portal .date-controls .segmented button{padding-inline:6px}
}

@media screen and (max-width:760px){
 #portal .workspace-heading{padding-block:8px;gap:6px}
 #portal .workspace-heading .eyebrow,#portal .energy-heading .eyebrow{display:none}
 #portal .workspace-heading h1{font-size:21px}
 #portal #metrics .gauge-heading{min-height:0;align-items:center;gap:8px}
 #portal #metrics .gauge-heading .gauge-eyebrow{display:none}
 #portal #metrics .gauge-icon{width:28px;height:28px;border-radius:8px}
 #portal #metrics .gauge-icon svg{width:18px;height:18px}
 #portal #metrics .gauge-status-row{min-height:0;margin:5px 0 7px;gap:5px}
 #portal #metrics .gauge-quality{padding:3px 5px;font-size:10px}
 #portal #metrics .metric-gauge{padding-top:12px}
}

/* Dashboard context lives in the news ribbon; only controls precede the gauges. */
@media screen{
 #portal .portal-context-sr{position:absolute!important;width:1px!important;height:1px!important;min-width:0!important;min-height:0!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
 #portal .workspace-heading{padding:6px 14px;min-height:0;gap:0;margin-bottom:3px}
 #portal .workspace-controls{width:100%;justify-content:space-between;align-items:center;gap:12px}
 #portal .site-switch{flex-direction:row;align-items:center;gap:8px}
 #portal .audience-switch{position:relative}
 #portal .audience-switch legend,#portal .site-switch>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 #portal .workspace-heading:before{inset-block:9px}
 #portal .tabs{margin-bottom:5px}
 #portal .toolbar{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-end;gap:10px;padding:6px 12px;margin-bottom:9px}
 #portal .date-controls{display:flex;flex-direction:row;align-items:flex-end;gap:10px;width:auto;flex:1;min-width:0}
 #portal .date-controls .segmented{flex:none;margin:0}
 #portal .date-controls form{display:flex;gap:7px;width:auto;grid-column:auto;align-items:flex-end;flex-wrap:nowrap}
 #portal .date-controls label{min-width:0;margin:0}
 #portal .date-controls input{min-width:0}
 #portal .toolbar-actions{display:flex;align-items:center;gap:5px;flex:none}
 #portal .toolbar-actions button{min-height:36px;padding:6px 10px;font-size:11px;line-height:1.3;white-space:nowrap}
 #portal #operations-summary{margin-top:18px}
}
@media screen and (max-width:900px){
 #portal .toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 8px}
 #portal .date-controls{display:contents}
 #portal .date-controls .segmented{grid-column:1;grid-row:1;justify-self:start}
 #portal .toolbar-actions{grid-column:2;grid-row:1;justify-self:end}
 #portal .date-controls form{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:6px;width:100%;align-items:end}
 #portal .date-dash{display:none}
}
@media screen and (max-width:760px){
 #portal .workspace-heading{padding:5px 10px;margin-bottom:2px}
 #portal .workspace-controls{gap:8px}
 #portal .workspace-heading .site-switch select{min-height:44px}
 #portal .workspace-heading .audience-switch button{min-height:44px}
 #portal .tabs{margin-bottom:4px;gap:14px}
 #portal .toolbar{padding:6px 8px;gap:5px 6px;margin-bottom:8px}
 #portal .date-controls .segmented{padding:2px;gap:1px}
 #portal .date-controls .segmented button{min-height:44px;min-width:44px;padding-inline:6px;font-size:10px}
 #portal .toolbar-actions{gap:2px}
 #portal .toolbar-actions button{min-height:44px;min-width:44px;padding-inline:6px;font-size:10px}
 #portal .toolbar-actions #export-energy{min-width:44px}
 #portal .date-controls form{gap:5px}
 #portal .date-controls input,#portal .date-controls .secondary{min-height:44px}
 #portal .date-controls input{width:100%;font-size:12px;padding-inline:4px}
 #portal .date-controls .secondary{min-width:45px;padding-inline:8px}
}
@media screen and (max-width:370px){
 #portal .workspace-heading{padding-inline:8px}
 #portal .workspace-controls{gap:6px}
 #portal .date-controls input{font-size:11px}
 #portal .toolbar-actions button{padding-inline:4px}
}

@media screen and (max-width:370px){
 body:has(#portal:not([hidden])) .masthead #account{display:grid;grid-template-columns:minmax(72px,1fr) auto;gap:4px 6px;flex:1;min-width:0;max-width:180px}
 body:has(#portal:not([hidden])) .masthead .account-identity{grid-column:1/-1;max-width:100%;min-width:0}
 body:has(#portal:not([hidden])) .masthead .language-switch{min-width:0}
 body:has(#portal:not([hidden])) .masthead .language-switch>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 body:has(#portal:not([hidden])) .masthead .language-switch select{width:100%;min-width:72px;min-height:44px;padding-inline:6px}
 body:has(#portal:not([hidden])) .masthead #logout{min-width:44px;min-height:44px;padding-inline:5px;white-space:nowrap;justify-self:end}
}

/* Shared compact instruments: eight desktop gauges with expandable reading details. */
@media screen {
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;align-items:start;margin-bottom:14px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .flow-gauges-heading,body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-eyebrow,body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-context{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .metric-gauge{padding:9px 8px 0;border-radius:11px;box-shadow:0 2px 10px #17242c05;overflow:hidden}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .metric-gauge:before{inset-inline:12px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-heading{min-height:35px;gap:0;align-items:start}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .metric-label{font-size:12px;line-height:1.4;letter-spacing:0}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-icon{display:none}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-status-row{min-height:18px;margin:2px 0 6px;justify-content:flex-start}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-quality{font-size:9px;padding:2px 4px;gap:3px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-instrument{padding:3px 3px 5px;border-radius:8px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-dial{max-width:142px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-dial .metric-value{font-size:23px;letter-spacing:-.6px;gap:1px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-dial .metric-value.gauge-number-wide{font-size:18px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-dial .metric-value.gauge-number-long{font-size:15px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-dial .metric-value small{font-size:10px;line-height:1.3}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-detail{font-size:9px;min-height:26px;line-height:1.4;padding:0 1px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-peak-cost{padding-top:2px;gap:0;inset-inline:7%}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-peak-cost>span{font-size:7px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-peak-cost strong{font-size:11px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-peak-cost strong.gauge-cost-long{font-size:9px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .ops-gauge-details{font-size:10px;line-height:1.5;min-width:0}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .ops-gauge-details>summary{cursor:pointer;min-height:34px;display:flex;align-items:center;gap:5px;font-size:10px;color:#516671;padding-block:5px;list-style:none}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .ops-gauge-details>summary:after{content:'+';margin-inline-start:auto;color:var(--gauge-color);font-size:17px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .ops-gauge-details[open]>summary:after{content:'−'}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .ops-gauge-details>summary:focus-visible{outline:2px solid var(--gauge-color);outline-offset:-2px;border-radius:4px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-reference{margin-top:0;padding:6px 0;gap:4px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .gauge-reference-main{display:grid;gap:4px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .metric-note{font-size:10px;min-height:0;padding:7px 0}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .flow-gauge-window{padding:6px 5px;margin-bottom:8px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .flow-window-endpoint{flex-wrap:wrap;gap:2px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .power-exclusion-note{font-size:10px;padding:5px;margin-block:5px}
 body[data-audience="operations"] #portal #operations-summary .summary-heading{display:none}
 body[data-audience="operations"] #portal #operations-summary{margin-top:12px}
}
@media screen and (max-width:1100px){body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media screen and (max-width:600px){
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .metric-label{font-size:12px}
 body:is([data-audience="operations"],[data-audience="customer"]) #portal #metrics .ops-gauge-details>summary{min-height:44px}
}
/* Savings and fuel comparisons belong to the customer presentation. */
body[data-audience="operations"] #steam-economics { display:none; }

/* Supporting customer readings form a compact strip below the primary gauges. */
@media screen {
 body[data-audience="customer"] #portal #process-instruments{margin:10px 0 18px}
 body[data-audience="customer"] #portal .process-instruments-heading{margin-bottom:7px}
 body[data-audience="customer"] #portal .process-instruments-heading h2{font-size:13px}
 body[data-audience="customer"] #portal .process-instruments-heading p{font-size:10px}
 body[data-audience="customer"] #portal .process-card{padding:10px 11px 0;border-radius:11px}
 body[data-audience="customer"] #portal .process-card header{min-height:30px;gap:3px}
 body[data-audience="customer"] #portal .process-card h3{font-size:12px}
 body[data-audience="customer"] #portal .process-dial{max-width:132px;margin-top:3px}
 body[data-audience="customer"] #portal .process-dial-reading strong{font-size:24px;letter-spacing:-.6px}
 body[data-audience="customer"] #portal .process-dial-reading small{font-size:10px}
 body[data-audience="customer"] #portal .process-battery-stage{max-width:146px;min-height:121px;padding:14px 5px 10px;margin-top:3px}
 body[data-audience="customer"] #portal .process-battery-shell{height:64px;border-radius:8px}
 body[data-audience="customer"] #portal .process-battery-value strong{font-size:25px;letter-spacing:-.6px}
 body[data-audience="customer"] #portal .process-battery-value small{font-size:12px}
 body[data-audience="customer"] #portal .process-battery-scale{margin-top:6px}
 body[data-audience="customer"] #portal .process-reading-meta{padding:6px 0 5px}
 body[data-audience="customer"] #portal #process-instruments .insight-card{padding:10px;border-radius:11px}
 body[data-audience="customer"] #portal #process-instruments .insight-card-head h3{font-size:12px}
 body[data-audience="customer"] #portal #process-instruments .insight-svg{min-height:128px}
 body[data-audience="customer"] #portal #process-instruments .insight-readout{min-height:42px;padding-top:6px}
}
@media screen and (min-width:601px) and (max-width:1000px){
 body[data-audience="customer"] #portal #process-instruments .insight-svg{max-height:180px}
}
@media screen and (max-width:600px){
 body[data-audience="customer"] #portal .process-card header{min-height:43px}
 body[data-audience="customer"] #portal .process-battery-card header{min-height:0}
 body[data-audience="customer"] #portal .process-battery-stage{min-height:106px;padding-block:5px;margin-top:0}
 body[data-audience="customer"] #portal .process-dial{max-width:132px}
 body[data-audience="customer"] #portal .process-module-readings summary{min-height:44px}
 body[data-audience="customer"] #portal #process-instruments .insight-expand{min-height:44px}
}