:root {
  color-scheme: light;
  --page: #f3f6f7;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-soft: #f7f9fa;
  --surface-strong: #eaf0f2;
  --text: #343537;
  --text-strong: #242426;
  --muted: #6d7377;
  --subtle: #8b9296;
  --border: #dbe3e7;
  --border-strong: #c8d4da;
  --navy: #252426;
  --navy-light: #393638;
  --accent: #008d97;
  --accent-strong: #007b85;
  --accent-soft: #e2f7f8;
  --cyan: #12d4d9;
  --normal: #177b5d;
  --normal-soft: #e6f5ef;
  --watch: #8a6800;
  --watch-soft: #fff8cc;
  --intervention: #d80000;
  --intervention-soft: #ffe8e8;
  --unavailable: #74818a;
  --shadow-sm: 0 1px 2px rgba(7, 26, 39, 0.04), 0 8px 22px rgba(7, 26, 39, 0.045);
  --shadow-md: 0 18px 50px rgba(7, 26, 39, 0.09);
  --radius: 18px;
  --radius-sm: 12px;
  --focus: #007f8a;
  --curve-planned: #5f6b70;
  --curve-actual: #008d97;
}

:root[data-density="compact"] {
  --radius: 14px;
  --radius-sm: 10px;
}

:root[data-density="compact"] .panel,
:root[data-density="compact"] .status-banner {
  padding: 0.85rem 1rem;
}

:root[data-density="compact"] .kpi-grid,
:root[data-density="compact"] .overview-grid,
:root[data-density="compact"] .station-detail-grid {
  gap: 0.75rem;
}

#dashboardContent {
  display: flex;
  flex-direction: column;
  gap: inherit;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #111416;
  --surface: #1a1e20;
  --surface-raised: #202527;
  --surface-soft: #15191b;
  --surface-strong: #272d30;
  --text: #e0e7e9;
  --text-strong: #f6fbfc;
  --muted: #9fb0b9;
  --subtle: #788c98;
  --border: #303638;
  --border-strong: #454d50;
  --navy: #111416;
  --navy-light: #272d30;
  --accent: #33ced5;
  --accent-strong: #6ee1e5;
  --accent-soft: #17383b;
  --cyan: #33ced5;
  --normal: #4ec89a;
  --normal-soft: #12392e;
  --watch: #ffd83d;
  --watch-soft: #3a310a;
  --intervention: #ff5a5f;
  --intervention-soft: #451416;
  --unavailable: #a2b0b8;
  --shadow-sm: 0 10px 26px rgba(0, 0, 0, 0.18);
  --shadow-md: 0 22px 60px rgba(0, 0, 0, 0.3);
  --focus: #59c9ff;
  --curve-planned: #a9b4b8;
  --curve-actual: #33ced5;
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  background: var(--page);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background: var(--page);
  color: var(--text);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

button,
input {
  color: inherit;
  font: inherit;
}

button,
input[type="date"] {
  -webkit-tap-highlight-color: transparent;
}

button {
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.55;