/* cutscene da intro: deserto em flat (pôr do sol, dunas em paralaxe, caminhão) e depois a clínica à noite */
.cs{position:relative;flex:1;min-height:100%;overflow:hidden;background:#07040B}
.cssc{position:absolute;inset:0;transition:opacity 1s}
.cssc.s1{background:linear-gradient(180deg,#3A1240 0%,#B8402A 45%,#F29A3A 62%,#F2B860 66%)}
.cssc.s1.out{opacity:0}
.cssc.s2{opacity:0;background:linear-gradient(180deg,#05030A,#160A22 60%,#1E0F1A 66%)}
.cssc.s2.in{opacity:1}
.cssun{position:absolute;left:50%;top:30%;width:150px;height:150px;margin-left:-75px;border-radius:50%;background:#FFD23F;box-shadow:0 0 60px #FF9A3A;background-image:repeating-linear-gradient(180deg,transparent 0 16px,#F29A3A 16px 20px);background-position:0 60px}
.csdune{position:absolute;left:0;width:200%;height:30%;bottom:22%;animation:csdune 7s linear infinite}
.csdune.d2{bottom:16%;height:24%;animation-duration:4s;filter:brightness(.85)}
.csdune svg{width:100%;height:100%;display:block}
@keyframes csdune{to{transform:translateX(-50%)}}
.cscac{position:absolute;bottom:20%;width:40px;animation:cscac 3s linear infinite}
.cscac:nth-of-type(odd){animation-duration:3.6s;animation-delay:-1.2s}
.cscac svg{width:100%;height:auto;display:block}
@keyframes cscac{from{transform:translateX(120vw)}to{transform:translateX(-140vw)}}
.csroad{position:absolute;left:0;right:0;bottom:0;height:20%;background:#5A3A22;border-top:6px solid #7A5030}
.csroad:after{content:"";position:absolute;left:0;top:44%;width:200%;height:6px;background:repeating-linear-gradient(90deg,#E8C27A 0 40px,transparent 40px 90px);animation:csdune 1s linear infinite}
.csroad.n{background:#141018;border-top-color:#241C2A}.csroad.n:after{display:none}
.cstruck{position:absolute;left:50%;bottom:15%;width:290px;margin-left:-160px;animation:csbump .38s ease-in-out infinite alternate}
.cstruck>svg{width:100%;height:auto;display:block;position:relative}
.cswh{animation:csspin .4s linear infinite}
@keyframes csspin{to{transform:rotate(360deg)}}
@keyframes csbump{to{transform:translateY(-4px) rotate(-.6deg)}}
.csmom{position:absolute;left:28px;bottom:58px;width:86px}
.csmom svg{width:100%;height:auto;display:block;animation:csbump .5s ease-in-out infinite alternate-reverse}
.csdust{position:absolute;left:calc(50% - 190px);bottom:15%;width:70px;height:40px;border-radius:50%;background:radial-gradient(circle,rgba(242,184,96,.8),transparent 70%);animation:csdust .5s ease-out infinite}
@keyframes csdust{from{transform:scale(.4);opacity:1}to{transform:translate(-60px,-20px) scale(1.4);opacity:0}}
.csmoon{position:absolute;right:16%;top:12%;width:60px;height:60px;border-radius:50%;box-shadow:-14px 6px 0 0 #F2E9D0}
.csclin{position:absolute;left:50%;bottom:20%;width:250px;height:230px;margin-left:-110px;background:#3A3A44;border:4px solid #231B33;border-bottom:0;box-shadow:inset 0 -40px 0 #2E2E36}
.csclin:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 30px,rgba(0,0,0,.15) 30px 32px);pointer-events:none}
.cssign2{position:absolute;left:12px;right:12px;top:14px;text-align:center;font-family:var(--f-horror);font-size:30px;color:#9DFF8A;text-shadow:0 0 12px #3EBF5A;animation:ctneon 2.6s steps(1) infinite;line-height:1}
.cssign2 small{display:block;font-family:var(--f-body);font-weight:900;font-size:11px;color:#C9FFC0;text-shadow:none;opacity:.7}
.cscross{position:absolute;right:16px;top:66px;width:34px;height:34px;background:linear-gradient(#E0243A,#E0243A) center/12px 100% no-repeat,linear-gradient(#E0243A,#E0243A) center/100% 12px no-repeat;filter:drop-shadow(0 0 8px #E0243A);animation:ctneon 3.4s steps(1) infinite}
.cswin2{position:absolute;left:18px;top:74px;width:80px;height:60px;background:#120A14;border:4px solid #231B33;transition:background .4s}
.cswin2.on{background:#8E1A22;box-shadow:0 0 30px #E0243A}
.cswin2.flash{animation:cswf .25s steps(1) 6}
@keyframes cswf{50%{background:#fff}}
.csdoor2{position:absolute;left:118px;bottom:0;width:66px;height:110px;background:#120A0C;border:4px solid #231B33;border-bottom:0;transform-origin:left;transform:perspective(300px) rotateY(-60deg);transition:transform .6s}
.csdoor2.shut{transform:none;background:#4A2E22}
.csmom2{position:absolute;left:-30%;bottom:18%;width:90px;transition:left 1.6s linear,opacity .5s}
.csmom2 svg{width:100%;height:auto;display:block}
.csmom2.walk{left:calc(50% + 6px);animation:csbump .3s ease-in-out infinite alternate}
.csmom2.gone{opacity:0}
.cscap{position:absolute;left:18px;right:18px;top:calc(50px + env(safe-area-inset-top,0px));text-align:center;color:#fff;font-family:var(--f-display);font-weight:800;font-size:21px;line-height:1.2;text-shadow:0 2px 0 #000,0 0 14px #000;opacity:0;text-wrap:balance}
.cscap.on{animation:cscap .6s ease-out forwards}
@keyframes cscap{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.csskip{position:absolute;right:14px;bottom:calc(18px + env(safe-area-inset-bottom,0px));border:0;border-radius:99px;padding:9px 16px;font-weight:900;background:rgba(0,0,0,.55);color:#fff;border:1px solid rgba(255,255,255,.25)}
