/* GENERATED: edit named source modules, then run scripts/build.py. */
/* SOURCE: generated/tokens.css */
/* GENERATED from tokens/source. Run python scripts/build-tokens.py. */
:root {
  --accent: var(--color-teal);
  --action: var(--color-teal);
  --action-chamfer: 14px;
  --action-disabled-bg: #e6eae8;
  --action-disabled-border: #c7ceca;
  --action-disabled-text: #626a68;
  --action-gap: .6em;
  --action-height: 48px;
  --action-height-compact: 44px;
  --action-hover: #101010;
  --action-label-leading: 1.2;
  --action-label-size: .875rem;
  --action-label-weight: 700;
  --action-letter-spacing: .08em;
  --action-lift: -2px;
  --action-padding-x: 1.5rem;
  --action-padding-y: .85rem;
  --action-primary-background: var(--color-teal);
  --action-primary-foreground: var(--color-paper);
  --action-radius: 0px;
  --action-secondary-background: var(--color-ink);
  --action-secondary-border: transparent;
  --action-secondary-foreground: var(--color-paper);
  --aqua: var(--color-aqua);
  --border: 1px solid var(--color-line);
  --border-strong: var(--text-primary);
  --border-subtle: var(--color-rule-neutral);
  --border-width-default: 1px;
  --border-width-default-semantic: var(--border-width-default);
  --border-width-strong: 2px;
  --border-width-strong-semantic: var(--border-width-strong);
  --breakpoint-expanded-min: 64rem;
  --breakpoint-medium-min: 38rem;
  --breakpoint-narrow-min: 0rem;
  --color-aqua: #6fc9c9;
  --color-clay: #c96442;
  --color-coral: #f25147;
  --color-coral-soft: #f97068;
  --color-ink: #101010;
  --color-line: #d8dfdc;
  --color-mist: #f0f4f3;
  --color-muted: #525a59;
  --color-muted-neutral: #525252;
  --color-navy: #343c61;
  --color-paper: #fefefe;
  --color-paper-warm: #fafaf7;
  --color-rule-neutral: #d8d8d8;
  --color-source-observed-aqua: var(--color-aqua);
  --color-source-observed-black: var(--color-ink);
  --color-source-observed-coral: var(--color-coral);
  --color-source-observed-deep-teal: var(--color-teal);
  --color-source-observed-light-coral: var(--color-coral-soft);
  --color-source-observed-navy: var(--color-navy);
  --color-source-observed-white: var(--color-paper);
  --color-source-observed-yellow: var(--color-yellow);
  --color-teal: #11797c;
  --color-yellow: #fbc733;
  --container: 84rem;
  --content-full: var(--content-width-full);
  --content-narrow: var(--content-width-narrow);
  --content-reading: var(--content-width-reading);
  --content-standard: var(--content-width-standard);
  --content-width-full: 100%;
  --content-width-narrow: 50ch;
  --content-width-reading: 62ch;
  --content-width-standard: 76rem;
  --coral: var(--color-coral-soft);
  --coral-deep: var(--color-coral);
  --coral-soft: var(--color-clay);
  --display-lg: clamp(1.75rem,2.8vw,2.8rem);
  --display-md: clamp(1.35rem,1.65vw,1.85rem);
  --display-sm: 1.125rem;
  --display-xl: clamp(2rem,3.5vw,3.6rem);
  --dur-1: var(--duration-pointer);
  --dur-2: var(--duration-hover);
  --dur-3: var(--duration-sweep);
  --dur-4: var(--duration-reveal);
  --duration-context: 300ms;
  --duration-feedback: 4000ms;
  --duration-hover: 240ms;
  --duration-marquee: 32s;
  --duration-micro: 150ms;
  --duration-pointer: 140ms;
  --duration-reveal: 620ms;
  --duration-standard: 200ms;
  --duration-sweep: 380ms;
  --ease-emphasis: var(--easing-emphasis);
  --ease-glide: var(--easing-glide);
  --ease-soft: var(--easing-soft);
  --easing: cubic-bezier(.2,.65,.3,1);
  --easing-emphasis: cubic-bezier(.16,1,.3,1);
  --easing-glide: cubic-bezier(.65,0,.35,1);
  --easing-soft: cubic-bezier(.4,0,.2,1);
  --focus: var(--color-ink);
  --focus-minimum-contrast: 3:1;
  --focus-offset: 3px;
  --focus-offset-semantic: var(--focus-offset);
  --focus-offset-separated: 4px;
  --focus-offset-separated-semantic: var(--focus-offset-separated);
  --focus-ring: var(--color-ink);
  --focus-ring-width: 2px;
  --focus-width: var(--focus-ring-width);
  --font-body: system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-display: 'TAN - HEADLINE',Georgia,serif;
  --font-family-display: var(--font-display);
  --font-family-functional: var(--font-body);
  --font-mono: var(--font-body);
  --font-size-body-lg: 1.125rem;
  --font-size-body-md: 1rem;
  --font-size-body-sm: 0.875rem;
  --font-size-caption: 0.8125rem;
  --font-size-display-lg: clamp(1.8rem, 1.2rem + 2vw, 3rem);
  --font-size-display-md: clamp(1.4rem, 1.1rem + 1vw, 2rem);
  --font-size-display-xl: clamp(2.2rem, 1.3rem + 3vw, 4rem);
  --font-size-heading-lg: clamp(1.2rem, 1.1rem + .5vw, 1.6rem);
  --font-size-heading-md: 1.125rem;
  --font-size-heading-sm: 1rem;
  --font-size-label: 0.875rem;
  --font-size-metadata: 0.8125rem;
  --font-weight-bold: 700;
  --font-weight-regular: var(--weight-display);
  --font-weight-semibold: 600;
  --gap: clamp(1rem,2.5vw,2.25rem);
  --grid-columns-expanded: 12;
  --grid-columns-medium: 8;
  --grid-columns-narrow: 4;
  --grid-gap-compact: 1rem;
  --grid-gap-standard: 1.5rem;
  --gutter: clamp(1.25rem,4.5vw,4rem);
  --header-height: 5.5rem;
  --heading-synthesis: weight;
  --icon-size-campaign: 3rem;
  --icon-size-feature: 2rem;
  --icon-size-inline: 1rem;
  --icon-size-standard: 1.5rem;
  --icon-stroke-default: 1.5px;
  --icon-stroke-emphasis: 2px;
  --image-ratio-editorial: 3 / 2;
  --image-ratio-event: 3 / 2;
  --image-ratio-portrait: 4 / 5;
  --image-ratio-poster: 7 / 10;
  --image-ratio-poster-alternate: 2 / 3;
  --image-ratio-still: 16 / 9;
  --image-ratio-still-alternate: 3 / 2;
  --ink: var(--color-ink);
  --layout-grid-columns-expanded: var(--grid-columns-expanded);
  --layout-grid-columns-medium: var(--grid-columns-medium);
  --layout-grid-columns-narrow: var(--grid-columns-narrow);
  --layout-grid-gap-compact: var(--grid-gap-compact);
  --layout-grid-gap-standard: var(--grid-gap-standard);
  --leading-body: 1.65;
  --leading-display: 1.25;
  --leading-label: 1.35;
  --letter-spacing-label-uppercase: 0.065em;
  --letter-spacing-natural: normal;
  --line-height-action: 1.2;
  --line-height-body: 1.65;
  --line-height-body-compact: 1.5;
  --line-height-display: 1.25;
  --line-height-heading-functional: 1.35;
  --line-height-label: 1.25;
  --line-height-metadata: 1.45;
  --listing-action-primary: var(--color-teal);
  --listing-action-primary-foreground: var(--color-paper);
  --listing-action-primary-hover: #0e6466;
  --listing-action-secondary: #101010;
  --listing-action-secondary-foreground: #fefefe;
  --listing-aqua: var(--color-aqua);
  --listing-coral: var(--color-coral);
  --listing-coral-soft: var(--color-coral-soft);
  --listing-dur-1: 140ms;
  --listing-dur-2: 220ms;
  --listing-dur-3: 340ms;
  --listing-dur-4: 520ms;
  --listing-dur-5: 780ms;
  --listing-easing-emphasis: cubic-bezier(.2,.7,.1,1);
  --listing-easing-soft: cubic-bezier(.4,0,.2,1);
  --listing-focus-ring: #11797c;
  --listing-ink: var(--color-ink);
  --listing-ink-deep: #1a1916;
  --listing-ink-fade: #6b6964;
  --listing-ink-mid: #525252;
  --listing-measure: 76rem;
  --listing-navy: var(--color-navy);
  --listing-paper: var(--color-paper);
  --listing-paper-warm: #fafaf7;
  --listing-radius-action: 4px;
  --listing-radius-card: 6px;
  --listing-radius-pill: 999px;
  --listing-rule: #d8d8d8;
  --listing-space-1: 4px;
  --listing-space-10: 40px;
  --listing-space-12: 48px;
  --listing-space-16: 64px;
  --listing-space-2: 8px;
  --listing-space-20: 80px;
  --listing-space-24: 96px;
  --listing-space-3: 12px;
  --listing-space-4: 16px;
  --listing-space-5: 20px;
  --listing-space-6: 24px;
  --listing-space-8: 32px;
  --listing-teal: var(--color-teal);
  --listing-text-muted: #525252;
  --listing-text-primary: #101010;
  --listing-text-secondary: #343c61;
  --listing-type-body: var(--font-body);
  --listing-type-display: var(--font-display);
  --listing-type-mono: var(--font-mono);
  --listing-yellow: var(--color-yellow);
  --motion-duration-context: 300ms;
  --motion-duration-instant: 0ms;
  --motion-duration-micro: 150ms;
  --motion-duration-standard: 200ms;
  --motion-easing-standard: ease-out;
  --mute: var(--color-muted-neutral);
  --navy: var(--color-navy);
  --on-accent: var(--color-paper);
  --on-action: var(--color-paper);
  --on-coral: var(--color-ink);
  --on-coral-deep: var(--color-ink);
  --on-navy: var(--color-paper);
  --on-yellow: var(--color-ink);
  --pad-x: var(--showcase-gutter);
  --paper: var(--color-paper);
  --paper-warm: var(--color-paper-warm);
  --radius: 0;
  --radius-card: 0.375rem;
  --radius-compact: 0.25rem;
  --radius-control: 2px;
  --radius-pill: 100vmax;
  --radius-sharp: 0;
  --reading: 62ch;
  --rule: var(--color-rule-neutral);
  --rule-color: var(--color-rule-neutral);
  --rule-w: var(--border-width-default);
  --section: clamp(3.5rem,7vw,6.5rem);
  --showcase-breakpoint-grid: 55rem;
  --showcase-breakpoint-menu: 75rem;
  --showcase-card-radius: var(--radius-card);
  --showcase-container: 76rem;
  --showcase-gutter: clamp(1.25rem,4vw,3rem);
  --showcase-input-radius: var(--showcase-radius-input);
  --showcase-radius-input: 4px;
  --showcase-section: clamp(3rem,6vw,6rem);
  --showcase-space-1: var(--space-1);
  --showcase-space-2: var(--space-2);
  --showcase-space-3: var(--space-3);
  --showcase-space-4: var(--space-4);
  --showcase-space-5: var(--space-6);
  --showcase-space-6: var(--space-8);
  --showcase-space-7: var(--space-12);
  --showcase-space-8: var(--space-16);
  --showcase-space-9: var(--space-24);
  --space-1: .25rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-2: .5rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 1.75rem;
  --space-8: 2rem;
  --space-9: 2.25rem;
  --space-page-gutter: clamp(1rem, 4vw, 3rem);
  --space-section: clamp(2.5rem, 6vw, 5rem);
  --spacing-campaign-field: var(--space-16);
  --spacing-content-group: var(--space-6);
  --spacing-metadata-group: var(--space-2);
  --spacing-page-gutter: var(--space-page-gutter);
  --spacing-section: var(--space-section);
  --surface: var(--color-paper);
  --surface-base: var(--color-paper);
  --surface-emphasis: var(--color-yellow);
  --surface-inverse: var(--color-ink);
  --target: 48px;
  --text: var(--color-ink);
  --text-base: 1rem;
  --text-inverse: var(--color-paper);
  --text-invert: var(--color-paper);
  --text-lg: 1.125rem;
  --text-mute: var(--color-muted-neutral);
  --text-primary: var(--color-ink);
  --text-secondary: var(--color-muted-neutral);
  --text-sm: .875rem;
  --text-xs: .8125rem;
  --type-body: 1rem;
  --type-display: var(--display-xl);
  --type-eyebrow: .75rem;
  --type-h1: var(--display-xl);
  --type-h2: var(--display-lg);
  --type-h3: var(--display-md);
  --type-h4: var(--display-sm);
  --type-label: var(--action-label-size);
  --type-lead: 1.1875rem;
  --type-small: .8125rem;
  --typography-action-label-font-family: var(--font-family-functional);
  --typography-action-label-font-size: var(--font-size-label);
  --typography-action-label-font-weight: var(--font-weight-bold);
  --typography-action-label-line-height: var(--line-height-action);
  --typography-body-lg-font-family: var(--font-family-functional);
  --typography-body-lg-font-size: var(--font-size-body-lg);
  --typography-body-lg-line-height: var(--line-height-body);
  --typography-body-md-font-family: var(--font-family-functional);
  --typography-body-md-font-size: var(--font-size-body-md);
  --typography-body-md-line-height: var(--line-height-body);
  --typography-body-sm-font-family: var(--font-family-functional);
  --typography-body-sm-font-size: var(--font-size-body-sm);
  --typography-body-sm-line-height: var(--line-height-body-compact);
  --typography-caption-font-family: var(--font-family-functional);
  --typography-caption-font-size: var(--font-size-caption);
  --typography-caption-line-height: var(--line-height-metadata);
  --typography-display-lg-font-family: var(--font-family-display);
  --typography-display-lg-font-size: var(--font-size-display-lg);
  --typography-display-lg-font-weight: var(--font-weight-regular);
  --typography-display-lg-line-height: var(--line-height-display);
  --typography-display-md-font-family: var(--font-family-display);
  --typography-display-md-font-size: var(--font-size-display-md);
  --typography-display-md-font-weight: var(--font-weight-regular);
  --typography-display-md-line-height: var(--line-height-display);
  --typography-display-xl-font-family: var(--font-family-display);
  --typography-display-xl-font-size: var(--font-size-display-xl);
  --typography-display-xl-font-weight: var(--font-weight-regular);
  --typography-display-xl-letter-spacing: var(--letter-spacing-natural);
  --typography-display-xl-line-height: var(--line-height-display);
  --typography-heading-lg-font-family: var(--font-display);
  --typography-heading-lg-font-size: var(--font-size-heading-lg);
  --typography-heading-lg-font-weight: var(--weight-heading);
  --typography-heading-lg-line-height: var(--line-height-display);
  --typography-heading-md-font-family: var(--font-family-functional);
  --typography-heading-md-font-size: var(--font-size-heading-md);
  --typography-heading-md-font-weight: var(--font-weight-semibold);
  --typography-heading-md-line-height: var(--line-height-heading-functional);
  --typography-heading-sm-font-family: var(--font-family-functional);
  --typography-heading-sm-font-size: var(--font-size-heading-sm);
  --typography-heading-sm-font-weight: var(--font-weight-semibold);
  --typography-heading-sm-line-height: var(--line-height-heading-functional);
  --typography-label-font-family: var(--font-family-functional);
  --typography-label-font-size: var(--font-size-label);
  --typography-label-line-height: var(--line-height-label);
  --typography-metadata-font-family: var(--font-family-functional);
  --typography-metadata-font-size: var(--font-size-metadata);
  --typography-metadata-line-height: var(--line-height-metadata);
  --weight-body: 400;
  --weight-display: 400;
  --weight-heading: 700;
  --weight-label: 600;
  --wrap: var(--showcase-container);
  --yellow: var(--color-yellow);
}

