/* STAYTEL · full-journey gate (2026-10-16). One wait, one STAYTEL screen, one honest percentage of the whole journey.
   Loads after every existing stylesheet; changes no film, dialog or cinema rule. The markup is hidden by default
   (hidden attribute) and only film-v10 shows it, so a script or style failure never leaves a veil over the page.
   Brand: green #003B23, ivory #EAE9E3, tan #D0925F. */

.film-loader{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:calc(env(safe-area-inset-top,0px) + 32px) 28px calc(env(safe-area-inset-bottom,0px) + 32px);background:radial-gradient(90% 70% at 50% 42%,#004a2c 0,#003B23 55%,#00281a 100%);color:#EAE9E3;text-align:center;font-family:Naskh,'Noto Naskh Arabic',serif;opacity:1;visibility:visible;transition:opacity .7s ease,visibility .7s}
.film-loader[hidden]{display:none!important}
.film-loader.is-done{opacity:0;visibility:hidden;pointer-events:none}
.fl-inner{width:min(440px,100%)}
/* the original logo with generous clear space around it */
.fl-logo{display:block;width:min(230px,56vw);height:auto;margin:0 auto 48px;padding:12px 0}
.fl-title{margin:0 0 26px;font-weight:400;font-size:clamp(21px,2.2vw,27px);line-height:1.5}
.fl-bar{position:relative;width:min(280px,70vw);height:2px;margin:0 auto;background:#eae9e326;border-radius:2px;overflow:hidden}
.fl-bar i{position:absolute;inset:0;background:#D0925F;transform-origin:right;transform:scaleX(var(--fl,0));transition:transform .45s ease}
.fl-meta{display:flex;justify-content:center;gap:10px;margin:14px 0 0;font-size:14px;color:#eae9e3a6}
.fl-pct{font-variant-numeric:tabular-nums;color:#eae9e3d9}
.fl-actions{display:grid;justify-items:center;gap:12px;margin-top:34px}
.fl-actions[hidden],.fl-actions [hidden]{display:none!important}
.fl-why{margin:0 0 6px;max-width:26em;font-size:15px;line-height:1.75;color:#eae9e3d9}
.fl-btn{min-width:210px;padding:11px 26px;border:0;border-radius:30px;background:#D0925F;color:#1c140c;font:inherit;font-size:16px;cursor:pointer;transition:filter .2s}
.fl-btn:hover{filter:brightness(1.06)}
.fl-btn.fl-retry,.fl-btn.fl-reinit{background:none;color:#EAE9E3;border:1px solid #d0925fb3}
.fl-link{padding:4px 0;border:0;border-bottom:1px solid #d0925f99;background:none;color:#EAE9E3;font:inherit;font-size:15px;cursor:pointer}
.film-loader button:focus-visible{outline:2px solid #D0925F;outline-offset:4px}
/* the page under the gate does not scroll (a separate class from the cinema dialogs' html.layer-open) */
html.film-gate{overflow:hidden}

@media(prefers-reduced-motion:reduce){.film-loader,.fl-bar i{transition:none}}