[hidden] { display: none !important; }
.site-frame { position: relative; width: 100%; height: calc(var(--stage-height, var(--cover-height, 900px)) * var(--site-scale, 1)); overflow: clip; }
.site-stage { position: absolute; left: 0; top: 0; width: 1440px; margin: 0; padding: 0; transform: scale(var(--site-scale, 1)); transform-origin: top left; }
.site-stage[data-view="cover"], .site-stage[data-view="flipping"] { height: var(--cover-height, 900px); overflow: hidden; }
.site-stage[data-view="flipping"] { height: var(--transition-height, 900px); background: #95a3aa; }
.cover-view { position: relative; width: 1440px; height: var(--cover-height, 900px); background-color: #95a3aa; background-image: url('assets/cover-grid.png?v=20261030-2'); background-size: 180px 180px; background-position: 0 0; overflow: hidden; }
.cover-caption { position: absolute; z-index: 6; left: 1260px; top: 180px; width: 180px; height: 180px; perspective: 1000px; pointer-events: none; }
.cover-caption-inner { position: relative; width: 180px; height: 180px; transform-style: preserve-3d; transform: rotateY(180deg); }
.cover-caption-face { position: absolute; inset: 0; width: 180px; height: 180px; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.cover-caption-front { background: #95a3aa url('assets/cover-grid.png?v=20261030-2') 0 0 / 180px 180px; }
.cover-caption-rear { transform: rotateY(180deg); }
.cover-caption-rear img { display: block; width: 180px; height: 180px; max-width: none; }
.site-stage[data-caption-flipping="true"] .cover-caption-inner, .site-stage[data-cover-complete="true"] .cover-caption-inner { transform: rotateY(180deg); }
.cover-art { position: absolute; left: 0; top: 0; clip-path: inset(180px 0 0); display: block; width: 1440px; height: 900px; max-width: none; border: 0; margin: 0; padding: 0; }
.cover-enter { position: absolute; z-index: 7; inset: 180px 0 0; width: 1440px; cursor: pointer; }
.cover-enter:focus-visible { outline: 2px dashed #273238; outline-offset: -8px; }
.cover-number-mask { position: absolute; left: 183px; top: 184px; width: 24px; height: 22px; background: #ce3a77; pointer-events: none; }
.cover-view[data-cover-visual-complete="false"] > .cover-number-mask { display: none; }
.stable-header { position: fixed; z-index: 10; left: 0; top: 0; width: 1440px; height: 180px; overflow: hidden; pointer-events: auto; transform: scale(var(--site-scale, 1)); transform-origin: top left; }
.stable-header > .header-background { pointer-events: none; display: block; width: 1440px; height: 180px; max-width: none; }
.main-nav { position: absolute; inset: 0; pointer-events: none; }
.menu-link { position: absolute; top: 0; width: 180px; height: 180px; display: block; pointer-events: auto; }
.menu-label { display: block; width: 180px; height: 180px; max-width: none; transform-origin: center; }
.menu-link:hover .menu-label, .menu-link:focus-visible .menu-label { animation: menu-pulse 700ms ease-in-out infinite; }
.menu-link:focus-visible { outline: 2px solid #273238; outline-offset: -6px; }
@keyframes menu-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.1); } }
@media (prefers-reduced-motion: reduce) {
  .menu-link:hover .menu-label, .menu-link:focus-visible .menu-label { animation: none; transform: scale(1.1); }
}
.transition-grid { position: absolute; z-index: 5; left: 0; top: 180px; width: 1440px; height: var(--transition-height, 720px); display: grid; grid-template-columns: repeat(8, 180px); grid-template-rows: repeat(var(--transition-rows, 4), 180px); overflow: hidden; pointer-events: none; }
.site-stage[data-transition-kind="entrance"] .transition-grid { top: 180px; }
.transition-tile { width: 180px; height: 180px; perspective: 1000px; }
.transition-tile-inner { position: relative; width: 180px; height: 180px; transform-style: preserve-3d; transition: transform 600ms cubic-bezier(.35, .05, .25, 1); transition-delay: var(--flip-delay); }
.transition-grid.is-flipping .transition-tile-inner { transform: rotateY(180deg); }
.transition-face { position: absolute; inset: 0; overflow: hidden; backface-visibility: hidden; -webkit-backface-visibility: hidden; background-repeat: no-repeat; background-position: var(--tile-x) var(--tile-y); }
.transition-front { background-image: url('assets/cover-static.svg?v=20261030-2'); background-size: 1440px 900px; }
.transition-face > .cover-number-mask { left: 3px; top: 4px; }
.transition-back { transform: rotateY(180deg); }
.scroll-reveal-grid { position: absolute; z-index: 4; left: 0; top: 0; width: 1440px; overflow: hidden; pointer-events: none; }
.scroll-reveal-row { position: absolute; left: 0; width: 1440px; display: flex; overflow: hidden; }
.scroll-reveal-row .transition-tile { flex: 0 0 180px; background-repeat: no-repeat; }
.scroll-reveal-row.is-flipping .transition-tile-inner { transform: rotateY(180deg); }
.long-art-tail { position: relative; width: 1440px; background: #95a3aa; pointer-events: none; }
.background-top-grid { position: absolute; z-index: 9; left: 0; top: 0; width: 1440px; pointer-events: none; background-image: url('assets/grid.svg'); background-size: 180px 180px; }
.retired-chart-mask { position: absolute; left: 900px; top: 0; width: 360px; height: 180px; background: #95a3aa url('assets/grid.svg') repeat; background-size: 180px 180px; pointer-events: none; }

.home-link { position: absolute; left: 0; top: 0; width: 180px; height: 180px; display: grid; place-items: center; pointer-events: auto; cursor: pointer; }
.home-logo-ink { display: block; width: 180px; height: 180px; background-color: #273238; mask: url('assets/menu/logo-ink.png') center / 180px 180px no-repeat; -webkit-mask: url('assets/menu/logo-ink.png') center / 180px 180px no-repeat; transform-origin: center; }
.home-link:hover .home-logo-ink, .home-link:focus-visible .home-logo-ink { transform: scale(1.15); background-color: #ce3a77; animation: logo-grow 700ms ease-in-out both; }
.home-link:focus-visible { outline: 2px solid #273238; outline-offset: -6px; }
@keyframes logo-grow { 0% { transform: scale(1); } 50%, 100% { transform: scale(1.15); } }
@media (prefers-reduced-motion: reduce) { .home-link:hover .home-logo-ink, .home-link:focus-visible .home-logo-ink { animation: none; transition: none; transform: scale(1.15); background-color: #ce3a77; } }

.home-logo-original { position: absolute; inset: 0; display: block; width: 180px; height: 180px; max-width: none; pointer-events: none; }
.home-logo-ink { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
.home-link:hover .home-logo-original, .home-link:focus-visible .home-logo-original { opacity: 0; }
.home-link:hover .home-logo-ink, .home-link:focus-visible .home-logo-ink { opacity: 1; }

.cover-view[data-cover-visual-complete="false"] .cover-caption { visibility: hidden; }

.safe-area-probe { position: fixed; left: 0; bottom: 0; width: 0; height: 0; padding-bottom: env(safe-area-inset-bottom, 0px); visibility: hidden; pointer-events: none; }

.site-frame { background: #95a3aa; }

.cover-tile-art { position: absolute; inset: 0; width: 180px; height: 180px; overflow: hidden; background: #95a3aa; pointer-events: none; }
.cover-tile-art > img { display: block; width: 180px; height: 180px; max-width: none; }

.transition-face { background-color: #95a3aa; }

/* 3D surfaces use screen pixels and never inherit the tall artwork transform. */
.transition-grid.screen-grid { position: fixed; z-index: 9; transform: none; grid-template-columns: repeat(8, var(--screen-cell)); grid-template-rows: repeat(var(--transition-rows, 4), var(--screen-cell)); }
.screen-tile { width: var(--screen-cell); height: var(--screen-cell); perspective: var(--screen-perspective); background-color: #95a3aa; }
.screen-tile > .transition-tile-inner { width: 100%; height: 100%; }
.screen-tile .transition-face { background-image: none; }
.screen-tile .transition-face::after { display: none; }
.native-tile-art { position: absolute; left: 0; top: 0; width: 180px; height: 180px; overflow: hidden; contain: layout paint; transform: scale(var(--site-scale, 1)); transform-origin: top left; background-color: #95a3aa; background-repeat: no-repeat; pointer-events: none; }

/* The fixed menu uses half a native grid row. */
.stable-header { height: 90px; z-index: 1000001; background: #95a3aa; }
.stable-header > .header-background { display: none; }
.main-nav, .menu-link, .home-link { height: 90px; }
.menu-label { position: absolute; left: 0; top: -45px; }
.home-logo-original, .home-logo-ink { top: -45px; bottom: auto; }
.home-logo-original { display: none; }
.home-logo-ink { opacity: 1; mask-image: url('assets/menu/logo-unified.svg'); -webkit-mask-image: url('assets/menu/logo-unified.svg'); }

.cover-enter { inset: 90px 0 0; }

/* Remove the former half-row spacer without changing native artwork geometry. */
.site-stage { transform: scale(var(--site-scale, 1)) translateY(-90px); }
.site-frame { height: calc((var(--stage-height, var(--cover-height, 900px)) - 90px) * var(--site-scale, 1)); }
.cover-enter { inset: 180px 0 0; }