/* SOURCE: components/typography.css */
/* Typography: all 13 semantic roles. Load generated/tokens.css first.
 * Consumes typography-<role>-* plus regular/semibold weight and natural tracking.
 * TAN is display-only. Titles use Regular 400. Secondary headings use the explicitly requested 700 synthesis.
 * Generated semantics win over spec differences: Body L leading 1.65, Heading S 1.35.
 * Font-face descriptors cannot use var(); family/400 below match approved tokens.
 * Local supplied font for review only; webfont licensing remains unresolved.
 */
/* Font loading is owned by production base.css (D-013 embedded WOFF2). */
:where([class*="lca-type-"]) {
  margin: 0;
  overflow-wrap: anywhere;
  font-style: normal;
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-natural);
}
.lca-type-display-xl {
  font-family: var(--typography-display-xl-font-family);
  font-weight: var(--typography-display-xl-font-weight);
  font-size: var(--typography-display-xl-font-size);
  line-height: var(--typography-display-xl-line-height);
  letter-spacing: var(--typography-display-xl-letter-spacing);
}
.lca-type-display-lg {
  font-family: var(--typography-display-lg-font-family);
  font-weight: var(--typography-display-lg-font-weight);
  font-size: var(--typography-display-lg-font-size);
  line-height: var(--typography-display-lg-line-height);
}
.lca-type-display-md {
  font-family: var(--typography-display-md-font-family);
  font-weight: var(--typography-display-md-font-weight);
  font-size: var(--typography-display-md-font-size);
  line-height: var(--typography-display-md-line-height);
}
.lca-type-heading-lg {
  font-family: var(--typography-heading-lg-font-family);
  font-weight: var(--typography-heading-lg-font-weight);
  font-size: var(--typography-heading-lg-font-size);
  line-height: var(--typography-heading-lg-line-height);
}
:is(.lca-type-display-xl, .lca-type-display-lg, .lca-type-display-md, .lca-type-heading-lg) { font-synthesis: none; }
.lca-type-heading-md {
  font-family: var(--typography-heading-md-font-family);
  font-weight: var(--typography-heading-md-font-weight);
  font-size: var(--typography-heading-md-font-size);
  line-height: var(--typography-heading-md-line-height);
}
.lca-type-heading-sm {
  font-family: var(--typography-heading-sm-font-family);
  font-weight: var(--typography-heading-sm-font-weight);
  font-size: var(--typography-heading-sm-font-size);
  line-height: var(--typography-heading-sm-line-height);
}
.lca-type-body-lg {
  font-family: var(--typography-body-lg-font-family);
  font-size: var(--typography-body-lg-font-size);
  line-height: var(--typography-body-lg-line-height);
}
.lca-type-body-md {
  font-family: var(--typography-body-md-font-family);
  font-size: var(--typography-body-md-font-size);
  line-height: var(--typography-body-md-line-height);
}
.lca-type-body-sm {
  font-family: var(--typography-body-sm-font-family);
  font-size: var(--typography-body-sm-font-size);
  line-height: var(--typography-body-sm-line-height);
}
.lca-type-label {
  font-family: var(--typography-label-font-family);
  font-weight: var(--font-weight-semibold);
  font-size: var(--typography-label-font-size);
  line-height: var(--typography-label-line-height);
}
.lca-type-metadata {
  font-family: var(--typography-metadata-font-family);
  font-size: var(--typography-metadata-font-size);
  line-height: var(--typography-metadata-line-height);
}
.lca-type-caption {
  font-family: var(--typography-caption-font-family);
  font-size: var(--typography-caption-font-size);
  line-height: var(--typography-caption-line-height);
}
.lca-type-action-label {
  font-family: var(--typography-action-label-font-family);
  font-weight: var(--typography-action-label-font-weight);
  font-size: var(--typography-action-label-font-size);
  line-height: var(--typography-action-label-line-height);
}

