/* AI Engineer — the official neutral palette with one Sydney event accent. */
@layer theme {
  :root {
    --neutral-pure-white: #ffffff;
    --neutral-light-gray: #e5e5e5;
    --neutral-soft-gray: #dddddd;
    --neutral-pure-black: #000000;
    --neutral-dark-gray: #333333;
    --neutral-soft-dark-gray: #4a4a4a;

    --neutral-wash: color-mix(in srgb, var(--neutral-light-gray) 35%, var(--neutral-pure-white));
    --neutral-quiet: color-mix(in srgb, var(--neutral-light-gray) 64%, var(--neutral-pure-white));
    --event-accent: #4f46e5;

    --palette-brand: var(--neutral-pure-black);
    --palette-brand-hi: var(--neutral-dark-gray);
    --palette-theme: var(--neutral-wash);
    --palette-theme-hi: var(--neutral-quiet);
    --palette-accent: var(--neutral-pure-black);
    --palette-accent-2: var(--neutral-dark-gray);
    --palette-accent-3: var(--neutral-pure-black);
    --palette-on-accent: var(--neutral-pure-white);
    --palette-bg: var(--neutral-pure-white);
    --palette-panel: var(--neutral-wash);
    --palette-panel-alt: var(--neutral-quiet);
    --palette-rule: var(--neutral-soft-gray);
    --palette-ink: var(--neutral-pure-black);
    --palette-ink-weak: var(--neutral-dark-gray);
    --palette-ink-muted: var(--neutral-soft-dark-gray);

    --color-bg: var(--palette-bg);
    --color-panel: var(--palette-panel);
    --color-panel-alt: var(--palette-panel-alt);
    --color-rule: var(--palette-rule);
    --color-ink: var(--palette-ink);
    --color-ink-weak: var(--palette-ink-weak);
    --color-ink-muted: var(--palette-ink-muted);
    --color-accent: var(--palette-accent);
    --color-accent-hi: var(--palette-brand-hi);
    --color-accent-2: var(--palette-accent-2);
    --color-accent-3: var(--palette-accent-3);
    --color-on-accent: var(--palette-on-accent);

    --link: var(--event-accent);
    --link-hover: color-mix(in srgb, var(--event-accent), black 18%);
    --hairline: 1px solid var(--color-rule);

    --radius-2: 8px;
    --radius-3: 12px;
    --radius-4: 18px;
    --radius-pill: 999px;

    --site-nav-h: 64px;
    --site-nav-bg: var(--neutral-pure-white);
    --site-nav-ink: var(--neutral-pure-black);
    --site-nav-rule: 1px solid var(--neutral-soft-gray);
    --site-nav-hover: var(--neutral-wash);
    --site-nav-accent: var(--event-accent);

    --page-nav-bg: color-mix(in srgb, var(--neutral-pure-white) 94%, transparent);
    --page-nav-text: var(--neutral-pure-black);
    --page-nav-divider-color: var(--neutral-soft-gray);
    --page-nav-button-text: var(--neutral-pure-white);

    --page-header-bg: var(--neutral-pure-white);
    --page-header-fg: var(--neutral-pure-black);
    --page-header-accent: var(--event-accent);
    --footer-bg: var(--neutral-dark-gray);
    --footer-ink: var(--neutral-pure-white);
  }

  ::selection {
    background: color-mix(in srgb, var(--event-accent) 24%, white);
    color: var(--neutral-pure-black);
  }

  #site-nav {
    --site-nav-accent: var(--event-accent);
    --site-nav-hover: var(--neutral-wash);
  }

  nav.page {
    backdrop-filter: saturate(140%) blur(12px);
  }

  #page-header {
    border-block-end: 1px solid var(--neutral-soft-gray);
  }

  #page-header h2 em {
    color: var(--event-accent);
    font-style: italic;
    font-weight: inherit;
    text-decoration: none;
  }

  #page-header .hero-actions .button:first-child {
    --btn-bg: var(--neutral-pure-black);
    --btn-ink: var(--neutral-pure-white);
  }

  #page-header .hero-actions .button + .button {
    --btn-bg: transparent;
    --btn-ink: var(--neutral-pure-black);
    border: 1.5px solid var(--neutral-pure-black);
    box-shadow: none;
    box-sizing: border-box;
  }

  #page-header .hero-actions .button + .button:hover {
    --btn-bg-hover: var(--neutral-wash);
  }

  #page-header .hero-actions .button + .button:focus-visible {
    outline: 2px solid var(--event-accent);
    outline-offset: 3px;
  }

  #at-a-glance {
    background: var(--neutral-pure-black);
    color: var(--neutral-pure-white);
  }

  #at-a-glance li + li {
    border-inline-start: 1px solid var(--neutral-soft-dark-gray);
  }

  #at-a-glance p {
    color: var(--neutral-light-gray);
  }

  .ai-engineer-refresh :is(#tracks, #testimonials, #register, #about) {
    background: var(--neutral-wash);
  }

  .ai-engineer-refresh :is(#endorsement, #workshops, #venue, #code-of-conduct) {
    background: var(--neutral-pure-white);
    color: var(--neutral-pure-black);
  }

  .ai-engineer-refresh #livestream {
    background: var(--neutral-quiet);
    color: var(--neutral-pure-black);
  }

  .ai-engineer-refresh #about > .media-object {
    background: transparent;
    color: var(--neutral-pure-black);
  }

  .ai-engineer-refresh #code-of-conduct a {
    color: var(--link);
  }

  footer.site {
    --footer-bg: var(--neutral-dark-gray);
    --footer-ink: var(--neutral-pure-white);
    border-block-start-color: var(--neutral-dark-gray);
  }
}