/* Game artwork leads the page; controls keep their established, readable layout. */
body.sxs-hub-site{--bg:#f4f0e7;--paper:#fffdf8;--ink:#253b33;--muted:#637064;--accent:#2c5c48;--line:#dddccf;background:radial-gradient(ellipse at 85% 120px,#e4e9dc 0,transparent 520px),var(--bg)}
.hub-header{background:#233f36;border:0;color:#fff9e9;box-shadow:0 3px 14px #243a3012}
.hub-header .hub-header-main{min-height:82px}
.hub-brand{color:#fff8e4;font-size:25px;letter-spacing:-1.3px}
.hub-brand .hub-x{color:#e4c487;font-size:18px}
.hub-brand-tail{color:#cbd9c1}
.hub-brand small{color:#b9c9b6;font-size:10px;letter-spacing:1px}
.hub-search{background:#fffdf4;border-color:#fffdf4;height:44px;box-shadow:0 3px 8px #15291e12}
.hub-header-coupon{color:#ead6a8;font-weight:650}
.hub-header-coupon span{color:#b7c6a8}
.hub-nav-wrap{border-top:1px solid #ffffff15;background:#1d362e}
.hub-header .hub-nav{gap:32px;min-height:46px}
.hub-header .hub-nav a{color:#c8d3bf;font-size:13px}
.hub-header .hub-nav a:hover,.hub-header .hub-nav a[aria-current=page]{color:#f9e2af;box-shadow:inset 0 -3px #d3ad68}
.hub-search-results{color:#253b33}
.hub-home{padding-top:24px}
.hub-village{min-height:230px;padding:28px 34px;margin-bottom:26px;gap:24px;border:1px solid #d5ddc6;border-radius:14px;background-color:#e6ead8;background-image:linear-gradient(90deg,#eceddd 0%,#ecedddf2 27%,#e9ecdb80 48%,#e9ecdb00 75%),url('art/ground.webp');background-size:100%,790px auto;background-position:center,right 60%;box-shadow:0 10px 28px #61724b0b}
.hub-village-copy{max-width:410px;position:relative;z-index:2}
.hub-village .hub-kicker{font-size:10px;letter-spacing:1.6px;color:#6b7852;margin-bottom:13px}
.hub-village h1{font-size:clamp(27px,3.1vw,37px);line-height:1.35;letter-spacing:-1.8px;max-width:390px;margin:0 0 13px;color:#2a4939}
.hub-village-copy>p:last-child{font-size:14px;line-height:1.8;max-width:310px;color:#60724f}
.hub-village-stops{position:relative;align-items:flex-end;gap:15px;padding:0 3px 0 0;min-height:175px}
.hub-village-stops a{position:relative;width:143px;gap:6px;isolation:isolate;font-size:12px;color:#36513a}
.hub-village-stops a::before{content:"";position:absolute;z-index:-1;bottom:26px;left:8%;right:8%;height:21px;border-radius:50%;background:#57754526;filter:blur(5px)}
.hub-village-stops a:nth-child(2){margin-bottom:14px}
.hub-village-stops a:nth-child(3){margin-bottom:-5px}
.hub-village-stops img{width:143px;height:137px;filter:drop-shadow(0 7px 4px #3a512b18)}
.hub-village-stops span{font-size:11px;min-height:27px;display:flex;align-items:center;justify-content:center;padding:3px 11px;border:1px solid #d4ddc7;background:#fffdf4eb;border-radius:5px;box-shadow:0 2px 3px #3f5a2c09}
.hub-village-stops b{margin-left:8px}
.hub-build-finder,.hub-coupon-panel{border:1px solid #dedfd1;border-radius:12px;box-shadow:0 7px 22px #354d2a05}
.hub-build-finder{border-top:3px solid #3e6a4f}
.hub-section-title h2{font-size:22px;color:#2d4838}
.hub-section-title>a{color:#617455;font-size:12px}
.hub-kicker{color:#8a7853;letter-spacing:1.3px;font-size:10px}
.hub-rank-tabs{background:#edeee4;border:1px solid #e1e4d4;padding:4px;gap:4px}
.hub-rank-tabs button{color:#6c775e}
.hub-rank-tabs button[aria-pressed=true]{background:#345b43;box-shadow:0 2px 5px #28482b24;color:#fff5da}
.hub-class-choices button{background:#fffdf7;color:#617050;border-color:#dbe0cc}
.hub-class-choices button[aria-pressed=true]{background:#e8efdb;border-color:#879e67;color:#3c5733}
.hub-build-selection label{color:#687558;font-size:12px}
.hub-build-preview{position:relative;background:linear-gradient(115deg,#284f42,#1c3a32);border:1px solid #244639;border-radius:9px;padding:19px 20px 18px;box-shadow:inset 0 1px #ffffff0c}
.hub-preview-top strong{color:#fff3d2;font-size:17px;font-weight:750}
.hub-preview-top>span{color:#bdcdb5;font-size:10px}
.hub-build-preview [data-hub-preview-skills]{gap:25px}
.hub-skill-row{gap:10px}
.hub-skill-label{color:#bfd1b5;font-size:11px}
.hub-skill-row>div{gap:7px}
.hub-skill{width:44px;height:44px;border-radius:8px;background:#102e28;border:1px solid #90ac704d;box-shadow:inset 0 0 0 2px #152f26,0 3px 5px #10251f45}
.hub-skill img{width:39px;height:39px;border-radius:6px}
.hub-skill i{background:#e7be75;border-color:#284d40;width:9px;height:9px}
.hub-preview-bottom{margin-top:20px}
.hub-preview-bottom>span{color:#c2d0b9;font-size:11px;max-width:190px;line-height:1.6}
.hub-preview-bottom .hub-primary{background:#ead8a9;color:#294737;min-height:43px;padding-inline:17px;box-shadow:0 3px 0 #b7a274;font-size:12px}
.hub-preview-bottom .hub-primary:hover{background:#f3e6c8}
.hub-context-note{color:#6e795f;font-size:11px;line-height:1.8}
.hub-coupon-panel{background:linear-gradient(#f2e9d3 0,#f7f0df 108px,#fffdf8 108px);border-top:3px solid #c09b5d}
.hub-coupon-panel .hub-kicker{color:#9a7943}
.hub-coupon-panel .hub-section-title h2{color:#644c2d}
.hub-coupon-panel .hub-section-title>a{color:#87714b}
.hub-coupon-lead{color:#8a7651;margin-bottom:18px}
.hub-coupon-lead strong{color:#865f2d;font-size:33px}
.hub-coupon-lead strong small{color:#8a7853}
.hub-coupon-regions{border-color:#e6e4d6}
.hub-coupon-regions a{padding:12px 1px;border-color:#e8e6da}
.hub-coupon-regions a:hover strong{color:#2d583c}
.hub-coupon-regions strong{color:#556445;font-size:12px}
.hub-coupon-regions a>span>small{color:#80876f;font-size:10px;margin-top:3px}
.hub-coupon-regions b{color:#526f39}
.hub-coupon-regions b small{color:#879275}
.hub-secondary{border:1px solid #dce2d0;background:#ecf1e3;color:#46613b;min-height:43px}
.hub-quick-guides{gap:15px;margin:25px 0 36px}
.hub-quick-guides>a{border:1px solid #dbdecc;border-radius:8px;padding:20px 18px;background:#fdfbf2}
.hub-guide-number{font-size:15px;color:#9a956e;font-weight:650}
.hub-quick-guides strong{font-size:14px;color:#465c3b}
.hub-quick-guides small{font-size:11px;color:#788064}
.hub-editorial-grid .hub-section-title h2{font-size:22px}
.hub-guide-section .card h3{font-size:16px;color:#35503b}
.hub-guide-section .card p{color:#6f7a62;font-size:12px;line-height:1.8}
.hub-guide-section .card>small{color:#868e76;font-size:10px}
.hub-data-note{background:#e8eddf;border:1px solid #d6dfc7;border-radius:9px;padding:22px}
.site-footer{background:#263e34;color:#b7c4ad;border-color:#1e332b}
.site-footer a{color:#e0e7d7}
@media(max-width:1100px){
 .hub-village{padding:27px;min-height:220px}
 .hub-village h1{font-size:31px;max-width:335px}
 .hub-village-stops{gap:5px}
 .hub-village-stops a{width:116px}
 .hub-village-stops img{width:116px;height:123px}
 .hub-build-preview{padding:18px 16px}
 .hub-build-preview [data-hub-preview-skills]{gap:15px}
 .hub-skill{width:36px;height:36px}
 .hub-skill img{width:32px;height:32px}
 .hub-skill-row>div{gap:5px}
}
@media(max-width:760px){
 .hub-header .hub-header-main{min-height:0;padding-top:18px;padding-bottom:16px;gap:15px}
 .hub-brand{font-size:24px}
 .hub-header-coupon{font-size:11px}
 .hub-header .hub-nav{gap:0;min-height:45px}
 .hub-header .hub-nav a{font-size:12px;padding:14px 11px 13px}
 .hub-home{padding-top:17px}
 .hub-village{padding:22px;min-height:202px;margin-bottom:21px;gap:12px;background-size:100%,610px auto;background-position:center,right 58%}
 .hub-village h1{font-size:29px;max-width:300px}
 .hub-village .hub-kicker{font-size:9px;letter-spacing:1.1px;margin-bottom:10px}
 .hub-village-copy>p:last-child{font-size:12px;max-width:260px}
 .hub-village-stops{min-height:150px;gap:0}
 .hub-village-stops a{display:none;width:120px}
 .hub-village-stops a:first-child{display:flex}
 .hub-village-stops img{width:120px;height:122px}
 .hub-build-preview [data-hub-preview-skills]{gap:28px}
 .hub-skill{width:42px;height:42px}
 .hub-skill img{width:37px;height:37px}
 .hub-preview-bottom>span{max-width:230px}
 .hub-quick-guides{gap:9px}
 .hub-quick-guides>a{padding:18px 16px}
 .hub-coupon-regions a{padding:13px 0}
 .hub-coupon-panel{background:linear-gradient(#f2e9d3 0,#f7f0df 105px,#fffdf8 105px)}
}
@media(max-width:480px){
 .hub-village{padding:20px 18px;min-height:195px;gap:0;background-position:center,68% 58%}
 .hub-village h1{font-size:25px;max-width:225px;letter-spacing:-1.2px}
 .hub-village-copy>p:last-child{max-width:195px;font-size:12px;line-height:1.7}
 .hub-village-stops{width:82px;flex:0 0 82px;margin-right:-9px;align-self:flex-end}
 .hub-village-stops a:first-child{width:91px}
 .hub-village-stops img{width:91px;height:100px}
 .hub-village-stops span{font-size:9px;padding:3px 6px;min-height:25px;white-space:nowrap}
 .hub-village-stops b{margin-left:4px}
 .hub-build-finder,.hub-coupon-panel{padding:19px 15px}
 .hub-section-title h2,.hub-build-finder .hub-section-title h2{font-size:19px}
 .hub-section-title>a{font-size:10px}
 .hub-rank-tabs{gap:1px}
 .hub-build-preview{padding:16px 13px}
 .hub-preview-top{margin-bottom:16px}
 .hub-preview-top strong{font-size:15px}
 .hub-preview-top>span{font-size:9px}
 .hub-build-preview [data-hub-preview-skills]{display:grid;grid-template-columns:1fr;gap:14px}
 .hub-skill-row{justify-content:space-between;gap:12px}
 .hub-skill-row>div{gap:8px}
 .hub-skill{width:43px;height:43px}
 .hub-skill img{width:38px;height:38px}
 .hub-skill-label{font-size:11px}
 .hub-preview-bottom{margin-top:19px}
 .hub-preview-bottom>span{max-width:none;margin-bottom:13px}
 .hub-preview-bottom .hub-primary{min-height:44px}
 .hub-context-note{font-size:11px}
 .hub-coupon-regions{column-gap:14px}
 .hub-coupon-regions strong{font-size:11px}
 .hub-coupon-regions a>span>small{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.hub-village-stops img{transition:none}}