/* Finalization: explicit section-role weight; no fabricated font binary. */
.lca-type-heading-lg{font-weight:var(--weight-heading);font-synthesis:weight}

/* SOURCE: components/layout.css */
/* Layout: Container (76rem + approved gutters), Section (standard/compact),
 * Stack (standard/tight/loose), wrapping Cluster (standard/tight), Divider.
 * Consumes content-standard, spacing-*, space-*, border-width-default.
 * Section only owns vertical rhythm; no campaign variant requested in Phase 1.
 * Divider uses the resolved border-subtle semantic role.
 * Zeroes, percentages and flex factors are structural, not new visual scale values.
 */
.lca-container {
  box-sizing: border-box;
  inline-size: min(calc(100% - var(--spacing-page-gutter) * 2), var(--content-standard));
  margin-inline: auto;
}
.lca-section { padding-block: var(--spacing-section); }
.lca-section--compact { padding-block: var(--spacing-content-group); }
.lca-stack { display: flex; flex-direction: column; gap: var(--spacing-content-group); }
.lca-stack--tight { gap: var(--spacing-metadata-group); }
.lca-stack--loose { gap: var(--space-8); }
.lca-stack > * { margin-block: 0; min-inline-size: 0; }
.lca-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.lca-cluster--tight { gap: var(--spacing-metadata-group); }
.lca-cluster > * { min-inline-size: 0; max-inline-size: 100%; }
.lca-divider {
  inline-size: 100%;
  margin: 0;
  border: 0;
  border-block-start: var(--border-width-default) solid;
}
[data-lca-demo] .lca-divider { border-color: var(--border-subtle); }

