:root {
    --yellow: var(--color-accent);
    --red: var(--color-accent-strong);
    --black: var(--color-ink);
    --white: var(--color-text);
    --muted: #aaa9a5;
    --line: #33332f;
    --header-height: 88px;
    --gutter: 24px;
    color-scheme: dark;
}

html { scroll-padding-top: 110px; }
body { background: var(--black); color: var(--white); font-family: var(--font-editorial-body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body, button, input { letter-spacing: 0; }
h1, h2, h3, p, figure, dl, dd { margin: 0; }
h1, h2, h3 { font-family: var(--font-editorial-display); font-weight: 400; line-height: 1.06; }
h1 { font-size: 76px; }
h2 { font-size: 42px; }
h3 { font-size: 26px; }
em { font-family: var(--font-editorial-serif); font-weight: 400; text-transform: none; }
p { text-wrap: pretty; }
a { text-decoration: none; text-underline-offset: 5px; }
button, input { color: inherit; }
button { border: 0; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
button:disabled { cursor: default; }
::selection { color: var(--black); background: var(--yellow); }
:focus-visible { outline: 3px solid var(--yellow); outline-offset: 5px; }
.quick-info :focus-visible, .visit-section :focus-visible, .food-section :focus-visible { outline-color: var(--black); }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 100; padding: 12px 20px; background: var(--yellow); color: var(--black); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.eyebrow { font-family: var(--font-mono); font-size: 11px; line-height: 1.4; text-transform: uppercase; }
.small { font-size: 13px; line-height: 1.6; }
.text-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 0; border: 0; border-bottom: 1px solid currentColor; color: inherit; background: transparent; font-size: 15px; font-weight: 600; }
.text-link .icon { transition: transform 180ms ease; }
.text-link:hover .icon { transform: translate(3px, -3px); }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 54px; padding: 14px 22px; border: 1px solid transparent; font-size: 14px; font-weight: 600; line-height: 1.4; transition: background-color 180ms ease, color 180ms ease; }
.button--yellow { background: var(--yellow); color: var(--black); }
.button--yellow:hover { background: var(--white); }
.button--black { background: var(--black); color: var(--white); }
.button--black:hover { background: var(--yellow); color: var(--black); }
.button--outline { border-color: #777; background: transparent; color: var(--white); }
.button--outline:hover { border-color: var(--yellow); color: var(--yellow); }
.icon-button { display: grid; width: 46px; height: 46px; padding: 10px; place-items: center; background: transparent; color: inherit; }
.icon { display: inline-block; flex: 0 0 auto; width: 22px; height: 22px; background: currentColor; mask-repeat: no-repeat; mask-position: center; mask-size: contain; vertical-align: middle; }
.icon--up-right { mask-image: url('/shared/assets/icons/lucide/arrow-up-right.svg'); }
.icon--right { mask-image: url('/shared/assets/icons/lucide/arrow-right.svg'); }
.icon--down { mask-image: url('/shared/assets/icons/lucide/arrow-down.svg'); }
.icon--menu { mask-image: url('/shared/assets/icons/lucide/menu.svg'); }
.icon--x { mask-image: url('/shared/assets/icons/lucide/x.svg'); }
.icon--plus { mask-image: url('/shared/assets/icons/lucide/plus.svg'); }
.icon--search { mask-image: url('/shared/assets/icons/lucide/search.svg'); }

.site-header { z-index: 30; background: var(--black); border-bottom: 1px solid #252522; }
.brand img { object-fit: contain; }
.desktop-navigation { font-size: 13px; font-weight: 600; }
.desktop-navigation a { padding: 13px 0; }
.desktop-navigation a:hover { color: var(--yellow); }
.mobile-navigation { border-top: 1px solid var(--line); background: var(--black); }
.mobile-navigation a { display: flex; align-items: center; gap: 16px; min-height: 65px; border-bottom: 1px solid var(--line); font-family: var(--font-editorial-display); font-size: 28px; }
.mobile-navigation a span { color: var(--yellow); font: 11px var(--font-mono); }
.mobile-navigation a .icon { margin-left: auto; }

.hero { isolation: isolate; background: #17100e; }
.hero__photos { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.hero__photos::after { position: absolute; inset: 0; content: ''; background: rgba(0, 0, 0, .32); }
.hero:has([data-scene="bar"][aria-pressed="true"]) .hero__photos::after { background: rgba(0, 0, 0, .6); }
.hero__scene { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; opacity: 0; transition: opacity 550ms ease; }
.hero__scene img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero__scene.is-active { opacity: 1; }
.hero__scene[data-scene-image='bar'] { object-position: 50% 56%; }
.hero__top { color: #fff; }
.hero h1 { color: var(--yellow); font-size: 98px; line-height: .93; text-shadow: 0 2px 32px rgba(0, 0, 0, .12); }
.hero h1 > span { display: block; }
.hero h1 > span:nth-child(2) { padding-left: 32px; }
.hero__period { color: var(--red); }
.hero__invitation p { font-size: 19px; line-height: 1.2; }
.hero__invitation em { font-size: 29px; white-space: nowrap; }
.hero__details > p { font-size: 15px; line-height: 1.5; }
.scene-controls { gap: 12px; }
.scene-controls button { padding: 12px 0 7px; border-top: 2px solid rgba(255, 255, 255, .4); color: white; background: transparent; font-size: 11px; text-align: left; transition: border-color 160ms ease, color 160ms ease; }
.scene-controls button span { display: block; margin-bottom: 6px; font: 10px var(--font-mono); }
.scene-controls button[aria-pressed='true'] { border-color: var(--yellow); color: var(--yellow); }
.hero__rail { font: 10px var(--font-mono); writing-mode: vertical-rl; }
.quick-info { background: var(--yellow); color: var(--black); }
.quick-info__grid > a { transition: background 160ms ease; }
.quick-info__grid > a:hover { background: rgba(0, 0, 0, .04); }
.quick-info strong { display: block; font-size: 17px; font-weight: 600; }
.quick-info .eyebrow { margin-bottom: 5px; opacity: .7; }
.quick-info .small { font-size: 11px; }
.quick-info strong .small { font-weight: 400; }

.section-number { color: var(--yellow); }
.section-heading h2 em { display: inline-block; margin-top: 8px; font-size: 1.1em; }
.section-heading__aside { color: #bbb; font-size: 16px; }
.experience { display: block; }
.experience__photo { position: relative; overflow: hidden; background: #111; }
.experience__photo::after { position: absolute; inset: 40% 0 0; content: ''; background: linear-gradient(transparent, rgba(0, 0, 0, .65)); pointer-events: none; }
.experience__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms ease; }
.experience:hover img { transform: scale(1.04); }
.experience__number { position: absolute; top: 20px; left: 20px; font: 11px var(--font-mono); }
.experience__title { position: absolute; bottom: 22px; left: 22px; right: 22px; display: flex; align-items: center; justify-content: space-between; z-index: 1; font: 50px/1 var(--font-editorial-display); }
.experience__title .icon { width: 28px; height: 28px; }
.experience > p { margin-top: 20px; font-size: 14px; color: #bbb; }
.experience:nth-child(3) img { object-position: 36%; }
.food-section { background: var(--red); color: var(--black); }
.food-section__image { position: relative; }
.food-section__image img { width: 100%; height: 100%; object-fit: cover; }
.photo-caption { position: absolute; left: 28px; bottom: 28px; padding: 6px 10px; background: var(--black); color: var(--white); font: 10px var(--font-mono); text-transform: uppercase; }
.food-section h2 em { display: inline-block; margin-top: 5px; font-size: 1.13em; }
.menu-preview { border-top: 1px solid rgba(0, 0, 0, .35); }
.menu-preview > div { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding: 15px 0; border-bottom: 1px solid rgba(0, 0, 0, .35); font-size: 15px; }
.menu-preview strong { font-weight: 600; }
.food-section__note { margin-top: 16px; }
.arcade-section h2 em { display: inline-block; margin-top: 8px; }
.arcade-section__copy > p:not(.eyebrow) { color: #bbb; }
.admission { display: flex; align-items: center; gap: 22px; }
.admission strong { font: 58px/1 var(--font-editorial-display); color: var(--yellow); }
.admission div { font-size: 13px; line-height: 1.4; }
.arcade-section .text-link { color: var(--yellow); }
.game-tease { padding: 28px 0; border-bottom: 1px solid var(--line); }
.game-tease:first-child { border-top: 1px solid var(--line); }
.game-tease > span { display: block; margin-bottom: 12px; color: var(--muted); font: 11px var(--font-mono); text-transform: uppercase; }
.game-tease h3 { font-size: 44px; text-transform: uppercase; }
.game-tease p { margin-top: 4px; color: var(--muted); font-size: 13px; }
.arcade-section__all { display: flex; justify-content: space-between; gap: 20px; padding: 20px 0; font-size: 14px; }
.arcade-section__all span { color: var(--yellow); }
.events-section { border-top: 1px solid var(--line); background: #10100e; }
.event-list { border-top: 1px solid #46463e; }
.event-row { border-bottom: 1px solid #46463e; transition: color 180ms ease; }
.event-row:hover h3, .event-row:hover > .icon { color: var(--yellow); }
.event-row__date { color: var(--yellow); font: 24px/1.1 var(--font-editorial-display); text-transform: uppercase; }
.event-row .eyebrow { margin-bottom: 10px; color: var(--muted); }
.event-row h3 { font-family: var(--font-editorial-body); font-size: 24px; font-weight: 600; }
.event-row p:not(.eyebrow) { margin-top: 10px; color: #b8b8b2; font-size: 14px; }
.event-row > .icon { width: 32px; height: 32px; }
.groups-section { position: relative; isolation: isolate; background: #181412; }
.groups-section::after { position: absolute; inset: 0; z-index: -1; content: ''; background: rgba(0, 0, 0, .42); }
.groups-section__image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.groups-section h2 { color: var(--yellow); font-size: 62px; }
.groups-section h2 em { color: white; font-size: 1.2em; }
.groups-section__footer { border-top: 1px solid #777; font: 10px var(--font-mono); text-transform: uppercase; }
.visit-section { color: var(--black); background: var(--yellow); }
.visit-section h2 em { font-size: 1.1em; }
.visit-section address { font-size: 20px; font-style: normal; line-height: 1.5; }
.visit-section__hours h3 { margin-bottom: 24px; font: 11px var(--font-mono); text-transform: uppercase; }
.hours-list > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 46px; border-bottom: 1px solid rgba(0, 0, 0, .25); font-size: 15px; }
.hours-list > div[data-today] { font-weight: 600; }
.hours-list > div[data-today] dt::after { content: ' / Today'; font-size: 11px; }
.visit-section__hours > p { margin-top: 18px; }
.visit-section a:not(.text-link) { text-decoration: underline; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list details:first-child { border-top: 1px solid var(--line); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 74px; padding: 20px 0; font-size: 16px; font-weight: 600; list-style: none; cursor: pointer; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary .icon { width: 20px; height: 20px; transition: transform 180ms ease; }
.faq-list details[open] summary .icon { transform: rotate(45deg); }
.faq-list details p { padding-bottom: 24px; color: #bbb; font-size: 15px; }
.faq-list details a { text-decoration: underline; color: var(--yellow); }
.faq-section h2 { font-size: 38px; }
.faq-section .eyebrow { color: var(--muted); }
.booking-section { border-top: 1px solid var(--line); padding-block: 60px; }
.booking-heading .eyebrow { color: var(--yellow); margin-bottom: 18px; }
.booking-options > div { padding-block: 20px; }
.booking-options .eyebrow { color: var(--yellow); }
.booking-options h3 { margin-top: 18px; }
.booking-options p:not(.eyebrow) { margin: 18px 0 26px; color: #bbb; max-width: 38ch; }
.booking-modal { width: min(940px, calc(100% - 32px)); max-height: calc(100svh - 40px); padding: 0; border: 1px solid var(--line); background: #10100e; color: var(--white); overscroll-behavior: contain; }
.booking-modal::backdrop { background: rgba(0, 0, 0, .76); backdrop-filter: blur(5px); }
.booking-modal .booking-section { width: 100%; padding: 50px; margin: 0; border: 0; }
.booking-close { position: absolute; right: -22px; top: -24px; }
.site-footer { padding-top: 56px; border-top: 1px solid var(--line); }
.footer-top > p { font: 36px/.98 var(--font-editorial-display); }
.footer-top > p em { font-size: 43px; line-height: 1.4; }
.footer-top a { display: flex; align-items: center; justify-content: space-between; gap: 25px; min-height: 42px; font-size: 14px; }
.footer-top a:hover { color: var(--yellow); }
.footer-top .icon { width: 16px; height: 16px; }
.footer-wordmark { color: var(--yellow); font: 52px/1 var(--font-editorial-display); white-space: nowrap; }
.footer-wordmark span { color: var(--red); }
.footer-bottom { border-top: 1px solid var(--line); font: 10px var(--font-mono); text-transform: uppercase; }
.footer-bottom .icon { width: 14px; height: 14px; }

.page-heading { padding-block: 38px 56px; }
.page-heading .back-link { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 35px; font-size: 12px; }
.page-heading .back-link .icon { width: 15px; height: 15px; }
.page-heading .eyebrow { margin-bottom: 18px; }
.page-heading h1 { font-size: 76px; }
.page-heading > .shell > p:last-child { max-width: 38ch; margin-top: 22px; font-size: 18px; }
.page-heading p em { font-size: 1.35em; }
.page-heading--menu { background: var(--red); color: var(--black); }
.page-heading--menu h1 span { color: var(--yellow); }
.page-heading--games { position: relative; isolation: isolate; }
.page-heading--games::before { position: absolute; z-index: -1; inset: 0; content: ''; background: rgba(0, 0, 0, .62); }
.page-heading--games > img { position: absolute; z-index: -2; width: 100%; height: 100%; object-fit: cover; inset: 0; }
.page-heading--games h1 { color: var(--yellow); }
.menu-switch { position: sticky; top: var(--header-height); z-index: 10; display: flex; padding-top: 12px; border-bottom: 1px solid #777; background: var(--black); }
.menu-switch a { display: flex; align-items: baseline; gap: 32px; padding: 10px 24px 18px; border-bottom: 3px solid transparent; font: 36px var(--font-editorial-display); text-transform: uppercase; }
.menu-switch a:first-child { padding-left: 0; }
.menu-switch a span { color: var(--muted); font: 10px var(--font-mono); }
.menu-switch a[aria-current='true'] { border-color: var(--yellow); color: var(--yellow); }
[data-menu-panel] { scroll-margin-top: 96px; }
.menu-page__intro { color: #bbb; font-size: 14px; }
.menu-page__intro a { color: var(--yellow); font-size: 13px; }
.menu-category { border-top: 1px solid var(--line); }
.menu-category h2 { font-size: 32px; color: var(--yellow); }
.menu-category__heading .small { margin-top: 10px; color: #bbb; }
.menu-item { border-bottom: 1px solid #292927; padding-bottom: 22px; }
.menu-item__name { display: flex; justify-content: space-between; gap: 24px; align-items: baseline; }
.menu-item h3 { font: 600 17px/1.35 var(--font-editorial-body); }
.menu-item__name > span { color: var(--yellow); white-space: nowrap; font-size: 14px; }
.menu-item p { margin-top: 10px; color: #aaa; font-size: 14px; line-height: 1.6; }
.diet-label { display: inline-block; margin-top: 12px; color: var(--yellow); font: 10px var(--font-mono); }
.menu-legend, .menu-source { color: var(--muted); }
.menu-legend a { text-decoration: underline; }
.page-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 48px; border-top: 1px solid var(--line); }
.page-cta > p { font: italic 38px/1.1 var(--font-editorial-serif); }
.games-toolbar h2 { font-size: 34px; }
.game-search { display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 12px 16px; border: 1px solid #555; }
.game-search:focus-within { outline: 2px solid var(--yellow); outline-offset: 2px; }
.game-search input { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; font-size: 14px; }
.game-search input::placeholder { color: #aaa; }
.game-search .icon { width: 18px; height: 18px; }
.game-filters button { min-height: 44px; padding: 10px 16px; border: 1px solid #444; color: white; background: transparent; font-size: 12px; }
.game-filters button[aria-pressed='true'] { color: var(--black); background: var(--yellow); border-color: var(--yellow); }
.game-filters button:hover { border-color: var(--yellow); }
.game-count { color: #aaa; }
.game-card { min-height: 180px; padding: 24px; border: 1px solid var(--line); background: #10100e; }
.game-card__number { color: var(--yellow); font: 11px var(--font-mono); }
.game-card h3 { margin-top: 28px; font-size: 25px; }
.game-card p { margin-top: 12px; color: #aaa; font-size: 12px; }
.games-empty { padding: 60px 0; border-block: 1px solid var(--line); }
.games-empty p { margin-block: 18px; color: #aaa; }
.games-notes p { margin-top: 10px; color: #aaa; }
.games-notes a { color: var(--yellow); text-decoration: underline; }

@media (prefers-reduced-motion: no-preference) {
    .hero h1 { animation: title-enter 850ms cubic-bezier(.16, 1, .3, 1) both; }
    [data-reveal] { transition: opacity 600ms ease, transform 650ms cubic-bezier(.16, 1, .3, 1); }
    [data-reveal].will-reveal { opacity: 0; transform: translateY(28px); }
    @keyframes title-enter { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation: none !important; transition: none !important; }
}