.appearance-settings{padding:24px;max-width:620px}
.appearance-settings label{display:block;font-size:14px;font-weight:700;margin-bottom:8px}
.appearance-settings select{width:100%;max-width:320px;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text)}
.appearance-settings p{font-size:13px;color:var(--muted);line-height:1.6}
.setup-tabs{flex-wrap:wrap}.setup-tabs button{white-space:nowrap}
/* Bound the responsive canvas to its grid cell, not its own intrinsic height. */
.month-panel,.comparison-panel,.pie-panel{display:flex;flex-direction:column;min-height:0}
:is(.month-panel,.comparison-panel,.pie-panel) .panel-header{flex-shrink:0}
:is(.month-panel,.comparison-panel,.pie-panel) .chart-wrap{position:relative;flex:1;min-height:0;height:0}
.month-panel .chart-wrap{min-height:360px}
@media(max-width:760px){.month-panel .chart-wrap{min-height:0}}
@media screen {
  html[data-theme="dark"]{--bg:#0b1726;--panel:#122338;--text:#e5edf7;--muted:#abbdd2;--line:#30445c;--border:#30445c;--blue:#79b8ff;--blue-soft:#203d5d;--green:#69d6a2;--red:#ff959c;--shadow:0 8px 24px rgba(0,0,0,.18)}
  html[data-theme="dark"] :is(.tabs,.login-card,.metersight-login-logo-wrap,.maintenance-facts>div,.setup-savebar){background:var(--panel)}
  html[data-theme="dark"] :is(.metric-card,.metric-card.green,.metric-card.red){background:#152b43;border-color:var(--line)}
  html[data-theme="dark"] .metric-card.green{background:#142f30;border-color:#35615a}
  html[data-theme="dark"] .metric-card.red{background:#362a36;border-color:#654452}
  html[data-theme="dark"] :is(.tenant-table th,.report-table thead th,.meter-subtotal td,.meter-subtotal th,.meter-group-row td,.meter-card-head,.login-footer,.maintenance-badge){background:#1b3048;color:var(--text);border-color:var(--line)}
  html[data-theme="dark"] .report-table tfoot th{background:#3b361f;color:#f2e3ad}
  html[data-theme="dark"] :is(.tenant-table th,.tenant-table td,.report-table th,.report-table td,.point-row){border-color:var(--line)}
  html[data-theme="dark"] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background:#0e1e30;color:var(--text);border-color:var(--line)}
  html[data-theme="dark"] #loginUsername{background:#0e1e30}
  html[data-theme="dark"] :is(input,textarea)::placeholder{color:#96abc3;opacity:1}
  html[data-theme="dark"] :is(.secondary-button,.icon-button,.rate-save-button,.period-toggle,.period-toggle button,.range-buttons button,.report-mode-tabs button,.setup-tabs button){background:#1b3048;color:var(--text);border-color:var(--line)}
  html[data-theme="dark"] :is(.primary-button,.secondary-button.selected,.period-toggle button.active,.range-buttons button.active,.report-mode-tabs button.active,.setup-tabs button.active){background:#236dc2;border-color:#4b95e7;color:#fff}
  html[data-theme="dark"] :is(.secondary-button,.icon-button,.rate-save-button):hover{background:#294560}
  html[data-theme="dark"] :is(button,input,select,textarea):focus-visible{outline:2px solid #91c6ff;outline-offset:3px}
  html[data-theme="dark"] :is(.tab-button,.metric-label,.control-group label,.rate-editor label,.billing-editor>label,.setup-panel label,.meter-card label,.user-form label,.report-coverage-note,.billing-period-status,.password-toggle){color:var(--muted)}
  html[data-theme="dark"] .tab-button.active{color:var(--blue)}
  html[data-theme="dark"] .negative-change{color:#7be0ac}
  html[data-theme="dark"] .positive-change{color:#ff959c}
  html[data-theme="dark"] .global-message{background:#3e2632;color:#ffb1b5;border-color:#6f4052}
  html[data-theme="dark"] .billing-editor{border-color:#35615a}
  html[data-theme="dark"] .password-toggle:hover{background:#294560}
}
/* Printing stays light regardless of the browser's saved screen appearance. */
@media print {html{color-scheme:light!important}}