/* Landscape-only composition; original portrait styling and artwork stay intact. */
html.asen-landscape body{min-width:0;overflow-x:hidden;padding:0}
html.asen-landscape main{width:auto;max-width:none;transform:none;margin:0 var(--asen-landscape-rail) 0 0;padding:0}
/* Clearing the portrait engine's identity transforms keeps viewport-fixed
   children fixed to the viewport after an orientation change. */
html.asen-landscape main,html.asen-landscape .home-page{translate:none!important;scale:none!important;transform:none!important}
html.asen-landscape .topbar{height:70px;padding:8px 18px 8px 16px;align-items:center;gap:16px;left:0;right:var(--asen-landscape-rail);width:auto;transform:none}
html.asen-landscape .brand{margin:0;gap:7px;align-items:center;flex:0 1 auto}
html.asen-landscape .brand-symbol{width:48px;height:48px;flex:0 0 48px}
html.asen-landscape .brand-copy{height:44px;grid-template-rows:22px 20px}
html.asen-landscape .brand-copy strong{font-size:20px;line-height:22px}
html.asen-landscape .brand-domain{font-size:12px;line-height:14px;margin-top:2px;transform:scaleY(1.25)}
html.asen-landscape .top-actions{width:auto;flex:none;margin-left:auto}
html.asen-landscape .action-grid{width:auto;grid-template-columns:repeat(4,minmax(74px,90px));grid-template-rows:34px;gap:7px}
html.asen-landscape .action-grid .header-action{width:auto;min-height:34px;height:34px;font-size:11px;padding:0 4px;gap:3px}
html.asen-landscape .bottom-nav{position:fixed;left:auto;right:calc(6px + var(--asen-safe-right));top:8px;bottom:calc(8px + var(--asen-safe-bottom));width:76px;height:calc(100dvh - 16px - var(--asen-safe-bottom));max-width:none;transform:none;padding:12px 5px;display:flex;flex-direction:column;justify-content:center;gap:12px;border:1px solid #d0a86777;border-radius:14px;box-shadow:inset 0 0 0 1px #171d28,0 3px 16px #0005;z-index:15}
html.asen-landscape .bottom-nav button{width:100%;height:48px;min-height:48px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;border-radius:9px}
html.asen-landscape .bottom-nav button.selected{background:#d4ac6926}
html.asen-landscape .bottom-nav button small{font-size:11px;line-height:1.2}
html.asen-landscape .bottom-nav .nav-recharge{height:65px;min-height:65px;display:block;margin:3px 0}
html.asen-landscape .bottom-nav .nav-recharge .nav-recharge-art{top:0;width:42px;height:42px;margin-left:-21px}
html.asen-landscape .bottom-nav .nav-recharge small{bottom:0}
html.asen-landscape .bottom-nav .nav-recharge-coin{font-size:24px}
html.asen-landscape .home-page.active{padding:calc(var(--asen-landscape-header) + 16px) var(--asen-landscape-gutter) 28px;display:grid;grid-template-columns:var(--asen-landscape-hero) minmax(0,1fr);column-gap:var(--asen-landscape-gap);row-gap:22px;align-items:start}
html.asen-landscape .hero{position:relative;top:0;width:100%;aspect-ratio:1/1;min-height:0;height:auto;border:1px solid #8c714744;border-radius:14px}
/* Reserve a dedicated left column throughout home scrolling. Only the active
   homepage owns this fixed banner, so inner pages retain their ordinary flow. */
html.asen-landscape .home-page.active>.hero{position:fixed;left:calc(var(--asen-landscape-gutter) + var(--asen-safe-left));top:calc(var(--asen-landscape-header) + 16px);width:var(--asen-landscape-hero);height:var(--asen-landscape-hero);z-index:2}
html.asen-landscape .hero-slide{background-size:cover!important}
html.asen-landscape .hero-copy,html.asen-landscape .hero.image-headline .hero-copy{left:0;right:0;top:auto;bottom:40px;max-width:100%;height:100px;padding:0 16px;transform:none}
html.asen-landscape .hero-copy h1,html.asen-landscape .hero.image-headline .hero-copy h1{font-size:23px;line-height:1.1}
html.asen-landscape .hero-copy p{font-size:11px}
html.asen-landscape .hero-badge{top:17%;left:16px;font-size:20px}
html.asen-landscape .hero-tagline{font-size:9px}
html.asen-landscape .hero-controls{bottom:8px}
html.asen-landscape .hero .gold-button{height:30px;min-height:30px;font-size:12px}
html.asen-landscape .home-content{grid-column:2;width:auto;max-width:none;margin:0;padding:0;min-width:0}
html.asen-landscape .quick-grid{grid-template-columns:repeat(5,minmax(0,1fr));max-width:none;width:100%;gap:8px;margin:0 0 16px}
html.asen-landscape .quick-grid button{aspect-ratio:auto;min-height:55px;padding:5px 2px;gap:3px}
html.asen-landscape .quick-grid button span{width:24px;height:24px}
html.asen-landscape .quick-grid button small{font-size:10px}
html.asen-landscape .section-title{margin:0 0 15px;align-items:center}
html.asen-landscape .section-title h2{font-size:22px;margin:1px 0}
html.asen-landscape .section-title .eyebrow{font-size:9px}
html.asen-landscape .text-link{font-size:11px}
html.asen-landscape .featured-halls{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 23px}
html.asen-landscape .featured-hall{aspect-ratio:auto;height:105px;padding:12px 10px;min-width:0}
html.asen-landscape .featured-hall-label{font-size:16px;max-width:100%;padding-left:6px;z-index:3}
html.asen-landscape .featured-hall-art{height:87px;width:85%;top:24px;right:0;object-fit:contain;object-position:right bottom}
html.asen-landscape .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}
html.asen-landscape .category-card{min-height:160px;padding:12px 10px;justify-content:flex-start;overflow:visible}
html.asen-landscape .category-card strong{font-size:16px}
html.asen-landscape .category-card small{font-size:10px}
html.asen-landscape .category-card-art{width:86%;height:74%;right:0;bottom:0;object-fit:contain}
html.asen-landscape .service-strip{margin:22px 0;gap:10px}
html.asen-landscape .service-strip button{min-height:44px;font-size:11px;padding:0 10px;gap:7px}
html.asen-landscape .download-showcase{margin:0}
html.asen-landscape .download-stage{min-height:310px}
html.asen-landscape .download-actions{width:min(39%,210px);top:8%;align-items:flex-start}
html.asen-landscape .download-actions button[data-app-launch="general"]{width:135%;margin-top:6px}
html.asen-landscape .download-actions button img{width:100%;height:auto}
html.asen-landscape .inner-page{max-width:1080px;width:100%;margin:0 auto;padding:88px 24px 30px;min-height:100dvh}
html.asen-landscape .page-heading{margin:0 0 18px}
html.asen-landscape .page-heading h1{font-size:28px}
html.asen-landscape .game-list{grid-template-columns:repeat(2,minmax(0,1fr))}
html.asen-landscape .category-tabs{flex-wrap:wrap;overflow:visible}
html.asen-landscape .form-card{max-width:680px}
html.asen-landscape .account-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
html.asen-landscape .sheet{max-height:90dvh;overflow-y:auto;max-width:min(600px,88vw)}
html.asen-landscape .profile-card{margin-top:15px}
@media(orientation:landscape) and (max-width:760px){
 html.asen-landscape .bottom-nav{width:60px;padding:8px 3px;gap:5px}
 html.asen-landscape .topbar{height:62px;padding:5px 12px;gap:10px}
 html.asen-landscape .brand-symbol{width:39px;height:39px;flex-basis:39px}
 html.asen-landscape .brand-copy strong{font-size:17px}
 html.asen-landscape .brand-domain{font-size:11px}
 html.asen-landscape .brand-copy{height:38px}
 html.asen-landscape .action-grid{grid-template-columns:repeat(4,64px);gap:4px}
 html.asen-landscape .action-grid .header-action{font-size:10px}
 html.asen-landscape .inner-page{padding-top:78px}
 html.asen-landscape .hero-copy h1{font-size:20px!important}
}

/* Nine shortcuts stay in the scrolling content column, beside the pinned
   banner. Their 3 × 3 grid never passes beneath either fixed navigation rail. */
html.asen-landscape .home-page>.page-footer{grid-column:2;margin:4px 0 0;padding:14px 0;scroll-margin-top:calc(var(--asen-landscape-header) + 8px)}
html.asen-landscape .page-footer nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
html.asen-landscape .page-footer h2{margin-bottom:10px!important}
html.asen-landscape .page-footer nav button{min-height:58px;padding:6px 4px;font-size:11px;line-height:1.25;text-align:center}
html.asen-landscape .page-footer nav button::before{width:18px;height:18px;margin:0 auto 4px}
html.asen-landscape .page-footer .footer-support{margin-top:10px;min-height:36px;padding:6px 12px}
html.asen-landscape .brand-domain-row{min-width:0;max-width:140px}
html.asen-landscape .brand-domain-row .brand-domain{width:110px}
html.asen-landscape .brand-domain-row .asen-copy-button{flex:none}
/* Preserve the existing game-host navigation hiding behavior. */
html.asen-landscape body.in-game .topbar,html.asen-landscape body.in-game .bottom-nav{display:none}
@media(orientation:landscape) and (min-width:900px){
 html.asen-landscape .category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 html.asen-landscape .category-card{min-height:160px}
 html.asen-landscape .category-card-art{width:88%;height:76%;bottom:0}
 html.asen-landscape .category-card strong{font-size:15px}
}

/* Shared center axes keep icons and labels inside their own buttons. */
html.asen-landscape .bottom-nav button:not(.nav-recharge){display:grid;grid-template-rows:24px 16px;align-content:center;justify-items:center;row-gap:5px;padding:5px 2px}
html.asen-landscape .bottom-nav button:not(.nav-recharge)>span{display:grid;place-items:center;width:24px;height:24px;margin:0}
html.asen-landscape .bottom-nav button small{display:block;width:100%;text-align:center;justify-self:center;margin:0}
html.asen-landscape .bottom-nav .nav-recharge{height:66px;min-height:66px;margin:0}
html.asen-landscape .bottom-nav .nav-recharge .nav-recharge-art{left:50%;top:2px;margin-left:-21px;transform:none}
html.asen-landscape .bottom-nav .nav-recharge small{left:0;bottom:1px;width:100%;text-align:center}
html.asen-landscape .quick-grid button{display:grid;grid-template-rows:24px minmax(14px,auto);align-content:center;justify-items:center;row-gap:5px;min-height:64px;text-align:center}
html.asen-landscape .quick-grid button>span{display:grid;place-items:center;width:24px;height:24px;margin:0}
html.asen-landscape .quick-grid button>small{display:block;width:100%;margin:0;text-align:center;line-height:1.25}
html.asen-landscape .header-action{align-items:center;justify-content:center;text-align:center}
html.asen-landscape .header-action>[data-ui-icon]{display:grid;place-items:center;flex:none;margin:0;width:17px;height:17px}
html.asen-landscape .header-action>span:last-child{margin:0;text-align:center;align-self:center}
html.asen-landscape .service-strip button{align-items:center}
html.asen-landscape .service-strip button>[data-ui-icon]{display:grid;place-items:center;flex:none;width:20px;height:20px;margin:0}

/* Each fixed region reserves its own space; safe-area insets do not consume
   the game's scrollable content or the right-hand navigation hit targets. */
html.asen-landscape{--asen-safe-left:env(safe-area-inset-left,0px);--asen-safe-right:env(safe-area-inset-right,0px);--asen-safe-bottom:env(safe-area-inset-bottom,0px);--asen-landscape-rail:calc(88px + var(--asen-safe-right));--asen-landscape-header:70px;--asen-landscape-gutter:18px;--asen-landscape-gap:22px;--asen-landscape-hero:min(38vw,calc(100dvh - var(--asen-landscape-header) - 32px - var(--asen-safe-bottom)),360px)}
html.asen-landscape .topbar{padding-left:calc(16px + var(--asen-safe-left))}
html.asen-landscape .home-page.active{padding-left:calc(var(--asen-landscape-gutter) + var(--asen-safe-left));padding-bottom:calc(28px + var(--asen-safe-bottom))}
html.asen-landscape .inner-page{padding-bottom:calc(30px + var(--asen-safe-bottom))}
@media(orientation:landscape) and (max-width:760px){html.asen-landscape{--asen-landscape-rail:calc(72px + var(--asen-safe-right));--asen-landscape-header:62px;--asen-landscape-gutter:12px;--asen-landscape-gap:14px}html.asen-landscape .topbar{padding-left:calc(12px + var(--asen-safe-left))}}
@media(orientation:landscape) and (max-height:360px){html.asen-landscape .bottom-nav{padding-top:8px;padding-bottom:8px;gap:4px}html.asen-landscape .bottom-nav button:not(.nav-recharge){height:42px;min-height:42px}}
@media(orientation:landscape) and (max-height:360px){
 html.asen-landscape .bottom-nav button:not(.nav-recharge){grid-template-rows:22px 14px;row-gap:2px;padding:2px}
 html.asen-landscape .bottom-nav button:not(.nav-recharge)>span{width:22px;height:22px}
}



/* 横屏滚动卡片使用内容列宽度，避免保存的竖屏位移挤入右侧导航。 */
html.asen-landscape #popularGames{min-width:0;max-width:100%;width:100%;box-sizing:border-box;translate:none!important;scale:none!important;transform:none!important}
html.asen-landscape #popularGames .popular-viewport{min-width:0;max-width:100%;overflow:hidden}
html.asen-landscape #memberTicker{left:calc(5% + var(--asen-safe-left));right:calc(var(--asen-landscape-rail) + 18px);width:auto;max-width:none;transform:none}
