body.vxs-vibathlon-page #masthead,
body.vxs-vibathlon-page .site-header,
body.vxs-vibathlon-page .main-navigation,
body.vxs-vibathlon-page #colophon,
body.vxs-vibathlon-page .site-footer,
body.vxs-vibathlon-page #vxs-oracle-widget,
body.vxs-vibathlon-page #vxs-account-toast,
body.vxs-vibathlon-page #vxs-upgrade-toast,
body.vxs-vibathlon-page .vxs-dock,
body.vxs-vibathlon-page .footer-bottom-nav { display: none !important; }
body.vxs-vibathlon-page .entry-header .entry-title { display: none !important; }
body.vxs-vibathlon-page .site-content,
body.vxs-vibathlon-page .content-area,
body.vxs-vibathlon-page .site-main { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
.vxs-course, .vxs-course-gate { min-height: 100vh; padding: max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(88px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); background: #100d15; color: #fff; font-family: var(--font-body, "DM Sans",sans-serif); box-sizing: border-box; }
.vxs-course > .vgc .vgc-orb-layer { position: fixed; right: max(1.15rem,env(safe-area-inset-right)); bottom: max(1.15rem,env(safe-area-inset-bottom)); }
.vxs-course *, .vxs-course-gate * { box-sizing: border-box; }
.vxs-course-bar { position: sticky; top: env(safe-area-inset-top); z-index: 20; max-width: 1100px; min-height: 64px; margin: 0 auto 24px; display: flex; align-items: center; gap: 14px; border-bottom: 1px solid #ffffff20; border-radius: 0 0 14px 14px; background: #100d15; box-shadow: 0 8px 20px #100d15cc; }
.vxs-course-mark { width: 42px; height: 42px; flex: none; display: grid; place-items: center; position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,0.08); border-radius: 26%; background: #1a1528; box-shadow: none; }
.vxs-course-mark svg { display: block; width: 100%; height: 100%; }
.vxs-course-mark img { display: block; width: calc(80% + 2px); height: calc(80% + 2px); object-fit: contain; }
.vxs-course-bar p, .vxs-course-eyebrow { margin: 0 0 4px; color: #c9a9d3; font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.vxs-course-clock { margin-left: auto; font-variant-numeric: tabular-nums; font-size: 20px; font-weight: 700; }
.vxs-course-content { position: relative; max-width: 760px; margin: clamp(48px,12vh,130px) auto 0; padding: clamp(24px,6vw,56px); border: 1px solid #ffffff20; border-radius: 24px; background: radial-gradient(680px 340px at 50% -12%, #d4a8ff26, transparent 65%), #ffffff0b; overflow: hidden; text-align: center; }
.vxs-course-hero-mark { position: relative; display: block; margin: 0 auto clamp(10px,2vw,16px); width: clamp(96px,16vw,140px); height: clamp(96px,16vw,140px); }
.vxs-course-hero-mark img { display: block; width: 100%; height: 100%; filter: drop-shadow(0 0 34px #d4a8ff55) drop-shadow(0 0 70px #f08bc433); }
.vxs-course-hero-mark-label { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #e2d1ed; font-family: var(--font-display,"Syne",sans-serif); font-weight: 800; font-size: clamp(10px,1.6vw,13px); letter-spacing: .16em; }
.vxs-course-hero-wordmark { margin: 0 0 clamp(14px,3vw,22px); color: #d4a8ff; font-family: var(--font-display,"Syne",sans-serif); font-weight: 800; font-size: clamp(20px,3.4vw,28px) !important; letter-spacing: .28em; }
.vxs-course-content .vxs-course-eyebrow,
.vxs-course-content > p:not(.vxs-course-eyebrow),
.vxs-course-content .vxs-course-allowance-note { text-align: center; }
.vxs-course-allowance-note { display: none !important; }
.vxs-course h1 { margin: 8px 0 14px; color: white; font-family: var(--font-display,"Syne",sans-serif); font-size: clamp(34px,7vw,68px); line-height: 1.05; }
.vxs-course-hero-subline { margin: 0 0 2px; color: #d9c7e7; font-size: clamp(14px,2vw,18px); }
.vxs-course-content > p:not(.vxs-course-eyebrow):not(.vxs-course-hero-wordmark) { color: #d8d2dc; font-size: 18px; }
.vxs-course-content .vxs-course-allowance-note { margin: 14px 0; color: #e2d1ed; font-size: 14px; line-height: 1.5; }
.vxs-course-blocked { margin: 20px 0; padding: 18px 20px; border: 1px solid #ffb989aa; border-radius: 14px; background: #49302a; color: #fff2e5; text-align: left; }
.vxs-course-blocked * { text-align: left; }
.vxs-course-blocked h2 { margin: 0 0 8px; font-size: 22px; }
.vxs-course-blocked p { margin: 0 0 10px; }
.vxs-course-blocked ul { margin: 0; padding-left: 22px; }
.vxs-course-editions { display: grid; gap: 12px; margin: 24px 0; padding: 0; border: 0; text-align: left; }
.vxs-course-editions * { text-align: left; }
.vxs-course-editions legend { margin-bottom: 10px; color: #eee4f2; font-weight: 700; }
.vxs-course-editions label { display: flex; align-items: center; gap: 14px; min-height: 74px; padding: 14px 16px; border: 1px solid #ffffff44; border-radius: 14px; background: #ffffff0a; cursor: pointer; }
.vxs-course-edition-icon { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border: 1px solid #d4a8ff66; border-radius: 10px; color: #e4ceff; font-size: 25px; line-height: 1; }
.vxs-course-edition--classic .vxs-course-edition-icon svg { display: block; width: 23px; height: 23px; }
.vxs-course-edition-icon--turbo { border-color: #b892e866; color: #d3b5ff; }
.vxs-course-edition-icon--turbo svg { display:block; width:23px; height:23px; }
.vxs-course-editions label:has(input:checked) { border-color: #d4a8ff; background: #d4a8ff1c; }
.vxs-course-edition-copy { display: flex; align-items: baseline; flex-wrap: wrap; column-gap: 12px; row-gap: 2px; }
.vxs-course-editions strong { font-size: 19px; }
.vxs-course-editions small { margin-top: 0; color: #d8d2dc; font-size: 15px; }
.vxs-course-editions input { accent-color: #d4a8ff; }
.vxs-course-edition-go { margin-left: auto; padding-left: 12px; color: #d4a8ff; font-size: 26px; font-weight: 800; line-height: 1; opacity: .8; }
.vxs-course-edition--turbo .vxs-course-edition-go { color: #b892e8; }
.vxs-course-edition--turbo { border-color: #9b6fe099 !important; background: linear-gradient(135deg,#9b6fe02e,#7c4fd026) !important; }
.vxs-course-edition--turbo:has(input:checked) { border-color: #9b6fe0 !important; background: linear-gradient(135deg,#9b6fe04d,#7c4fd045) !important; }
.vxs-course-edition--turbo input { accent-color: #9b6fe0; }
.vxs-course-howto { max-width: 760px; margin: clamp(24px,6vh,64px) auto; padding: clamp(24px,5vw,48px); border: 1px solid #ffffff30; border-radius: 24px; background: linear-gradient(145deg,#21162d,#14101b); }
.vxs-course-howto h2 { margin: 8px 0 14px; font: 800 clamp(28px,5vw,48px)/1.1 var(--font-display,"Syne",sans-serif); }
.vxs-course-howto-lead { color: #fff; font-size: 20px; font-weight: 700; }
.vxs-course-howto p:not(.vxs-course-eyebrow) { max-width: 56ch; }
.vxs-course-suspended { max-width: 760px; margin: clamp(24px,8vh,100px) auto; padding: clamp(24px,5vw,48px); border: 1px solid #d4a8ff88; border-radius: 24px; background: linear-gradient(145deg,#30203e,#17111f); }
.vxs-course-suspended p { color: #eee4f2; }
.vxs-course-demo { position: relative; height: 150px; margin: 28px 0; overflow: hidden; border: 1px solid #ffffff26; border-radius: 18px; background: radial-gradient(circle at center,#65458b55,#15111e); }
.vxs-course-demo span { position: absolute; top: 50%; display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid #ffffff88; border-radius: 12px; background: #7660ba; font-size: 24px; transform: translateY(-50%); }
.vxs-course-demo-a { left: 20%; animation: vxs-demo-left 5s ease-in-out infinite; }
.vxs-course-demo-b { right: 20%; animation: vxs-demo-right 5s ease-in-out infinite; }
.vxs-course-demo .vxs-course-demo-target { left: calc(50% - 27px); opacity: 0; background: #3d9f7c; animation: vxs-demo-success 5s ease-in-out infinite; }
.vxs-course-demo--mood_ring .vxs-course-demo-a { border-radius: 50%; animation-name: vxs-demo-bubble; }
.vxs-course-demo--mood_ring .vxs-course-demo-b { border-radius: 50%; animation-name: vxs-demo-bubble-two; }
.vxs-course-demo--mood_guesser .vxs-course-demo-a { animation-name: vxs-demo-wave; }
.vxs-course-demo--mood_guesser .vxs-course-demo-b { animation-name: vxs-demo-answer; }
.vxs-course-demo--vibe_shuffle .vxs-course-demo-a,.vxs-course-demo--vibe_challenge .vxs-course-demo-a { animation-name: vxs-demo-place; }
.vxs-course-demo--vibe_shuffle .vxs-course-demo-b,.vxs-course-demo--vibe_challenge .vxs-course-demo-b { animation-name: vxs-demo-slot; }
.vxs-course-demo--mood_memory .vxs-course-demo-a,.vxs-course-demo--mood_memory .vxs-course-demo-b,.vxs-course-demo--mood_match .vxs-course-demo-a,.vxs-course-demo--mood_match .vxs-course-demo-b { animation-name: vxs-demo-flip; }
.vxs-course-demo--rapid_pace .vxs-course-demo-a,.vxs-course-demo--sprinter .vxs-course-demo-a { animation-name: vxs-demo-left; }
.vxs-course-demo--rapid_pace .vxs-course-demo-b,.vxs-course-demo--sprinter .vxs-course-demo-b { animation-name: vxs-demo-right; }
@keyframes vxs-demo-left { 0%,12% { left: 20%; transform: translateY(-50%); } 45%,65% { left: 43%; transform: translateY(-50%) scale(1.08); } 85%,100% { left: 20%; transform: translateY(-50%); } }
@keyframes vxs-demo-right { 0%,12% { right: 20%; transform: translateY(-50%); } 45%,65% { right: 43%; transform: translateY(-50%) scale(1.08); } 85%,100% { right: 20%; transform: translateY(-50%); } }
@keyframes vxs-demo-success { 0%,43%,72%,100% { opacity: 0; transform: translateY(-50%) scale(.5); } 50%,65% { opacity: 1; transform: translateY(-50%) scale(1); } }
@keyframes vxs-demo-bubble { 0%,100% { left: 20%; transform: translateY(-50%); } 25% { left: 30%; transform: translateY(-70%); } 55% { left: 45%; transform: translateY(-50%) scale(.2); opacity: .2; } 70% { opacity: 1; } }
@keyframes vxs-demo-bubble-two { 0%,100% { right: 20%; transform: translateY(-50%); } 25% { right: 27%; transform: translateY(-25%); } 55% { right: 42%; transform: translateY(-50%) scale(.2); opacity: .2; } 70% { opacity: 1; } }
@keyframes vxs-demo-wave { 0%,100% { transform: translateY(-50%) scaleY(.5); } 20%,55% { transform: translateY(-50%) scaleY(1.25); } 38% { transform: translateY(-50%) scaleY(.7); } }
@keyframes vxs-demo-answer { 0%,30%,100% { opacity: .4; transform: translateY(-50%); } 55%,75% { opacity: 1; transform: translateY(-50%) scale(1.15); } }
@keyframes vxs-demo-place { 0%,15%,100% { left: 20%; transform: translateY(-50%); } 55%,75% { left: 45%; transform: translateY(-50%); } }
@keyframes vxs-demo-slot { 0%,45%,100% { opacity: .45; transform: translateY(-50%); } 55%,75% { opacity: 1; transform: translateY(-50%) scale(1.15); } }
@keyframes vxs-demo-flip { 0%,18%,100% { transform: translateY(-50%) rotateY(180deg); filter: brightness(.6); } 38%,68% { transform: translateY(-50%) rotateY(0); filter: brightness(1.3); } }
.vxs-course-breather { max-width: 760px; margin: clamp(24px,6vh,64px) auto; padding: clamp(24px,5vw,48px); border: 1px solid #ffffff30; border-radius: 24px; background: linear-gradient(145deg,#21162d,#14101b); box-shadow: 0 24px 70px #0005; }
.vxs-course-breather h2 { margin: 8px 0; color: #fff; font: 800 clamp(26px,5vw,44px)/1.1 var(--font-display,"Syne",sans-serif); }
.vxs-course-stars { margin: 8px 0; color: #f9cf73; font-size: 28px; letter-spacing: .15em; }
.vxs-course-result-score { margin: 12px 0 22px; color: #d8d2dc; font-size: 20px; }
.vxs-course-result-score strong { color: #fff; font-size: 42px; font-variant-numeric: tabular-nums; }
.vxs-course-meters { display: grid; gap: 12px; }
.vxs-course-meters label { display: grid; grid-template-columns: 120px 1fr 44px; align-items: center; gap: 12px; color: #eee4f2; font-size: 14px; }
.vxs-course-meters meter { width: 100%; height: 16px; accent-color: #d4a8ff; }
.vxs-course-meters span { text-align: right; font-variant-numeric: tabular-nums; }
.vxs-course-breather [data-course-split], .vxs-course-breather [data-course-tier], .vxs-course-breather [data-course-halfway] { margin: 16px 0 0; color: #d9c7e7; }
.vxs-course-hype { margin: 18px 0; padding: 16px; border: 1px solid #f08bc477; border-radius: 16px; background: #f08bc412; }
.vxs-course-hype[hidden] { display: none; }
.vxs-course .vxs-course-hype button { min-height: 44px; border: 1px solid #f08bc4 !important; border-radius: 12px; background: #f08bc4 !important; color: #1a1022 !important; font-weight: 800; }
.vxs-course-hype p { margin: 10px 0 0; color: #f8d8eb; }
.vxs-course-total { margin: 22px 0 8px; font-size: 18px; }
.vxs-course-total strong { color: #f9cf73; font-variant-numeric: tabular-nums; }
.vxs-course-breather [data-course-next] { margin: 0 0 20px; font-weight: 700; }
.vxs-course-breather-actions { display: flex; align-items: center; gap: 16px; }
.vxs-course-breather-actions span { color: #d9c7e7; font-variant-numeric: tabular-nums; }
.vxs-course button, .vxs-course-gate a { min-height: 48px; padding: 12px 22px; border: 0; border-radius: 14px; background: #d4a8ff; color: #1a1022; font: inherit; font-weight: 800; cursor: pointer; }
.vxs-course button:disabled { opacity: .55; cursor: wait; }
.vxs-course-play { max-width: 1100px; margin: 0 auto; }
.vxs-course-play iframe { width: 100%; min-height: min(72vh,760px); border: 1px solid #ffffff20; border-radius: 18px; background: #18131f; }
.vxs-course-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 12px; padding-right: 76px; }
.vxs-course-actions [data-course-skip] { background: transparent; border: 1px solid #ffffff50; color: #fff; }
.vxs-course-dialog { width: min(480px,calc(100vw - 32px)); padding: 28px; border: 1px solid #c9a9d3; border-radius: 18px; background: #21162d; color: #fff; box-shadow: 0 24px 80px #0009; }
.vxs-course-dialog::backdrop { background: #090610bb; }
.vxs-course-dialog h2 { margin: 0 0 12px; }
.vxs-course-dialog p { color: #eee4f2; }
.vxs-course-dialog div { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.vxs-course-dialog [data-course-skip-confirm], .vxs-course-dialog [data-course-leave-confirm] { background: transparent; border: 1px solid #ffffff80; color: #fff; }
.vxs-course .vxs-course-dialog .vxs-course-primary, .vxs-course .vxs-course-breather .vxs-course-primary { background: #d4a8ff !important; border: 0 !important; color: #1a1022 !important; box-shadow: 0 8px 24px #d4a8ff44; }
.vxs-course .vxs-course-dialog .vxs-course-primary:hover, .vxs-course .vxs-course-breather .vxs-course-primary:hover { background: #dfbdff !important; color: #1a1022 !important; }
.vxs-course .vxs-course-primary { background: #d4a8ff !important; color: #1a1022 !important; box-shadow: 0 8px 24px #d4a8ff44; }
.vxs-course-cap-notice { position: sticky; top: calc(env(safe-area-inset-top) + 64px); z-index: 19; max-width: 1100px; margin: -16px auto 24px; padding: 10px 14px; border: 1px solid #f9cf7366; border-radius: 10px; background: #382b22; color: #fff2d5; font-weight: 700; }
.vxs-course-cap-notice.is-urgent { border-color: #ff928b; background: #4e2429; }
.vxs-course-finish { max-width: 850px; margin: clamp(24px,6vh,70px) auto; padding: clamp(24px,5vw,48px); border: 1px solid #ffffff33; border-radius: 24px; background: linear-gradient(155deg,#2c1a3b,#130f1c); }
.vxs-course-finish .vxs-course-finish-mark { width: 72px; height: 72px; margin-bottom: 18px; }
.vxs-course-finish-total { margin: 22px 0; color: #e9dcf5; font-size: 20px; }
.vxs-course-finish-total strong { color: #f9cf73; font: 800 clamp(48px,9vw,88px)/1 var(--font-display,"Syne",sans-serif); font-variant-numeric: tabular-nums; }
.vxs-course-finish-tier { display: inline-flex; align-items: center; min-height: 42px; margin: 0; padding: 8px 16px; border: 1px solid #f9cf7380; border-radius: 999px; background: #f9cf7318; color: #ffe7a1; font-weight: 800; letter-spacing: .04em; }
.vxs-course-finish-legs { display: grid; gap: 12px; margin: 28px 0; padding: 0; list-style: none; }
.vxs-course-finish-legs li { padding: 16px; border: 1px solid #ffffff25; border-radius: 14px; background: #ffffff0a; }
.vxs-course-finish-legs li > div:first-child { display: flex; justify-content: space-between; gap: 12px; }
.vxs-course-finish-components { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 10px; }
.vxs-course-finish-components label { color: #d9c7e7; font-size: 12px; }
.vxs-course-finish-components meter { display: block; width: 100%; height: 13px; accent-color: #d4a8ff; }
.vxs-course-replay { color: #eee4f2; }
.vxs-course-finish-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.vxs-course-finish-actions a { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 22px; border: 1px solid #ffffff70; border-radius: 14px; color: #fff; text-decoration: none; font-weight: 800; }
.vxs-course-join-board { display: grid; gap: 12px; margin: 24px 0; padding: 18px; border: 1px solid #d4a8ff70; border-radius: 16px; background: #d4a8ff12; }
.vxs-course-join-board h2,.vxs-course-join-board p { margin: 0; }
.vxs-course-join-board button,.vxs-course-join-board select,.vxs-course-join-board input { min-height: 48px; padding: 10px 14px; border: 1px solid #ffffff55; border-radius: 12px; background: #21192b; color: #fff; font: inherit; }
.vxs-course-join-board form { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; }
.vxs-course-join-board label { display: grid; gap: 5px; }
.vxs-course-join-board summary { display: flex; align-items: center; min-height: 48px; cursor: pointer; }
.vxs-course-finish.is-animated .vxs-course-finish-legs li { animation: vxs-finish-light .45s both; animation-delay: calc(var(--finish-index) * .16s); }
.vxs-course-finish.is-animated .vxs-course-finish-total { animation: vxs-finish-rise .55s .18s both; }
.vxs-course-finish.is-animated .vxs-course-finish-tier { animation: vxs-finish-tier .65s .65s both; }
.vxs-course-finish.is-animated .vxs-course-finish-legs { animation: vxs-finish-rise .45s .8s both; }
.vxs-course-finish.is-animated .vxs-course-replay,.vxs-course-finish.is-animated .vxs-course-finish-actions { animation: vxs-finish-rise .4s 1.1s both; }
@keyframes vxs-finish-light { from { opacity: .25; transform: translateY(12px); border-color: #ffffff25; } to { opacity: 1; transform: translateY(0); border-color: #d4a8ff88; } }
@keyframes vxs-finish-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes vxs-finish-tier { 0% { opacity: 0; transform: scale(.8); } 70% { opacity: 1; transform: scale(1.08); } 100% { opacity: 1; transform: scale(1); } }
.vxs-course-gate { display: grid; place-content: center; text-align: center; }
.vxs-course [hidden] { display: none !important; }
.vxs-course-mode-picker { display: flex; justify-content: center; gap: 10px; margin: 18px auto 0; }
.vxs-course .vxs-course-mode-picker button { min-width: 108px; border: 1px solid #ffffff45; background: #ffffff0b; color: #eee4f2; }
.vxs-course .vxs-course-mode-picker button[aria-pressed="true"] { border-color: #8ecbff; background: #8ecbff22; color: #d9efff; }
.vxs-course-battle-panel { max-width: 700px; margin: 20px auto 0; padding: clamp(20px,4vw,34px); border: 1px solid #8ecbff55; border-radius: 18px; background: radial-gradient(520px 230px at 50% -18%,#8ecbff26,transparent 70%),#151b24; text-align: left; }
.vxs-course-start-instructions { max-width: 38rem; margin: 12px auto !important; color: #d8e7f1 !important; font-size: .96rem; line-height: 1.5; }
.vxs-course-start-instructions .vgh-gearup-orb { display: inline-block; width: 2.05rem; height: 2.05rem; margin: 0 .16rem; overflow: visible; vertical-align: -.64rem; }
.vxs-course-battle-panel h2 { margin: 0 0 8px; color: #f5fbff; font: 800 clamp(24px,4vw,34px)/1.1 var(--font-display,"Syne",sans-serif); }
.vxs-course-battle-panel > p { color: #d8e7f1; line-height: 1.5; }
.vxs-course-battle-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: stretch; gap: 14px; margin: 24px 0 18px; }
.vxs-course-battle-actions.without-friends { grid-template-columns: repeat(2,minmax(0,1fr)); }
.vxs-course-battle-action { display: flex; min-width: 0; flex-direction: column; padding: 20px; border: 1px solid #8ecbff38; border-radius: 16px; background: linear-gradient(155deg,#1b2a39,#111922 78%); box-shadow: inset 0 1px #ffffff0c,0 12px 28px #02070c55; }
.vxs-course-battle-action-label { margin: 0 0 10px !important; color: #8fc7fa !important; font-size: .68rem; font-weight: 800; letter-spacing: .15em; }
.vxs-course-battle-action h3 { margin: 0 0 8px; color: #f4f9ff; font: 800 1.14rem/1.2 var(--font-display,"Syne",sans-serif); }
.vxs-course-battle-action-detail { min-height: 4.5em; margin: 0 0 18px !important; color: #b9cbd9 !important; font-size: .9rem; line-height: 1.5; }
.vxs-course-battle-panel .vxs-course-battle-accept { display: grid; grid-template-columns: minmax(0,1fr) auto; align-content: start; align-items: end; gap: 10px; margin: auto 0 0; }
.vxs-course-battle-panel .vxs-course-battle-accept label { display: grid; min-width: 0; gap: 8px; color: #d8e7f1; font-size: .88rem; }
.vxs-course-battle-panel .vxs-course-battle-accept input,
.vxs-course-battle-panel .vxs-course-battle-accept select { width: 100%; min-width: 0; min-height: 48px; padding: 10px 12px; border: 1px solid #8ecbff70; border-radius: 10px; background: #101820; color: #f5fbff; font: inherit; }
.vxs-course-battle-action > button { width: 100%; min-height: 48px; margin-top: auto; border-radius: 11px; }
.vxs-course-battle-action .vxs-course-battle-accept > button { width: auto; min-width: 96px; min-height: 48px; margin-top: 0; align-self: end; border-radius: 11px; }
.vxs-course-battle-action .vxs-course-battle-code { margin: 14px 0 0; }
.vxs-course-battle-action .vxs-course-battle-code strong { min-width: 0; overflow-wrap: anywhere; }
.vxs-course-battle-action .vxs-course-battle-code button { min-height: 42px; margin-left: auto; padding: 8px 12px; border: 1px solid #8ecbff70; border-radius: 9px; background: #203b54; color: #f5fbff; font: inherit; font-weight: 700; }
.vxs-course-battle-matches-heading { margin: 14px 0 8px; padding-top: 0; border-top: 0; color: #e8f4ff; font: 800 1rem/1.3 var(--font-display,"Syne",sans-serif); }
.vxs-course-battle-panel [role="status"]:empty { margin: 0; }
.vxs-course-battle-grounds, .vxs-course-battle-invite { margin: 0 0 14px; }
.vxs-course-battle-grounds summary, .vxs-course-battle-invite summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px; border: 1px solid #8ecbff38; border-radius: 14px; background: linear-gradient(155deg,#1b2a39,#111922 78%); color: #f4f9ff; font: 800 1rem/1.2 var(--font-display,"Syne",sans-serif); list-style: none; cursor: pointer; }
.vxs-course-battle-summary-label { display: inline-flex; align-items: center; gap: 9px; }
.vxs-course-battle-summary-icon { display: inline-grid; place-items: center; font-family: var(--font-body,"DM Sans",sans-serif); font-size: 1.05em; line-height: 1; }
.vxs-course-battle-grounds summary::marker, .vxs-course-battle-grounds summary::-webkit-details-marker, .vxs-course-battle-invite summary::marker, .vxs-course-battle-invite summary::-webkit-details-marker { display: none; }
.vxs-course-battle-grounds summary::after, .vxs-course-battle-invite summary::after { content: '+'; color: #8fc7fa; font-size: 1.3rem; line-height: 1; }
.vxs-course-battle-grounds[open] summary, .vxs-course-battle-invite[open] summary { border-radius: 14px 14px 0 0; }
.vxs-course-battle-grounds[open] summary::after, .vxs-course-battle-invite[open] summary::after { content: '\2212'; }
.vxs-course-battle-grounds > :not(summary) { padding: 0 18px; }
.vxs-course-battle-invite > p { margin: 16px 0 0; padding: 0 4px; color: #b9cbd9; font-size: .9rem; }
.vxs-course-duet .vxs-course-battle-grounds summary, .vxs-course-duet .vxs-course-battle-invite summary { border-color: #ec489940; background: linear-gradient(155deg,#392033,#1b111d 78%); }
.vxs-course-duet .vxs-course-battle-grounds summary::after, .vxs-course-duet .vxs-course-battle-invite summary::after { color: #f472b6; }
.vxs-course-battle-panel > button,.vxs-course-battle-panel form button { min-height: 44px; padding: 10px 16px; border: 1px solid #7bbaff90; border-radius: 10px; background: #1b3d5c; color: #f5fbff; font: inherit; font-weight: 700; cursor: pointer; }
.vxs-course-battle-panel .vxs-course-primary,.vxs-course-battle-panel form button { background: #7bbaff !important; color: #0b1a2b !important; }
.vxs-course.vxs-course-battle .vxs-course-battle-panel .vxs-course-battle-accept button { background-color: #7bbaff !important; background-image: none !important; border-color: #7bbaff !important; color: #0b1a2b !important; border-radius: 11px !important; text-transform: none !important; padding: 12px 22px !important; font-weight: 800 !important; letter-spacing: normal !important; }
.vxs-course-duet .vxs-course-battle-panel .vxs-course-battle-accept button { border-radius: 11px !important; text-transform: none !important; padding: 12px 22px !important; font-weight: 800 !important; letter-spacing: normal !important; }
.vxs-course.vxs-course-battle .vxs-course-battle-panel .vxs-course-battle-accept button[type=submit]:hover:not(.btn-newsletter):not(.menu-toggle):not(.vym-btn),.vxs-course.vxs-course-battle .vxs-course-battle-panel .vxs-course-battle-accept button:focus-visible { background: #a2d2ff !important; border-color: #a2d2ff !important; box-shadow: 0 0 24px #7bbaff55 !important; }
.vxs-course.vxs-course-duet { --duet-accent:#ec4899; --duet-bright:#f472b6; --duet-muted:#f5d3e5; background:radial-gradient(900px 760px at 50% 18%,#ec489918,transparent 72%),#130d19; color:#fff8ff; }
.vxs-course-duet .vxs-course-bar { border-color:#ec489940; background:#130d19; }
.vxs-course-duet .vxs-course-bar p,.vxs-course-duet .vxs-course-eyebrow,.vxs-course-duet .vxs-course-hero-wordmark { color:#f472b6; }
.vxs-course-duet .vxs-course-content { border-color:#ec489955; background:radial-gradient(680px 340px at 50% -12%,#ec48992c,transparent 65%),#17101e; }
.vxs-course-duet .vxs-course-content > p:not(.vxs-course-eyebrow):not(.vxs-course-hero-wordmark) { color:#f5d3e5; }
.vxs-course-duet .vxs-course-hero-mark { width:clamp(150px,28vw,190px); height:auto; aspect-ratio:8/5; }
.vxs-course-duet .vxs-course-hero-mark img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; transform:none; filter:drop-shadow(0 0 24px #ec489955) drop-shadow(0 0 46px #8b5cf644); }
.vxs-course-duet .vxs-course-hero-mark-label { top:50%; bottom:auto; left:50%; transform:translate(-50%,-50%); position:absolute; padding:7px 14px; border:0; border-radius:999px; background:#1b1124e6; box-shadow:none; color:#fff; font-size:clamp(9px,1.25vw,11px); font-weight:900; letter-spacing:.12em; line-height:1; white-space:nowrap; text-shadow:none; z-index:2; }
.vxs-course-duet .vxs-course-hero-mark-label::before { content:""; position:absolute; inset:0; padding:1.5px; border-radius:inherit; background:conic-gradient(from var(--vxs-duet-halo-angle,0deg),#8b5cf6 0 10%,#c084fc 16%,transparent 26% 56%,#ec4899 68%,#f472b6 80%,transparent 89% 100%); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; filter:drop-shadow(0 0 5px #ec489988); pointer-events:none; animation:vxs-duet-halo-orbit 3.2s linear infinite; }
@property --vxs-duet-halo-angle { syntax:"<angle>"; inherits:false; initial-value:0deg; }
@keyframes vxs-duet-halo-orbit { to { --vxs-duet-halo-angle:360deg; } }
@media (prefers-reduced-motion: reduce) { .vxs-course-duet .vxs-course-hero-mark-label::before { animation:none; } }
.vxs-course-duet .vxs-course-content h1 { color:#fff8ff; }
.vxs-course-duet .vxs-course-editions label:has(input:checked) { border-color:#ec4899; background:#ec48991c; }
.vxs-course-duet .vxs-course-editions input { accent-color:#ec4899; }
.vxs-course-duet .vxs-course-edition-go { color:#f472b6; }
.vxs-course-duet .vxs-course-edition--turbo { border-color:#8b5cf699 !important; background:linear-gradient(135deg,#8b5cf633,#ec489922) !important; }
.vxs-course-duet .vxs-course-edition--turbo:has(input:checked) { border-color:#ec4899 !important; background:linear-gradient(135deg,#8b5cf64d,#ec489944) !important; }
.vxs-course-duet .vxs-course-edition--turbo input { accent-color:#ec4899; }
.vxs-course-duet .vxs-course-mode-picker button[aria-pressed="true"] { border-color:#ec4899; background:#ec489922; color:#ffe4f1; }
.vxs-course-duet .vxs-course-battle-panel { border-color:#ec489966; background:radial-gradient(520px 230px at 50% -18%,#ec489933,transparent 70%),#19121f; }
.vxs-course-duet .vxs-course-battle-actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
.vxs-course-duet .vxs-course-battle-action { border-color:#ec489940; background:linear-gradient(155deg,#392033,#1b111d 78%); }
.vxs-course-duet .vxs-course-battle-action-label { color:#f472b6 !important; }
.vxs-course-duet .vxs-course-battle-panel .vxs-course-battle-accept input,.vxs-course-duet .vxs-course-battle-panel .vxs-course-battle-accept select { border-color:#ec489970; }
.vxs-course-duet .vxs-course-battle-panel > button,.vxs-course-duet .vxs-course-battle-panel form button,.vxs-course-duet .vxs-course-battle-panel .vxs-course-primary { background:linear-gradient(135deg,#8b5cf6,#ec4899) !important; border-color:#ec4899 !important; color:#1b0b17 !important; }
.vxs-course-duet .vxs-course-battle-live { border-color:#ec489970; background:#2c1728; color:#ffe4f1; }
.vxs-course-duet .vxs-course-duet-live { max-width:360px; }
.vxs-course-duet .vxs-course-battle-live img { object-fit:contain; }
.vxs-course-duet-reactions { display:flex; gap:4px; margin-left:4px; }
.vxs-course-duet-reactions button { display:grid; place-items:center; width:44px; min-width:44px; min-height:44px; padding:0; border:1px solid #ec489970; border-radius:9px; background:#3a1b33; color:#fff; font-size:19px; cursor:pointer; }
.vxs-course-duet-reactions button:focus-visible { outline:3px solid #f472b6; outline-offset:2px; }
.vxs-course-duet-reactions button:disabled { opacity:.55; cursor:wait; }
.vxs-course-duet .vxs-course-meters meter { accent-color:#ec4899; }
@media (max-width:920px) { .vxs-course-duet .vxs-course-battle-actions { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px) { .vxs-course-duet .vxs-course-battle-actions { grid-template-columns:minmax(0,1fr); } .vxs-course-duet .vxs-course-battle-action { min-height:0; } }
@media (max-width:600px) { .vxs-course-duet .vxs-course-duet-live { flex:1 0 100%; max-width:none; margin-left:0; justify-content:space-between; } }
.vxs-course-battle-accept { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; margin: 20px 0; }
.vxs-course-battle-accept label { display: grid; flex: 1 1 220px; gap: 6px; color: #d8e7f1; font-weight: 700; }
.vxs-course-battle-accept input { min-height: 44px; padding: 10px 12px; border: 1px solid #8ecbff70; border-radius: 9px; background: #101820; color: #fff; font: inherit; letter-spacing: .12em; text-transform: uppercase; }
.vxs-course-battle-code { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 12px; border: 1px solid #8ecbff66; border-radius: 10px; background: #101820; color: #e7f4ff !important; }
.vxs-course-battle-code strong { font: 800 1.2rem/1.2 var(--font-display,"Syne",sans-serif); letter-spacing: .16em; }
.vxs-course-battle-match { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 10px; padding: 12px 0; border-top: 1px solid #ffffff20; color: #e5edf4; }
.vxs-course-battle-match > span { flex: 1 1 100%; }
.vxs-course-battle-match button { min-height: 44px; padding: 7px 12px; border: 1px solid #8ecbff70; border-radius: 10px; background: #213347; color: #f5fbff; font: inherit; font-weight: 700; }
.vxs-course-battle-match.is-active > span { color: #a8dcff; font-weight: 700; }
.vxs-course-battle-match.is-active { border-top-color: #8ecbff55; }
.vxs-course-battle-match.is-done { opacity: .62; }
.vxs-course-battle-match.is-done button { background: transparent; border-color: #ffffff2a; color: #cdd9e2; font-weight: 600; }
.vxs-course-battle-match.is-done button:hover, .vxs-course-battle-match.is-done button:focus-visible { background: #ffffff14; border-color: #ffffff4a; color: #f5fbff; }
.vxs-course-battle-match.is-done button:disabled { opacity: .5; cursor: default; }
.vxs-course-duet .vxs-course-battle-match.is-active > span { color: #f9a8d4; }
.vxs-course-duet .vxs-course-battle-match.is-active { border-top-color: #ec489970; }
.vxs-course-battle-panel [role="status"] { min-height: 1.5em; color: #b9dcf5; }
.vxs-course-battle-live { display: flex; align-items: center; gap: 8px; max-width: 240px; margin-left: auto; padding: 6px 9px; border: 1px solid #8ecbff55; border-radius: 8px; background: #172534; color: #d9efff; font-size: 12px; line-height: 1.25; }
.vxs-course-battle-live img { display: block; flex: 0 0 32px; width: 32px; height: 32px; }
.vxs-course-battle-result-reason { margin-top: -6px; color: #bfd2df; font-size: .88rem; }
.vxs-course-battle-result[data-outcome="you"] { padding: 20px; border: 1px solid #7bbaff88; border-radius: 18px; background: radial-gradient(ellipse at 50% 0%, #3b82f633, transparent 72%), #102039; animation: vxs-battle-win-in .55s cubic-bezier(.2,.8,.2,1) both; }
.vxs-course-battle-result[data-outcome="you"] h2 { color: #b9dcff; text-shadow: 0 0 22px #3b82f666; }
.vxs-course-battle-result[data-outcome="opponent"] { padding: 16px; border: 1px solid #ffffff18; border-radius: 18px; background: #ffffff08; }
@keyframes vxs-battle-win-in { from { opacity: .55; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (prefers-reduced-motion: reduce) { .vxs-course-battle-result[data-outcome="you"] { animation: none; } }
.vxs-course-gate-battle { gap: 12px; background: radial-gradient(680px 420px at 50% 30%,#226eb52b,transparent 68%),#07111b; color: #f5fbff; }
.vxs-course-gate-battle-mark { display: block; width: clamp(120px,26vw,168px); height: auto; margin: 0 auto 4px; filter: drop-shadow(0 0 28px #7bbaff42); }
.vxs-course-gate-battle-eyebrow { margin: 0; color: #7bbaff; font: 800 12px/1.3 var(--font-display,"Syne",sans-serif); letter-spacing: .16em; text-transform: uppercase; }
.vxs-course-gate-battle h1 { margin: 0; color: #f5fbff; font: 800 clamp(30px,6vw,48px)/1.08 var(--font-display,"Syne",sans-serif); }
.vxs-course-gate-battle > p:not(.vxs-course-gate-battle-eyebrow) { max-width: 520px; margin: 0 auto 8px; color: #bfd2df; line-height: 1.55; }
.vxs-course-gate-battle a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; margin: 4px auto 0; border: 1px solid #7bbaff; border-radius: 12px; background: #7bbaff; color: #0b1a2b; font-weight: 800; text-decoration: none; }
.vxs-course-gate-battle a:hover { background: #a2d2ff; border-color: #a2d2ff; }
.vxs-course-gate-battle a:focus-visible { outline: 3px solid #e7f4ff; outline-offset: 3px; }
@media (max-width: 920px) { .vxs-course-battle-actions { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 520px) { .vxs-course-battle-actions { grid-template-columns: minmax(0,1fr); } .vxs-course-battle-action { min-height: 0; } .vxs-course-battle-action-detail { min-height: 0; } .vxs-course-battle-panel .vxs-course-battle-accept { grid-template-columns: minmax(0,1fr); } .vxs-course-battle-action .vxs-course-battle-accept > button { width: 100%; } .vxs-course-battle-match { align-items: stretch; } .vxs-course-battle-match button { flex: 1 1 100%; } }
@media (max-width: 520px) { .vxs-course-battle-actions.without-friends { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 600px) { .vxs-course-battle-live { flex: 1 0 100%; max-width: none; margin-left: 52px; } }
@media (max-width: 600px) { .vxs-course-bar { min-height: 56px; } .vxs-course-mark { width: 36px; height: 36px; } .vxs-course-cap-notice { top: calc(env(safe-area-inset-top) + 56px); } .vxs-course-play iframe { min-height: 70vh; } .vxs-course-actions { justify-content: stretch; } .vxs-course-actions button { flex: 1; } .vxs-course-meters label { grid-template-columns: 1fr 1.2fr 40px; gap: 8px; } .vxs-course-breather-actions { align-items: stretch; flex-direction: column; } .vxs-course-finish-components { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

.vxs-course-finish-time,.vxs-course-personal-best{margin:8px 0;color:#e8dafa;font-weight:700}.vxs-course-personal-best{color:#d6c5ff}.vxs-course-finish-split{margin:8px 0 0;color:#d6c5ff;font-size:.9rem}.vxs-course-finish-actions a:last-of-type{border-color:#d4a8ff;background:#d4a8ff;color:#1a1022}

.vxs-course-share-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0}.vxs-course-finish-actions button{min-height:48px;padding:10px 18px}

/* Battle is its own blue identity; Solo keeps the existing lavender palette. */
.vxs-course.vxs-course-battle { --battle-accent:#7bbaff; --battle-accent-bright:#a2d2ff; --battle-text:#e7f4ff; --battle-muted:#bfd2df; --battle-panel:#101820; --battle-raised:#151f29; background:#07111b; color:#f5fbff; }
.vxs-course-battle .vxs-course-bar { border-color:#7bbaff36; background:#07111b; box-shadow:0 8px 20px #07111bcc; }
.vxs-course-battle .vxs-course-mark { border-color:#7bbaff36; background:#10202e; }
.vxs-course-battle .vxs-course-bar p,.vxs-course-battle .vxs-course-eyebrow { color:#7bbaff; }
.vxs-course-battle .vxs-course-content { border-color:#7bbaff35; background:radial-gradient(680px 340px at 50% -12%,#7bbaff20,transparent 65%),#0d1923; }
.vxs-course-battle .vxs-course-hero-mark img { filter:drop-shadow(0 0 34px #7bbaff55) drop-shadow(0 0 70px #318ce033); }
.vxs-course-battle .vxs-course-hero-mark-label { color:#d9efff; }
.vxs-course-battle .vxs-course-hero-wordmark { color:#7bbaff; }
.vxs-course-battle .vxs-course-content > p:not(.vxs-course-eyebrow):not(.vxs-course-hero-wordmark) { color:#c7d9e7; }
.vxs-course-battle .vxs-course-blocked { border-color:#ffb989aa; background:#49302a; }
.vxs-course-battle .vxs-course-howto,.vxs-course-battle .vxs-course-suspended,.vxs-course-battle .vxs-course-breather { border-color:#7bbaff38; background:linear-gradient(145deg,#142737,#0b151e); color:#e7f4ff; }
.vxs-course-battle .vxs-course-howto p:not(.vxs-course-eyebrow),.vxs-course-battle .vxs-course-suspended p,.vxs-course-battle .vxs-course-result-score,.vxs-course-battle .vxs-course-meters label,.vxs-course-battle .vxs-course-breather [data-course-split],.vxs-course-battle .vxs-course-breather [data-course-tier],.vxs-course-battle .vxs-course-breather [data-course-halfway],.vxs-course-battle .vxs-course-breather-actions span { color:#c5d9e8; }
.vxs-course-battle .vxs-course-meters meter,.vxs-course-battle .vxs-course-finish-components meter { accent-color:#7bbaff; }
.vxs-course-battle .vxs-course-hype { border-color:#7bbaff77; background:#7bbaff12; color:#e7f4ff; }
.vxs-course-battle .vxs-course-hype button { border-color:#7bbaff !important; background:#7bbaff !important; color:#10202e !important; }
.vxs-course-battle .vxs-course-hype p { color:#c5e4fa; }
.vxs-course-battle button,.vxs-course-battle .vxs-course-primary { background:#7bbaff; color:#10202e; }
.vxs-course-battle .vxs-course-play iframe { border-color:#7bbaff38; background:#0b151e; }
.vxs-course-battle .vxs-course-dialog { border-color:#7bbaff77; background:#10202e; color:#f5fbff; }
.vxs-course-battle .vxs-course-dialog p { color:#c5d9e8; }
.vxs-course-battle .vxs-course-dialog .vxs-course-primary,.vxs-course-battle .vxs-course-breather .vxs-course-primary,.vxs-course-battle .vxs-course-primary { background:#7bbaff !important; color:#10202e !important; box-shadow:0 8px 24px #7bbaff38 !important; }
.vxs-course-battle .vxs-course-dialog .vxs-course-primary:hover,.vxs-course-battle .vxs-course-breather .vxs-course-primary:hover { background:#a2d2ff !important; color:#10202e !important; }
.vxs-course-battle .vxs-course-finish { border-color:#7bbaff4a; background:linear-gradient(155deg,#142b3b,#09141d); }
.vxs-course-battle .vxs-course-finish-total,.vxs-course-battle .vxs-course-finish-components label,.vxs-course-battle .vxs-course-finish-time,.vxs-course-battle .vxs-course-personal-best,.vxs-course-battle .vxs-course-finish-split { color:#c8dfef; }
.vxs-course-battle .vxs-course-finish-total strong { color:#7bbaff; }
.vxs-course-battle .vxs-course-finish-tier { border-color:#7bbaff77; background:#7bbaff18; color:#c8e9ff; }
.vxs-course-battle .vxs-course-finish-legs li { border-color:#7bbaff2b; background:#7bbaff08; }
.vxs-course-battle .vxs-course-join-board { border-color:#7bbaff70; background:#7bbaff12; }
.vxs-course-battle .vxs-course-join-board button,.vxs-course-battle .vxs-course-join-board select,.vxs-course-battle .vxs-course-join-board input { border-color:#7bbaff55; background:#101f2b; }
.vxs-course-battle .vxs-course-replay,.vxs-course-battle .vxs-course-finish-actions a:last-of-type { color:#d9efff; }
.vxs-course-battle .vxs-course-finish-actions a:last-of-type { border-color:#7bbaff; background:#7bbaff; color:#10202e; }
.vxs-course-battle .vxs-course-mode-picker button[aria-pressed="true"] { border-color:#7bbaff; background:#7bbaff22; color:#d9efff; }
.vxs-course-battle .vxs-course-hero-mark { width:clamp(116px,24vw,160px); height:clamp(116px,24vw,160px); }
.vxs-course-battle .vxs-course-hero-mark-label { width:84%; color:#f5fbff; font-size:clamp(14px,2.2vw,17px); font-weight:900; letter-spacing:.055em; line-height:1; text-align:center; white-space:nowrap; text-shadow:0 1px 4px #06111b; }
.vxs-course [tabindex="-1"]:focus { outline: none; }
.vxs-course [tabindex="-1"]:focus-visible { outline: 3px solid #7bbaff; outline-offset: 4px; }
#cmplz-manage-consent .cmplz-btn { background: #1b2a39 !important; color: #f5fbff !important; border: 1px solid #8ecbff55 !important; }
#cmplz-manage-consent .cmplz-btn:hover, #cmplz-manage-consent .cmplz-btn:focus-visible { background: #223b52 !important; border-color: #8ecbff !important; }

/* Battle-only match entry: the exact ten mark shards assemble after the glass-break flash. */
.vxs-course-battle-intro { position: fixed; z-index: 999999; inset: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(ellipse at center,#12304a 0,#081521 48%,#050b11 100%); color: #f5fbff; opacity: 1; transition: opacity .26s ease; }
.vxs-course-battle-intro.is-leaving { opacity: 0; }
.vxs-course-battle-intro-stage { position: relative; width: min(68vw,300px); aspect-ratio: 1; filter: drop-shadow(0 0 26px #7bbaff38); }
.vxs-course-battle-intro-shard { position: absolute; inset: 0; display: block; opacity: .12; transform: translate(var(--shard-x),var(--shard-y)) rotate(var(--shard-turn)) scale(.72); transition: transform .72s cubic-bezier(.18,.78,.2,1) var(--shard-delay),opacity .32s ease var(--shard-delay); }
.vxs-course-battle-intro-shard img { display: block; width: 100%; height: 100%; }
.vxs-course-battle-intro-stage.is-assembling .vxs-course-battle-intro-shard { opacity: 1; transform: translate(0,0) rotate(0) scale(1); }
.vxs-course-battle-intro-glass { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: #9ed3ff18; stroke: #d8edff; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 12px #9ed3ff); animation: vxs-battle-glass-break .58s ease-out both; }
.vxs-course-battle-intro-glass path:first-child { stroke-width: 2.2; }
.vxs-course-battle-intro-glass path:last-child { fill: none; stroke-width: 1.1; opacity: .9; }
.vxs-course-battle-intro-wordmark { position: absolute; top: 49%; left: 50%; color: #f5fbff; font: 900 clamp(20px,5vw,32px)/1 var(--font-display,"Syne",sans-serif); letter-spacing: .12em; text-shadow: 0 2px 18px #07111b; transform: translate(-50%,-50%); opacity: 0; transition: opacity .3s ease .62s; }
.vxs-course-battle-intro-caption { position: absolute; top: calc(100% + 20px); left: 50%; width: max-content; color: #a8d6ff; font: 800 clamp(11px,2.2vw,14px)/1.2 var(--font-display,"Syne",sans-serif); letter-spacing: .22em; transform: translateX(-50%); opacity: 0; transition: opacity .3s ease .82s; }
.vxs-course-battle-intro-stage.is-assembling .vxs-course-battle-intro-wordmark,.vxs-course-battle-intro-stage.is-assembling .vxs-course-battle-intro-caption { opacity: 1; }
@keyframes vxs-battle-glass-break { 0% { opacity: 1; transform: scale(.82); } 18% { opacity: 1; transform: scale(1.04); } 100% { opacity: 0; transform: scale(1.16); } }
@media (prefers-reduced-motion: reduce) { .vxs-course-battle-intro,.vxs-course-battle-intro-shard,.vxs-course-battle-intro-glass,.vxs-course-battle-intro-wordmark,.vxs-course-battle-intro-caption { animation: none !important; transition-duration: .01ms !important; } .vxs-course-battle-intro-glass { opacity: 0; } }