/* Night preserves the original palette; day uses warm stone and muted teal. */
:root {
  --map-bg:#14202c; --map-border:#4b6176; --map-text:#d6e2ef; --map-link:#61778b;
  --canvas-bg:#0d151f; --canvas-grid:#162230; --canvas-label:rgba(13,21,31,.88);
  --canvas-tooltip:rgba(25,35,46,.98); --canvas-ray:rgba(240,242,244,.45);
  --canvas-glow:rgba(240,242,244,.35); --canvas-transparent:rgba(240,242,244,0);
  --input-border:#617182; --placeholder:#aebac7; --selected-bg:rgba(139,213,232,.10);
  --domain-0:#8bd5e8; --domain-1:#e8c17e; --domain-2:#a3b4f7; --domain-3:#c8a3ea; --domain-4:#88d1b4;
}
:root[data-theme="light"] {
  color-scheme:light;
  --bg:#edeae4; --surface:#e4e1db; --ink:#263737; --muted:#536360;
  --line:#bdc6bf; --accent:#216b73; --blue:#515d8c;
  --map-bg:#e1e5df; --map-border:#7e938b; --map-text:#344b46; --map-link:#71877e;
  --canvas-bg:#e7e8df; --canvas-grid:#d9dfd5; --canvas-label:rgba(231,232,223,.94);
  --canvas-tooltip:rgba(237,234,228,.98); --canvas-ray:rgba(38,55,55,.38);
  --canvas-glow:rgba(33,107,115,.20); --canvas-transparent:rgba(33,107,115,0);
  --input-border:#7d8c83; --placeholder:#5e6b64; --selected-bg:rgba(33,107,115,.10);
  --domain-0:#20666e; --domain-1:#865a21; --domain-2:#4e5b93; --domain-3:#79528e; --domain-4:#346d50;
}
/* A useful light fallback if JavaScript is disabled. */
@media (prefers-color-scheme:light) {
  :root:not([data-theme]) {
    color-scheme:light;
    --bg:#edeae4; --surface:#e4e1db; --ink:#263737; --muted:#536360;
    --line:#bdc6bf; --accent:#216b73; --blue:#515d8c;
    --map-bg:#e1e5df; --map-border:#7e938b; --map-text:#344b46; --map-link:#71877e;
    --canvas-bg:#e7e8df; --placeholder:#5e6b64;
  }
}
.header-inner { gap:20px; }
.brand { margin-right:auto; }
#navigation { order:1; }
.theme-toggle { order:2; display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:9px 13px; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink); font-size:13px; white-space:nowrap; cursor:pointer; }
.theme-toggle:hover { border-color:var(--accent); color:var(--accent); }
.theme-toggle svg { width:18px; height:18px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.theme-toggle [data-theme-sun] { display:none; }
[data-theme="dark"] .theme-toggle [data-theme-sun] { display:block; }
[data-theme="dark"] .theme-toggle [data-theme-moon] { display:none; }
.menu-toggle { order:3; min-height:44px; }
.system-map { background:var(--map-bg); }
.map-node { border-color:var(--map-border); color:var(--map-text); }
.map-link { background:var(--map-link); }
.cosmos-stage { background:var(--canvas-bg); }
.cosmos-search input::placeholder { color:var(--placeholder); opacity:1; }
.cosmos-search input, #portfolio-visit input, #portfolio-visit textarea { border-color:var(--input-border); }
.results button[aria-pressed="true"] { background:var(--selected-bg); }
.pf-mode-note { color:var(--muted); font-size:13px; margin-top:12px; }
.pf-source-detail { font-size:12px; color:var(--muted); margin-top:14px; }
@media (max-width:1000px) { #navigation { gap:18px; } .header-inner { gap:16px; } }
@media (max-width:850px) {
  .header-inner { gap:12px; }
  .theme-toggle { width:44px; padding:10px; }
  .theme-toggle [data-theme-label] { display:none; }
  .menu-toggle { display:inline-flex; align-items:center; justify-content:center; }
  #navigation { display:none; position:absolute; left:0; right:0; top:100%; padding:21px 27px; background:var(--surface); border-bottom:1px solid var(--line); flex-direction:column; gap:19px; }
  #navigation.open { display:flex; }
  .header:not(.js-ready) .header-inner { flex-wrap:wrap; padding-block:14px; }
  .header:not(.js-ready) #navigation { display:flex; position:static; flex-direction:row; flex-wrap:wrap; padding:0; background:none; border:0; width:100%; }
}
@media (max-width:570px) {
  .header-inner { gap:10px; }
  .brand { gap:8px; font-size:clamp(12px,3.25vw,14px); }
  .monogram { width:32px; height:32px; font-size:12px; flex-shrink:0; }
  .menu-toggle { padding:7px 10px; }
}
