/* Load LAST, after refinement.css and hero-video.css. Images and brand ink are unchanged.
   --ink stays graphite: existing heroes/buttons use it as a background/text pairing. */
:root {
  color-scheme: light;
  --theme-bg: #f4f8fb;
  --theme-surface: #ffffff;
  --theme-raised: #eaf1f6;
  --theme-text: #071923;
  --theme-muted: #465e6d;
  --theme-line: #c3d2dc;
  --theme-control: #6b8595;
  --theme-link: #006b93;
  --theme-business: #b71d53;
  --theme-metal: #526c7c;
  --theme-focus: #006b93;
  --theme-error: #a41445;
  --theme-action: #00aff0;
  --theme-action-text: #071923;
  --paper: var(--theme-bg);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --control-border: var(--theme-control);
}
/* System also works without JavaScript. The early script overrides with saved choice. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --theme-bg: #091b26;
    --theme-surface: #102b3b;
    --theme-raised: #193a4d;
    --theme-text: #edf5fa;
    --theme-muted: #b7ccda;
    --theme-line: #496878;
    --theme-control: #7995a6;
    --theme-link: #63d4ff;
    --theme-business: #ff8eb4;
    --theme-metal: #c8d9e4;
    --theme-focus: #63d4ff;
    --theme-error: #ff9ebd;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --theme-bg: #091b26;
  --theme-surface: #102b3b;
  --theme-raised: #193a4d;
  --theme-text: #edf5fa;
  --theme-muted: #b7ccda;
  --theme-line: #496878;
  --theme-control: #7995a6;
  --theme-link: #63d4ff;
  --theme-business: #ff8eb4;
  --theme-metal: #c8d9e4;
  --theme-focus: #63d4ff;
  --theme-error: #ff9ebd;
}
html { background: var(--theme-bg); scrollbar-color: var(--theme-control) var(--theme-bg); }
body { background: var(--theme-bg); color: var(--theme-text); }
::selection { background: #00aff0; color: #071923; }
input, textarea, select { caret-color: var(--theme-link); accent-color: var(--theme-link); }
/* Keep native select options readable even on fixed graphite surfaces. */
option, optgroup { background: var(--theme-surface); color: var(--theme-text); }
:is(input, textarea)::placeholder { color: var(--theme-muted); opacity: 1; }
:is(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--theme-focus);
  outline-offset: 4px;
}
/* Authored dark islands remain photographic/graphite in both themes. No inversion. */
:is(.site-header, .site-footer, .hero, .cat-hero, .cat-detail-hero, .layer-band, .chapter,
    .cat-editorial-note, .cat-project.cloud, .cat-project.workshop, .cat-story-group.metal .cat-story,
    .facts, .portrait-card) {
  --theme-text: #edf5fa;
  --theme-muted: #b7ccda;
  --theme-surface: #102b3b;
  --theme-raised: #193a4d;
  --theme-link: #63d4ff;
  --theme-business: #ff8eb4;
  --theme-metal: #c8d9e4;
  --theme-focus: #63d4ff;
  --theme-control: #7995a6;
  --theme-line: #496878;
  --muted: #b7ccda;
  --line: #496878;
  --control-border: #7995a6;
  color-scheme: dark;
}
.skip { background: var(--theme-surface); color: var(--theme-text); }
.button, .open-slices, .cat-project-button, .cat-empty button {
  background-color: var(--theme-action); border-color: var(--theme-action); color: var(--theme-action-text);
}
.button.secondary { background: transparent; color: inherit; border-color: currentColor; }
.button:hover, .open-slices:hover, .cat-project-button:hover, .cat-empty button:hover {
  background-color: #62d1fa; color: #071923;
}
.button.secondary:hover { background: var(--theme-raised); color: var(--theme-text); }
.layer-band.business .open-slices { background: #e83c78; border-color: #e83c78; color: #071923; }
.layer-band.business .open-slices:hover { background: #ff8eb4; }
.blue, .contact-help .blue { color: var(--theme-link); }
.raspberry { color: var(--theme-business); }
.site-header #site-nav a:is(:hover, [aria-current="page"]),
.site-header #site-nav .nav-contact, .footer-contact, .site-footer > a:last-of-type {
  color: #63d4ff;
}
.site-header #site-nav .resume-link { color: #c6d4de; }
.hero-layers .business, .hero-layer-key .business, .chapter.business .chapter-num { color: #ff8eb4; }
.hero-layers .business i, .hero-layer-key .business i { color: #ff8eb4; }
/* Reading surfaces, including new content inserted by the existing router. */
.catalogue, .cat-detail, .experience-chat { background: var(--theme-bg); color: var(--theme-text); }
.section.wrap.intro, .section.intro + .layer-intro { background: var(--theme-surface); }
.section.workshop, .contact-form, .booking { background: var(--theme-raised); color: var(--theme-text); border-color: var(--theme-line); }
.intro-visual figcaption { background: var(--theme-surface); color: var(--theme-muted); }
.workshop-kicker, .how-card h3, .edu-item h3, .contact-details li span { color: var(--theme-text); }
:is(.about-prose, .about-lead, .about-facts, .journey-intro, .how-intro, .how-card p,
    .workbench-copy p, .edu-item p, .eyebrow) { color: var(--theme-muted); }
.workshop-badge, .initial-mark { background: var(--theme-raised); color: var(--theme-muted); }
:is(.how-icon.blue-tint, .how-icon.blue-icon, .how-icon.cyan-tint, .edu-icon, .contact-icon) {
  background: var(--theme-raised); color: var(--theme-link); border-color: var(--theme-control);
}
:is(.how-icon.raspberry-tint, .how-icon.raspberry-icon) { background: var(--theme-raised); color: var(--theme-business); }
:is(.workshop-cta, .contact-email, .cat-group-heading a, .cat-text-link, .cat-reading a,
    .cat-sources a, .cat-next > a, .experience-demo__diagram summary) { color: var(--theme-link); }
.cat-controls, .cat-project, .cat-group-heading, .cat-source-link, .cat-review-note,
.cat-sources, .cat-next, .cat-related li { border-color: var(--theme-line); }
.cat-search, .cat-story, .cat-project.is-compact, .cat-project-source, .button.contact-pill {
  background: var(--theme-surface); color: var(--theme-text); border-color: var(--theme-control);
}
.cat-story { border-color: var(--theme-line); }
.cat-search input { color: inherit; }
.cat-search input::placeholder { color: var(--theme-muted); }
.cat-filters button { background: var(--theme-raised); color: var(--theme-text); border-color: var(--theme-control); }
.cat-filters button.business, .cat-filters button.cloud { background: var(--theme-raised); border-color: var(--theme-control); }
.cat-filters button[aria-pressed="true"] { background: #071923; border-color: var(--theme-control); color: #fff; }
.cat-filters button.business[aria-pressed="true"] { background: #e83c78; border-color: #e83c78; color: #071923; }
.cat-filters button.cloud[aria-pressed="true"] { background: #00aff0; border-color: #00aff0; color: #071923; }
.cat-filters button:is(:hover, :focus-visible) { border-color: var(--theme-link); }
:is(.cat-result-count, .cat-status, .cat-story-copy .cat-status, .cat-story-copy > p:not(.cat-status),
    .cat-project.is-compact .cat-project-body > p:not(.cat-status), .cat-detail-aside p,
    .cat-review-note p, .cat-next > span, .cat-empty p, .cat-source-link,
    .cat-gallery figcaption, .cat-construction-photo figcaption) { color: var(--theme-muted); }
.cat-story.workshop .cat-story-copy > p.cat-status { color: #edf5fa; }
.cat-story.cloud .cat-status, .cloud .cat-layer { color: var(--theme-link); }
.business .cat-layer, .cat-compact-icon { color: var(--theme-business); }
.cat-layer { color: var(--theme-metal); }
.cat-tags li, .cat-reading code { background: var(--theme-raised); color: var(--theme-text); }
.cat-project-visual { background: var(--theme-raised); }
.cat-project.cloud, .cat-project.workshop, .cat-story-group.metal .cat-story { background: #071923; color: #edf5fa; }
.cat-story-group.metal .cat-text-link { color: #63d4ff; }
.cat-project-source:hover, .button.contact-pill:hover { background: var(--theme-raised); color: var(--theme-link); }
@media (min-width: 901px) {
  .cat-story-group.cloud .cat-story:first-child {
    --theme-muted: #b7ccda; --theme-link: #63d4ff; --theme-focus: #63d4ff;
    background: #071923; color: #edf5fa;
  }
  .cat-story-group.cloud .cat-story:first-child .cat-text-link { color: #63d4ff; }
}
/* Existing SVG diagrams are authored on graphite; keep their palette intact. */
.semantic-diagram, .cat-project-diagram { background: #071923; color-scheme: dark; }
.cat-diagram { color: var(--theme-link); }
.cat-diagram rect { fill: var(--theme-surface); stroke: var(--theme-link); }
.cat-diagram text, .cat-diagram .cat-diagram-caption { fill: var(--theme-text); }
/* Contact, calendar proposal, and optional Explore forms. */
.contact-form .field :is(input, select, textarea), .booking input:not([type="checkbox"]), .booking select {
  background: var(--theme-surface); color: var(--theme-text); border-color: var(--theme-control); font-size: 16px;
}
.contact-form .field :is(input, textarea)::placeholder { color: var(--theme-muted); }
.contact-submit { background: #0066dd; border-color: #0066dd; color: #fff; }
.contact-submit:hover { background: #0052b4; border-color: #0052b4; color: #fff; }
.booking__intro > p, .booking__limits, .booking__privacy, .booking__fields p,
.booking__meeting p, .booking__review > p { color: var(--theme-muted); }
.booking__status, .booking input[readonly], .booking__meeting select:disabled,
.booking__review button:disabled { background: var(--theme-raised); color: var(--theme-muted); border-color: var(--theme-control); }
.booking__status span { background: var(--theme-muted); }
.booking summary { color: var(--theme-link); }
.booking__error { color: var(--theme-error); }
.booking__disclosure, .booking__review, .booking__review dl > div { border-color: var(--theme-line); }
.status-note { background: var(--theme-raised); color: var(--theme-text); }
.experience-chat { --chat-ink: var(--theme-text); --chat-muted: var(--theme-muted); --chat-line: var(--theme-line); }
.experience-chat__conversation, .experience-chat__composer, .experience-chat__composer textarea,
.experience-chat button { background: var(--theme-surface); color: var(--theme-text); border-color: var(--theme-control); }
.experience-chat__message--user, .experience-chat__prompts button, .experience-chat button:hover:not(:disabled) {
  background: var(--theme-raised); color: var(--theme-text); border-color: var(--theme-control);
}
.experience-chat button:disabled, .experience-chat__composer textarea:disabled {
  background: var(--theme-raised); color: var(--theme-muted); border-color: var(--theme-control); opacity: 1;
}
.experience-chat__composer button { background: #00aff0; color: #071923; border-color: #00aff0; }
.experience-chat a, .experience-chat a:hover { color: var(--theme-link); }
.experience-chat__status, .experience-chat__record p, .experience-chat summary,
.experience-chat__form .experience-chat__consent { color: var(--theme-text); }
.experience-chat__composer textarea::placeholder { color: var(--theme-muted); }
.experience-chat__messages { scrollbar-color: var(--theme-control) var(--theme-bg); }
/* Deliberately no animated theme transition; changes also respect reduced motion. */
.portfolio-theme { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 14px; font-weight: 700; line-height: 1.5; }
.portfolio-theme select { min-height: 44px; max-width: 100%; padding: 8px 12px; border: 1px solid var(--theme-control); border-radius: 0; background: var(--theme-surface); color: var(--theme-text); font: inherit; cursor: pointer; }
.portfolio-theme select:focus-visible { outline: 3px solid var(--theme-focus); outline-offset: 4px; }
.site-footer .portfolio-theme { color: #edf5fa; }
@media (forced-colors: active) {
  .portfolio-theme select { border: 1px solid ButtonText; background: Canvas; color: CanvasText; }
  .portfolio-theme select:focus-visible { outline-color: Highlight; }
}

/* New About marks use neutral grounds; their source pixels are never inverted. */
:root{--theme-logo-ground:transparent}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--theme-logo-ground:#f4f8fb}}
:root[data-theme="dark"]{--theme-logo-ground:#f4f8fb}
.career-logo,.education-logo{background:var(--theme-logo-ground);box-shadow:0 0 0 6px var(--theme-logo-ground)}

/* True-alpha employer marks: white on dark, original official colors on light. */
:root{--career-original-opacity:1;--career-white-opacity:0}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--career-original-opacity:0;--career-white-opacity:1}}
:root[data-theme="dark"]{--career-original-opacity:0;--career-white-opacity:1}
.career-logo{background:transparent;box-shadow:none;opacity:var(--career-original-opacity)}
.career-mark::after{content:"";position:absolute;inset:0;pointer-events:none;background:#fff;opacity:var(--career-white-opacity);-webkit-mask-image:var(--career-alpha);mask-image:var(--career-alpha);mask-mode:alpha;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}