/* ARM-G 3D portal intro overlay (see js/intro3d.js). Presentation only. */
html.armg-intro-on { background: #050a16; }
html.armg-intro-on body > *:not(#armgIntro) { visibility: hidden !important; }
html.armg-intro-lock, html.armg-intro-lock body { overflow: hidden !important; }

.ai-root { position: fixed; inset: 0; z-index: 2147483000; color: #fff; cursor: pointer; overflow: hidden;
  background: radial-gradient(ellipse at 50% 42%, var(--ai-bg1, #0a2a5c) 0%, var(--ai-bg2, #030814) 72%);
  font-family: Inter, "Segoe UI", system-ui, sans-serif; -webkit-tap-highlight-color: transparent; }
.ai-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ai-vignette { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at center, transparent 55%, rgba(0,0,0,.6) 100%); }
.ai-flash { position: absolute; inset: 0; pointer-events: none; opacity: 0; mix-blend-mode: screen;
  background: radial-gradient(circle at 50% 44%, #fff 0%, rgba(255,255,255,.55) 30%, transparent 70%); }

.ai-text { position: absolute; left: 0; right: 0; bottom: max(7vh, 56px); text-align: center; pointer-events: none; padding: 0 16px; }
.ai-title { margin: 0; font-family: Manrope, Inter, system-ui, sans-serif; font-weight: 800; text-transform: uppercase;
  font-size: clamp(18px, 3.4vw, 38px); letter-spacing: .3em; line-height: 1.2; text-shadow: 0 0 22px rgba(120,200,255,.55), 0 2px 12px rgba(0,0,0,.6); }
.ai-title span { display: inline-block; opacity: 0; transform: translateY(26px) scale(.7) rotateX(70deg); filter: blur(8px); }
.ai-show-title .ai-title span { animation: ai-letter .75s cubic-bezier(.2,.9,.25,1.2) forwards; animation-delay: calc(var(--i) * 45ms); }
.ai-boss .ai-title { text-shadow: none; }
.ai-boss .ai-title span { background: linear-gradient(180deg, #fff6d6 0%, #ffc247 55%, #e08a12 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; padding: 0 .02em; }
.ai-boss .ai-title { filter: drop-shadow(0 0 16px rgba(255,170,40,.55)); }
.ai-sub { margin: 14px 0 0; font-size: clamp(11px, 1.45vw, 16px); font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: rgba(255,255,255,.85);
  opacity: 0; transform: translateY(10px); transition: opacity .8s ease, transform .8s ease; }
.ai-sub i { display: inline-block; width: 5px; height: 5px; margin: 0 .9em; border-radius: 50%; vertical-align: middle; background: #4cc3ff; box-shadow: 0 0 10px #4cc3ff; }
.ai-boss .ai-sub i { background: #ffc247; box-shadow: 0 0 10px #ffc247; }
.ai-show-sub .ai-sub { opacity: 1; transform: none; }
@keyframes ai-letter { to { opacity: 1; transform: none; filter: blur(0); } }

.ai-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255,255,255,.08); pointer-events: none; }
.ai-bar b { display: block; height: 100%; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, #ff3b3b, #4cc3ff); box-shadow: 0 0 12px rgba(76,195,255,.8); }
.ai-boss .ai-bar b { background: linear-gradient(90deg, #ff7a1a, #ffc247); box-shadow: 0 0 12px rgba(255,194,71,.8); }

.ai-skip { position: absolute; top: max(16px, env(safe-area-inset-top)); right: 16px; padding: 8px 16px; border-radius: 999px; font: 600 12px/1 Inter, system-ui, sans-serif;
  letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.85); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(6px); cursor: pointer; opacity: 0; animation: ai-fadein .6s .8s forwards; }
.ai-skip:hover, .ai-skip:focus-visible { background: rgba(255,255,255,.18); color: #fff; outline: none; }
@keyframes ai-fadein { to { opacity: 1; } }

@media (max-width: 600px) { .ai-title { letter-spacing: .16em; } .ai-sub { letter-spacing: .14em; } .ai-sub i { margin: 0 .5em; } }
@media (prefers-reduced-motion: reduce) { .ai-root { display: none !important; } html.armg-intro-on body > *:not(#armgIntro) { visibility: visible !important; } }