/* SOURCE: patterns/film-detail/film-detail-pattern.css */
/*
 * Film Detail
 * Status: APPROVED DIRECTION — IMPLEMENTATION PATTERN
 *
 * Composition CSS preserving the approved Round 1 identity → context →
 * attendance direction. Load generated tokens and approved typography/layout
 * CSS first. Campaign colours are expressive, not semantic status colours.
 */

.lca-film-detail-pattern,
.lca-film-detail-pattern * { box-sizing: border-box; }

.lca-film-detail-pattern {
  margin: 0;
  color: var(--text-primary);
  background: var(--surface-base);
  font-family: var(--font-family-functional);
}

.lca-film-detail-pattern img { display: block; max-inline-size: 100%; }
.lca-film-detail-pattern :focus-visible {
  outline: var(--focus-width) solid currentColor;
  outline-offset: var(--focus-offset-separated-semantic);
}

.lca-film-detail-skip-link {
  position: fixed;
  z-index: 10;
  inset-block-start: var(--space-2);
  inset-inline-start: var(--space-2);
  padding: var(--space-3) var(--space-4);
  color: var(--text-primary);
  background: var(--color-source-observed-yellow);
  font-weight: var(--font-weight-bold);
  transform: translateY(-180%);
}
.lca-film-detail-skip-link:focus { transform: translateY(0); }

