:root { --color-player-scrim: #081008db; --color-player-glass: #172017db; --color-player-clear: #08100800; --color-player-track: #ffffff55; }
.film-player { position:relative; isolation:isolate; background:var(--color-ink); color:var(--color-paper); --color-focus:var(--color-lime); }
.film-player:focus-visible { outline:2px solid var(--color-lime); outline-offset:5px; }
.film-launch { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-sm); border:0; background:var(--color-transparent); color:var(--color-paper); cursor:pointer; text-shadow:0 2px 8px var(--color-player-scrim); }
.film-launch svg { width:76px; height:76px; border:1px solid var(--color-stage-rule); border-radius:50%; padding:var(--space-lg); background:var(--color-player-glass); backdrop-filter:blur(8px); transition:transform var(--dur-short) var(--ease-out),background var(--dur-short); }
.film-launch span { font-size:13px; }
.film-launch:hover svg { transform:scale(1.08); background:var(--color-accent); }
.is-playing .film-launch { display:none; }
.film-controls { position:absolute; inset:auto 0 0; display:flex; align-items:center; gap:var(--space-xs); padding:var(--space-xl) var(--space-md) var(--space-sm); background:linear-gradient(var(--color-player-clear),var(--color-player-scrim)); }
.film-controls button { flex:0 0 44px; width:44px; height:44px; display:grid; place-items:center; border:0; background:var(--color-transparent); color:var(--color-paper); }
.film-controls button:hover { color:var(--color-lime); }
.film-controls button svg { width:22px; height:22px; }
.film-controls button[aria-label="Unmute"] svg { opacity:.6; }
.film-time { font-variant-numeric:tabular-nums; font-size:12px; white-space:nowrap; }
.film-seek { flex:1; min-width:24px; height:44px; margin:0 var(--space-xs); appearance:none; background:transparent; cursor:pointer; }
.film-seek::-webkit-slider-runnable-track { height:2px; background:linear-gradient(to right,var(--color-lime) var(--played,0%),var(--color-player-track) var(--played,0%)); }
.film-seek::-webkit-slider-thumb { appearance:none; width:10px; height:10px; border-radius:50%; background:var(--color-lime); margin-top:-4px; }
.film-seek::-moz-range-track { height:2px; background:var(--color-player-track); }
.film-seek::-moz-range-progress { height:2px; background:var(--color-lime); }
.film-seek::-moz-range-thumb { width:10px; height:10px; border:0; border-radius:50%; background:var(--color-lime); }
.film-seek:focus-visible { outline:2px solid var(--color-lime); outline-offset:2px; }
.film-seek:disabled { opacity:.5; cursor:default; }
.film-status { position:absolute; inset:var(--space-md) var(--space-md) auto; font-size:12px; text-shadow:0 1px 5px var(--color-ink); pointer-events:none; }
.is-buffering .film-status:empty::after { content:'Loading film…'; }
.film-player:fullscreen { display:grid; place-items:center; width:100%; height:100%; }
.film-player:fullscreen video { width:100%; height:100%; max-height:100%; object-fit:contain; }
.player-fallback .film-launch,.player-fallback .film-controls { display:none; }
.music-film .film-player { box-shadow:0 20px 70px var(--color-shadow); }
.work-row .film-player { max-width:880px; margin-block:var(--space-xs) var(--space-lg); }
.work-row .film-player .archive-film { margin:0; }
@media(max-width:700px) { .film-controls { gap:var(--space-2xs); padding:var(--space-lg) var(--space-xs) var(--space-2xs); } .film-controls button { flex-basis:36px; width:36px; height:44px; } .film-time { font-size:10px; } .film-launch svg { width:60px; height:60px; padding:var(--space-md); } .film-seek { margin-inline:var(--space-2xs); } }
@media(prefers-reduced-motion:reduce) { .film-launch svg { transition:none; } }
.film-controls button[hidden] { display:none; }
.film-player:fullscreen .project-film { max-height:100%; height:100%; aspect-ratio:auto; }
/* The cover action is a compact target; the video itself also toggles playback. */
.film-launch { inset:50% auto auto 50%; transform:translate(-50%,-50%); width:52px; height:52px; }
.film-launch svg { width:52px; height:52px; flex-shrink:0; padding:var(--space-md); }
.film-launch span { position:absolute; top:calc(100% + var(--space-sm)); left:50%; transform:translateX(-50%); white-space:nowrap; }
.film-player:focus-visible,.film-player button:focus-visible,.film-player input:focus-visible { outline:2px solid var(--color-paper); outline-offset:2px; box-shadow:0 0 0 6px var(--color-ink); }
.film-case .film-player,.dining-case .film-player,.process-note .film-player { --player-ring:var(--color-accent); }
.film-player:focus-visible { outline-color:var(--player-ring,var(--color-paper)); }

@media(max-width:700px) { .film-launch span { display:none; } }
