/* Approved illuminated header. All dimensions below apply only to shared navigation. */
html body #header.zh-header{
 --zh-clearance:76px;--zh-logo:166px;--zh-height:76px;--zh-ease:cubic-bezier(.22,.8,.28,1);
 --zh-edge:#69efff;--zh-near:#00caff;--zh-bloom:#007aff;
 position:fixed;inset:0 0 auto;z-index:60;display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr) auto;
 align-items:center;gap:clamp(8px,1.1vw,20px);width:auto;max-width:none;height:var(--zh-height);min-height:0;
 margin:0;box-sizing:border-box;padding:6px clamp(20px,2.4vw,42px);border:0;border-radius:0;
 background:transparent;color:#f7fbff;isolation:isolate;overflow:visible;transform:none;translate:none;scale:none;opacity:1;
 transition:inset 400ms var(--zh-ease),height 400ms var(--zh-ease),border-radius 400ms var(--zh-ease),padding 400ms var(--zh-ease);
}
html body #header.zh-header.is-stuck{inset:8px 2% auto;--zh-height:68px;--zh-logo:156px;border-radius:0}
html body #header.zh-header::before{
 content:"";position:absolute;inset:0;z-index:-1;border:2px solid transparent;border-radius:inherit;opacity:1;pointer-events:none;backdrop-filter:none;
 background:linear-gradient(180deg,#102d49 0%,#061b32 22%,#031429 77%,#08243e) padding-box,linear-gradient(135deg,#b0d6f0,#277fc4 10%,#133e63 40%,#8adaff 70%,#0c365a 95%) border-box;
 box-shadow:inset 0 1px 0 #e4f6ff66,inset 0 0 0 2px #010c1fa8,inset 0 -3px 0 #000b1c99,0 3px 0 #062441,0 0 0 1px #56bfff55,0 6px 14px #000d2028;
 transition:box-shadow 400ms var(--zh-ease);
}
html body #header.zh-header.is-stuck::before{box-shadow:inset 0 1px 0 #effaff66,inset 0 0 0 2px #010c1fa8,inset 0 -3px 0 #000b1c99,0 3px 0 #062441,0 0 0 1px #56bfff55,0 10px 24px #00112940}
/* Neon bloom around the bar; only its opacity breathes, so the glow stays on the compositor. */
html body #header.zh-header::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:.6;will-change:opacity;
 box-shadow:0 0 0 1px #69efff40,0 0 8px #00caff33,0 3px 12px #007aff26}