.lca-film-detail { overflow: hidden; }
.lca-film-detail__kicker {
  margin: 0;
  font-size: var(--font-size-label);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-label);
  letter-spacing: var(--letter-spacing-label-uppercase);
  text-transform: uppercase;
}

.lca-film-detail__hero {
  display: grid;
  grid-template-columns: minmax(16rem, 4fr) minmax(0, 7fr);
  gap: var(--space-12);
  align-items: center;
  padding-block: var(--space-12) var(--space-16);
}
.lca-film-detail__media { margin: 0; min-inline-size: 0; }
.lca-film-detail__media img {
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: var(--image-ratio-poster);
  object-fit: contain;
  object-position: center;
  border-radius: var(--radius-card);
  background: var(--surface-inverse);
}
.lca-film-detail__identity { min-inline-size: 0; }
.lca-film-detail__title {
  max-inline-size: 12ch;
  margin: var(--space-2) 0 var(--space-3);
  font-family: var(--font-family-display);
  font-size: var(--font-size-display-xl);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-display);
  font-synthesis: none;
  overflow-wrap: anywhere;
}
.lca-film-detail__director {
  margin: 0;
  font-size: var(--font-size-body-lg);
  line-height: var(--line-height-body);
}
.lca-film-detail__identity-facts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-8);
  margin: var(--space-6) 0 0;
  padding-block-start: var(--space-4);
  border-block-start: var(--border-width-default) solid currentColor;
  font-size: var(--font-size-metadata);
  line-height: var(--line-height-metadata);
}
.lca-film-detail__identity-facts div { display: flex; gap: var(--space-2); }
.lca-film-detail__identity-facts dt { font-weight: var(--font-weight-bold); }
.lca-film-detail__identity-facts dd { margin: 0; font-variant-numeric: tabular-nums; }
.lca-film-detail__synopsis {
  max-inline-size: var(--content-reading);
  margin-block-start: var(--space-8);
  padding-inline-start: var(--space-6);
  border-inline-start: var(--border-width-strong) solid var(--color-source-observed-coral);
}
.lca-film-detail__synopsis-label {
  margin: 0 0 var(--space-3);
  font-family: var(--font-family-functional);
  font-size: var(--font-size-label);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-label);
  letter-spacing: var(--letter-spacing-label-uppercase);
  text-transform: uppercase;
}
.lca-film-detail__synopsis p { margin: 0; font-size: var(--font-size-body-lg); line-height: var(--line-height-body); }

