/* October feedback: luminous chrome header and full artwork on every screen. */
.header{background:linear-gradient(180deg,#051325 0%,#020914 78%,#04182b);border-top:1px solid #79d9ff90;border-bottom:1px solid #69c8f7aa;box-shadow:inset 0 3px 10px #80dcff19,0 2px 16px #008dff25}
.header .head-top{width:calc(100% - 32px);max-width:1600px;height:106px;gap:30px;padding-inline:26px}
.header .brand{display:flex;align-items:center;width:300px;height:auto;overflow:visible;flex:0 0 24%;max-width:340px}
.header .brand img{width:100%;height:auto;max-height:92px;object-fit:contain;transform:none;filter:drop-shadow(0 3px 8px #009dff65)}
.header-search{flex:1;min-width:160px;max-width:none}
.header-search input{height:58px;border:1px solid #91acc4;border-radius:999px;padding-left:53px;background:linear-gradient(180deg,#061421,#020a16);box-shadow:inset 0 2px 4px #a4daff38,0 0 3px #9cd6ff80;font-size:16px}
.header-search>.icon{left:20px;width:24px;height:24px;color:#e4f7ff}
.header-search .search-go{right:15px;color:#b7e6ff}
.head-actions{flex-shrink:0;gap:12px;padding:10px 14px;border:1px solid #7693ad80;border-radius:28px;background:linear-gradient(150deg,#101e2f,#020a14);box-shadow:inset 0 2px 5px #94d0ff24,0 0 16px #0077ff16}
.head-actions .balance-chip{border:0;border-radius:0;background:none;box-shadow:none;padding:0 17px 0 2px;border-right:1px solid #51718d80;min-width:132px;gap:13px;font-size:12px}
.head-actions .balance-chip>.icon{width:30px;height:30px;color:#f3fbff}
.head-actions .balance-chip strong{font-size:24px;line-height:1.35}
.head-actions .header-topup{border-radius:999px;min-height:52px;padding:10px 20px;font-size:16px;background:linear-gradient(170deg,#19edff,#0098f8 40%,#0647ed);box-shadow:inset 0 2px 5px #d4ffff8a,0 0 12px #0098ff60}
.head-actions .iconbtn{width:51px;height:51px;border:1px solid #a0b7ca;border-radius:50%;background:linear-gradient(155deg,#38516a,#071421 65%);box-shadow:inset 0 2px 5px #def3ff35}
.head-actions .iconbtn .icon{width:29px;height:29px}
.art-hero .hero-poster{max-width:none}
.art-hero .hero-poster img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}
.page-intro.art-intro.unique-banner{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;min-height:0;padding:0;width:100vw;max-width:none;margin-inline:calc((100% - 100vw)/2);margin-bottom:28px;overflow:hidden}
.unique-banner>.inner-poster{grid-area:1/1;position:relative;inset:auto;z-index:0;display:block;width:100%;height:auto;max-width:none;aspect-ratio:auto;object-fit:contain;object-position:center;mask-image:none;opacity:1}
.unique-banner .intro-copy{grid-area:1/1;position:relative;z-index:2;width:47%;max-width:620px;margin-left:max(30px,calc((100vw - 1180px)/2));padding:0;background:none}
.unique-banner .eyebrow{font-size:clamp(7px,.7vw,12px);letter-spacing:1.5px}
.unique-banner h1{font-size:clamp(16px,2.7vw,46px);line-height:1.45;margin:12px 0 18px;max-width:none}
.unique-banner p{font-size:clamp(9px,1.05vw,17px);line-height:1.8;max-width:520px;margin:0}
.unique-banner:after{display:none}
/* Keep the supplied artwork's entire 3:1 composition instead of cropping it. */
.announcement{display:flex;align-items:center;max-width:1180px;margin:12px auto 0;min-height:39px;border:1px solid #18649b;border-radius:5px;background:linear-gradient(180deg,#061329,#020918);box-shadow:inset 0 1px 10px #008cff15;position:relative;z-index:2}
.announcement-toggle{display:grid;place-items:center;align-self:stretch;flex:0 0 45px;border:0;border-right:1px solid #174a7b;background:linear-gradient(140deg,#046cf0,#022374);color:#fff;cursor:pointer}
.announcement-toggle svg{width:18px;height:18px}
.announcement-window{overflow:hidden;container-type:inline-size;flex:1;min-width:0;padding:7px 0}
.announcement-copy{display:block;width:max-content;max-width:none;white-space:nowrap;font-size:13px;line-height:1.8;color:#d7f5ff;animation:announcementLeft 27s linear infinite}
@keyframes announcementLeft{from{transform:translateX(100cqw)}to{transform:translateX(-100%)}}
.announcement.paused .announcement-copy,.announcement:hover .announcement-copy,.aw-selecting .announcement-copy{animation-play-state:paused}
.aw-selecting .announcement-copy{animation:none;transform:none;white-space:normal;width:auto;padding-inline:10px}
.art-hero .poster-controls{padding-top:20px}
/* An SVG border keeps the glowing reference frame crisp at every size. */
.shortcut.category-art-card{container-type:inline-size;border:0;border-radius:22px;padding:32px 34px;min-height:226px;overflow:visible;box-shadow:none;background:radial-gradient(ellipse at 75% 90%,#063f8799,transparent 70%),linear-gradient(115deg,#020817,#041329)}
.page-intro.unique-banner{container-type:inline-size}
.category-art-card:before{content:'';position:absolute;inset:-8px;background:url('/assets/category-neon-frame.svg') center/100% 100% no-repeat;z-index:3;pointer-events:none;filter:drop-shadow(0 0 6px #007cffb0)}
.category-art-card:after{content:'';position:absolute;inset:9px;border-radius:17px;border-top:1px solid #71dfff50;border-bottom:1px solid #0053b050;pointer-events:none}
.category-art-card .category-art{right:10px;width:48%;bottom:7px;height:96%;filter:drop-shadow(0 0 10px #007cff66);border-radius:20px}
.category-art-card:hover{border:0;box-shadow:0 0 30px #0397ff38}
.category-art-card .category-copy{width:62%;z-index:4}
.category-art-card strong{font-size:clamp(24px,2.4vw,33px)}
.category-art-card small{font-size:16px}
.shortcut-grid{gap:30px;margin-top:22px;margin-bottom:42px}
.category-section[data-category=games]{position:relative;isolation:isolate;padding-top:22px;padding-bottom:42px;margin-block:35px 55px}
.category-section[data-category=games]:before{content:'';position:absolute;z-index:-2;left:50%;transform:translateX(-50%);top:-12px;bottom:-12px;width:100vw;background:#020a1b url('/assets/arena-feedback-v1.png') center/100% 100% no-repeat;pointer-events:none}
.category-section[data-category=games] .section-title{margin-bottom:24px}
.category-section[data-category=games] .section-title .link{border:1px solid #2cdbff;border-radius:999px;padding:8px 18px;background:#001426aa;box-shadow:0 0 10px #009cff40}
.card-games{border-color:#44ccf6;background:linear-gradient(165deg,#07172bf5,#020b1cf5);box-shadow:inset 0 0 7px #1387ff33,0 0 8px #118cff50}
.card-games .card-art{padding:9px 9px 0}
.card-games .card-art img{border-radius:11px}
@media(max-width:1150px){
 .header .head-top{height:89px;gap:20px;padding-inline:20px}.header .brand{flex-basis:23%}
 .head-actions{gap:9px;padding:8px 10px}.head-actions .balance-chip{min-width:104px;padding-right:10px;font-size:10px}.head-actions .balance-chip strong{font-size:20px}
 .head-actions .header-topup{font-size:13px;padding:9px 12px;min-height:44px}.head-actions .iconbtn{height:43px;width:43px}
 .header-search input{height:50px;font-size:12px;padding-left:38px}.header-search>.icon{left:12px;width:20px}
 .shortcut.category-art-card{min-height:190px;padding:25px}.category-art-card strong{font-size:25px}.category-art-card small{font-size:13px}
}
@media(max-width:700px){
 .header .head-top{height:70px;gap:10px;padding-inline:12px}.header .brand{flex:1;max-width:150px;width:auto}
 .head-actions{gap:7px;padding:5px 7px;border-radius:20px}.head-actions .balance-chip{min-width:0;font-size:7px;gap:5px;padding-right:7px}.head-actions .balance-chip>.icon{width:18px;height:18px}.head-actions .balance-chip strong{font-size:15px}
 .head-actions .header-topup{font-size:10px;padding:6px 8px;min-height:32px}.head-actions .iconbtn{height:30px;width:30px}.head-actions .iconbtn .icon{width:19px;height:19px}
 .page-intro.art-intro.unique-banner{min-height:0;padding:0;margin-bottom:20px;align-items:center}
 .unique-banner>.inner-poster{position:relative;top:auto;bottom:auto;height:auto;object-fit:contain;object-position:center;mask-image:none}
 .unique-banner .intro-copy{width:49%;max-width:none;margin-left:4%;padding:0}
 .unique-banner .eyebrow{font-size:clamp(5px,1.35vw,9px);letter-spacing:.5px;line-height:1.5}
 .unique-banner h1{font-size:clamp(12px,3.45vw,23px);line-height:1.45;margin:5px 0 6px;max-width:none}
 .unique-banner p{font-size:clamp(6px,1.75vw,12px);line-height:1.65;max-width:none}
 .announcement{margin:8px 12px 0;min-height:31px}.announcement-toggle{flex-basis:33px}.announcement-copy{font-size:10px}.announcement-window{padding:5px 0}
 .art-hero .poster-controls{padding-top:14px}
 .shortcut-grid{gap:15px;margin-top:16px;margin-bottom:28px}
 .shortcut.category-art-card{min-height:0;aspect-ratio:2.3/1;padding:12px 10px;border-radius:11px}
 .category-art-card:before{inset:-4px;filter:drop-shadow(0 0 3px #007cff99)}.category-art-card:after{inset:4px;border-radius:9px}
 .category-art-card .category-art{width:47%;right:2px;height:94%;bottom:3px;border-radius:9px}
 .category-art-card strong{font-size:clamp(10px,7.3cqw,22px)}.category-art-card small{font-size:clamp(7px,4.4cqw,12px)}
 .category-section[data-category=games]{margin-block:25px 36px;padding-block:12px 28px}
 .category-section[data-category=games]:before{background-size:auto 100%;background-position:center;opacity:.85}
 .category-section[data-category=games] .section-title .link{padding:6px 10px;font-size:10px;white-space:nowrap}
 .card-games .card-art{padding:6px 6px 0}
}
@media(max-width:380px){.header .brand{max-width:118px}.head-actions{gap:5px}.head-actions .header-topup{padding-inline:6px;font-size:9px}.head-actions .iconbtn{width:27px;height:27px}}
@media(prefers-reduced-motion:reduce){.announcement-copy{animation:none;transform:none;white-space:normal;width:auto;padding-inline:10px}.announcement-toggle{display:none}}
body.low-motion .announcement-copy{animation:none;transform:none}