/* Direct routes retain their own composition and share the visitor's appearance. */
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
.theme-logo-light { display: block !important; }
.theme-logo-dark { display: none !important; }
:root[data-theme="dark"] .theme-logo-light { display: none !important; }
:root[data-theme="dark"] .theme-logo-dark { display: block !important; }
:root[data-page="portfolio"][data-theme="light"] {
  --bg:oklch(0.975 0.008 95);--panel:oklch(0.995 0.003 95);--ink:oklch(0.245 0.022 220);
  --muted:oklch(0.43 0.024 220);--line:oklch(0.85 0.014 210);--cyan:oklch(0.44 0.085 188);
  --signal-ink:#ffffff;--cyan-soft:oklch(0.40 0.035 210);--panel-2:oklch(0.93 0.012 210);--black:oklch(0.94 0.01 210);
}
:root[data-page="studio"][data-theme="dark"] {
  --paper:oklch(0.155 0.018 220);--surface:oklch(0.205 0.020 220);--ink:#edf4f3;--muted:#bac8cc;
  --line:#435057;--turquoise-dark:#65dbd4;--success:#87d9b8;--wash:oklch(0.265 0.042 195);--wash-line:oklch(0.38 0.05 195);
}
:root[data-page="studio"] .site-nav { background:var(--paper);border-color:var(--line); }
:root[data-page="studio"] .nav-links a:hover,
:root[data-page="studio"] .nav-links a:focus-visible,
:root[data-page="studio"] .nav-links a[aria-current="page"] { background:var(--wash); }
:root[data-page="error"][data-theme="light"] {
  --bg:#f9f8f4;--panel:#fffdf8;--ink:#26363c;--muted:#53616b;--line:#d8d5cf;--signal:#067982;--signal-ink:#fff;
}
:root[data-page="error"] main { background:var(--panel);width:min(680px,calc(100% - 32px));margin:24px 16px; }
@media (max-width:620px) {
  :root[data-page="portfolio"] .nav-inner { gap:12px; }
  :root[data-page="portfolio"] .logo-lockup { width:clamp(120px,42vw,174px); }
  :root[data-page="portfolio"] .nav-actions { gap:8px; }
  :root[data-page="portfolio"] #nav .btn-sm.nav-call { padding:10px;min-width:44px; }
  :root[data-page="studio"] .nav-inner { padding-inline:16px;gap:12px; }
  :root[data-page="studio"] .brand img { width:clamp(130px,42vw,190px); }
  :root[data-page="studio"] .nav-links { display:none; }
  :root[data-page="studio"] .menu-button { min-width:44px;min-height:44px; }
  :root[data-page="studio"] .colour-row { flex-wrap:wrap; }
}