/* jackalmuse v107 — approved artwork, independently sized; no global raster stretching. */
:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#e9edf5;background:#03050d;--ink:#01040a;--edge:rgba(46,194,255,.66);--icon:clamp(3rem,calc((100svh - 33.75rem)/5),5.25rem)}
html,body{overscroll-behavior-y:none}
*{box-sizing:border-box}body{margin:0;min-width:280px}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #74ecca;outline-offset:4px}button{touch-action:manipulation}
[hidden]{display:none!important}.visually-hidden,.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:12px;top:10px;transform:translateY(-160%);z-index:100;padding:12px;background:#030811;border:1px solid #65e6d5;border-radius:8px}.skip-link:focus{transform:none}
.wallpaper{position:fixed;inset:0 0 auto;height:100vh;height:100lvh;z-index:-1;overflow:hidden;pointer-events:none;background:#03050d url('assets/home-midnight-wallpaper-v1.webp') center/cover no-repeat;isolation:isolate}
.wallpaper:before,.wallpaper:after{content:'';position:absolute;inset:-5%;background:url('assets/home-midnight-wallpaper-v1.webp') center/cover no-repeat;will-change:transform;transform-origin:50% 50%}
.wallpaper:before{animation:smoke-flow 18s ease-in-out -6s infinite alternate}
.wallpaper:after{opacity:.16;mix-blend-mode:screen;animation:smoke-counterflow 25s ease-in-out -13s infinite alternate}
.wallpaper.is-webgl:before,.wallpaper.is-webgl:after{visibility:hidden;animation-play-state:paused}
.wallpaper.is-paused:before,.wallpaper.is-paused:after{animation-play-state:paused}
.wallpaper__colour{position:absolute;inset:0;z-index:2;pointer-events:none;mix-blend-mode:color;opacity:.18;background:linear-gradient(110deg,#f02abb 0%,#bd32ed 25%,#7746e8 44%,#2563ee 60%,#20cf9c 80%,#1965e7 100%)}
.wallpaper__canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;z-index:1}.wallpaper__canvas.is-ready{opacity:1}
@keyframes smoke-flow{from{transform:translate(-1.6%,1.2%) rotate(-1deg) scale(1.015)}to{transform:translate(1.6%,-1.2%) rotate(1deg) scale(1.025)}}
@keyframes smoke-counterflow{from{transform:translate(2%,-1.4%) rotate(1.4deg) scale(1.03)}to{transform:translate(-2%,1.4%) rotate(-1.4deg) scale(1.015)}}
.site-shell{width:100%;min-height:100vh;min-height:100svh;min-height:100dvh;padding:max(8px,env(safe-area-inset-top)) 14px max(8px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px}
/* Shared spare space keeps the content centred and the footer at the page bottom. */
.site-shell>.hero,.site-shell>.socials,.site-shell>.site-footer{flex-shrink:0}.site-shell>.hero{margin-top:auto}
.hero{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.site-nav{position:relative;z-index:10}.menu-button{border:0;background:none;color:#eaf6fa;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;border-radius:12px;width:clamp(120px,18svh,175px)}
/* Dedicated alpha artwork replaces the opaque old-page crop; button geometry and behaviour are unchanged. */
.controller-art{display:block;width:100%;aspect-ratio:347/184;background:url('assets/controller-transparent-v1.png') center/100% 100% no-repeat;transition:transform 160ms ease}
.menu-button{position:relative;isolation:isolate}
.menu-button:before{content:'';position:absolute;left:10%;right:10%;bottom:16%;height:35%;z-index:-1;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse,rgba(83,231,255,.65),rgba(125,72,255,.36) 42%,transparent 73%);opacity:.12;transform:translateY(6px) scale(.85);transition:opacity 180ms ease,transform 220ms ease}
.controller-art{transition:transform 220ms cubic-bezier(.2,.8,.2,1),filter 220ms ease;transform-origin:50% 60%}
.menu-button[aria-expanded=true] .controller-art,.menu-button:focus-visible .controller-art{transform:translateY(-3px) scale(1.055);filter:brightness(1.12) drop-shadow(0 5px 7px #7754ff88)}
.menu-button[aria-expanded=true]:before,.menu-button:focus-visible:before{opacity:1;transform:translateY(7px) scale(1.18)}
.menu-button:active .controller-art{transform:translateY(1px) scale(.97);filter:brightness(1.2)}
.menu-button:active:before{opacity:1;transform:translateY(4px) scale(1.05)}
@media(hover:hover){.menu-button:hover .controller-art{transform:translateY(-3px) scale(1.055);filter:brightness(1.12) drop-shadow(0 5px 7px #7754ff88)}.menu-button:hover:before{opacity:1;transform:translateY(7px) scale(1.18)}}
.menu-caption{text-transform:uppercase;letter-spacing:.28em;font-size:.75rem;line-height:1.6;display:flex;gap:12px;align-items:center}.menu-caption:before,.menu-caption:after{content:'';width:20px;height:1px;background:linear-gradient(90deg,transparent,#41c9d8)}.menu-caption:after{transform:rotate(180deg)}
.glass{background:linear-gradient(145deg,rgba(3,7,14,.99),rgba(0,2,7,.99));border:1px solid var(--edge);box-shadow:inset 0 1px 5px rgba(100,167,220,.10),0 3px 15px rgba(0,0,0,.35)}
.status{display:flex;align-items:center;justify-content:center;gap:12px;padding:5px 15px;border-color:rgba(132,161,208,.66);border-radius:30px;text-transform:uppercase;letter-spacing:.17em;font-size:.69rem;white-space:nowrap;line-height:1.25}.status__eye{position:relative;display:block;flex:none;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle,#fff2ee 0 13%,#ff654a 20%,#fa080a 48%,#8d0003 68%);box-shadow:0 0 0 2px #1b0107,0 0 0 3px #902224,0 0 10px #ee10177a;animation:status-pulse 2.2s ease-in-out infinite}.status__eye:after{content:'';position:absolute;inset:-7px;border-radius:50%;background:radial-gradient(circle,#ff192260,transparent 68%);animation:eye-halo 2.2s ease-in-out infinite}
.topics{margin:2px 0 0;font-size:clamp(1rem,2.1svh,1.2rem);font-weight:300;line-height:1.38;letter-spacing:.11em}.jackal-emblem{display:block;width:clamp(64px,10svh,96px);height:auto;aspect-ratio:1;overflow:visible}
.socials{position:relative;width:clamp(286px,68vw,374px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-radius:21px;padding:5px 7px;isolation:isolate;box-shadow:inset 0 0 14px #14578315,0 0 11px #0676c912,0 9px 30px #0006;scroll-margin-top:12px}
.socials{margin-top:clamp(10px,1.5svh,16px)}
.social{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2px 4px 4px;position:relative;text-decoration:none;border-top:1px solid #558fbd35;line-height:1.12;transition:background-color 180ms ease}.social:nth-of-type(-n+2){border-top:0}.social:nth-of-type(odd){border-right:1px solid #558fbd35}.social:hover{background-color:#0b1d283f}.social:focus-visible{z-index:2;border-radius:7px;outline-offset:-3px}
.social__art{display:block;flex-shrink:0;width:var(--icon);aspect-ratio:1;background-image:url('assets/social-emblems-v107.webp');background-repeat:no-repeat;background-size:519.444444% auto;mix-blend-mode:screen;transition:transform 160ms ease}.social:hover .social__art{transform:scale(1.045)}
.social__art--psn{background-position:1.8543% 9.3555%}.social__art--tiktok{background-position:25.9603% 9.3555%}.social__art--x{background-position:49.6689% 9.3555%}.social__art--github{background-position:73.1788% 9.3555%}.social__art--suno{background-position:97.351% 9.3555%}.social__art--youtube{background-position:1.8543% 85.239%}.social__art--paypal{background-position:25.9603% 85.239%}.social__art--pinterest{background-position:49.6689% 85.239%}.social__art--facebook{background-position:73.1788% 85.239%}.social__art--instagram{background-position:97.351% 85.239%}
.social__platform{font-size:.75rem;letter-spacing:.115em;font-weight:400;text-transform:uppercase;line-height:1.25}.social__handle{font-size:.75rem;letter-spacing:.035em;line-height:1.35;color:#d8e5ee}.site-footer{margin-top:auto;padding-top:12px;display:flex;justify-content:center;width:100%}.site-footer>span{font-size:.73rem;letter-spacing:.14em;border-radius:30px;padding:5px 16px;border-color:#539bbc9a;line-height:1.2}
@keyframes status-pulse{0%,100%{opacity:.62;transform:scale(.92);box-shadow:0 0 0 2px #1b0107,0 0 0 3px #902224,0 0 5px #ff142866}50%{opacity:1;transform:scale(1.08);box-shadow:0 0 0 2px #1b0107,0 0 0 3px #d02a2a,0 0 15px #ff1428cc}}
@keyframes eye-halo{0%,100%{opacity:.3}50%{opacity:1}}
/* Established menu architecture and destinations; the panel overlays, never pushes, the homepage. */
.menu-panel{position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);width:min(310px,calc(100vw - 32px));max-height:calc(100svh - 165px);overflow:auto;overscroll-behavior:contain;padding:9px;background:linear-gradient(140deg,#030710,#00030a);border:1px solid #368caa;box-shadow:0 12px 34px #000b,inset 0 1px 5px #71b5cf18;border-radius:19px;text-align:left;scrollbar-width:thin;scrollbar-color:#225c7b transparent}
.menu-list{padding:0;margin:0;list-style:none}.menu-list>li+li{border-top:1px solid #30405255}.menu-item,.menu-category__button,.submenu-item{display:flex;width:100%;min-height:44px;align-items:center;justify-content:space-between;gap:10px;border:0;border-radius:7px;padding:10px 12px;color:#d8e0ee;background:transparent;text-decoration:none;text-transform:uppercase;font-size:.83rem;letter-spacing:.115em;text-align:left;cursor:pointer}.menu-item:hover,.menu-category__button:hover,.submenu-item:hover{background:#13252f90;color:white}.menu-item:after,.submenu-item:after{content:'';width:5px;height:5px;flex-shrink:0;border-radius:50%;background:#b68aff;box-shadow:0 0 6px #864eff80}.menu-category__chevron{width:8px;height:8px;border-top:1px solid #83deff;border-right:1px solid #83deff;filter:drop-shadow(0 0 3px #39b9ff)}.menu-back{position:sticky;top:-9px;z-index:1;display:block;min-height:44px;width:100%;border:0;border-bottom:1px solid #30405288;background:#040810;color:#cbe5ee;text-align:left;padding:8px 12px;font-size:.8rem;letter-spacing:.12em;cursor:pointer}.menu-view__title,.submenu-heading{padding:15px 12px 7px;color:#85b6c4;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase}.menu-view__title{color:#e2e9f1}.submenu-item[aria-disabled=true]{color:#798594;cursor:default}.submenu-item[aria-disabled=true]:after{background:#465063;box-shadow:none}.submenu-item[aria-disabled=true]:hover{background:transparent}
@media(min-width:700px){.site-shell{gap:6px}.socials{width:374px}.hero{gap:4px}}
@media(max-height:720px){:root{--icon:2.9rem}.hero{gap:4px}.site-shell{gap:5px}.menu-button{width:112px}.jackal-emblem{width:64px}.topics{font-size:1rem}.status{padding:5px 12px}.social{padding-top:1px;padding-bottom:3px}}
@media(max-width:340px){.socials{width:100%}.status{font-size:.625rem;letter-spacing:.1em}.social__platform{letter-spacing:.07em}.social__handle{letter-spacing:0}}
@media(prefers-reduced-motion:reduce){.wallpaper:before,.wallpaper:after{animation:none;transform:none}.wallpaper__canvas{display:none}.wallpaper.is-webgl:before,.wallpaper.is-webgl:after{visibility:visible}.controller-art,.menu-button:before,.social__art{transition:none}.menu-button .controller-art{transform:none!important}.status__eye{animation:status-pulse-reduced 2.2s ease-in-out infinite}}
@keyframes status-pulse-reduced{0%,100%{opacity:.62}50%{opacity:1}}
