/* Scena otwierająca (js/scenes/IntroScene.js): napisy, cel, podpowiedź, radio, POMIŃ */
body.in-intro #hud, body.in-intro #touch, body.in-intro #levelBanner, body.in-intro #psycheVignette { display: none !important; }
#introUi { position: fixed; inset: 0; pointer-events: none; z-index: 40; font-family: "Chakra Petch", system-ui, sans-serif; color: #efe6d2; }
#introUi .intro-title { position: absolute; inset: 0; background: #030406; display: grid; place-content: center; text-align: center; gap: 10px; transition: opacity 1.6s ease; padding: 0 24px; }
#introUi .intro-title.out { opacity: 0; }
#introUi .intro-t1 { margin: 0; font-family: "Black Ops One", "Chakra Petch", sans-serif; font-size: clamp(22px, 4vw, 44px); letter-spacing: 0.12em; color: #c9a227; animation: introIn 1.4s ease both; }
#introUi .intro-t2 { margin: 0; font-size: clamp(14px, 1.8vw, 20px); color: #cfc6b2; animation: introIn 1.4s 1.2s ease both; }
#introUi .intro-t3 { margin: 8px 0 0; font-size: clamp(13px, 1.5vw, 17px); color: #8f877a; font-style: italic; animation: introIn 1.4s 2.6s ease both; }
@keyframes introIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
#introUi .intro-obj { position: absolute; left: 20px; top: 18px; max-width: min(460px, 70vw); padding: 8px 12px 8px 14px; background: rgba(8, 10, 8, 0.72);
  border-left: 3px solid #c9a227; font-size: 15px; line-height: 1.35; text-shadow: 0 1px 2px #000; }
#introUi .intro-obj.pulse { animation: introPulse 0.9s ease; }
@keyframes introPulse { 0% { background: rgba(201, 162, 39, 0.45); } 100% { background: rgba(8, 10, 8, 0.72); } }
#introUi .intro-hint { position: absolute; left: 50%; bottom: 13%; transform: translateX(-50%); padding: 6px 12px; background: rgba(8, 8, 8, 0.7); border: 1px solid rgba(239, 230, 210, 0.25);
  font-size: 15px; letter-spacing: 0.04em; white-space: nowrap; }
#introUi .intro-radio { position: absolute; left: 20px; bottom: 22px; width: min(520px, calc(100vw - 40px)); background: rgba(10, 14, 11, 0.9); border: 1px solid #3c4a33;
  box-shadow: 0 0 0 1px #000, 0 6px 18px rgba(0, 0, 0, 0.6); }
#introUi .intro-radio.in { animation: introRadio 0.35s ease; }
@keyframes introRadio { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
#introUi .intro-radio header { display: flex; align-items: center; gap: 8px; padding: 5px 10px; background: #1a2318; border-bottom: 1px solid #3c4a33; font-size: 12px; letter-spacing: 0.08em; }
#introUi .intro-radio header i { width: 8px; height: 8px; border-radius: 50%; background: #e04a2a; box-shadow: 0 0 6px #e04a2a; animation: introBlink 0.8s steps(2) infinite; }
#introUi .intro-radio header b { color: #c9a227; text-transform: uppercase; }
#introUi .intro-radio header span { margin-left: auto; color: #7f8a74; }
@keyframes introBlink { 50% { opacity: 0.2; } }
#introUi .intro-radio p { margin: 0; padding: 10px 12px 12px; font-size: 16px; line-height: 1.4; min-height: 2.8em; }
#introUi .intro-hurt { position: absolute; inset: 0; opacity: 0; box-shadow: inset 0 0 160px 40px rgba(150, 0, 0, 0.9); transition: opacity 0.15s linear; }
#introUi .intro-fade { position: absolute; inset: 0; background: #000; opacity: 0; transition: opacity 1.1s ease; }
#introUi .intro-fade.on { opacity: 1; }
#introUi .intro-skip { position: absolute; right: 18px; bottom: 18px; pointer-events: auto; cursor: pointer; padding: 8px 14px; font: 600 13px "Chakra Petch", system-ui, sans-serif;
  letter-spacing: 0.1em; color: #cfc6b2; background: rgba(8, 8, 8, 0.6); border: 1px solid rgba(207, 198, 178, 0.35); z-index: 2; }
#introUi .intro-skip:hover, #introUi .intro-skip:focus-visible { color: #fff; border-color: #c9a227; outline: none; }
#introUi .intro-radio, #introUi .intro-obj { z-index: 1; }