.lca-film-detail__attendance {
  color: var(--text-inverse);
  background: var(--surface-inverse);
}
.lca-film-detail__attendance-inner {
  display: grid;
  grid-template-columns: minmax(11rem, 3fr) minmax(0, 8fr);
  gap: var(--space-8);
  align-items: start;
  padding-block: var(--space-8) var(--space-12);
}
.lca-film-detail__attendance-heading { min-inline-size: 0; }
.lca-film-detail__attendance-heading h2 { margin: var(--space-2) 0 0; }
.lca-film-detail__screening { min-inline-size: 0; }
.lca-film-detail__screening-title {
  margin: 0 0 var(--space-4);
  font-size: var(--font-size-heading-md);
  line-height: var(--line-height-heading-functional);
}
.lca-film-detail__screening-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4) var(--space-6);
  margin: 0;
  padding-block: var(--space-4);
  border-block: var(--border-width-default) solid var(--color-source-observed-aqua);
  font-size: var(--font-size-metadata);
  line-height: var(--line-height-metadata);
}
.lca-film-detail__screening-facts div { min-inline-size: 0; }
.lca-film-detail__screening-facts dt {
  margin-block-end: var(--space-1);
  color: var(--color-source-observed-aqua);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-label-uppercase);
  text-transform: uppercase;
}
.lca-film-detail__screening-facts dd { margin: 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.lca-film-detail__qa {
  margin-block-start: var(--space-4);
  padding-inline-start: var(--space-4);
  border-inline-start: var(--border-width-strong) solid var(--color-source-observed-yellow);
}
.lca-film-detail__qa p {
  margin: 0;
  font-size: var(--font-size-metadata);
  line-height: var(--line-height-metadata);
  overflow-wrap: anywhere;
}
.lca-film-detail__qa .lca-film-detail__qa-state {
  margin-block-end: var(--space-1);
  color: var(--color-source-observed-yellow);
  font-size: var(--font-size-label);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-label);
}
.lca-film-detail__route {
  max-inline-size: var(--content-narrow);
  margin: var(--space-4) 0 0;
  padding-block-start: var(--space-3);
  border-block-start: var(--border-width-default) solid currentColor;
  font-size: var(--font-size-body-sm);
  line-height: var(--line-height-body-compact);
}