/* Lit hairline on the top edge plus two travelling sparks that run the bar's edges. */
html body #header.zh-header .zh-glow{position:absolute;inset:0;z-index:0;display:block;overflow:hidden;pointer-events:none;border-radius:inherit;
 background:linear-gradient(90deg,transparent,#98e3ff77 25%,#fff 48%,#56c6ff77 60%,transparent) 50% 1px/76% 1px no-repeat}
html body #header.zh-header .zh-glow::before,html body #header.zh-header .zh-glow::after{content:"";position:absolute;left:0;width:26%;height:8px;opacity:0;transform:translateX(-100%);will-change:transform,opacity;
 background:radial-gradient(50% 50% at 50% 50%,#fff 0,var(--zh-edge) 22%,#00caff70 48%,transparent 72%)}
html body #header.zh-header .zh-glow::before{bottom:-2px}
html body #header.zh-header .zh-glow::after{top:-3px;width:20%}
html body #header.zh-header>*{min-width:0}
html body #header.zh-header>.header-route{display:none!important}
html body #header.zh-header .logo{display:block;position:relative;isolation:isolate;grid-column:1;width:var(--zh-logo);max-width:none;padding:0;margin:0;transition:width 400ms var(--zh-ease);line-height:0}
html body #header.zh-header .logo img{display:block;width:100%;height:auto;max-height:56px;object-fit:contain;transform:none;filter:drop-shadow(0 0 1px #9eeaff99);transition:filter 250ms ease,transform 250ms ease}
/* Lit sign: a blurred copy of the logo's own artwork sits behind it as the glow,
   and a light sweep masked to the letters passes over the face. */
html body #header.zh-header .logo::before,html body #header.zh-header .logo::after{content:"";position:absolute;inset:0;pointer-events:none;
 background:url("/assets/header/logo-illuminated-lossless.webp") center/contain no-repeat}
html body #header.zh-header .logo::before{z-index:-1;inset:-2% -1%;filter:blur(6px) brightness(1.15) saturate(1.2);opacity:.35;will-change:opacity}
html body #header.zh-header .logo::after{z-index:1;opacity:0;mix-blend-mode:screen;
 background:linear-gradient(105deg,transparent 40%,#e9fbff66 50%,transparent 60%) 120% 0/300% 100% no-repeat;
 -webkit-mask:url("/assets/header/logo-illuminated-lossless.webp") center/contain no-repeat;mask:url("/assets/header/logo-illuminated-lossless.webp") center/contain no-repeat}
html body #header.zh-header .logo-glow{display:none}
html body #header.zh-header .zh-detail{position:relative;display:block;align-self:stretch;min-width:0;max-height:72px;overflow:hidden;pointer-events:none;user-select:none;opacity:.62;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
html body #header.zh-header .zh-detail img{position:absolute;inset:auto 0 0;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 1px 1px #0008)}
html body #header.zh-header .zh-playfield{grid-column:4;max-width:250px;width:100%;justify-self:center}
html body #header.zh-header .nav-bar{grid-column:3;display:flex;position:relative;gap:0;margin:0;padding:0}
html body #header.zh-header .nav-list{position:relative;gap:6px;margin:0;padding:0}
html body #header.zh-header .nav-trigger{font:600 18px/1.2 var(--ds-ui,"Barlow Condensed",sans-serif);letter-spacing:.01em;min-height:44px;padding:8px 13px;color:#e8f3ff;gap:8px;white-space:nowrap;border-radius:10px}
html body #header.zh-header .nav-trigger{transition:color 200ms ease,text-shadow 250ms ease}
html body #header.zh-header .nav-trigger:is(:hover,[aria-expanded="true"],[data-nav-current]){color:#9cecff;text-shadow:0 0 8px #00caffb3,0 0 18px #007aff80}
html body #header.zh-header .nav-trigger:is(:hover,[aria-expanded="true"]) .nav-chevron{filter:drop-shadow(0 0 4px #00caff)}
html body #header.zh-header .nav-chevron{width:13px;height:13px;color:#3dbbff;opacity:1}
html body #header.zh-header .nav-pill{border-radius:10px;background:linear-gradient(#1689ff21,#0062ff12);border-color:#4ebeff33;box-shadow:inset 0 1px 0 #cbebff15}
html body #header.zh-header .header-actions{grid-column:5;display:flex;align-items:center;gap:0;margin:0;position:relative}
html body #header.zh-header .nav-cta,html body #menu.zh-menu .zh-menu-cta{
 display:inline-flex;position:relative;isolation:isolate;align-items:center;justify-content:center;gap:8px;min-height:40px;height:auto;
 padding:8px 14px;border:1px solid #3fb5ff;border-radius:9px;background:linear-gradient(180deg,#087fff,#0059f3);color:#fff;
 font:700 15px/1.25 var(--ds-ui,"Barlow Condensed",sans-serif);letter-spacing:.01em;text-transform:none;white-space:nowrap;
 box-shadow:inset 0 1px 0 #d0f0ff55,inset 0 -2px 0 #0041b9,0 3px 9px #0062ff30;transform:none;clip-path:none;overflow:hidden;
 transition:transform 200ms var(--zh-ease),box-shadow 250ms ease,background 250ms ease;
}
html body #header.zh-header .nav-cta::before,html body #menu.zh-menu .zh-menu-cta::before{display:none}
html body #header.zh-header .nav-cta::after,html body #menu.zh-menu .zh-menu-cta::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,#e5f7ff55 50%,transparent 65%);transform:translateX(-120%)}
html body #header.zh-header .zh-arrow,html body #menu.zh-menu .zh-arrow{display:block;width:15px;height:15px;flex:none;transition:transform 200ms ease}
html body #menu.zh-menu .zh-menu-cta{gap:12px;padding:10px 16px;font-size:16px}
/* Neon halo behind the pilot button; it breathes on opacity only. */
html body #header.zh-header .header-actions::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:9px;pointer-events:none;opacity:.4;will-change:opacity;
 box-shadow:0 0 8px #0a8cff80,0 0 16px #00caff26}
