/* Local refinement: floating translucent navigation and a complete portrait. */
:root{--island-space:110px}
body{padding-top:var(--island-space)}
.site-header{position:fixed;top:16px;left:50%;width:min(1180px,calc(100% - 40px));min-height:80px;padding:11px 26px;gap:24px;z-index:66;transform:translateX(-50%);border:1px solid #fff3;border-radius:999px;background:linear-gradient(125deg,#ffffff22,#ffffff09 48%,#fff1),#231c1a6b;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%);box-shadow:inset 0 1px 0 #fff2,inset 0 -1px 0 #fff1,0 10px 36px #1e120e2b;opacity:1;transition:opacity .32s ease,transform .42s cubic-bezier(.2,.75,.25,1),box-shadow .3s;will-change:transform,opacity}
.site-header:before,.site-header:after{content:none}
.site-header .brand{flex-shrink:0;gap:12px}
.site-header .brand img{width:82px;height:54px}
.site-header nav{gap:8px;flex-wrap:nowrap}
.site-header nav a{padding:10px 17px;border:1px solid transparent;border-radius:999px;background:transparent;box-shadow:none}
.site-header nav a:hover,.site-header nav a:focus-visible,.site-header nav a[aria-current]{background:linear-gradient(135deg,#ffffff26,#ffffff0c);border-color:#ffefd42e;box-shadow:inset 0 1px 0 #fff2,0 3px 12px #1e120e10}
.site-header nav a:before,.site-header nav a[aria-current]:after{content:none}
.site-header nav a:focus-visible{outline-offset:3px}
.island-ready.island-scrolled:not(.island-open) .site-header{opacity:0;transform:translate(-50%,-135%) scale(.96);pointer-events:none}
.nav-edge{position:fixed;inset:0 0 auto;height:24px;z-index:65;display:none}
.island-scrolled .nav-edge{display:block}
.nav-peek{position:fixed;top:4px;left:50%;transform:translate(-50%,-70px);z-index:67;min-height:34px;padding:5px 17px;border:1px solid #ffffff40;border-radius:999px;background:#2a23209c;backdrop-filter:blur(18px);color:var(--ink);font:inherit;font-size:12px;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .25s,transform .3s}
.nav-peek:focus-visible{transform:translate(-50%,0);opacity:1;pointer-events:auto;outline:2px solid var(--gold);outline-offset:2px}
.home-page .portal-scene{margin-top:calc(-1 * var(--island-space));min-height:100svh;padding-top:calc(45px + var(--island-space))}
/* The portrait keeps its whole canvas; the former transparent cutout is removed. */
.activity-heading{min-height:460px;display:flex;align-items:center;padding-right:390px}
.activity-heading>div{max-width:100%}
.activity-illustration{position:absolute;top:24px;right:38px;width:274px;height:410px;margin:0;overflow:hidden;border:1px solid #f4d9b980;border-radius:140px 140px 14px 14px;box-shadow:0 12px 35px #2a191366,inset 0 0 0 5px #ffe8cd15;background:#302622;z-index:1}
.activity-illustration img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;margin:0}
.activity-heading>img:not(.hero-character){right:344px;bottom:36px;width:185px;z-index:1}
@media(max-width:1150px){.site-header{gap:18px;padding-inline:21px}.site-header nav a{padding-inline:14px}.home-page .portal-scene{padding-top:calc(42px + var(--island-space))}}
@media(max-width:900px) and (min-width:761px){.activity-heading{padding-left:30px;padding-right:315px}.activity-illustration{right:25px;width:248px;height:371px;top:42px}.activity-heading>img:not(.hero-character){right:302px;width:150px}}
@media(max-width:760px){:root{--island-space:132px}.site-header{top:10px;width:calc(100% - 24px);min-height:110px;border-radius:34px;flex-wrap:wrap;justify-content:center;gap:3px;padding:8px 12px 10px}.site-header .brand{gap:8px}.site-header .brand img{width:65px;height:45px}.site-header nav{width:100%;justify-content:center;gap:4px}.site-header nav a{padding:7px 12px}.home-page .portal-scene{padding-top:calc(208px + var(--island-space))}.home-page .scene-art{top:var(--island-space);height:calc(575px - var(--island-space));mask-image:linear-gradient(180deg,transparent,#000 28px)}.home-page .scene-caption{top:calc(25px + var(--island-space))}.activity-heading{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:28px 24px 86px}.activity-heading>div{max-width:none}.activity-heading h1{max-width:none}.activity-intro,.archive-meta{max-width:none}.activity-illustration{position:relative;inset:auto;width:min(240px,100%);height:auto;aspect-ratio:3007 / 4500;flex-shrink:0;margin:24px auto 0}.activity-heading>img:not(.hero-character){left:50%;right:auto;bottom:22px;transform:translateX(-50%);width:148px;margin:0}}
@media(max-width:420px){.home-page .portal-scene{padding-top:calc(196px + var(--island-space))}.site-header nav a{padding-inline:10px}}
@media(hover:none),(pointer:coarse){.island-scrolled:not(.island-open) .nav-peek{transform:translate(-50%,0);opacity:1;pointer-events:auto}}
@media(prefers-reduced-motion:reduce){.site-header,.nav-peek{transition:none}}
.motion-paused .site-header,.motion-paused .nav-peek{transition:none}
/* Small screens use an explicit top handle as the touch equivalent of hover. */
@media(max-width:760px){.island-scrolled:not(.island-open) .nav-peek{transform:translate(-50%,0);opacity:1;pointer-events:auto}}