.lca-film-detail-pattern--no-art { background: var(--color-source-observed-aqua); }
.lca-film-detail-pattern--no-art .lca-film-detail__hero { min-block-size: 28rem; }
.lca-film-detail__text-art {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: var(--space-6);
  min-block-size: 20rem;
  padding: var(--space-8);
  border-block-start: var(--border-width-strong) solid var(--color-source-observed-yellow);
  border-inline-start: var(--border-width-strong) solid var(--color-source-observed-aqua);
  color: var(--text-inverse);
  background: var(--color-source-observed-navy);
}
.lca-film-detail__text-art::after {
  content: '';
  position: absolute;
  inset-inline: var(--space-8);
  inset-block-end: var(--space-16);
  border-block-start: var(--border-width-default) solid var(--color-source-observed-aqua);
}
.lca-film-detail__text-art p { position: relative; z-index: 1; margin: 0; overflow-wrap: anywhere; }
.lca-film-detail__text-art-mark {
  max-inline-size: var(--content-narrow);
  font-size: var(--font-size-metadata);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-metadata);
  letter-spacing: var(--letter-spacing-label-uppercase);
  text-transform: uppercase;
}
.lca-film-detail__text-art-title {
  align-self: center;
  font-family: var(--font-family-display);
  font-size: var(--font-size-display-xl);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-display);
  font-synthesis: none;
}
.lca-film-detail__text-art-credit {
  padding-block-start: var(--space-4);
  font-size: var(--font-size-metadata);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-metadata);
}

