.ff-splash{position:fixed;inset:0;z-index:60;background:#F3F1E9;color:#243B32;display:grid;place-items:center;overflow:hidden;font-family:Inter,system-ui,sans-serif}
.ff-splash-scene{position:relative;width:100%;max-width:520px;height:100%;overflow:hidden;background:#F3F1E9}
.ff-splash-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 53%}
.ff-splash-shade{position:absolute;inset:0;background:linear-gradient(#F3F1E9 0%,rgba(243,241,233,.4) 19%,transparent 38%,transparent 65%,#F3F1E9 91%)}
.ff-splash-logo{position:absolute;top:max(-18px,calc(env(safe-area-inset-top) - 18px));left:50%;transform:translateX(-50%);width:clamp(190px,29vh,250px);height:auto}
.ff-splash-footer{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:24px;right:24px;text-align:center}
.ff-splash-title{font-size:25px;font-weight:700;line-height:1.15;margin:0 0 10px}
.ff-splash-status{font-size:12px;color:#58675D;margin:0 0 16px}
.ff-splash-track{height:3px;width:104px;background:#D7DDCF;border-radius:4px;overflow:hidden;margin:auto}
.ff-splash-track:after{content:'';display:block;width:42%;height:100%;background:linear-gradient(90deg,#AA8134,#E4C97B,#287255);animation:ffLoading 1.6s ease-in-out infinite}
:root[data-client-ui="true"][data-theme="dark"] .ff-splash{background:#0d120f;color:#f4f8ee}
:root[data-client-ui="true"][data-theme="dark"] .ff-splash-scene{background:#0d120f}
:root[data-client-ui="true"][data-theme="dark"] .ff-splash-shade{background:linear-gradient(#0d120f 0%,rgba(13,18,15,.36) 19%,transparent 38%,transparent 65%,#0d120f 91%)}
:root[data-client-ui="true"][data-theme="dark"] .ff-splash-status{color:#b0c0b2}
:root[data-client-ui="true"][data-theme="dark"] .ff-splash-track{background:#344237}
:root[data-client-ui="true"][data-theme="dark"] .ff-splash-logo{filter:brightness(0) invert(1)}
@keyframes ffLoading{from{transform:translateX(-110%)}to{transform:translateX(350%)}}
@media(prefers-reduced-motion:reduce){.ff-splash-track:after{animation:none;width:100%;opacity:.75}}
@media(max-height:500px){.ff-splash-scene{max-width:760px}.ff-splash-art{width:55%;left:45%;object-position:center 55%}.ff-splash-shade{background:linear-gradient(90deg,#F3F1E9 40%,transparent 70%)}.ff-splash-logo{left:24%;width:190px}.ff-splash-footer{left:16px;right:54%;bottom:24px}.ff-splash-title{font-size:20px}}
@media(max-height:500px){:root[data-client-ui="true"][data-theme="dark"] .ff-splash-shade{background:linear-gradient(90deg,#0d120f 40%,transparent 70%)}}
/* Sept 2026: the opening photo is a dark studio shot, so the splash stays dark in both appearances. */
.ff-splash,.ff-splash-scene,:root[data-client-ui="true"][data-theme="dark"] .ff-splash,:root[data-client-ui="true"][data-theme="dark"] .ff-splash-scene{background:#050505;color:#f5f5f5}
.ff-splash-art{object-position:50% 45%}
.ff-splash-shade,:root[data-client-ui="true"][data-theme="dark"] .ff-splash-shade{background:linear-gradient(#050505 0%,rgba(5,5,5,.45) 16%,transparent 34%,transparent 62%,rgba(5,5,5,.7) 80%,#050505 94%)}
.ff-splash-logo{filter:brightness(0) invert(1)}
.ff-splash-status,:root[data-client-ui="true"][data-theme="dark"] .ff-splash-status{color:#b8b8b0}
.ff-splash-track,:root[data-client-ui="true"][data-theme="dark"] .ff-splash-track{background:#2a2a2a}
@media(max-height:500px){.ff-splash-shade,:root[data-client-ui="true"][data-theme="dark"] .ff-splash-shade{background:linear-gradient(90deg,#050505 40%,transparent 70%)}}
