/* Fighter introductions share the menu's poster typography and colours. */
.arena.cinematic-intro .fight-hud,.arena.cinematic-intro .fight-tools,.arena.cinematic-intro .controls-deck,.arena.cinematic-intro #shot-dock,.arena.cinematic-intro .touch-combat{visibility:hidden;pointer-events:none}
#announcement.announcement{inset:auto auto max(28px,env(safe-area-inset-bottom)) 4%;width:min(540px,52%);display:block;padding:0;border:0;background:none;box-shadow:none;transform:none;color:#fff;overflow:visible}
#announcement[hidden]{display:none}
#announcement .intro-ticket{position:relative;padding:17px 24px 18px;background:#ffe500;color:#191919;border:3px solid #191919;box-shadow:7px 7px 0 #191919;transform:rotate(-2deg);isolation:isolate}
#announcement[data-who=rival] .intro-ticket{background:#e33739;color:#fff}
#announcement .intro-ticket:before{content:'';position:absolute;right:14px;bottom:12px;width:42px;height:5px;background:currentColor;opacity:.35;transform:skewX(-20deg)}
#announcement .intro-slot{display:block;font:800 12px/1.1 'Barlow',sans-serif;letter-spacing:2px;margin:0 50px 8px 0;color:inherit}
#announcement .intro-number{position:absolute;right:15px;top:9px;font:900 italic 38px/1 var(--display);letter-spacing:-2px;color:inherit;opacity:.25}
#announcement .intro-name{display:block;font:900 italic clamp(36px,5.4vw,78px)/.92 var(--display);text-transform:uppercase;letter-spacing:-1.5px;overflow-wrap:anywhere;color:inherit;margin:0}
#announcement.long-name .intro-name{font-size:clamp(32px,4.3vw,60px)}
#announcement .intro-title{display:block;font:700 clamp(13px,1.5vw,18px)/1.15 'Barlow',sans-serif;letter-spacing:0;margin:10px 0 0;color:inherit}
#announcement .intro-line{font:600 14px/1.3 'Barlow',sans-serif;color:#fff;background:#191919e8;padding:9px 12px;margin:15px 0 0;max-width:100%;text-shadow:none}
#announcement #skip-intro{position:fixed;right:max(18px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));min-height:44px;max-width:none;border:2px solid #191919;border-radius:0;background:#ffe500;color:#191919;padding:10px 15px;font:800 13px/1 'Barlow',sans-serif;box-shadow:3px 3px 0 #191919;cursor:pointer}
#announcement #skip-intro:focus-visible{outline:3px solid white;outline-offset:4px}
#announcement.intro-arrive .intro-ticket{animation:intro-ticket-in .5s cubic-bezier(.15,.85,.25,1.15) both}
#announcement.intro-arrive .intro-name{animation:intro-name-in .4s .14s ease-out both}
#announcement.intro-arrive .intro-line{animation:intro-name-in .3s .25s ease-out both}
@keyframes intro-ticket-in{from{opacity:0;transform:translateX(-120%) rotate(-8deg)}to{opacity:1;transform:translateX(0) rotate(-2deg)}}
@keyframes intro-name-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.no-subtitles #announcement .intro-line{display:none}
.reduced #announcement .intro-ticket,.reduced #announcement .intro-name,.reduced #announcement .intro-line{animation:none}
@media(max-width:600px){#announcement.announcement{left:5%;width:88%;bottom:max(24px,env(safe-area-inset-bottom))}#announcement .intro-ticket{padding:14px 18px}#announcement .intro-name{font-size:clamp(38px,11vw,62px)}#announcement.long-name .intro-name{font-size:clamp(32px,9vw,52px)}#announcement .intro-line{font-size:12px;margin-top:12px}#announcement .intro-slot{font-size:10px}}
@media(max-height:500px) and (min-width:601px){#announcement.announcement{bottom:20px;width:42%}#announcement .intro-ticket{padding:12px 16px}#announcement .intro-name{font-size:44px}#announcement.long-name .intro-name{font-size:36px}#announcement .intro-line{font-size:11px;margin-top:10px}#announcement .intro-title{font-size:13px}}
@media(prefers-reduced-motion:reduce){#announcement .intro-ticket,#announcement .intro-name,#announcement .intro-line{animation:none}}

body.cinematic-intro #shot-dock,body.cinematic-intro .touch-fight-tools,body.cinematic-intro .touch-combat{visibility:hidden;pointer-events:none}
.no-subtitles #announcement>.intro-ticket{display:block!important}

body.cinematic-intro .controls-deck{visibility:hidden;pointer-events:none}

#announcement .intro-line.fighter-speaking{border-left:4px solid #ffe500;font-style:italic;font-size:16px}
@media(max-width:600px){#announcement .intro-line.fighter-speaking{font-size:14px}}