@media (max-width: 63.99rem) {
  .lca-film-detail__hero { grid-template-columns: minmax(13rem, 4fr) minmax(0, 6fr); gap: var(--space-8); }
}

@media (max-width: 37.99rem) {
  .lca-film-detail__hero,
  .lca-film-detail-pattern--no-art .lca-film-detail__hero {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
    min-block-size: 0;
    padding-block: var(--space-6) var(--space-8);
  }
  .lca-film-detail__media { inline-size: min(100%, 14rem); margin-inline-start: auto; }
  .lca-film-detail__text-art { min-block-size: 16rem; padding: var(--space-6); }
  .lca-film-detail__text-art::after { inset-inline: var(--space-6); inset-block-end: var(--space-12); }
  .lca-film-detail__title { margin-block: var(--space-1) var(--space-2); }
  .lca-film-detail__director { font-size: var(--font-size-body-md); }
  .lca-film-detail__identity-facts { margin-block-start: var(--space-4); }
  .lca-film-detail__synopsis { margin-block-start: var(--space-6); padding-inline-start: var(--space-4); }
  .lca-film-detail__attendance-inner { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); padding-block: var(--space-8); }
  .lca-film-detail__screening-title { margin-block-end: var(--space-4); }
  .lca-film-detail__screening-facts { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); padding-block: var(--space-4); }
  .lca-film-detail__qa,
  .lca-film-detail__route { margin-block-start: var(--space-4); }
}

/* Requested secondary heading weight. Main film title remains regular. */
.lca-film-detail__attendance-heading .lca-type-heading-lg{font-weight:var(--weight-heading);font-synthesis:weight}

/* Docs-required closing callout: foundations/base.css and
 * patterns/editorial/compositions.css, unchanged accepted geometry. */
.lca-film-detail .tone-yellow { background: var(--color-yellow); color: var(--color-ink); }
.lca-film-detail .callout { display: grid; grid-template-columns: 1.6fr 1fr; gap: 3rem; align-items: center; }
.lca-film-detail .callout > * { min-width: 0; }
.lca-film-detail .callout h2 { max-width: 25ch; }
.lca-film-detail .callout p { margin-top: 1.3rem; max-width: 55ch; }
@media (max-width: 760px) {
  .lca-film-detail .callout { grid-template-columns: 1fr; gap: 2rem; }
}

/* D-018: minimal production-only spacing for supplied multi-paragraph copy,
 * extended credits and related items; no changes to accepted hero geometry. */
.lca-film-detail__synopsis p + p { margin-block-start: var(--space-4); }
.lca-film-detail .credits-list { margin: 0; }
.lca-film-detail .credits-list div + div { margin-block-start: var(--space-3); }
.lca-film-detail .credits-list dt { font-weight: var(--font-weight-bold); }
.lca-film-detail .credits-list dd { margin: 0; }
.lca-film-detail .related-item { margin-block-start: var(--space-4); }