@import url('https://fonts.googleapis.com/css2?family=Special+Elite&family=UnifrakturMaguntia&display=swap');
.intro { position:fixed;inset:0;z-index:50;background:#070909;color:#e9ddbc;overflow:hidden;opacity:1;transition:opacity .25s ease; }
.intro.leaving { opacity:0;pointer-events:none; }
.intro-art { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease;filter:brightness(.62) saturate(.72); }
.intro[data-phase="art"] .intro-art { opacity:1; }
.intro[data-mode="short"] .intro-art { transition-duration:.2s; }
.intro::after { content:"";position:absolute;inset:0;background:linear-gradient(0deg,#050b10fa,transparent 46%,#0004);pointer-events:none; }
#intro-film { position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none; }
.intro-copy { position:absolute;z-index:3;inset:22% 6% auto;text-align:center; }
.intro-type { font-family:"Special Elite",monospace;font-size:clamp(13px,2vw,30px);line-height:1.7;min-height:5em; }
.intro-type p { margin:0 0 .5em; }
.intro:not([data-phase="type"]) .intro-type { visibility:hidden; }
.intro-title { position:absolute;inset:14% 0 auto;width:100%;margin:0;font-family:"UnifrakturMaguntia",Georgia,serif;font-weight:400;font-size:clamp(44px,8vw,130px);line-height:1.05;text-shadow:0 2px 30px #000;opacity:var(--title-opacity,0);filter:blur(var(--title-blur,0)); }
.intro .intro-title>span { display:block;font-size:.42em;letter-spacing:.1em;font-family:inherit;margin-bottom:.6em; }
.intro-load { position:absolute;z-index:4;bottom:max(7%,calc(var(--safe-bottom) + 22px));left:50%;transform:translateX(-50%);width:min(660px,78vw);text-align:center;font-family:"Special Elite",monospace; }
.intro-ammo { display:flex;justify-content:center;gap:clamp(2px,.45vw,7px);height:clamp(24px,4vw,48px);margin-bottom:16px; }
.intro-ammo i { flex:1;max-width:13px;position:relative;background:linear-gradient(90deg,#191916,#343125,#151613);border:1px solid #9b875744;border-radius:45% 45% 1px 1px;clip-path:polygon(32% 0,68% 0,80% 16%,80% 37%,100% 43%,100% 100%,0 100%,0 43%,20% 37%,20% 16%); }
.intro-ammo i.filled { background:linear-gradient(90deg,#6a4925,#ddbf70 42%,#a88343 68%,#61451f);border-color:#eed5a0; }
.intro-load p { margin:7px 0;font-size:clamp(12px,1.3vw,19px);line-height:1.25; }
#intro-files { color:#a9aaa0;font-size:clamp(10px,.85vw,13px); }
#intro-prompt { min-height:1.5em;margin-top:18px;color:#f2d694; }
.intro.ready #intro-prompt { animation:intro-breathe 1.8s ease-in-out infinite; }
.intro[data-mode="full"]:not(.complete) #intro-prompt { visibility:hidden; }
#intro-skip { position:absolute;right:max(3%,calc(var(--safe-right) + 16px));top:max(4%,calc(var(--safe-top) + 12px));z-index:5;height:34px;padding:0 12px;border:1px solid #ac97774d;background:#0a1116bb;color:#d3c8ae;font-size:clamp(11px,1vw,15px); }
.intro-replay { align-self:center; }
.title-bottom .intro-replay { font-size:calc(1.05 * var(--u));flex:none; }
@keyframes intro-breathe { 50% { opacity:.55; } }
@media(max-height:500px) { .intro-copy { top:18%; } .intro-load { bottom:max(5%,calc(var(--safe-bottom) + 12px)); } .intro-ammo { margin-bottom:10px;height:28px; } #intro-prompt { margin-top:10px; } }
@media(prefers-reduced-motion:reduce) { .intro,.intro-art { transition:none; } .intro.ready #intro-prompt { animation:none; } .intro-title { filter:none; } }
