/* 冰晶 UI：标题与装饰使用原始透明素材，CSS 控制留白，不拉伸文字。 */
:root { --text-muted: #96afc8; --line: rgba(153,221,255,.55); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.art-title { background-repeat:no-repeat; background-position:center; background-size:125% auto; background-clip:border-box; -webkit-background-clip:border-box; filter:drop-shadow(0 2px 5px #061427) drop-shadow(0 0 15px #8edcff55); }
.hero-title.art-title { width:min(100%,660px); height:clamp(96px,16vw,182px); margin:0 auto 8px; background-image:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/f1.png'); }
.section-title.art-title { display:block; width:min(78%,340px); height:100px; margin:0 auto 4px; background-size:143% auto; }
.f2 { background-image:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/f2.png'); }.f3 { background-image:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/f3.png'); }.f4 { background-image:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/f4.png'); }.f5 { background-image:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/f5.png'); }
.section-title::before,.section-title::after { content:none; }
.hero-title-group::before { content:''; display:block; width:min(100%,780px); height:110px; margin:0 auto 8px; background:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/d1.png') center/100% auto no-repeat; filter:drop-shadow(0 0 12px #74cdff88); }
.section-eyebrow { position:relative; padding-top:62px; margin-bottom:0; color:#c8efff; font-family:Georgia,serif; font-size:13.75px; letter-spacing:5px; }
.section-eyebrow::before { position:absolute; top:0; left:50%; transform:translateX(-50%); width:min(88%,440px); height:62px; background:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/d1.png') center/100% auto no-repeat; }
.section-eyebrow::after { content:none; }
.section-desc { color:#a8c4da; }
.hero-date { font-family:'Noto Serif SC',serif; font-weight:600; letter-spacing:2px; color:#e0f6ff; text-shadow:0 0 12px #78cfff,0 2px 4px #041127; }
.hero-date::after { content:'✦'; color:#c3efff; font-size:20px; }
.hero-date .dot { width:6px; height:6px; border-radius:0; transform:rotate(45deg); }
.btn-primary,.faction-select-btn,.action-btn.invite,.action-btn.create,.action-btn.reward { background:transparent url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/k1.png') center/100% 160% no-repeat; border:0; box-shadow:none; color:#edfaff; font-family:'Noto Serif SC',serif; text-shadow:0 0 9px #9ddeff,0 2px 3px #06142f; }
.btn-primary { min-width:280px; padding:26px 38px; }
.action-btn.invite,.action-btn.create,.action-btn.reward { min-height:64px; padding:16px 12px; gap:6px; }
.action-btn.create { filter:brightness(1.22); }
.action-btn:hover { filter:brightness(1.3); }
.hero-faction-tag.elyos,.hero-faction-tag.asmodian,.hero-badge { border:0; background:transparent url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/k2.png') center/100% 170% no-repeat; box-shadow:none; padding:12px 24px; color:#e3f6ff; }
.floating-cta { background:transparent url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/k1.png') center/100% 170% no-repeat; border:0; box-shadow:none; padding:20px 30px; backdrop-filter:none; }
.floating-cta .cta-btn { background:none; padding:12px 22px; }
.quick-nav { border-top:1px solid #a6e1ff55; border-bottom:1px solid #a6e1ff88; background:linear-gradient(180deg,#142738ee,#070e1aee); box-shadow:0 0 18px #71cfff22; }
.nav-item { font-family:'Noto Serif SC',serif; letter-spacing:2px; position:relative; padding:10px 18px; }
.nav-item.active { background:radial-gradient(ellipse at bottom,#6ed7ff33,transparent 75%); border-color:transparent; box-shadow:none; color:#fff; text-shadow:0 0 9px #9fe5ff; }
.nav-item.active::after { content:'◆'; position:absolute; bottom:-6px; left:50%; transform:translateX(-50%); font-size:11.25px; color:#e1f7ff; text-shadow:0 0 8px #78d4ff; }
.card,.qual-path,.qr-card { border:1px solid #a1dcf5; border-radius:28px 0 24px 0; background:linear-gradient(135deg,rgba(99,152,172,.16),rgba(17,35,56,.78) 50%,rgba(70,112,137,.17)); box-shadow:0 0 8px #9cdeff40,0 0 25px #6cbfff20,inset 0 0 22px #aadfff0c; }
.card::before { left:26px; right:18px; height:1px; background:linear-gradient(90deg,transparent,#e5faff,transparent); }
.reward-box,.tier-item,.legion-reward-item { border:1px solid #89ccea66; background:linear-gradient(110deg,#213e5b99,#101e35bb); box-shadow:inset 0 0 18px #7ccfff0d; border-radius:12px 0 12px 0; }
.tier-item.current { border-color:#a8e4ff; box-shadow:0 0 13px #77cfff30,inset 0 0 15px #8cdfff0a; }
.tier-item.unlocked { border-color:#76c9ba88; }
.tier-badge { border-radius:25% 0 25% 0; background:linear-gradient(145deg,#d7f6ff,#3d8cc5 46%,#142e59); border:1px solid #b4e8ff; box-shadow:0 0 12px #78cdff55; font-family:Georgia,serif; }
.points-block-label .text,.tier-points,.reward-name,.squad-divider-label { font-family:'Noto Serif SC',serif; }
.squad-divider-label { color:#cbeaff; letter-spacing:2px; }
.squad-divider-label::before,.squad-divider-label::after { content:' ⟡ '; color:#a8e7ff; text-shadow:0 0 8px #78d3ff; }
.squad-slot { overflow:visible; position:relative; border:1px solid #c0ebff88; background:radial-gradient(circle,#122c48 45%,#6cbbec33 65%,#09172c 72%); }
.squad-slot.filled,.squad-slot.leader { border:2px solid #a9e3ff; box-shadow:0 0 12px #78d0ff44,inset 0 0 12px #7dd0ff55; }
.squad-slot::before { content:''; position:absolute; inset:5px; border:1px solid #b1e8ff77; border-radius:50%; pointer-events:none; }
.squad-slot::after { content:'✦'; position:absolute; bottom:-12px; left:50%; transform:translateX(-50%); color:#d7f6ff; text-shadow:0 0 6px #62caff; font-size:20px; }
.squad-slot .avatar-icon { background:radial-gradient(circle at 35% 20%,#74b4da,#245988 58%,#0d2649); border:1px solid #b2e6ff77; font-family:'Noto Serif SC',serif; text-shadow:0 0 7px #a6e8ff; }
.squad-slot.leader .avatar-icon { background:radial-gradient(circle at 35% 20%,#b1c7ed,#6364ab 60%,#252957); }
.squad-slots { margin-bottom:30px; }
.points-bar,.legion-bar { border:1px solid #80c4e766; box-shadow:0 0 8px #74c8ff22; height:9px; }
.points-bar-fill.personal,.points-bar-fill.squad,.legion-bar-fill { background:linear-gradient(90deg,#367bb7,#88d9fa 80%,#e5fbff); box-shadow:0 0 12px #77d3ff77; }
.faction-split { height:22px; background:url('https://static.web.sdo.com//aionm/pic/pro2026/260828AIONRally/d1.png') center/240px auto no-repeat; margin:22px 0; }
.faction-split>* { display:none; }
.qr-card { border-radius:16px 0 16px 0; padding:12px; }
.to-top { border:1px solid #a4dff5; box-shadow:0 0 12px #85d7ff44,inset 0 0 10px #79caff22; border-radius:10px 0 10px 0; }
.popup-deco { width:100%; right:0; top:-60px; }
@media(min-width:820px) { .hero-title-group::before { height:125px; } .btn-primary { min-width:360px; font-size:21px; } .section-title.art-title { width:360px; height:112px; } .action-btn.invite,.action-btn.create,.action-btn.reward { min-height:76px; } .card { padding:32px; } }
@media(max-width:819px) { .hero-title-group::before { height:62px; } .section-title.art-title { height:82px; width:260px; max-width:85%; } .hero-title.art-title { height:100px; } .hero-content { padding-left:16px; padding-right:16px; } .hero-faction-tag.elyos,.hero-faction-tag.asmodian,.hero-badge { padding:10px 17px; } .hero-date { letter-spacing:0; font-size:15px; } .floating-side { right:8px; bottom:100px; } .qr-card { padding:6px; } .qr-card img { width:54px; height:54px; } .qr-card .qr-text { width:54px; font-size:10px; } .floating-cta { width:270px; max-width:90vw; padding:17px 25px; } .section-eyebrow { padding-top:45px; } .section-eyebrow::before { height:45px; width:300px; max-width:95%; } .nav-item { padding:8px 12px; letter-spacing:1px; } .action-btn.invite,.action-btn.create,.action-btn.reward { padding:13px 5px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; scroll-behavior:auto!important; transition:none!important; } }
.full-squad-label { max-width:720px; margin:0 auto 12px!important; color:#ccefff!important; font-family:'Noto Serif SC',serif; }
.full-squad-label::before { content:'✧'; font-size:19px; margin-right:9px; color:#dcf7ff; text-shadow:0 0 9px #88d8ff; }
@media(max-width:819px) { .floating-side { position:absolute; top:120px; bottom:auto; right:8px; } .floating-side .to-top { position:fixed; right:10px; bottom:110px; width:32px; height:32px; } }