@font-face{font-family:RGLoadingMono;src:url('fonts/DepartureMono-1.500.woff2') format('woff2');font-display:swap}
#boot-screen{--boot-progress:0%;position:fixed;inset:0;z-index:100000;display:grid;place-items:center;overflow:hidden;background:#07142a;color:#eee7d1;font:16px/1.45 RGLoadingMono,'Microsoft YaHei',monospace;opacity:1;transition:opacity .28s ease-out}
#boot-screen::before{content:"";position:absolute;inset:0;opacity:.38;background-image:radial-gradient(#adc4e6 1px,transparent 1px),radial-gradient(#7e9cbd 1px,transparent 1px);background-size:179px 137px,293px 223px;background-position:37px 17px,112px 75px;pointer-events:none}
#boot-screen::after{content:"";position:absolute;inset:36px;border:1px solid #345075;clip-path:polygon(0 0,18% 0,18% 1%,1% 1%,1% 20%,0 20%,0 80%,1% 80%,1% 99%,18% 99%,18% 100%,0 100%,82% 100%,82% 99%,99% 99%,99% 80%,100% 80%,100% 20%,99% 20%,99% 1%,82% 1%,82% 0,100% 0,100% 100%,0 100%);pointer-events:none}
.boot-shell{position:relative;z-index:1;width:min(1040px,86vw);display:flex;align-items:center;flex-direction:column;gap:18px}
.boot-topline{position:fixed;top:24px;right:40px;font-size:11px;letter-spacing:3px;color:#aec3e0}
.boot-logo{display:block;width:min(620px,75vw);height:clamp(110px,26vh,268px);object-fit:contain;image-rendering:pixelated}
.boot-logo[hidden]{display:none}
.boot-title-fallback{margin:0;font-size:clamp(26px,7vw,64px);letter-spacing:3px}
#boot-screen .boot-tagline{margin:0;color:#eee7d1;text-align:center;font-size:clamp(13px,2vw,20px)}
.boot-course{position:relative;width:100%;margin-top:clamp(75px,13vh,125px)}
.boot-raceway{position:relative;margin:0 18px}
.boot-avatar{position:absolute;left:var(--boot-progress);bottom:calc(100% - 12px);width:128px;height:128px;transform:translateX(-50%);background-repeat:no-repeat;background-size:1536px 128px;image-rendering:pixelated;animation:boot-stride .70s steps(12) infinite}
.boot-rail{height:40px;box-sizing:border-box;border:8px solid transparent;border-image:url('assets/ui/reference/xp-rail.png') 8 16 fill / 8px 16px / 0 stretch;padding:2px 9px;background:#071429;image-rendering:pixelated}
.boot-well{height:20px;overflow:hidden;background:repeating-linear-gradient(90deg,#162744 0 18px,#496184 18px 20px);box-shadow:inset 0 0 0 1px #061223}
.boot-fill{width:var(--boot-progress);height:100%;background:url('assets/ui/reference/xp-fill.png') repeat-x left center;background-size:20px 20px;image-rendering:pixelated}
.boot-flag{position:absolute;bottom:auto;top:-42px;left:8px;width:3px;height:42px;background:#eee7d1;box-shadow:2px 0 #435d80}
.boot-flag::after{content:"";position:absolute;top:2px;left:3px;width:22px;height:17px;background:#eee7d1;clip-path:polygon(0 0,100% 50%,0 100%)}
.boot-finish{left:auto;right:8px}
.boot-finish::after{width:24px;height:24px;background:repeating-conic-gradient(#eee7d1 0 25%,#102039 0 50%) 0 0 / 12px 12px;clip-path:none;left:-22px}
.boot-meter{display:flex;justify-content:space-between;gap:20px;width:100%;margin-top:10px;padding:0 18px;box-sizing:border-box;color:#eee7d1;font-size:clamp(11px,1.5vw,16px)}
.boot-percent{white-space:nowrap;min-width:8ch;text-align:right}
.boot-race-card{display:flex;align-items:center;gap:18px;margin-top:12px;padding:10px 28px 10px 14px;border:1px solid #7899c4;background:#0b1932;position:relative}
.boot-race-card::before,.boot-race-card::after{content:"";position:absolute;width:10px;height:10px;border-top:2px solid #b4ccea;border-left:2px solid #b4ccea;top:-2px;left:-2px}
.boot-race-card::after{top:auto;left:auto;bottom:-2px;right:-2px;transform:rotate(180deg)}
.boot-race-portrait{width:70px;height:62px;overflow:hidden;background:#112340}
.boot-race-portrait img{display:block;width:70px;height:112px;object-fit:cover;object-position:center top;image-rendering:pixelated}
.boot-race-name{font-size:17px;letter-spacing:1px}
.boot-race-card small{display:block;color:#9ab8df;font-size:10px;margin-top:4px}
.boot-error{display:none;text-align:center;margin:0;max-width:550px}
#boot-screen button{font:inherit;background:#eee7d1;color:#142036;border:1px solid #c1d4e5;min-height:42px;padding:8px 20px;cursor:pointer}
#boot-screen[data-failed=true] .boot-error{display:block}
#boot-screen[data-failed=true] .boot-race-card{display:none}
#boot-screen[data-failed=true] .boot-logo{height:min(140px,21vh)}
#boot-screen[data-failed=true] .boot-course{margin-top:60px}
#boot-screen[data-failed=true] .boot-avatar,#boot-screen[data-complete=true] .boot-avatar{animation-play-state:paused}
#boot-screen[data-leaving=true]{opacity:0;pointer-events:none}
@keyframes boot-stride{to{background-position:-1536px 0}}
@media(max-width:600px){#boot-screen::after{inset:14px}.boot-topline{top:20px;right:24px;font-size:9px}.boot-shell{width:84vw;gap:17px}.boot-logo{height:clamp(110px,22vh,200px);width:90vw}.boot-course{margin-top:95px}.boot-avatar{width:112px;height:112px;background-size:1344px 112px;bottom:calc(100% - 10px);animation-name:boot-stride-small}.boot-rail{height:33px;border-width:6px;padding:2px 7px}.boot-well{height:17px}.boot-fill{background-size:17px 17px}.boot-flag{bottom:auto;top:-31px;height:31px}.boot-flag::after{width:18px;height:17px}.boot-finish::after{width:20px;height:20px;left:-18px;background-size:10px 10px}.boot-meter{padding:0 7px;font-size:10px;gap:8px}.boot-race-card{padding:7px 16px 7px 8px;gap:12px}.boot-race-name{font-size:14px}.boot-race-portrait{width:55px;height:47px}.boot-race-portrait img{width:55px;height:88px}}
@keyframes boot-stride-small{to{background-position:-1344px 0}}
@media(max-height:500px){.boot-shell{gap:8px;width:min(950px,84vw)}.boot-topline{top:11px;font-size:9px}.boot-logo{height:100px;width:min(400px,65vw)}.boot-course{margin-top:50px}.boot-race-card{margin-top:3px;padding:4px 14px;gap:10px}.boot-race-portrait{width:40px;height:29px}.boot-race-portrait img{width:40px;height:60px}.boot-race-name{font-size:12px}.boot-race-card small{display:none}.boot-avatar{width:96px;height:96px;background-size:1152px 96px;animation-name:boot-stride-short}.boot-meter{margin-top:5px;font-size:10px}}
@keyframes boot-stride-short{to{background-position:-1152px 0}}
@media(prefers-reduced-motion:reduce){#boot-screen{transition:none}.boot-avatar{animation:none!important}}
