/* A2 Armada reel styles. Everything is scoped under #a2-reel so it will not affect the rest of your site. */
#a2-reel h1, #a2-reel h2, #a2-reel p { margin:0; padding:0; color:inherit; background:none; border:0; text-align:inherit }
#a2-reel { position:relative; width:100%; overflow:hidden; border-radius:16px; background:#1e4077 }
#a2-reel .a2-stage { position:absolute; left:0; top:0; width:1920px; height:1080px; overflow:hidden; transform-origin:0 0; line-height:normal }
#a2-reel .scenebox { position:absolute; inset:0 }
#a2-reel .reel-btn { position:absolute; right:16px; bottom:16px; z-index:5; padding:8px 18px; border:0; border-radius:999px; background:#fcb316; color:#1e4077; font:700 15px "Source Sans 3", Arial, sans-serif; cursor:pointer }
#a2-reel .reel-btn:focus-visible { outline:3px solid #ffffff; outline-offset:2px }
#a2-reel .a2-stage {--sans:"Source Sans 3", "Helvetica Neue", Arial, sans-serif; --display:Montserrat, "Helvetica Neue", Arial, sans-serif; --ground:#1e4077; --main:#0097b9; --second:#ffffff; --accent:#87c042; --gold:#fcb316; color:var(--second); font-family:var(--sans, system-ui, sans-serif) }
#a2-reel .ground {position:absolute; inset:0; background:var(--ground) }
#a2-reel .words {position:absolute; margin:0; display:flex; flex-direction:column; gap:22px }
#a2-reel .words > * {margin:0 }
#a2-reel .line {font-family:var(--display, var(--sans, system-ui, sans-serif)); font-size:80px; line-height:1.06; font-weight:700; letter-spacing:-0.01em }
#a2-reel .sub {font-size:36px; line-height:1.3; color:color-mix(in srgb, var(--second) 78%, var(--ground)) }
#a2-reel .kicker {font-family:var(--display, var(--sans, system-ui, sans-serif)); font-size:24px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--main) }
#a2-reel .big {font-size:64px }
#a2-reel .chartbg {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.07 }
#a2-reel .vp {position:absolute; left:700px; top:90px; width:1130px; height:900px; border-radius:22px; overflow:hidden; background:#f1f1f1; box-shadow:0 30px 80px rgba(0,0,0,.35) }
#a2-reel .vp-in {position:absolute; left:0; top:0; transform-origin:0 0 }
#a2-reel .vp-in img {display:block; width:100%; height:100% }
#a2-reel .vp-dim {position:absolute; inset:0; background:color-mix(in srgb, var(--ground) 55%, transparent); pointer-events:none }
#a2-reel .ring {position:absolute; border:6px solid var(--gold); border-radius:14px; box-sizing:border-box; transform-origin:50% 50% }
#a2-reel .tag {position:absolute; padding:10px 18px; border-radius:999px; background:var(--gold); color:var(--ground); font-family:var(--display, var(--sans, system-ui, sans-serif)); font-weight:700; font-size:26px; white-space:nowrap }
#a2-reel .cap {left:120px; top:0; bottom:0; width:520px; justify-content:center }
#a2-reel .rule {width:90px; height:6px; border-radius:3px; background:var(--accent) }
#a2-reel .fleet {position:absolute; inset:0; width:100%; height:100%; overflow:visible }
#a2-reel .hull {fill:var(--main) }
#a2-reel .hull.b {fill:var(--second) }
#a2-reel .hull.c {fill:var(--accent) }