.film-button,.film-link,.tour-button{display:inline-flex;align-items:center;justify-content:center;gap:12px}
.film-play-icon{font-size:11px;line-height:1;flex-shrink:0}
.film-link{font-size:14px;font-weight:600;min-height:44px;text-decoration:underline;text-underline-offset:5px}
.film-link:hover{color:var(--coral)}
.tour-button{gap:12px;background:var(--blue);border-color:var(--blue);color:var(--ink)}
.tour-button:hover{background:#a6d2dc;border-color:#a6d2dc;color:var(--ink)}
.button+.tour-button{margin-left:16px}
.ending-bottom .tour-button{margin-left:0}
.action-copy>.film-button{margin-top:30px}
.film-dialog{width:min(1120px,calc(100vw - 24px),calc((100dvh - 100px) * 1.5));max-width:none;max-height:calc(100dvh - 24px);padding:0;border:0;margin:auto;background:transparent;color:var(--paper);overflow:auto;overscroll-behavior:contain}
.film-dialog{overflow:visible;translate:0 90vh;rotate:9deg;scale:.85;opacity:0;transition:translate .45s cubic-bezier(.55,0,.8,.3),rotate .45s ease-in,scale .45s ease-in,opacity .35s ease-in .1s,overlay .45s allow-discrete,display .45s allow-discrete}
.film-dialog[open]{translate:0 0;rotate:0deg;scale:1;opacity:1;transition:translate .75s cubic-bezier(.3,1.45,.5,1),rotate .75s cubic-bezier(.3,1.45,.5,1),scale .75s cubic-bezier(.3,1.45,.5,1),opacity .25s ease-out,overlay .75s allow-discrete,display .75s allow-discrete}
@starting-style{.film-dialog[open]{translate:0 -80vh;rotate:-14deg;scale:.7;opacity:0}}
.film-dialog::backdrop{background:rgb(243 239 230 / 0%);backdrop-filter:blur(0);transition:background .45s,backdrop-filter .45s,overlay .45s allow-discrete,display .45s allow-discrete}
.film-dialog[open]::backdrop{background:rgb(243 239 230 / 25%);backdrop-filter:blur(12px) saturate(.9)}
@starting-style{.film-dialog[open]::backdrop{background:rgb(243 239 230 / 0%);backdrop-filter:blur(0)}}
.film-close{position:absolute;left:96.2%;top:8.5%;z-index:6;translate:-50% -50%;display:grid;place-items:center;width:54px;aspect-ratio:1;padding:0;border:0;border-radius:50%;background:var(--coral);color:var(--paper);font:400 34px/1 var(--body);box-shadow:0 8px 20px #17161440;cursor:pointer;transition:rotate .3s,background .2s}
.film-close>span{margin-top:-3px}
.film-close:hover{rotate:90deg;background:var(--ink)}
.film-dialog :focus-visible{outline:3px solid var(--coral);outline-offset:4px}
.film-stage{position:relative;width:100%;aspect-ratio:3/2;isolation:isolate}
.film-frame{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}
.film-screen{position:absolute;left:10.65%;top:18.8%;width:78.7%;height:62%;object-fit:contain;display:block;background:#101210;z-index:4}
.film-error{font-size:14px;line-height:1.5;text-align:center;padding:0 20px 10px}
.film-error a{text-decoration:underline}
.film-dialog-plain{width:min(1120px,calc(100vw - 24px),calc((100dvh - 100px) * 16 / 9))}
.film-dialog-plain .film-stage{aspect-ratio:16/9;border-radius:14px;overflow:hidden;box-shadow:0 24px 60px #17161440}
.film-dialog-plain .film-screen{inset:0;width:100%;height:100%}
.film-dialog-plain .film-close{left:auto;right:14px;top:14px;translate:none}
.demo-dialog{width:min(620px,calc(100vw - 24px));color:var(--ink);overflow:auto}
.demo-card{position:relative;background:var(--paper);padding:44px 40px 36px;box-shadow:0 24px 60px #17161440}
.demo-dialog .film-close{left:auto;right:16px;top:16px;translate:none}
.demo-card h2{font-size:clamp(46px,7vw,64px);text-transform:uppercase;padding-right:50px}
.demo-intro{margin-top:12px;font-size:15px;line-height:1.6;max-width:440px}
.demo-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px;margin-top:26px}
.demo-fields label{display:grid;gap:6px;font-size:13px;font-weight:600}
.demo-fields label i{font-style:normal;font-weight:400;color:var(--muted)}
.demo-fields .demo-wide{grid-column:1/-1}
.demo-fields input,.demo-fields textarea{width:100%;padding:12px 14px;border:1px solid var(--line);background:#fff;font:15px/1.4 var(--body);color:var(--ink);border-radius:0}
.demo-fields input:focus,.demo-fields textarea:focus{outline:2px solid var(--ink);outline-offset:0;border-color:var(--ink)}
.demo-fields textarea{resize:vertical}
.demo-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.demo-error{margin-top:18px;padding:12px 14px;background:#fbe3df;color:#9b2c1d;font-size:14px}
.demo-actions{display:flex;align-items:center;gap:22px;margin-top:24px;flex-wrap:wrap}
.demo-actions .button{margin:0}
.demo-actions .button:disabled{opacity:.6;transform:none;cursor:wait}
.demo-actions p{font-size:12px;color:var(--muted)}
.demo-actions a{text-decoration:underline}
html.film-is-open{overflow:hidden;scrollbar-gutter:stable}
@media(max-width:700px){
    .film-dialog{width:min(calc(100vw - 12px),calc((100dvh - 90px) * 1.5))}
    .film-dialog-plain{width:min(calc(100vw - 12px),calc((100dvh - 90px) * 16 / 9))}
    .site-footer .film-link{font-size:12px}
    .button+.tour-button{display:flex;width:fit-content;margin:12px 0 0}
    .film-close{width:42px;font-size:28px}
    .demo-dialog{width:calc(100vw - 12px)}
    .demo-card{padding:36px 22px 26px}
    .demo-fields{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){.film-dialog,.film-dialog[open],.film-dialog::backdrop{transition:none;translate:none;rotate:none;scale:none}}
