/* NEW300-P2 official template allocation brand layer. */
:root{--p2-brand-primary:#4e73ff;--p2-brand-secondary:#0c173a;--p2-brand-accent:#c3d1ff}
img[src*="p2-brand/logo.svg"],.brand-logo-image,.p2-brand-logo{object-fit:contain!important;object-position:left center!important;max-width:100%!important;background:transparent!important;box-shadow:none!important}
[class*="logo"],[class*="brand"]{overflow-wrap:anywhere}
/* PH-TPL-01 keeps its original B + brand-name header treatment on every route. */
.lg-brand img,.rv-brand img{display:none!important}
.lg-brand::before,.rv-brand::before{content:"B";display:grid;place-items:center;width:22px;height:22px;flex:0 0 22px;border-radius:6px;color:#fff;background:linear-gradient(135deg,#ffcb14,#ffa900);font-size:14px;font-weight:900;line-height:1}
/* The editable App SVG is taller than the source WebP. Keep both hero assets inside the real mobile Hero height. */
.ad-hero-art{overflow:hidden!important}
.ad-phone[src*="app-phone.svg"]{top:4px!important;right:3px!important;width:auto!important;height:156px!important;max-width:100%!important;object-fit:fill!important}
.ad-download-icon{left:0!important;width:44px!important;height:44px!important}
/* PH-TPL-01: one shared floating bottom navigation for Home, Login, App, Bonus and Review. */
body:has(.p2-bottom-nav){padding-bottom:calc(62px + env(safe-area-inset-bottom))!important}
.p2-bottom-nav{position:fixed!important;z-index:80!important;left:50%!important;bottom:0!important;transform:translateX(-50%)!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;width:min(100%,660px)!important;min-height:calc(62px + env(safe-area-inset-bottom))!important;border-top:1px solid #edf0f4!important;padding:5px 9px calc(4px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.98)!important;box-shadow:0 -8px 22px rgba(16,24,40,.08)!important}
.p2-bottom-nav a{display:flex!important;min-width:0!important;min-height:52px!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;border-radius:7px!important;color:#101828!important;font-size:10px!important;font-weight:700!important;line-height:1!important;text-decoration:none!important}
.p2-bottom-nav a[aria-current="page"]{color:#ffbf00!important}
.p2-bottom-nav svg{width:20px!important;height:20px!important;flex:0 0 20px!important;fill:currentColor!important}
/* PH-TPL-02: keep the fixed bottom navigation identical on light and dark routes. */
.page[data-theme="dark"] .bottom-nav{background:#fff!important;border-color:#e7eaf1!important;box-shadow:0 -5px 18px rgba(0,0,0,.08)!important}
.page[data-theme="dark"] .bottom-nav a{color:#12141b!important}
.page[data-theme="dark"] .bottom-nav [aria-current="page"]{color:#f5ad00!important}
.tpl2-phone .bottom-nav{background:#fff!important;border-color:#e7eaf1!important;box-shadow:0 -5px 18px rgba(0,0,0,.08)!important}
.tpl2-phone .bottom-nav a{color:#12141b!important}
.tpl2-phone .bottom-nav [aria-current="page"],.tpl2-phone .bottom-nav [aria-current="page"] span{color:#f5ad00!important}
/* PH-TPL-02: App and Bonus share a dark header. Keep its action group off the right edge. */
.page[data-page="app"] .top-actions,.page[data-page="bonus"] .top-actions{margin-right:12px!important}
/* PH-TPL-02: fade the baked Bonus hero canvas into the dark hero instead of leaving a blue rectangle. */
.page[data-page="bonus"] .bonus-hero .hero-art{mask-image:radial-gradient(ellipse 74% 88% at 56% 50%,#000 56%,rgba(0,0,0,.78) 73%,transparent 100%)!important;-webkit-mask-image:radial-gradient(ellipse 74% 88% at 56% 50%,#000 56%,rgba(0,0,0,.78) 73%,transparent 100%)!important}
/* PH-TPL-04: Home, Games and the three section pages share one fixed mobile navigation. */
body:has(.p2-tpl4-bottom-nav){padding-bottom:104px!important}
.p2-tpl4-bottom-nav{position:fixed!important;z-index:80!important;left:50%!important;bottom:0!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;width:var(--canvas-width,864px)!important;height:102px!important;padding:8px 34px 5px!important;border-top:1px solid #29343a!important;background:#061015!important;box-shadow:0 -7px 18px rgba(0,0,0,.22)!important;transform:translateX(-50%)!important}
.p2-tpl4-bottom-nav a{display:flex!important;min-width:0!important;min-height:88px!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;color:#fff!important;font-size:14px!important;font-weight:700!important;line-height:1!important;text-decoration:none!important}
.p2-tpl4-bottom-nav a[aria-current="page"]{color:#ffc21a!important}
.p2-tpl4-bottom-nav svg{width:31px!important;height:31px!important;flex:0 0 31px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
