*, *::before, *::after { box-sizing: border-box; }

.n-page {
  --n-font: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --n-radius-sm: 6px;
  --n-radius-md: 10px;
  --n-radius-lg: 14px;
  --n-radius-xl: 20px;
  --n-pad-shell: clamp(1.25rem, 4vw, 2.5rem);
  --n-section-y: 3.25rem;
  --n-border-subtle: rgba(255, 255, 255, 0.078);
  --n-surface-raised: rgba(255, 255, 255, 0.038);
  --n-accent-primary: #4fc3f7;
  --n-accent-primary-soft: rgba(79, 195, 247, 0.16);
  --n-well: rgba(0, 0, 0, 0.22);

  font-family: var(--n-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100vh;
  background: var(--bg-base, #0a0c10);
  color: var(--text-primary, #e8eaed);
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  text-rendering: optimizeLegibility;
}

.theme-light.n-page {
  --n-border-subtle: rgba(15, 23, 42, 0.08);
  --n-surface-raised: #ffffff;
  --n-accent-primary: #0ea5e9;
  --n-accent-primary-soft: rgba(14, 165, 233, 0.14);
  --n-well: #f1f5f9;
  background: #f8fafc;
  color: #0f172a;
}

.theme-coastal.n-page {
  --bg-primary: #eef7f8;
  --bg-surface: #ffffff;
  --bg-input: #dbeff1;
  --border: #b8d7dc;
  --border-muted: #c7dde1;
  --text-primary: #12303a;
  --text-secondary: #2f5963;
  --text-muted: #55727a;
  --text-dim: #7d969d;
  --accent: #087f8c;
  --accent-hover: #0f9baa;
  --accent-on-bg: #ffffff;
  --n-border-subtle: rgba(8, 127, 140, 0.18);
  --n-surface-raised: #ffffff;
  --n-accent-primary: #087f8c;
  --n-accent-primary-soft: rgba(8, 127, 140, 0.14);
  --n-well: #e5f4f6;
  background: #eef7f8;
  color: #12303a;
}

.theme-aqi.n-page {
  --bg-primary: #fff8ee;
  --bg-surface: #ffffff;
  --bg-input: #f8ecd9;
  --border: #ead4b8;
  --border-muted: #ead4b8;
  --text-primary: #2f2418;
  --text-secondary: #5f4933;
  --text-muted: #7d6650;
  --text-dim: #9f8770;
  --accent: #b45309;
  --accent-hover: #d97706;
  --accent-on-bg: #ffffff;
  --n-border-subtle: rgba(180, 83, 9, 0.18);
  --n-surface-raised: #ffffff;
  --n-accent-primary: #b45309;
  --n-accent-primary-soft: rgba(180, 83, 9, 0.14);
  --n-well: #fff2df;
  background: #fff8ee;
  color: #2f2418;
}

/* ── Layout shell ──────────────────────────────────────────── */