/* Shared public portal primitives. Page styles only define composition. */
:root {
  --portal-bg: #12100e;
  --portal-surface: #191714;
  --portal-text: #f3eee5;
  --portal-muted: #b7afa3;
  --portal-line: rgba(243, 238, 229, .16);
  --portal-gold: #c89b45;
  --portal-shadow: rgba(0, 0, 0, .4);
  --portal-header-ink: #f8f3ea;
  --portal-glass: rgba(9, 8, 7, .22);
  --portal-pill-radius: 999px;
  --portal-control-height: 42px;
  --portal-header-height: 84px;
  --portal-gutter: clamp(24px, 7.5vw, 128px);
  --portal-content-max: 1280px;
  --portal-display: 400 clamp(48px, 6vw, 96px) / .98 'Playfair Display', serif;
  --portal-label-font: 500 11px / 1 'DM Mono', monospace;
  --portal-transition: 180ms ease;
}

html[data-theme='light'] {
  --portal-bg: #f5f0e6;
  --portal-surface: #ede5d8;
  --portal-text: #26211d;
  --portal-muted: #766c60;
  --portal-line: rgba(38, 33, 29, .18);
  --portal-gold: #9f722b;
  --portal-shadow: rgba(49, 39, 26, .12);
  --portal-header-ink: #f8f3ea;
  --portal-glass: rgba(20, 17, 13, .28);
}

*, *::before, *::after { box-sizing: border-box; }

.fh-logo,
.pf-logo {
  color: var(--portal-header-ink);
  font: 400 23px / 1 'Playfair Display', serif;
  letter-spacing: .2em;
  text-decoration: none;
  text-shadow: 0 1px 18px rgba(0, 0, 0, .34);
}

.fh-logo span,
.pf-logo span { color: var(--portal-gold); }

.portal-pill,
.fh-nav,
.fh-nav a,
.fh-actions button,
.fh-primary,
.pf-theme-toggle,
.pf-back,
.pf-primary,
.pf-secondary,
.pf-showtime-day a,
.pf-showtime-day > span,
.pf-trailer,
.pf-trailer-close {
  border-radius: var(--portal-pill-radius);
}

.fh-nav,
.fh-actions button,
.pf-theme-toggle,
.pf-back {
  border: 1px solid color-mix(in srgb, var(--portal-header-ink) 28%, transparent);
  background: var(--portal-glass);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.fh-actions button,
.pf-theme-toggle,
.pf-back,
.pf-primary,
.pf-secondary,
.pf-showtime-day a,
.pf-showtime-day > span,
.pf-trailer-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--portal-control-height);
  font: 500 13px/1 'DM Sans', sans-serif;
  letter-spacing: .01em;
  text-decoration: none;
  transition: color var(--portal-transition), background var(--portal-transition), border-color var(--portal-transition), transform var(--portal-transition);
}

.fh-actions button,
.pf-theme-toggle,
.pf-back,
.pf-trailer-close { cursor: pointer; }

.fh-actions button:hover,
.pf-theme-toggle:hover,
.pf-back:hover,
.pf-secondary:hover,
.pf-showtime-day a:hover,
.pf-trailer-close:hover {
  background: color-mix(in srgb, var(--portal-header-ink) 13%, transparent);
}

.fh-primary:hover,
.pf-primary:hover {
  transform: translateY(-1px);
  background: var(--portal-gold);
  color: #17130f;
}

.fh-actions button:focus-visible,
.pf-theme-toggle:focus-visible,
.pf-back:focus-visible,
.pf-primary:focus-visible,
.pf-secondary:focus-visible,
.pf-showtime-day a:focus-visible,
.pf-trailer-close:focus-visible,
.fh-nav a:focus-visible {
  outline: 2px solid var(--portal-gold);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 1ms !important; }
}