/* The AI poster is separated into responsive artwork and transparent lettering. */
#loading-screen{background:#203d2b}
#loading-screen:before{z-index:1;background:linear-gradient(transparent 65%,#1c36264d 82%,#1c3626 100%)}
.poster-stage{position:absolute;inset:0 0 158px;isolation:isolate}
#loading-screen .loading-art{object-fit:cover;object-position:center;background:#52725b}
.poster-brand{position:absolute;inset:0 0 auto;margin:0;text-align:center;z-index:2;height:34%;display:flex;justify-content:center}
.poster-brand .bittorture-logo{width:74%;height:100%;object-fit:contain}
.poster-billing{position:absolute;right:12%;top:29%;width:22%;height:auto;z-index:2}
.poster-headline{position:absolute;bottom:-1%;left:9%;width:82%;height:30%;margin:0;z-index:2}
.poster-headline img{display:block;width:100%;height:100%;object-fit:contain}
#loading-screen .loading-progress{bottom:max(24px,env(safe-area-inset-bottom));width:min(560px,calc(100% - 48px));min-height:0;justify-content:flex-start;z-index:3}
#loading-screen .fly-explainer{font:15px/1.35 Georgia,serif;color:#fff3d5;text-shadow:1px 2px 3px #163522;margin:0 0 12px;text-wrap:balance}
#loading-screen .loading-label{font-size:14px;margin-bottom:8px}
#loading-screen #start-show{width:min(320px,100%);min-height:49px;font-size:23px;padding:9px 16px;background:#b94428}
#loading-screen #start-music-note{margin-top:7px;font-size:12px}
#loading-screen #loading-error{position:absolute;bottom:0;max-width:100%;background:#14271cf5}
header .wordmark .bittorture-logo{width:320px;height:84px;object-fit:contain}
.menu-starring img{width:160px;height:auto}
#details h2 .bittorture-logo{width:100%;max-width:400px;margin:auto}
.fin-end-logo{width:clamp(240px,40vw,500px)}
@media(max-width:600px){
 .poster-stage{bottom:166px}
 .poster-brand{top:0;height:auto}
 .poster-brand .bittorture-logo{width:97%;height:auto}
 .poster-billing{top:20%;right:7%;width:40%}
 .poster-headline{left:1%;width:98%;height:auto;bottom:-2%}
 .poster-headline img{height:auto}
 #loading-screen .loading-art{object-position:53% center}
 #loading-screen .fly-explainer{font-size:13px;max-width:340px;margin-bottom:10px}
 #loading-screen .loading-progress{bottom:max(24px,env(safe-area-inset-bottom));width:calc(100% - 44px)}
 header .wordmark .bittorture-logo{width:210px;max-width:55vw;height:62px}
}
@media(max-width:600px) and (max-height:650px){
 .poster-stage{bottom:150px}
 .poster-billing{top:23%;right:8%;width:32%}
 #loading-screen .fly-explainer{font-size:12px;margin-bottom:8px}
 #loading-screen .loading-progress{bottom:18px}
 #loading-screen #start-show{min-height:44px;font-size:21px}
}
@media(max-height:600px) and (min-width:601px){
 .poster-stage{bottom:0}
 .poster-brand{height:37%;top:-2%}
 .poster-brand .bittorture-logo{width:65%;height:100%}
 .poster-billing{top:26%;right:12%;width:18%}
 .poster-headline{left:2%;width:64%;height:33%;bottom:2%}
 #loading-screen .loading-progress{left:auto;right:4%;bottom:6%;transform:none;width:28%}
 #loading-screen .fly-explainer{font-size:11px;margin-bottom:7px}
 #loading-screen .loading-label{font-size:12px;margin-bottom:5px}
 #loading-screen #start-show{min-height:42px;font-size:18px;padding:8px}
 #loading-screen #start-music-note{font-size:10px;margin-top:5px}
 header .wordmark .bittorture-logo{height:62px;width:260px}
}
@media(min-width:601px) and (min-height:601px){.poster-stage{bottom:180px}.poster-brand{height:42%;top:-3%}.poster-headline{height:38%;bottom:0}}
@media(max-width:600px){.poster-stage{bottom:180px}.poster-headline{bottom:0}}
@media(max-width:600px) and (max-height:650px){.poster-stage{bottom:160px}}
#loading-screen .loading-art{mask-image:linear-gradient(#000 0%,#000 93%,transparent 100%)}
@media(max-width:600px) and (max-height:650px){.poster-stage{bottom:172px}}
/* Painted ground continues behind the controls; no solid footer panel. */
#loading-screen{background:#b8ad65 url('/assets/fin-poster-background-v1.webp') center bottom / auto 220vh no-repeat}
#loading-screen:before{background:none}
#loading-screen .loading-art{mask-image:linear-gradient(#000 0%,#000 88%,transparent 100%)}
#loading-screen .loading-progress{left:clamp(24px,4vw,64px);right:clamp(24px,4vw,64px);bottom:max(24px,env(safe-area-inset-bottom));width:auto;transform:none;gap:0}
#loading-screen #loading-progress{display:block;align-self:stretch;width:100%;max-width:none;height:20px;border:3px solid #fff0c8;border-radius:12px;background:#253020cc;box-shadow:0 0 0 3px #22271c,0 4px 0 3px #22271c55;overflow:hidden}
#loading-screen #loading-progress::-webkit-progress-bar{background:#253020cc;border-radius:8px}
#loading-screen #loading-progress::-webkit-progress-value{background:repeating-linear-gradient(115deg,#e95b32 0 18px,#cf3d23 18px 36px);border-radius:8px;box-shadow:inset 0 3px #ffba6480;transition:width .25s ease}
#loading-screen #loading-progress::-moz-progress-bar{background:#e95b32;border-radius:8px}
#loading-screen .fly-explainer{color:#fff3d5;text-shadow:0 2px 2px #22271c,1px 0 2px #22271c,-1px 0 2px #22271c;font-weight:bold}
#loading-screen .loading-label,#loading-screen #start-music-note{color:#fff3d5;text-shadow:0 2px 2px #22271c,1px 0 2px #22271c,-1px 0 2px #22271c}
#loading-screen #start-show{width:min(420px,100%);min-height:65px;padding:12px 26px;border:3px solid #fff0c8;border-radius:12px 5px 12px 5px;background:linear-gradient(#ec633b,#bb3521);box-shadow:0 0 0 3px #20281e,0 7px 0 3px #20281e, inset 0 2px #ffc67d;font:30px/1.1 var(--title);letter-spacing:.4px;text-shadow:2px 3px #642719;transform:rotate(-1deg);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}
#loading-screen #start-show span{display:inline-block;margin-left:18px;font-size:22px;vertical-align:2px}
#loading-screen #start-show:hover{filter:brightness(1.1);transform:rotate(0deg) translateY(-2px)}
#loading-screen #start-show:active{transform:translateY(5px);box-shadow:0 0 0 3px #20281e,0 2px 0 3px #20281e}
#loading-screen #start-show:focus-visible{outline:3px solid #fff7df;outline-offset:9px}
#loading-screen #start-music-note{margin-top:15px}
#loading-screen.show-ready .loading-label{display:none}
@media(max-width:600px){
 #loading-screen .loading-progress{left:24px;right:24px;bottom:max(27px,env(safe-area-inset-bottom))}
 #loading-screen #start-show{min-height:60px;font-size:26px;padding:12px 14px}
 #loading-screen #start-show span{margin-left:12px;font-size:19px}
 #loading-screen #loading-progress{height:18px}
}
@media(max-width:600px) and (max-height:650px){
 #loading-screen .loading-progress{bottom:23px}
 #loading-screen #start-show{min-height:53px;font-size:23px}
 #loading-screen #start-music-note{margin-top:13px}
}
@media(max-height:600px) and (min-width:601px){
 #loading-screen:not(.show-ready) .loading-progress{left:32px;right:32px;bottom:25px;width:auto}
 #loading-screen:not(.show-ready) .poster-headline{bottom:23%}
 #loading-screen:not(.show-ready) .fly-explainer{margin-bottom:5px}
 #loading-screen.show-ready .loading-progress{left:auto;right:4%;width:28%;bottom:7%}
 #loading-screen #start-show{min-height:48px;font-size:20px;padding:9px 10px}
 #loading-screen #start-show span{font-size:15px;margin-left:9px}
 #loading-screen #start-music-note{margin-top:13px}
}
@media(prefers-reduced-motion:reduce){#loading-screen #start-show,#loading-screen #loading-progress::-webkit-progress-value{transition:none}}
/* Lower the poster headline into the space freed by the explanatory sentence. */
@media(min-width:601px) and (min-height:601px){.poster-headline{bottom:-95px}}
@media(max-width:600px){.poster-headline{bottom:-78px}}
@media(max-width:600px) and (max-height:650px){.poster-headline{bottom:-68px}}
@media(max-height:600px) and (min-width:601px){#loading-screen:not(.show-ready) .poster-headline{bottom:10%}.poster-headline{bottom:-12px}}

/* A simple, stable play button that follows the poster's lettering. */
#loading-screen #start-show{display:flex;align-items:center;justify-content:center;gap:14px;width:min(360px,100%);min-height:58px;padding:12px 22px;border:2px solid #f6e3b2;border-radius:5px;background:#ba4028;box-shadow:0 3px 0 #612619;font:26px/1.1 var(--title);letter-spacing:.3px;text-shadow:1px 2px #722818;transform:none;transition:background .15s ease,box-shadow .15s ease}
#loading-screen #start-show span{margin:0;font:16px/1 Georgia,serif;vertical-align:baseline}
#loading-screen #start-show:hover{filter:none;transform:none;background:#cf4c2e}
#loading-screen #start-show:active{transform:none;background:#a73623;box-shadow:0 1px 0 #612619}
#loading-screen #start-show:focus-visible{outline:2px solid #fff3ce;outline-offset:5px}
@media(max-width:600px){#loading-screen #start-show{min-height:54px;width:min(310px,100%);font-size:24px;padding:11px 18px}}
@media(max-height:600px){#loading-screen #start-show{min-height:46px;font-size:21px;padding:10px 14px;gap:10px}#loading-screen #start-show span{font-size:14px}}