html body #header.zh-header .menu-toggle,html body #menu.zh-menu .menu-close{display:none;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;min-width:44px;padding:0;border:1px solid #6fb5e333;border-radius:9px;color:#a8eaff;background:linear-gradient(#15436a66,#04152a);box-shadow:inset 0 1px 0 #acdfff33;gap:0;flex-direction:row}
html body #header.zh-header .zh-wicket,html body #menu.zh-menu .zh-wicket{display:block;width:32px;height:32px;overflow:visible;filter:drop-shadow(0 0 3px #0099ff40)}
.zh-wicket .zh-stump,.zh-wicket .zh-bail{transform-box:fill-box;transform-origin:center;transition:transform 280ms cubic-bezier(.22,.8,.28,1),opacity 180ms ease}
[aria-expanded="true"] .zh-wicket .zh-stump-left,.zh-menu[open] .menu-close .zh-stump-left{transform:translateX(8px) rotate(45deg)}
[aria-expanded="true"] .zh-wicket .zh-stump-right,.zh-menu[open] .menu-close .zh-stump-right{transform:translateX(-8px) rotate(-45deg)}
[aria-expanded="true"] .zh-wicket .zh-stump-middle,.zh-menu[open] .menu-close .zh-stump-middle{transform:scaleY(.2);opacity:0}
[aria-expanded="true"] .zh-wicket .zh-bail-left,.zh-menu[open] .menu-close .zh-bail-left{transform:translate(-3px,-6px) rotate(-22deg);opacity:0}
[aria-expanded="true"] .zh-wicket .zh-bail-right,.zh-menu[open] .menu-close .zh-bail-right{transform:translate(3px,-6px) rotate(22deg);opacity:0}
html body #header.zh-header :is(a,button):focus-visible,html body #menu.zh-menu :is(a,button):focus-visible{outline:2px solid #a8edff;outline-offset:3px}
html body #header.zh-header .nav-panel{max-height:calc(100dvh - var(--zh-clearance) - 26px);overflow-y:auto;border-color:#72c6ff66;box-shadow:inset 0 1px 0 #b6e4ff44,0 18px 38px #000b2770}
html body #header.zh-header .nav-panel-edge{animation:none}
/* Native dialog contains every destination and the mobile pilot action. */
html body #menu.zh-menu{--zh-ease:cubic-bezier(.22,.8,.28,1);position:fixed;inset:0;width:min(620px,calc(100% - 24px));max-width:none;height:max-content;max-height:calc(100dvh - var(--ui-header,72px) - 28px);margin:calc(var(--ui-header,72px) + 10px) auto auto;padding:0;border:1px solid #4ba4d7;border-radius:18px;background:linear-gradient(155deg,#0d2c49,#031429 65%);color:#f2f7ff;box-shadow:inset 0 1px 0 #badfff66,0 25px 65px #000b2699;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;box-sizing:border-box}
html body #menu.zh-menu::backdrop{background:#000b23b8;backdrop-filter:blur(7px)}
html body #menu.zh-menu .menu-head{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:2;padding:14px 18px;margin:0;border-bottom:1px solid #6caad524;background:#08213af5}
html body #menu.zh-menu .menu-head img{width:164px;height:auto;max-height:55px;object-fit:contain}
html body #menu.zh-menu .menu-close{display:flex;flex:none}
html body #menu.zh-menu .menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px 20px;padding:22px 22px 10px;margin:0;min-width:0}
html body #menu.zh-menu .menu-col{min-width:0}
html body #menu.zh-menu .col-title{font:600 13px/1.3 var(--ds-ui);letter-spacing:.15em;text-transform:uppercase;color:#77d7ff;margin:0 0 8px}
html body #menu.zh-menu ul{padding:0;margin:0;list-style:none}
html body #menu.zh-menu li{margin:0}
html body #menu.zh-menu .menu-col a{display:flex;align-items:center;min-height:44px;padding:8px 0;border:0;color:#f0f6ff;font:500 18px/1.2 var(--ds-ui);overflow-wrap:anywhere;transition:color 180ms ease,transform 180ms ease}
html body #menu.zh-menu .menu-col a:is(:hover,[aria-current="page"]){color:#78dfff;transform:translateX(2px)}
html body #menu.zh-menu .zh-menu-action{padding:10px 22px max(22px,env(safe-area-inset-bottom))}
html body #menu.zh-menu .zh-menu-cta{display:flex;width:100%;min-height:46px}
@media(hover:hover){
 html body #header.zh-header .logo:hover img{filter:drop-shadow(0 0 5px #167ffb65);transform:translateY(-1px)}
 html body #header.zh-header .nav-cta:hover,html body #menu.zh-menu .zh-menu-cta:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 #d0f0ff66,inset 0 -2px 0 #0041b9,0 5px 14px #0062ff60}
 html body #header.zh-header .nav-cta:hover .zh-arrow,html body #menu.zh-menu .zh-menu-cta:hover .zh-arrow{transform:translateX(2px)}
}
html body #header.zh-header .nav-cta:active,html body #menu.zh-menu .zh-menu-cta:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #00256888}
@media(max-width:1150px) and (min-width:1024px){html body #header.zh-header{--zh-logo:154px;gap:6px;padding-inline:20px}html body #header.zh-header.is-stuck{--zh-logo:146px}html body #header.zh-header .nav-trigger{padding-inline:10px}}
@media(max-width:1023px){
 html body #header.zh-header{--zh-clearance:64px;--zh-height:64px;--zh-logo:140px;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;padding:6px max(16px,env(safe-area-inset-left));border-radius:0;max-width:none}
 html body #header.zh-header.is-stuck{--zh-height:60px;--zh-logo:134px;inset:4px 2% auto;border-radius:0}
 html body #header.zh-header .nav-bar,html body #header.zh-header .nav-cta{display:none!important}
 html body #header.zh-header .zh-playfield{display:block;grid-column:2;opacity:.48}
 html body #header.zh-header .header-actions{grid-column:3;margin:0}
 html body #header.zh-header .menu-toggle{display:flex!important;background:linear-gradient(#15436a66,#04152a);border:1px solid #6fb5e333}
}
@media(max-width:380px){html body #header.zh-header{--zh-logo:132px;gap:8px}html body #header.zh-header.is-stuck{--zh-logo:128px}html body #header.zh-header .zh-playfield{opacity:.32}}
@media(max-width:340px){html body #menu.zh-menu .menu-grid{grid-template-columns:1fr;gap:16px}}
@media(prefers-reduced-motion:no-preference){
 /* Living header: the logo switches on like a neon sign, then breathes; sparks run the edges. */
 html body #header.zh-header .logo img{animation:zh-logo-ignite 1.3s ease-out both}
 html body #header.zh-header .logo::before{animation:zh-glow-soft 4.2s ease-in-out 1.3s infinite alternate backwards}
 html body #header.zh-header .logo::after{animation:zh-logo-sweep 7s ease-in-out 1.6s infinite}
 html body #header.zh-header::after{animation:zh-glow-soft 4.2s ease-in-out infinite alternate}
 html body #header.zh-header .zh-glow::before{animation:zh-spark-run 7s linear 0.4s infinite}
 html body #header.zh-header .zh-glow::after{animation:zh-spark-run 9s linear -3s infinite reverse}
 html body #header.zh-header .header-actions::before{animation:zh-glow-breathe 2.8s ease-in-out infinite alternate}
 html body #header.zh-header .nav-cta::after{animation:zh-button-sheen-idle 6s ease-in-out 2.2s infinite}
 body.v7-document-hidden #header.zh-header :is(.logo,.zh-glow,.header-actions,.nav-cta)::before,body.v7-document-hidden #header.zh-header :is(.logo,.zh-glow,.nav-cta)::after,body.v7-document-hidden #header.zh-header::after{animation-play-state:paused}
 html body #header.zh-header .nav-cta:is(:hover,:focus-visible)::after,html body #menu.zh-menu .zh-menu-cta:is(:hover,:focus-visible)::after{animation:zh-button-sheen 750ms ease-out both}
 html body #menu.zh-menu[data-state="open"]{animation:zh-menu-in 260ms var(--zh-ease) both}
 html body #menu.zh-menu[data-state="closing"]{animation:zh-menu-out 150ms ease both}
 html body #menu.zh-menu[data-state="open"] .menu-close .zh-bail{animation:zh-bail-off 320ms ease-out both}
}
@keyframes zh-logo-ignite{0%{opacity:.25}12%{opacity:.9}16%{opacity:.35}24%{opacity:1}28%{opacity:.6}40%,100%{opacity:1}}
@keyframes zh-glow-breathe{from{opacity:.4}to{opacity:.8}}
@keyframes zh-glow-soft{from{opacity:.25}to{opacity:.55}}
@keyframes zh-logo-sweep{0%{opacity:0;background-position:100% 0}8%{opacity:1}30%{opacity:1;background-position:0 0}36%,100%{opacity:0;background-position:0 0}}
@keyframes zh-spark-run{0%{transform:translateX(-100%);opacity:0}8%{opacity:1}92%{opacity:1}100%{transform:translateX(480%);opacity:0}}
@keyframes zh-button-sheen-idle{0%,70%{transform:translateX(-120%)}90%,100%{transform:translateX(120%)}}
@keyframes zh-button-sheen{to{transform:translateX(120%)}}
@keyframes zh-menu-in{from{opacity:0;transform:translateY(-8px) scale(.99)}to{opacity:1;transform:none}}
@keyframes zh-menu-out{to{opacity:0;transform:translateY(-5px)}}
@keyframes zh-bail-off{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-8px)}}
@media(prefers-reduced-motion:reduce){html body #header.zh-header,html body #header.zh-header *,html body #header.zh-header::before,html body #header.zh-header::after,html body #menu.zh-menu,html body #menu.zh-menu *,html body #menu.zh-menu *::after{animation:none!important;transition:none!important}}
/* Native fallback retains a navigable site index without script. */
html:not(.js) body #header.zh-header .menu-toggle{display:none!important}
html:not(.js) body #header.zh-header .nav-bar{display:none!important}
html:not(.js) body #menu.zh-menu{display:block;position:static;width:calc(100% - 32px);max-height:none;margin:24px auto}
html:not(.js) body #menu.zh-menu .menu-close{display:none}
