:root { --night:var(--veat-night); --night-ink:var(--veat-pearl); --gold:var(--veat-lavender); }
.brand__wordmark { width:5.25rem; height:1.75rem; filter:none; }
.on-night .btn-primary { background:var(--veat-button); color:var(--veat-ink); box-shadow:var(--veat-button-shadow); }
.sign .wordmark { filter:drop-shadow(0 0 16px rgba(137,91,255,.36)); }
.sign { box-shadow:0 0 24px rgba(137,91,219,.2),var(--veat-highlight); }
.chat-launch .face,.chat .avatar .face { object-fit:contain; padding:.35rem; filter:none; }
.chat-launch { box-shadow:var(--veat-button-shadow); }
.route-lion.veat-rider,.mascot__illustration.veat-rider { background-image:url('assets/lion-cycle-12.webp'); background-size:400% 300%; background-repeat:no-repeat; background-position:0 0; animation:veat-pedal .84s steps(1,end) infinite; }
.mascot__illustration.veat-rider { display:block; aspect-ratio:1; height:auto; }
.pk-art { grid-area:art; width:100%; max-width:12rem; height:11rem; object-fit:contain; justify-self:center; align-self:center; }
.pack .pk-body { display:grid; grid-template-columns:12rem minmax(0,1fr); grid-template-areas:'art list' 'art save'; gap:.25rem 2rem; align-items:center; }
.pk-list { grid-area:list; }
.pk-save { grid-area:save; }
.film { padding:5rem 0; background:var(--night); color:var(--night-ink); border-top:1px solid var(--veat-line); }
.film__layout { display:grid; grid-template-columns:minmax(13rem,.72fr) minmax(0,1.5fr); align-items:center; gap:3.5rem; }
.film__eyebrow { color:var(--veat-lavender); font-size:.75rem; letter-spacing:.13em; text-transform:uppercase; font-weight:650; margin:0 0 1rem; }
.film h2 { font-size:clamp(2rem,3.2vw,3rem); line-height:1.06; margin:0 0 1.15rem; }
.film__intro { color:var(--night-muted); font-size:1rem; line-height:1.65; max-width:23rem; margin:0; }
.film__cover { display:block; position:relative; isolation:isolate; overflow:hidden; aspect-ratio:16/9; border-radius:24px; border:1px solid var(--veat-line); box-shadow:var(--veat-highlight),var(--veat-shadow); color:var(--veat-pearl); background:#1b142b; text-decoration:none; }
.film__cover>img { display:block; width:100%; height:100%; object-fit:cover; }
.film__cover::after { content:''; position:absolute; inset:40% 0 0; z-index:0; background:linear-gradient(transparent,rgba(12,8,23,.9)); pointer-events:none; }
.film__caption { position:absolute; bottom:1.25rem; left:1.4rem; right:1.4rem; z-index:1; display:flex; gap:1rem; align-items:center; }
.film__play { display:grid; place-items:center; width:3rem; height:3rem; border-radius:50%; flex:none; background:var(--veat-button); color:var(--veat-ink); box-shadow:var(--veat-button-shadow); transition:transform .16s var(--ease-out); }
.film__play svg { width:1.1rem; height:1.1rem; margin-left:2px; fill:currentColor; }
.film__label { font-size:1rem; font-weight:650; line-height:1.3; }
.film__label small { display:block; color:var(--night-muted); font-size:.75rem; font-weight:400; margin-top:.3rem; }
.film-dialog { width:min(1100px,calc(100vw - 2rem)); max-width:1100px; max-height:calc(100dvh - 2rem); padding:0; overflow:auto; color:var(--veat-pearl); background:var(--veat-night); border:1px solid var(--veat-line); border-radius:24px; box-shadow:0 28px 100px rgba(0,0,0,.45); }
.film-dialog::backdrop { background:rgba(7,4,16,.86); backdrop-filter:blur(8px); }
.film-dialog__bar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem 1rem .75rem 1.25rem; border-bottom:1px solid var(--veat-line); }
.film-dialog__bar h2 { margin:0; font-size:1rem; letter-spacing:0; }
.film-dialog__close { display:grid; place-items:center; width:44px; height:44px; border-radius:50%; border:1px solid var(--veat-line); background:var(--veat-glass); color:inherit; cursor:pointer; }
.film-dialog__close svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }
.film-dialog video { display:block; width:100%; max-height:calc(100dvh - 11rem); aspect-ratio:16/9; background:#100c1c; object-fit:contain; }
.film-dialog__foot { padding:1rem 1.25rem; font-size:.8125rem; color:var(--night-muted); display:flex; gap:1rem; justify-content:space-between; flex-wrap:wrap; }
.film-dialog__foot a { color:var(--veat-lavender); text-underline-offset:3px; }
.film-dialog__error { padding:.8rem 1.25rem 0; margin:0; font-size:.875rem; }
.film-dialog[open] { opacity:1; transform:translateY(0); transition:opacity .2s ease,transform .25s var(--ease-out); }
@starting-style { .film-dialog[open] { opacity:0; transform:translateY(8px); } }
html.film-is-open { overflow:hidden; }
@media (hover:hover) and (pointer:fine) { .film__cover:hover .film__play { transform:scale(1.08); } .film__cover:hover { border-color:rgba(200,181,255,.38); } }
@media (max-width:760px) {
  .film { padding:3.5rem 0; }
  .film__layout { grid-template-columns:1fr; gap:1.5rem; }
  .film__intro { max-width:30rem; }
  .film__cover { border-radius:18px; }
  .film__caption { bottom:.9rem; left:.9rem; right:.9rem; gap:.75rem; }
  .film__label { font-size:.875rem; }
  .film__label small { font-size:.6875rem; }
  .film__play { width:2.75rem; height:2.75rem; }
  .pack .pk-body { grid-template-columns:7rem minmax(0,1fr); gap:.5rem 1rem; }
  .pk-art { height:8rem; }
}
@media (max-width:440px) { .pack .pk-body { grid-template-columns:1fr; grid-template-areas:'art' 'list' 'save'; } .pk-art { height:10rem; } }
@media (prefers-reduced-motion:reduce) { .film-dialog[open],.film__play { transition:none; transform:none; } .route-lion.veat-rider,.mascot__illustration.veat-rider { animation:none; } }
@media (prefers-contrast:more) { .film__cover,.film-dialog,.film-dialog__close { border-color:var(--veat-lavender); } }
