.banners-page{--bn-panel:#2c2d33;--bn-panel-dark:#1c1d21;--bn-border:#33343a;--bn-border-soft:#3a3b42;--bn-blue:#009eec;--bn-blue-bright:#1aadf7;--bn-gold:#ffc000;--bn-green:#38ff92;max-width:1600px;scroll-padding-top:calc(var(--bn-topbar-height,75px) + 28px);scroll-behavior:smooth;margin-inline:auto}.banners-page.banners-star-rail .page-header:before{background-image:url(https://cdn.prydwen.gg/images/upcoming-banners/banners_hsr.webp)}.banners-page.banners-zenless .page-header:before{background-image:url(https://cdn.prydwen.gg/images/upcoming-banners/banners_zzz.webp)}.banners-page.banners-wuthering-waves .page-header:before{background-image:url(https://cdn.prydwen.gg/images/upcoming-banners/banners_ww.webp)}.banners-page .page-header{border:1px solid var(--bn-border);background:#161429;align-items:stretch;min-height:280px;margin-bottom:16px;padding:34px 38px;display:flex;position:relative;overflow:hidden}.banners-page .page-header:before{background-image:var(--bn-hero,none);content:"";z-index:0;background-position:50% 16%;background-size:cover;position:absolute;inset:0;transform:scale(1.01)}.banners-page .page-header:after{content:"";pointer-events:none;z-index:0;background:linear-gradient(90deg,#0d0f1cc2 0%,#0d0f1c73 38%,#0d0f1c1f 72%,#0d0f1c00 100%),linear-gradient(#0d0f1c0a,#0d0f1c29);position:absolute;inset:0}.banners-page .page-header .page-icon{display:none}.banners-page .page-header .page-details{z-index:1;align-self:flex-end;max-width:780px;position:relative}.banners-page .page-header .page-details h1{color:#fff;text-shadow:0 3px 18px #0000008c;max-width:760px;margin:0 0 10px;font-size:clamp(34px,3.2vw,52px);font-weight:800;line-height:1.08}.banners-page .page-header .page-details .sub-title{color:#ffffffeb;text-shadow:0 2px 12px #00000080;max-width:700px;margin:0 0 2px;font-size:18px;line-height:1.55}.banners-page .page-header .page-details p:last-child{color:#ffffffdb;text-shadow:0 2px 10px #00000073;margin:2px 0 0;font-size:14px;line-height:24px}.banners-page .server-region-panel{border:1px solid var(--bn-border);border-left:3px solid var(--bn-blue);background:linear-gradient(90deg,#009eec29,#ffffff08),#1c1d21f0;grid-template-columns:minmax(170px,.8fr) auto minmax(190px,1fr);align-items:center;gap:14px;min-height:70px;margin-bottom:10px;padding:12px 14px;display:grid}.banners-page .server-region-copy span{color:#ffffffa3;text-transform:uppercase;margin-bottom:6px;font-size:12px;font-weight:800;display:block}.banners-page .server-region-copy strong{color:#fff;font-size:18px;font-weight:800;display:block}.banners-page .server-region-actions{background:#0c0d1075;border:1px solid #ffffff14;grid-template-columns:repeat(3,minmax(58px,1fr));gap:4px;padding:4px;display:inline-grid}.banners-page .region-option{color:#ffffffb8;cursor:pointer;text-transform:uppercase;background:0 0;border:1px solid #0000;height:38px;padding:0 13px;font-size:13px;font-weight:900;transition:background-color .18s,border-color .18s,color .18s}.banners-page .region-option:hover,.banners-page .region-option:focus-visible{color:#fff;border-color:#009eec9e;outline:0}.banners-page .region-option.active{background:var(--bn-blue);border-color:var(--bn-blue-bright);color:#fff;box-shadow:0 0 18px #009eec47}.banners-page .server-region-panel p{color:#ffffffb8;text-align:right;margin:0;font-size:13px;font-weight:700}.banners-page .quick-status{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:24px;display:grid}.banners-page .quick-status div{border:1px solid var(--bn-border);background:#1c1d21e6;min-height:74px;padding:13px 16px}.banners-page .quick-status span{color:#ffffffa3;text-transform:uppercase;margin-bottom:8px;font-size:12px;font-weight:800;line-height:1.2;display:block}.banners-page .quick-status strong{color:#fff;font-size:18px;line-height:1.25;display:block}.banners-page .article-layout{grid-template-columns:minmax(0,1fr) 260px;align-items:start;gap:40px;display:grid}.banners-page .anchor-row{border:1px solid var(--bn-border);border-top:3px solid var(--bn-blue);background:#1c1d21f0;flex-direction:column;grid-area:1/2/span 20;align-self:start;gap:0;padding:10px 12px 14px;display:flex;position:sticky;top:calc(50vh - 145px)}.banners-page .toc-label{color:#ffffff94;text-transform:uppercase;padding:8px 0 10px;font-size:12px;font-weight:800;line-height:1.2}.banners-page .anchor-row a{color:#ffffffd1;text-transform:uppercase;border-top:1px solid #ffffff1a;padding:14px 10px;font-size:13px;font-weight:800;transition:color .2s,background-color .2s;display:block}.banners-page .anchor-row a:hover{color:#fff;background:#009eec14}.banners-page .anchor-row a.anchor-row-cta{color:#fff;background:linear-gradient(90deg,#009eecf0,#0078bed1);border-top:0;justify-content:space-between;align-items:center;gap:10px;margin:8px 0;padding:15px 12px;display:flex}.banners-page .anchor-row a.anchor-row-cta:hover{background:linear-gradient(90deg,#1ab8fffa,#0091dbe6)}.banners-page .anchor-row a.anchor-row-cta i{font-size:12px;font-style:normal}.banners-page .section-group{grid-column:1;margin-bottom:0}.banners-page .section-header{border-bottom:2px solid var(--bn-blue);justify-content:space-between;align-items:center;min-height:36px;margin-bottom:14px;display:flex}.banners-page .section-header h2{color:#fff;text-transform:uppercase;align-items:center;gap:8px;margin:0;font-size:22px;font-weight:800;line-height:1.2;display:flex}.banners-page .section-header h2:before{background:var(--bn-blue-bright);content:"";flex:0 0 14px;width:14px;height:14px}.banners-page .light-cone-block{margin-top:28px}.banners-page .phase-summary{border:1px solid var(--bn-border);background:#1c1d21cc;grid-template-columns:minmax(220px,300px) minmax(0,1fr);align-items:center;gap:18px;margin-bottom:12px;padding:14px 16px;display:grid}.banners-page .phase-summary span{color:#ffffff9e;text-transform:uppercase;font-size:12px;font-weight:800;display:block}.banners-page .phase-summary strong{color:#fff;font-size:20px;line-height:1.25;display:block}.banners-page .phase-summary p{color:#ffffffd1;margin:0;font-size:15px;line-height:1.55}.banners-page .banner-grid,.banners-page .next-layout,.banners-page .light-cone-grid,.banners-page .rules-grid,.banners-page .faq-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.banners-page .banner-card,.banners-page .rules-grid article,.banners-page .faq-card,.banners-page .notice-card{border:1px solid var(--bn-border-soft);background:#2c2d33eb;position:relative}.banners-page .banner-card{border-top:3px solid var(--bn-blue);flex-direction:column;min-height:100%;display:flex;overflow:hidden}.banners-page .banner-card.featured,.banners-page .banner-card.collab-card,.banners-page .banner-card.light-cone-card{border-top:3px solid var(--bn-gold)}.banners-page .banner-card-link{text-indent:-9999px;z-index:4;position:absolute;inset:0;overflow:hidden}.banners-page .banner-card-link:focus-visible{outline:2px solid var(--bn-blue);outline-offset:-4px}.banners-page .banner-art{background:linear-gradient(160deg,#009eec52,#16171bdb),repeating-linear-gradient(135deg,#ffffff0b 0 10px,#0000 10px 20px);flex-direction:column;align-items:flex-start;gap:8px;min-height:250px;padding:12px;display:flex;position:relative;overflow:hidden}.banners-page .banner-art>img{object-fit:cover;object-position:center;z-index:0;width:100%;height:100%;position:absolute;inset:0}.banners-page .banner-art.icon-only>img{filter:drop-shadow(0 14px 22px #00000080);object-fit:contain;object-position:center bottom}.banners-page .banner-art:after{content:"";pointer-events:none;z-index:1;background:linear-gradient(#0e0f142e 0%,#0e0f1405 42%,#0e0f1494 100%),linear-gradient(90deg,#0e0f146b,#0e0f1405 48%,#0e0f1438);position:absolute;inset:0}.banners-page .banner-art.saber>img{object-position:50% 12%}.banners-page .banner-art.archer>img{object-position:50% 8%}.banners-page .banner-art.sunday>img{object-position:center 40%}.banners-page .banner-art.mortenax>img{object-position:center 20%}.banners-page .banner-art.himeko>img{object-position:center 24%}.banners-page .banner-art.evanescia{background:linear-gradient(160deg,#ffc0cb61,#009eec38,#16171be6),repeating-linear-gradient(135deg,#ffffff0b 0 10px,#0000 10px 20px)}.banners-page .banner-art.tribbie{background:linear-gradient(160deg,#a56eff61,#009eec2e,#16171be6),repeating-linear-gradient(135deg,#ffffff0b 0 10px,#0000 10px 20px)}.banners-page .banner-art.sunday{background:linear-gradient(160deg,#ffc75c57,#009eec2e,#16171be6),repeating-linear-gradient(135deg,#ffffff0b 0 10px,#0000 10px 20px)}.banners-page .banner-art.feixiao{background:linear-gradient(160deg,#7cde9757,#009eec2e,#16171be6),repeating-linear-gradient(135deg,#ffffff0b 0 10px,#0000 10px 20px)}.banners-page .banner-art.mortenax{background:linear-gradient(160deg,#009eec4d,#16171bdb),repeating-linear-gradient(135deg,#ffffff0b 0 10px,#0000 10px 20px)}.banners-page .banner-art.himeko{background:linear-gradient(160deg,#ff5f365c,#ffb84c29,#16171be6),repeating-linear-gradient(135deg,#ffffff0b 0 10px,#0000 10px 20px)}.banners-page .rarity,.banners-page .banner-type{color:#fff;text-transform:uppercase;z-index:4;background:#16171bd1;align-self:flex-start;padding:7px 9px;font-size:11px;font-weight:800;line-height:1;display:inline-flex;position:relative}.banners-page .banner-type{background:#009eeceb}.banners-page .banner-overlay{pointer-events:none;z-index:3;background:linear-gradient(#06070b61 0%,#06070b0f 45%,#06070bc7 100%),linear-gradient(90deg,#06070b99,#06070b0a 52%,#06070b42);flex-direction:column;justify-content:space-between;padding:12px 12px 14px;display:flex;position:absolute;inset:0}.banners-page .mode-ratings{background:#0a0c12c7;border:1px solid #ffffff29;flex-wrap:nowrap;justify-content:flex-end;align-self:flex-end;max-width:calc(100% - 118px);margin-left:118px;display:flex;overflow:hidden;box-shadow:0 8px 18px #0000003d}.banners-page .mode-ratings span{grid-template-columns:auto auto;min-width:56px;display:grid;overflow:hidden}.banners-page .mode-ratings span+span{border-left:1px solid #ffffff24}.banners-page .mode-ratings em,.banners-page .mode-ratings strong{justify-content:center;align-items:center;min-height:26px;padding:0 7px;font-style:normal;font-weight:900;line-height:1;display:inline-flex}.banners-page .mode-ratings em{color:#fff;text-transform:uppercase;background:linear-gradient(90deg,#009eecf0,#0086cde0);border-right:1px solid #ffffff1f;font-size:10px}.banners-page .mode-ratings strong{color:#fff;font-size:13px}.banners-page .banner-rate-up-icons{pointer-events:none;z-index:5;flex-direction:column;align-items:center;gap:5px;display:flex;position:absolute;top:44%;right:16px;transform:translateY(-50%)}.banners-page .banner-rate-up-icons img{object-fit:cover;object-position:center top;background:#ffffff1a;border:2px solid #ffffffc7;border-radius:999px;width:32px;height:32px;box-shadow:0 4px 12px #0000006b}.banners-page .banner-identity{text-shadow:0 2px 12px #000000d1;max-width:min(100%,430px);padding-right:156px}.banners-page .banner-overlay .banner-name{color:#fff;margin:0 0 4px;font-size:30px;font-weight:800;line-height:1.15}.banners-page .art-timer{text-align:right;text-shadow:0 2px 12px #000000e6;background:0 0;border:0;max-width:230px;padding:0;position:absolute;bottom:14px;right:12px}.banners-page .art-timer span{color:#ffffffd1;text-transform:uppercase;justify-content:flex-end;align-items:center;gap:6px;font-size:10px;font-weight:900;line-height:1;display:inline-flex}.banners-page .art-timer.static span{text-transform:none}.banners-page .art-timer i{background:var(--bn-green);border-radius:999px;flex:0 0 7px;width:7px;height:7px;box-shadow:0 0 10px #38ff92d6}.banners-page .art-timer.upcoming i{background:var(--bn-gold);box-shadow:0 0 10px #ffc000b8}.banners-page .art-timer strong{color:#fff;white-space:nowrap;flex-wrap:nowrap;justify-content:flex-end;align-items:baseline;gap:7px;margin-top:5px;font-size:20px;font-weight:900;line-height:1;display:flex}.banners-page .art-timer strong .timer-primary{font-size:20px;font-weight:950}.banners-page .art-timer strong .timer-secondary{color:#ffffffc7;font-size:13px;font-weight:850}.banners-page .banner-body{flex-direction:column;flex:1;padding:18px;display:flex}.banners-page .banner-icon-row{flex-wrap:wrap;gap:8px;margin:0 0 13px;display:flex}.banners-page .icon-chip{color:#fff;background:#16171b94;border:1px solid #ffffff1a;align-items:center;gap:8px;min-width:0;min-height:40px;padding:7px 10px;display:inline-flex}.banners-page .icon-chip img{object-fit:contain;flex:0 0 26px;width:26px;height:26px;display:block}.banners-page .icon-chip strong{font-size:13px;font-weight:900;line-height:1.1}.banners-page .banner-phase-meta{background:#16171b94;border:1px solid #ffffff1a;flex-direction:column;flex:220px;justify-content:center;min-width:220px;min-height:40px;padding:5px 10px;display:flex}.banners-page .banner-phase-meta span{color:#ffffff9e;text-transform:uppercase;margin-bottom:2px;padding-top:2px;font-size:11px;font-weight:900;line-height:11px;display:block}.banners-page .banner-phase-meta strong{color:#fff;font-size:13px;font-weight:900;display:block}.banners-page .banner-copy{color:#ffffffd6;margin:0;font-size:15px;line-height:1.6}.banners-page .banner-copy p{margin:0 0 8px}.banners-page .featured-rate-ups{flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:auto;padding:10px 0 0;display:flex}.banners-page .featured-rate-ups-label{color:#ffffffad;text-transform:uppercase;flex:none;font-size:11px;font-weight:900}.banners-page .featured-rate-ups-links{flex-wrap:wrap;flex:190px;gap:6px;min-width:0;display:flex}.banners-page .featured-rate-ups-links a,.banners-page .featured-rate-ups-links span{color:#31c7ff;background:#009eec24;border:1px solid #009eec57;padding:5px 7px;font-size:13px;font-weight:900;line-height:1.15;display:inline-flex}.banners-page .featured-rate-ups-links a:hover{color:#fff;background:#009eec3d}.banners-page .light-cone-card .banner-art,.banners-page .banner-art.lightcone-art{background:radial-gradient(circle at 52% 42%,#ffffff1f,#0000 34%),repeating-linear-gradient(135deg,#ffffff0b 0 12px,#0000 12px 24px),linear-gradient(135deg,#009eec57,#16171beb);align-items:flex-start;min-height:214px}.banners-page .lightcone-art:after{z-index:1;background:radial-gradient(at 52% 48%,#ffffff38 0%,#ffffff1a 24%,#0a0c123d 48%,#0a0c1280 100%),linear-gradient(#0e0f1414 0%,#0e0f1405 36%,#0e0f1475 100%),linear-gradient(90deg,#0e0f145c,#0e0f1400 50%,#0e0f1438)}.banners-page .lightcone-art .lightcone-bg-image{filter:brightness(1.18)saturate(1.08);object-fit:cover;object-position:center 18%;z-index:0;width:100%;max-width:none;height:100%;max-height:none;position:absolute;inset:0;transform:none}.banners-page .lightcone-art .lightcone-card-image{aspect-ratio:348/408;filter:drop-shadow(0 18px 24px #0000008a)brightness(1.08)saturate(1.04);object-fit:contain;object-position:center;z-index:2;width:clamp(120px,28%,162px);max-width:38%;height:auto;max-height:none;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-49%)rotate(-3deg)}.banners-page .light-cone-card .banner-overlay{background:linear-gradient(#06070b14 0%,#06070b05 45%,#06070b7a 100%),linear-gradient(90deg,#06070b6b,#06070b05 52%,#06070b2e);justify-content:flex-end}.banners-page .light-cone-card .banner-overlay .banner-name{font-size:22px;line-height:1.15}.banners-page .light-cone-card .banner-identity{max-width:58%;padding-right:0}.banners-page .collab-card .banner-overlay,.banners-page .upcoming-banner-card .banner-overlay{justify-content:flex-end}.banners-page .upcoming-banner-card .banner-identity{max-width:calc(100% - 250px);padding-right:0;position:absolute;bottom:14px;left:12px}.banners-page .collab-card.character-banner-card .banner-overlay{justify-content:space-between}.banners-page .collab-card .banner-overlay .banner-name{font-size:26px}.banners-page .rules-grid article,.banners-page .faq-card{border-top:3px solid var(--bn-blue);padding:20px}.banners-page .notice-card{border-top:3px solid var(--bn-gold);padding:22px}.banners-page .rules-grid h3,.banners-page .faq-card h3,.banners-page .notice-card h3{color:#fff;text-transform:uppercase;margin:0 0 8px;font-size:17px;font-weight:800;line-height:1.25}.banners-page .rules-grid p,.banners-page .faq-card p,.banners-page .notice-card p{color:#ffffffd6;margin:0;font-size:15px;line-height:1.6}.banners-page .shortcut-guides{margin-bottom:0}.banners-page .shortcut-stack{gap:18px;display:grid}.banners-page .shortcut-group h3{color:#fff;margin:0 0 9px;font-size:16px;font-weight:900;line-height:1.2}.banners-page .shortcut-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.banners-page .shortcut-card{border:1px solid var(--bn-border-soft);background:#2c2d33eb;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:14px;min-height:74px;padding-right:14px;transition:background .2s,border-color .2s,transform .2s;display:grid;position:relative;overflow:hidden}.banners-page .shortcut-card:hover{border-color:var(--bn-blue-bright);background:#33353cf5;transform:translateY(-2px)}.banners-page .shortcut-card:before{background:var(--bn-blue);content:"";width:3px;position:absolute;inset:0 auto 0 0}.banners-page .shortcut-card img{aspect-ratio:1;object-fit:cover;width:72px;height:72px}.banners-page .shortcut-card span{color:#fff;font-size:15px;font-weight:900;line-height:1.2}.banners-page .shortcut-card i{color:#ffffff7a;font-size:13px;font-style:normal;transition:color .2s,transform .2s}.banners-page .shortcut-card:hover i{color:var(--bn-blue-bright);transform:translate(2px)}@media (max-width:1280px){.banners-page .article-layout{grid-template-columns:minmax(0,1fr) 240px;gap:28px}.banners-page .banner-art{min-height:230px}}@media (max-width:1100px){.banners-page .article-layout{display:block}.banners-page .anchor-row{background:0 0;border:0;flex-direction:row;gap:8px;margin:0 0 30px;padding:0 0 6px;display:flex;position:static;overflow-x:auto}.banners-page .anchor-row a{border:1px solid var(--bn-border-soft);color:#fff;white-space:nowrap;background:#1c1d21eb;flex:none;padding:11px 13px}.banners-page .toc-label{display:none}}@media (max-width:992px){.banners-page .page-header{min-height:270px;padding:28px}.banners-page .page-header:before{background-position:48% 18%}.banners-page .server-region-panel{grid-template-columns:1fr}.banners-page .server-region-panel p{text-align:left}.banners-page .quick-status,.banners-page .banner-grid,.banners-page .next-layout,.banners-page .light-cone-grid,.banners-page .rules-grid,.banners-page .faq-grid{grid-template-columns:1fr}.banners-page .shortcut-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.banners-page .phase-summary{grid-template-columns:1fr}}@media (max-width:620px){.banners-page .banner-overlay .banner-name{font-size:24px}.banners-page .banner-identity{padding-right:132px}.banners-page .mode-ratings{gap:0;max-width:calc(100% - 96px);margin-left:96px}.banners-page .mode-ratings span{min-width:50px}.banners-page .mode-ratings em,.banners-page .mode-ratings strong{min-height:24px;padding:0 6px}.banners-page .mode-ratings strong{font-size:12px}.banners-page .shortcut-grid{grid-template-columns:1fr}.banners-page .featured-rate-ups{align-items:flex-start}.banners-page .featured-rate-ups-label,.banners-page .featured-rate-ups-links{flex-basis:100%}.banners-page .page-header{min-height:260px;padding:22px}.banners-page .page-header .page-details h1{font-size:30px}.banners-page .page-header .page-details .sub-title{font-size:16px}.banners-page .quick-status div{min-height:66px}.banners-page .section-header h2{font-size:20px}.banners-page .anchor-row{border:1px solid var(--bn-border);border-top:3px solid var(--bn-blue);background:#1c1d21f0;grid-template-columns:1fr;gap:0;margin-bottom:30px;padding:10px 12px 14px;display:grid;overflow:visible}.banners-page .toc-label{display:block}.banners-page .anchor-row a{flex:initial;white-space:normal;background:0 0;border:0;border-top:1px solid #ffffff1a;width:100%;padding:13px 10px;display:block}.banners-page .server-region-panel{grid-template-columns:1fr;align-items:stretch;gap:10px;padding:12px}.banners-page .server-region-actions{width:100%;display:grid}.banners-page .region-option{height:40px;padding:0 8px}.banners-page .art-timer{min-width:0;max-width:176px;padding:0;bottom:12px;right:10px}.banners-page .art-timer span{font-size:9px}.banners-page .art-timer strong{gap:5px;font-size:16px}.banners-page .art-timer strong .timer-primary{font-size:16px}.banners-page .art-timer strong .timer-secondary{font-size:11px}.banners-page .art-timer.static{min-width:0}.banners-page .collab-card .banner-overlay .banner-name{font-size:23px}.banners-page .light-cone-card .banner-overlay .banner-name{font-size:19px}.banners-page .light-cone-card .banner-identity{max-width:56%;padding-right:0}.banners-page .banner-card{min-height:auto}.banners-page .banner-art{min-height:236px}.banners-page .banner-overlay{padding:10px 10px 13px}.banners-page .banner-phase-meta{flex-basis:100%;min-width:0}.banners-page .faq-card,.banners-page .rules-grid article,.banners-page .notice-card{padding:16px}.banners-page .shortcut-card{grid-template-columns:64px minmax(0,1fr) auto;gap:12px;min-height:68px}.banners-page .shortcut-card img{width:64px;height:64px}}