body.loading{overflow:hidden;background:#111a1a}
.loading-screen{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:28px;background:#111a1a;isolation:isolate;transition:opacity .3s ease}
.loading-screen::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#101818bb,#101818eb),url('assets/v2/party-background.webp') center/cover}
.loading-content{width:min(640px,86vw);text-align:center}
.loading-logo{margin:0 0 24px;line-height:0}
.loading-logo img{display:block;width:100%;height:auto;max-height:62vh;object-fit:contain}
.loading-track,.loading-caption{width:80%;margin-left:auto;margin-right:auto}
.loading-track{height:18px;padding:3px;border:1px solid #79836a;background:#101918;box-shadow:3px 4px 0 #080f10}
.loading-fill{height:100%;width:0;background:#c8d77b;transition:width .15s linear}
.loading-caption{display:flex;justify-content:space-between;margin-top:14px;font-size:12px;letter-spacing:1px;color:#c6cbb9;gap:16px}
#loading-label{flex:1;min-width:0;text-align:left;line-height:1.5;min-height:3em}
.loading-percent{flex:none;line-height:1.5}
.loading-retry{margin-top:24px;padding:10px 24px;border:2px solid #111916;background:#c8d77b;color:#172020;font-weight:800;box-shadow:3px 4px 0 #080f10}
.loading-screen.leaving{opacity:0;pointer-events:none}
.loading-screen.ready .loading-track,.loading-screen.ready .loading-caption{display:none}
.loading-enter{display:block;margin:0 auto;width:min(320px,80%);min-height:62px;padding:14px 24px;border:2px solid #111916;border-radius:0;background:#c8d77b;color:#172020;font:900 clamp(20px,4.8vw,26px)/1.15 Arial,sans-serif;box-shadow:4px 5px 0 #080f10;transition:background-color .15s,transform .15s,box-shadow .15s}
.loading-enter:hover:not(:disabled){background:#dce99b;transform:translateY(-2px);box-shadow:4px 7px 0 #080f10}
.loading-enter:active:not(:disabled){transform:translate(2px,3px);box-shadow:2px 2px 0 #080f10}
.loading-enter:focus-visible{outline:2px solid #eee1b9;outline-offset:6px}
@media(prefers-reduced-motion:reduce){.loading-screen,.loading-fill{transition:none}}
.loading-identity{width:min(320px,80%);margin:0 auto 18px}.loading-identity label{display:block;text-align:left;margin-bottom:7px;color:#eee8d7;font-size:14px}.loading-identity input{box-sizing:border-box;width:100%;padding:12px;border:1px solid #91a06d;border-radius:0;background:#202d29;color:#f0e8cd;font:18px Arial}.player-welcome{color:#eee8d7;font-size:20px;overflow-wrap:anywhere;margin:8px 0}.change-nickname{border:0;background:none;color:#c8d77b;text-decoration:underline;cursor:pointer;padding:6px}.nickname-error{color:#e6a77a;font-size:13px;margin:6px 0}.loading-screen.ready .loading-logo img{max-height:48vh}

.player-welcome{font-family:"Arial Black",Impact,sans-serif;font-size:clamp(24px,4vw,32px);font-weight:900;line-height:1.15;letter-spacing:-.8px;text-shadow:2px 3px 0 #080f10;transform:rotate(-1deg);margin:12px -24px}
.loading-identity .player-welcome{font-size:clamp(24px,4vw,32px);font-family:"Arial Black",Impact,sans-serif;font-weight:900;line-height:1.15}

/* Compact progress bar with game-art endpoints. */
.loading-logo img,.loading-screen.ready .loading-logo img{max-height:42vh}.loading-logo{margin-bottom:40px}.loading-track.loading-journey,.loading-screen.ready .loading-track.loading-journey{display:block;position:relative;width:76%;height:18px;margin:0 auto;padding:3px;border:1px solid #6f7959;background:#101918;box-shadow:3px 4px #080f10;overflow:visible}.loading-journey .loading-fill{height:100%;background:#c8d77b;transition:width .2s ease-out}.loading-head,.loading-door{position:absolute;z-index:2;object-fit:contain;pointer-events:none;top:50%;transform:translateY(-50%)}.loading-head{width:84px;height:84px;left:-54px}.loading-door{width:65px;height:82px;right:-42px}.loading-journey .loading-percent{position:absolute;right:-31px;top:49px;font:900 12px/1 Arial,sans-serif;color:#d8dfac;font-variant-numeric:tabular-nums}.loading-caption{width:84%;margin-top:49px;margin-bottom:10px}.loading-caption #loading-label{text-align:center;min-height:2.6em}.loading-screen.ready .loading-journey{margin-bottom:65px}.loading-screen.ready .loading-logo img{max-height:35vh}.loading-identity{margin-bottom:12px}.loading-journey.arrived .loading-fill{background:#deeca0}
@media(max-width:480px){.loading-head{width:68px;height:68px;left:-44px}.loading-door{width:54px;height:70px;right:-34px}.loading-journey .loading-percent{right:-25px;top:42px}.loading-content{width:86vw}.loading-logo{margin-bottom:35px}}
@media(max-height:600px){.loading-screen{padding:12px}.loading-logo img,.loading-screen.ready .loading-logo img{max-height:23vh}.loading-logo{margin-bottom:26px}.loading-head{height:64px;width:64px;left:-42px}.loading-door{height:64px;width:50px;right:-32px}.loading-journey .loading-percent{top:36px;right:-25px}.loading-screen.ready .loading-journey{margin-bottom:45px}.loading-identity{margin-bottom:6px}.loading-identity input{padding:7px}.loading-identity .player-welcome{font-size:22px;margin:4px -24px}.loading-enter{min-height:44px;padding:9px 18px;font-size:20px}.change-nickname{padding:2px}}
@media(prefers-reduced-motion:reduce){.loading-journey .loading-fill{transition:none}}
.loading-screen.ready .loading-track.loading-journey{margin-bottom:65px}.loading-door{width:90px;height:110px;right:-54px}
@media(max-width:480px){.loading-door{width:76px;height:92px;right:-46px}}
@media(max-height:600px){.loading-screen.ready .loading-track.loading-journey{margin-bottom:45px}.loading-door{width:70px;height:88px;right:-42px}}
/* The head rides the fill edge, then vanishes through the exit at completion. */
.loading-track.loading-journey .loading-head{width:58px;height:58px;left:var(--load-position,0%);top:50%;transform:translate(-50%,-50%);transition:left .2s ease-out;z-index:3}.loading-track.loading-journey[hidden],.loading-screen.ready .loading-track.loading-journey{display:none!important}.loading-screen.ready .loading-logo{margin-bottom:24px}.loading-screen.ready .loading-logo img{max-height:48vh}
@media(max-width:480px),(max-height:600px){.loading-track.loading-journey .loading-head{width:46px;height:46px}}
@media(max-height:600px){.loading-screen.ready .loading-logo img{max-height:30vh}.loading-screen.ready .loading-logo{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){.loading-track.loading-journey .loading-head{transition:none}}
/* Reserve the entry area so switching from progress to the form never recentres the logo. */
.loading-content{--loading-logo-height:min(42vh,57.333vw,426.667px);height:calc(var(--loading-logo-height) + 240px)}
.loading-logo,.loading-screen.ready .loading-logo{margin:0 0 40px}
.loading-logo img,.loading-screen.ready .loading-logo img{height:var(--loading-logo-height);max-height:none}
@media(max-height:600px){.loading-content{--loading-logo-height:min(23vh,57.333vw,426.667px);height:calc(var(--loading-logo-height) + 210px)}.loading-logo,.loading-screen.ready .loading-logo{margin-bottom:26px}}
