/* Cool graphite surfaces keep the violet/blue identity and photographic artwork.
   Light values deliberately preserve the approved palette. */
:root {
  color-scheme:light dark;
  --dark-paper:oklch(20.6869% .009839 285.5081); /* #17171c */
  --dark-surface:oklch(24.6570% .013193 285.3921); /* #202027 */
  --dark-hover:oklch(28.4731% .016370 285.3137); /* #292932 */
  --dark-ink:oklch(95.7329% .006724 295.4494); /* #f1f0f5 */
  --dark-muted:oklch(77.2714% .019816 292.4945); /* #b5b3c1 */
  --dark-accent:oklch(73.9751% .146606 291.7783); /* #ad98ff */
  --paper:light-dark(#fbfbfc,var(--dark-paper));
  --ink:light-dark(#0b0b0f,var(--dark-ink));
  --muted:light-dark(#65656f,var(--dark-muted));
  --line:light-dark(rgba(11,11,15,.1),oklch(95.7329% .006724 295.4494 / .16));
  --accent:light-dark(#7041f3,var(--dark-accent));
  --gradient:linear-gradient(105deg,light-dark(#7c3aed,var(--dark-accent)) 0%,light-dark(#4d5af5,oklch(74% .13 276)) 53%,light-dark(#268cf4,oklch(77.3179% .117181 255.6034)) 100%);
  --surface:light-dark(white,var(--dark-surface));
  --surface-hover:light-dark(#f2f0f8,var(--dark-hover));
  --drawer-surface:light-dark(#fbfbfc,var(--dark-surface));
  --drawer-hover:light-dark(#eeecf4,var(--dark-hover));
  --on-ink:light-dark(white,var(--dark-paper));
  --primary-hover:light-dark(#34313f,oklch(88% .02 295));
  --nav-text:light-dark(#5b5b66,var(--dark-muted));
  --subtle:light-dark(#8a8a96,var(--dark-muted));
  --hint:light-dark(#9797a3,var(--dark-muted));
  --cue:light-dark(#7d7b88,var(--dark-muted));
  --cue-arrow:light-dark(#625c76,var(--dark-muted));
  --cue-border:light-dark(#dedae8,oklch(60% .02 285));
  --grid-dot:light-dark(rgba(11,11,15,.14),oklch(77.2714% .019816 292.4945 / .19));
  --skills-line:light-dark(#eee,var(--line));
  --chip-ink:light-dark(#303039,var(--dark-ink));
  --chip-line:light-dark(#ededee,var(--line));
  --image-surface:light-dark(#e9e9ef,var(--dark-hover));
  --project-year:light-dark(#898894,var(--dark-muted));
  --project-category:light-dark(#797883,var(--dark-muted));
  --timeline-role:light-dark(#878691,var(--dark-muted));
  --contact-kicker:light-dark(#85828f,var(--dark-muted));
  --footer-ink:light-dark(#84828e,var(--dark-muted));
  --footer-link:light-dark(#4c4859,var(--dark-ink));
  --focus:light-dark(#7651f4,var(--dark-accent));
  --backdrop:light-dark(rgba(22,18,35,.16),oklch(12% .01 285 / .65));
  --editor-link:light-dark(#433660,var(--dark-accent));
  --editor-link-border:light-dark(#ded9e8,var(--line));
  --editor-link-hover:light-dark(#f0ebf9,var(--dark-hover));
}
:root[data-theme="light"] {color-scheme:light;}
:root[data-theme="dark"] {color-scheme:dark;}

/* The ID is a physical white card in both appearances, including its ink. */
.badge-front {
  color-scheme:light;
  color:#0b0b0f;
  --muted:#65656f;
  --line:rgba(11,11,15,.1);
  --gradient:linear-gradient(105deg,#7c3aed 0%,#4d5af5 53%,#268cf4 100%);
}
.band-ribbon {stroke:light-dark(#16161c,oklch(34% .015 285));}

.nav.nav-understated .theme-control {
  position:relative;display:grid;place-items:center;flex-shrink:0;
  width:38px;height:38px;padding:0;border:0;border-radius:50%;color:var(--nav-text);
}
.nav.nav-understated .theme-control[hidden],.theme-control svg[hidden] {display:none;}
.theme-control svg {width:18px;height:18px;pointer-events:none;}
.nav.nav-understated .theme-control:hover {background:var(--surface-hover);color:var(--ink);}
.theme-control:focus-visible {outline:3px solid var(--focus);outline-offset:3px;}
@media(pointer:coarse) {.theme-control {min-width:44px;min-height:44px;}}
@media(max-width:380px) {.nav.nav-understated {gap:6px;}}