﻿/* ---------------------------------------------------------------------------
 * LCA! Film Festival 2026 — refinement layer
 *
 * Ported into this repository under LCA2026-SITE-010 (decision D-018) from the
 * Living Experience workspace. Design language adopted by the owner.
 *
 * AUTHORITY
 *   assets/css/tokens.css owns every design value. This file consumes tokens
 *   and defines none. It must never redefine a --color-*, --font-*, --duration-*,
 *   --easing-*, --space-* or --display-* custom property.
 *
 * CASCADE CONTRACT
 *   This layer SUPPLEMENTS production CSS; it never replaces it. It is linked
 *   AFTER the page's own stylesheet so it wins only where specificity is equal
 *   or higher. `.btn` itself stays owned by assets/css/components.css.
 *
 * Namespace is `.r06-`. Every rule below is as authored in the source layer
 * except this comment block.
 * ------------------------------------------------------------------------ */
/* R06 controls and media objects; .btn itself is owned by the accepted components.css. */
.r06-poster { margin:0; background:var(--color-ink); }
.r06-poster img { width:100%; aspect-ratio:2/3; object-fit:contain; }
.r06-poster figcaption { background:var(--color-paper); color:var(--color-ink); padding:.75rem; font-size:.8rem; }
.r06-photo { margin:0; }
.r06-photo img { aspect-ratio:3/2; object-fit:cover; }
.r06-photo figcaption { font-size:.73rem; line-height:1.6; margin-top:.7rem; }
.r06-controls { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.r06-controls .btn { cursor:pointer; }
.r06-controls .btn--square { min-width:48px; padding:.85rem; }
.r06-progress { display:flex; gap:.4rem; margin-right:auto; }
.r06-progress button { border:0; padding:0; width:2.5rem; height:44px; display:grid; place-items:center; background:none; cursor:pointer; }
.r06-progress button::before { content:''; height:3px; width:100%; background:currentColor; opacity:.25; }
.r06-progress button[aria-current=true]::before { opacity:1; }
.r06-story-deck { position:relative; }
.r06-story-window { overflow:hidden; }
.r06-story-track { display:flex; transition:transform 600ms var(--easing-emphasis); }
.r06-story-slide { flex:0 0 100%; width:100%; }
.r06-story-slide[aria-hidden=true] { visibility:hidden; }
.r06-story-deck:not(.is-enhanced) .r06-story-track { display:grid; gap:2rem; }
.r06-story-deck:not(.is-enhanced) .r06-controls { display:none; }
.r06-story-count { font-size:.72rem; letter-spacing:.1em; }
.r06-stamp { display:inline-flex; align-items:center; justify-content:center; width:5.8rem; height:5.8rem; border:1px solid currentColor; border-radius:50%; font:700 .68rem/1.5 var(--font-body); letter-spacing:.1em; text-align:center; text-transform:uppercase; transform:rotate(-12deg); }
.r06-tag { font:700 .68rem/1.4 var(--font-body); letter-spacing:.06em; text-transform:uppercase; padding:.4rem .55rem; background:var(--color-yellow); color:var(--color-ink); display:inline-block; }
.r06-photo-button { display:block; width:100%; border:0; padding:0; background:transparent; color:inherit; cursor:zoom-in; text-align:left; }
.r06-photo-button img { transition:filter var(--duration-hover),transform var(--duration-hover); }
.r06-photo-button:hover img { filter:saturate(1.15); }
.r06-lightbox { width:min(960px,94vw); padding:1.2rem; border:0; background:var(--color-ink); color:var(--color-paper); max-height:94dvh; }
.r06-lightbox::backdrop { background:#000c; }
.r06-lightbox img { width:100%; max-height:72vh; object-fit:contain; }
.r06-lightbox .r06-controls { margin-bottom:1rem; justify-content:space-between; }
.r06-lightbox p { margin-top:.75rem; font-size:.8rem; }
.r06-accordion { display:flex; gap:.75rem; min-height:27rem; }
.r06-accordion article { flex:1; position:relative; transition:flex 500ms var(--easing-emphasis); overflow:hidden; background:var(--color-ink); color:var(--color-paper); }
.r06-accordion article.is-open { flex:3; }
.r06-accordion img { height:100%; width:100%; object-fit:cover; position:absolute; inset:0; }
.r06-accordion article::after { content:''; position:absolute; inset:30% 0 0; background:linear-gradient(transparent,#000e); pointer-events:none; }
.r06-accordion button { position:absolute; z-index:1; inset:0; padding:1.5rem; display:flex; align-items:flex-end; text-align:left; background:none; color:inherit; border:0; cursor:pointer; font:700 1.1rem/1.4 var(--font-body); }
.r06-accordion .r06-accordion-link { position:absolute; bottom:1.3rem; right:1rem; z-index:2; }
.r06-accordion article.is-open button { padding-bottom:5rem; }
.r06-accordion article:not(.is-open) .r06-accordion-link { display:none; }
@media(max-width:600px) { .r06-accordion { flex-direction:column; min-height:0; }.r06-accordion article{min-height:7rem;flex:auto}.r06-accordion article.is-open{min-height:24rem;flex:auto} }
/* Icon-control modifier: the control already contains its directional glyph. */
.r06-controls .btn::after { content:none; }
@media(prefers-reduced-motion:reduce){.r06-story-track,.r06-accordion article{transition:none}.r06-poster-fan .r06-poster{animation:none}}
@media(prefers-reduced-motion:reduce){.r06 .r06-story-track,.r06 .r06-accordion article{transition:none!important}}
