.axo-body {
  --portal-cyan: #48eaff;
  --portal-pink: #ff4f9a;
  --portal-lime: #baff4d;
  --portal-violet: #9b63ff;
  background: #080f2c;
}

.axo-body::selection { color: #071430; background: var(--portal-cyan); }
.axo-shell { background: transparent; }
.axo-ambient { position: fixed; inset: 0; overflow: hidden; pointer-events: none; background: radial-gradient(circle at 75% 0, #2d1a67, transparent 42%), radial-gradient(circle at 0 52%, #082b51, transparent 35%), linear-gradient(140deg, #07132f, #0c1235 60%, #21134b); }
.axo-ambient::after { content: ""; position: absolute; inset: 0; opacity: .25; background-image: radial-gradient(circle, #7dedff 0 1px, transparent 1.5px); background-size: 37px 37px; mask-image: linear-gradient(to bottom, #000, transparent 75%); }
.axo-ambient i { position: absolute; border-radius: 50%; opacity: .16; box-shadow: inset -12px -15px 25px rgba(12,17,74,.4), inset 8px 9px 16px rgba(255,255,255,.45), 0 0 35px currentColor; animation: axo-float 12s ease-in-out infinite alternate; }
.axo-ambient i:nth-child(1) { width: 110px; height: 110px; left: 4%; top: 18%; color: #42e9ff; background: #42e9ff; }
.axo-ambient i:nth-child(2) { width: 60px; height: 60px; left: 23%; top: 69%; color: #ff4f9a; background: #ff4f9a; animation-delay: -5s; }
.axo-ambient i:nth-child(3) { width: 160px; height: 160px; right: 4%; top: 22%; color: #965eff; background: #965eff; animation-delay: -2s; }
.axo-ambient i:nth-child(4) { width: 38px; height: 38px; right: 24%; bottom: 12%; color: #baff4d; background: #baff4d; animation-delay: -8s; }
.axo-ambient i:nth-child(5) { width: 78px; height: 78px; left: 50%; top: 8%; color: #ffd34d; background: #ffd34d; animation-delay: -4s; }
@keyframes axo-float { to { transform: translate3d(14px,-28px,0) scale(1.08); } }

.axo-topbar { z-index: 30; border-bottom-color: rgba(91,234,255,.2); background: rgba(5,14,42,.8); backdrop-filter: blur(20px) saturate(1.3); }
.axo-topbar .brand { border: 0; background: transparent; box-shadow: none; }
.axo-topbar .brand__lockup { width: 178px; object-fit: contain; filter: drop-shadow(0 5px 12px rgba(26,204,255,.24)); }
.axo-topbar .desktop-nav a { position: relative; color: #b5c6e7; }
.axo-topbar .desktop-nav a::after { content: ""; position: absolute; left: 15%; right: 15%; bottom: -8px; height: 3px; border-radius: 3px; background: linear-gradient(90deg,var(--portal-pink),var(--portal-cyan)); opacity: 0; transform: scaleX(.3); transition: .2s ease; }
.axo-topbar .desktop-nav a:hover::after { opacity: 1; transform: scaleX(1); }
.axo-topbar .diamond-balance, .axo-topbar .balance-pill, .axo-topbar .profile-shortcut { border-color: rgba(87,228,255,.24); background: rgba(13,28,68,.85); }
.axo-topbar .account-icon, .axo-topbar .profile-shortcut > span:first-child { color: #091633; background: linear-gradient(135deg,var(--portal-lime),var(--portal-cyan)); }

.axo-main { padding-bottom: 40px; }
.axo-hero { max-width: 1228px; min-height: 620px; margin: 30px auto 18px; padding: 54px 56px; position: relative; display: grid; grid-template-columns: .93fr 1.07fr; align-items: center; gap: 28px; overflow: hidden; border: 1px solid rgba(91,232,255,.26); border-radius: 36px; background: radial-gradient(circle at 74% 34%, rgba(255,80,161,.25), transparent 33%), radial-gradient(circle at 58% 3%, rgba(74,232,255,.18), transparent 30%), linear-gradient(145deg, rgba(12,31,76,.92), rgba(34,19,82,.94)); box-shadow: 0 34px 90px rgba(1,5,29,.43), inset 0 1px rgba(255,255,255,.08); }
.axo-hero::after { content: ""; position: absolute; width: 560px; height: 560px; right: -180px; bottom: -360px; border: 52px solid rgba(75,230,255,.08); border-radius: 50%; }
.axo-hero-copy { position: relative; z-index: 4; }
.axo-kicker { display: inline-flex; align-items: center; gap: 8px; color: var(--portal-cyan); font: 900 11px/1.1 system-ui; letter-spacing: .16em; text-transform: uppercase; }
.axo-kicker i { width: 8px; height: 8px; border-radius: 50%; background: var(--portal-lime); box-shadow: 0 0 14px var(--portal-lime); }
.axo-hero h1 { margin: 21px 0 16px; color: #fff; font: 950 clamp(42px,5vw,72px)/.93 system-ui; letter-spacing: -.058em; }
.axo-hero h1 em, .axo-how h2 em { color: var(--portal-cyan); font-style: normal; text-shadow: 0 0 30px rgba(75,231,255,.26); }
.axo-hero-copy > p { max-width: 500px; margin: 0; color: #bdc9e6; font: 500 16px/1.58 system-ui; }
.axo-hero-actions { margin-top: 28px; display: flex; gap: 10px; }
.axo-hero-actions button, .axo-wide-play, .axo-affiliate-callout button { min-height: 58px; padding: 0 23px; display: inline-flex; align-items: center; justify-content: center; gap: 13px; border-radius: 17px; font: 900 13px/1 system-ui; text-transform: uppercase; letter-spacing: .07em; cursor: pointer; }
.axo-hero-actions svg, .axo-wide-play svg, .axo-affiliate-callout svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
.axo-hero-play { border: 0; color: #081532; background: linear-gradient(135deg,var(--portal-lime),var(--portal-cyan)); box-shadow: 0 16px 32px rgba(67,226,239,.2); }
.axo-hero-play svg { fill: currentColor; stroke: none; }
.axo-hero-ranking { border: 1px solid rgba(255,255,255,.18); color: #fff; background: rgba(255,255,255,.06); }
.axo-season-row { margin-top: 32px; display: flex; gap: 12px; }
.axo-season-row > span { min-width: 105px; padding-right: 15px; border-right: 1px solid rgba(255,255,255,.12); }
.axo-season-row > span:last-child { border: 0; }
.axo-season-row small, .axo-season-row strong { display: block; }
.axo-season-row small { color: #788eb9; font: 800 9px/1 system-ui; text-transform: uppercase; letter-spacing: .1em; }
.axo-season-row strong { margin-top: 6px; color: #fff; font: 850 13px/1 system-ui; }

.axo-hero-visual { min-width: 0; height: 500px; margin: 0; position: relative; display: grid; place-items: center; }
.axo-hero-visual .hero__slide { inset: 0; position: absolute; display: grid; place-items: center; opacity: 1; }
.axo-hero-visual img { position: absolute; z-index: 4; width: 285px; height: 285px; right: -8px; bottom: -12px; object-fit: contain; filter: drop-shadow(0 23px 35px rgba(0,0,0,.42)); animation: axo-mascot 4.2s ease-in-out infinite; }
@keyframes axo-mascot { 50% { transform: translateY(-10px) rotate(2deg); } }
.axo-board-preview { width: min(360px,78%); height: 480px; position: relative; overflow: hidden; transform: rotate(5deg) translateX(-32px); border: 8px solid rgba(220,248,255,.95); border-radius: 45px; background: radial-gradient(circle at 50% 30%,#243b8f,#0c183f 62%,#37145b); box-shadow: 0 30px 70px rgba(0,0,0,.45), inset 0 0 40px rgba(75,226,255,.18); }
.axo-board-preview::before { content: ""; position: absolute; top: 13px; left: 50%; width: 64px; height: 6px; transform: translateX(-50%); border-radius: 9px; background: #9eb8ce; }
.axo-preview-grid { padding: 42px 17px 0; display: flex; flex-wrap: wrap; gap: 4px; }
.axo-preview-grid i, .axo-how-icon i { width: 43px; height: 43px; border-radius: 50%; box-shadow: inset -7px -9px 13px rgba(21,17,82,.35), inset 6px 6px 10px rgba(255,255,255,.65), 0 0 14px currentColor; }
.axo-preview-grid i:nth-child(8n+1) { margin-left: 23px; }
.c1 { color:#52efff; background:#36d8f0; }.c2 { color:#ff66a8; background:#ff4d94; }.c3 { color:#c8ff55; background:#83ec46; }.c4 { color:#ad7dff; background:#8b55f2; }.c5 { color:#ffdc54; background:#ffb82f; }
.axo-preview-aim { position: absolute; width: 2px; height: 165px; left: 50%; bottom: 47px; transform: rotate(-23deg); transform-origin: bottom; border-left: 2px dashed rgba(255,255,255,.6); }
.axo-preview-shot { position: absolute; width: 48px; height: 48px; left: 47%; bottom: 32px; border-radius: 50%; background:#ff4d94; box-shadow: inset -8px -10px 14px rgba(43,16,78,.4),inset 5px 5px 10px rgba(255,255,255,.6),0 0 18px #ff66a8; }
.axo-float-label { position: absolute; z-index: 6; left: 4px; bottom: 72px; min-width: 115px; padding: 13px 17px; transform: rotate(-4deg); border: 1px solid rgba(255,255,255,.45); border-radius: 18px; text-align: center; color: #111945; background: linear-gradient(135deg,var(--portal-lime),#fbff98); box-shadow: 0 16px 34px rgba(0,0,0,.28); }
.axo-float-label small,.axo-float-label strong { display:block; }.axo-float-label small{font:900 9px/1 system-ui;letter-spacing:.14em}.axo-float-label strong{margin-top:4px;font:1000 30px/1 system-ui}

.axo-performance { max-width: 1228px; margin-inline: auto; border-color: rgba(75,229,255,.18); background: rgba(13,28,67,.72); backdrop-filter: blur(18px); }
.axo-performance .performance-strip__icon { color: #061b35; background: linear-gradient(135deg,var(--portal-cyan),var(--portal-lime)); }
.axo-dashboard-grid { max-width: 1228px; margin: 21px auto; display: grid; grid-template-columns: 1.08fr .92fr; gap: 20px; }
.axo-rank-card,.axo-mission-card { border: 1px solid rgba(89,231,255,.2); border-radius: 27px; background: linear-gradient(145deg,rgba(13,31,71,.9),rgba(26,20,75,.91)); box-shadow: 0 24px 60px rgba(0,0,0,.22); }
.axo-rank-card .live-pill { color: var(--portal-lime); border-color: rgba(186,255,77,.3); background: rgba(77,129,57,.18); }
.axo-rank-card .player-rank-card { border-color: rgba(76,230,255,.27); background: linear-gradient(135deg,rgba(30,192,228,.14),rgba(152,93,255,.1)); }
.axo-rank-card .player-rank-card__badge { color:#071533; background:linear-gradient(145deg,var(--portal-lime),var(--portal-cyan)); }
.axo-mission-card { overflow:hidden; }
.axo-mission-visual { height: 310px; position: relative; overflow:hidden; display:grid; place-items:center; background: radial-gradient(circle at 50% 56%,rgba(75,232,255,.35),transparent 34%),linear-gradient(145deg,#32165f,#0a3570 58%,#0a173b); }
.axo-mission-visual::before { content:"";position:absolute;inset:0;opacity:.22;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.5px);background-size:32px 32px; }
.axo-mission-visual img { position:relative;z-index:2;width:215px;height:215px;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(0,0,0,.35)); }
.axo-mission-visual span { position:absolute;width:62px;height:62px;border-radius:18px;box-shadow:inset -8px -9px 15px rgba(20,16,75,.35),inset 5px 5px 11px rgba(255,255,255,.55),0 0 20px currentColor;transform:rotate(8deg); }
.axo-mission-visual span:nth-child(1){left:12%;top:18%;color:#52efff;background:#31d9ee}.axo-mission-visual span:nth-child(2){right:13%;top:13%;color:#ff66a8;background:#ff4d94;transform:rotate(-9deg)}.axo-mission-visual span:nth-child(3){left:17%;bottom:13%;color:#c8ff55;background:#83ec46;transform:rotate(-6deg)}.axo-mission-visual span:nth-child(4){right:16%;bottom:17%;color:#ad7dff;background:#8b55f2}
.axo-mission-copy { padding:24px; }
.axo-mission-copy h2 { margin:10px 0 8px;color:#fff;font:950 31px/1 system-ui;letter-spacing:-.03em}.axo-mission-copy>p{color:#aebddd;font:500 13px/1.5 system-ui}.axo-mission-copy .mission-button{border:0;color:#081532;background:linear-gradient(135deg,var(--portal-lime),var(--portal-cyan))}

.axo-how { max-width:1228px;margin:22px auto;padding:55px;border:1px solid rgba(89,231,255,.18);border-radius:32px;background:rgba(8,20,54,.78);box-shadow:0 25px 70px rgba(0,0,0,.2); }
.axo-how>header { max-width:700px;text-align:center;margin:0 auto 32px}.axo-how h2{margin:14px 0 10px;color:#fff;font:950 clamp(34px,5vw,55px)/.95 system-ui;letter-spacing:-.05em}.axo-how header>p{color:#aebcdf;font:500 14px/1.5 system-ui}
.axo-how-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.axo-how-grid article{position:relative;padding:23px;border:1px solid rgba(255,255,255,.1);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025))}.axo-how-grid article>span{position:absolute;right:18px;top:17px;color:rgba(255,255,255,.18);font:1000 27px/1 system-ui}.axo-how-grid h3{margin:18px 0 8px;color:#fff;font:900 20px/1 system-ui}.axo-how-grid p{margin:0;color:#a8b9db;font:500 12px/1.52 system-ui}.axo-how-icon{height:75px;display:flex;align-items:center}.axo-how-icon i{width:48px;height:48px;margin-right:-13px;border:2px solid rgba(255,255,255,.45)}
.axo-wide-play { width:100%;margin-top:20px;border:0;color:#081532;background:linear-gradient(90deg,var(--portal-pink),#ff9b64,var(--portal-lime),var(--portal-cyan)); }.axo-wide-play svg{fill:currentColor;stroke:none}
.axo-affiliate-callout { max-width:1228px;margin:22px auto;padding:36px 42px;display:flex;align-items:center;justify-content:space-between;gap:30px;overflow:hidden;position:relative;border:1px solid rgba(178,255,84,.25);border-radius:28px;background:radial-gradient(circle at 90% 20%,rgba(185,255,78,.2),transparent 33%),linear-gradient(135deg,#251650,#0b315d)}.axo-affiliate-callout h2{margin:10px 0 7px;color:#fff;font:950 30px/1 system-ui}.axo-affiliate-callout p{max-width:670px;margin:0;color:#afbfde;font:500 13px/1.5 system-ui}.axo-affiliate-callout button{flex:0 0 auto;border:1px solid rgba(255,255,255,.25);color:#fff;background:rgba(255,255,255,.08)}
.axo-footer { max-width:1228px;margin-inline:auto;border-top-color:rgba(255,255,255,.1)}

@media(max-width:900px){.axo-hero{grid-template-columns:1fr;padding:38px;}.axo-hero-copy{text-align:center}.axo-hero-copy>p{margin-inline:auto}.axo-hero-actions,.axo-season-row{justify-content:center}.axo-hero-visual{height:430px}.axo-dashboard-grid{grid-template-columns:1fr}.axo-how-grid{grid-template-columns:1fr}.axo-affiliate-callout{align-items:flex-start;flex-direction:column}.axo-affiliate-callout button{width:100%}}
@media(max-width:760px){.axo-topbar .brand__lockup{width:145px}.axo-main{padding-inline:14px}.axo-hero{min-height:0;margin-top:15px;padding:31px 20px 21px;border-radius:26px}.axo-hero h1{font-size:41px}.axo-hero-copy>p{font-size:13px}.axo-hero-actions{display:grid;grid-template-columns:1fr}.axo-season-row{gap:4px}.axo-season-row>span{min-width:0;flex:1;padding-right:4px}.axo-hero-visual{height:380px}.axo-board-preview{height:365px;width:260px;transform:rotate(4deg) translateX(-21px)}.axo-preview-grid i{width:31px;height:31px}.axo-hero-visual img{width:210px;height:210px;right:-27px}.axo-float-label{left:0;bottom:35px}.axo-performance{margin-top:12px}.axo-dashboard-grid{margin-top:14px}.axo-how{padding:37px 17px;border-radius:25px}.axo-how h2{font-size:38px}.axo-affiliate-callout{padding:29px 23px}.axo-footer{padding-bottom:82px}}
@media(prefers-reduced-motion:reduce){.axo-ambient i,.axo-hero-visual img{animation:none}}