/* Opt-in shell: the hero retains its full viewport. No content-height offset. */
html,body{background-color:#000!important;color-scheme:dark!important}
/* Cover the device safe area independently of the cycling navigation surface. */
body::before,.site-navigation-immersive .site-menu::before{content:'';position:fixed;top:0;left:0;right:0;height:max(1px,env(safe-area-inset-top,0px));background:#000;pointer-events:none;z-index:2147483647}
.site-navigation-immersive{--nav-height:calc(56px + env(safe-area-inset-top,0px));--nav-ink:var(--page-neutral,#fff);--nav-accent:var(--page-primary,#80f5ff)}
.site-navigation-immersive [data-site-shell],.site-navigation-immersive [data-site-shell] :is(button,a,summary){font-family:ShowcaseManrope,Arial,sans-serif}
.site-navigation-immersive [data-site-shell] :is(button,a,summary):focus-visible{outline:2px solid var(--nav-accent);outline-offset:3px}
.site-navigation-immersive .site-header{background:transparent;border:0;color:var(--nav-ink);isolation:isolate}
.site-navigation-immersive .site-header::before{content:'';position:absolute;inset:0 4px;z-index:-1;background:var(--page-background,#24115d);border-bottom:1px solid var(--page-secondary,#dfb7ff);border-radius:0 0 16px 16px;opacity:0;transition:opacity 180ms ease}
.site-navigation-immersive[data-scrolled=true] .site-header::before{opacity:1}
.site-navigation-immersive .site-header-inner{height:var(--nav-height);grid-template-columns:72px minmax(0,1fr) 72px;gap:0;max-width:1200px;padding:env(safe-area-inset-top,0px) max(14px,env(safe-area-inset-right,0px)) 0 max(14px,env(safe-area-inset-left,0px))}
.site-navigation-immersive [data-site-shell] .site-brand{font-family:Georgia,'Times New Roman',serif;font-size:20px;letter-spacing:-.045em;line-height:1;min-height:44px;color:var(--page-primary,#80f5ff)}
.site-navigation-immersive [data-site-shell] .site-icon-button{color:inherit;border-radius:50%;background:transparent}
.site-navigation-immersive .site-header .site-icon-button{justify-self:start;width:44px;color:var(--page-secondary,#dfb7ff)}
.site-navigation-immersive .site-header svg{width:22px;height:22px;stroke-width:1.7}
.site-navigation-immersive .site-header #account-button:not([hidden]){border:0;background:transparent;box-shadow:none;color:inherit;border-radius:999px;width:auto;padding:0 8px;font-size:13px;font-weight:700;min-height:44px}
.site-navigation-immersive .site-header #account-button:not([hidden]) .account-action-label{border-bottom:1px solid currentColor;padding-bottom:3px}
.site-navigation-immersive .site-menu{width:min(360px,calc(100% - 32px));height:100dvh;max-height:100dvh;padding:max(12px,env(safe-area-inset-top,0px)) 22px max(20px,env(safe-area-inset-bottom,0px));border:0;border-right:4px solid #000;border-radius:0 22px 22px 0;background:var(--page-background,#24115d);color:var(--page-neutral,#fff);box-shadow:14px 0 50px #0004;scrollbar-width:none;color-scheme:dark}
.site-navigation-immersive .site-menu::-webkit-scrollbar{display:none}
.site-navigation-immersive .site-menu::backdrop{background:#0009;backdrop-filter:blur(5px)}
.site-navigation-immersive .site-menu[open]{animation:site-navigation-arrive 200ms ease-out}
.site-navigation-immersive .site-menu-heading{margin-bottom:20px;gap:8px}
.site-navigation-immersive .site-menu-heading .site-brand{font-size:23px;justify-self:start}
.site-navigation-immersive .site-menu-heading .site-icon-button{color:var(--page-neutral)}
.site-navigation-immersive .site-menu-links>a,.site-navigation-immersive .site-product-links>a{display:flex;align-items:center;min-height:46px;border-radius:10px;padding:10px 12px;font-size:17px;font-weight:700;line-height:1.3;color:var(--page-neutral)}
.site-navigation-immersive .site-product-group{border:0;margin:2px 0 8px}
.site-navigation-immersive .site-product-group summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:10px 12px;font-size:17px;font-weight:700;cursor:pointer;list-style:none;touch-action:manipulation}
.site-navigation-immersive .site-product-group summary::-webkit-details-marker{display:none}
.site-navigation-immersive .site-product-group summary svg{width:18px;height:18px;transition:transform 160ms ease}
.site-navigation-immersive .site-product-group[open] summary svg{transform:rotate(180deg)}
.site-navigation-immersive .site-product-links{display:grid;gap:3px;padding-left:10px}
.site-navigation-immersive .site-product-links>a{font-size:16px;font-weight:500;border:1px solid transparent}
.site-navigation-immersive .site-menu a[aria-current=page]{border:1px solid var(--page-primary);color:var(--page-primary);background:transparent;font-weight:700}
.site-navigation-immersive .site-menu-divider{margin:12px 0;background:var(--page-neutral);opacity:.16}
.site-navigation-immersive .site-menu-footer{margin-top:16px;padding-top:14px;border-color:color-mix(in srgb,var(--page-neutral),transparent 82%)}
.site-navigation-immersive .site-menu-footer nav{gap:0 16px}
.site-navigation-immersive .site-menu-footer nav a{color:var(--page-neutral);font-size:13px;min-height:44px}
.site-navigation-immersive .site-menu-account{min-height:46px;margin-top:10px;border:1px solid var(--page-primary);border-radius:999px;background:transparent;color:var(--page-primary);font-size:14px}
.site-navigation-fallback{position:fixed;inset:0 0 auto;z-index:120;display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:var(--page-background,#24115d);color:var(--page-neutral,#fff);min-height:56px;border-bottom:1px solid var(--page-secondary,#dfb7ff)}
.site-navigation-fallback a{color:inherit;font:700 13px ShowcaseManrope,Arial,sans-serif;padding:10px 0}
@media(hover:hover){.site-navigation-immersive [data-site-shell] :is(.site-icon-button,.site-account,.site-menu-links>a,.site-product-links>a,summary):hover{background:color-mix(in srgb,currentColor,transparent 93%);color:inherit}}
@media(max-width:360px){.site-navigation-immersive .site-header-inner{grid-template-columns:60px minmax(0,1fr) 60px;padding-left:10px;padding-right:10px}.site-navigation-immersive .site-header .site-brand{font-size:18px}.site-navigation-immersive .site-header #account-button:not([hidden]){font-size:12px;padding:0 4px}}
/* Outside portrait the showcase is narrow, so navigation sits over the black surround. */
@media(orientation:landscape){.site-navigation-immersive .site-header::before{opacity:1}}
@media(prefers-reduced-motion:reduce){.site-navigation-immersive .site-menu[open]{animation:none}}
@keyframes site-navigation-arrive{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:translateX(0)}}
