@font-face{font-family:Display;src:url('/assets/display.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Manticore;src:url('/assets/manticore.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{--ink:#090f0e;--accent:#b9cbb7;--paper:#e7e9d8;--muted:#a7b3a7;--line:#35463d;--amber:#d9b47b;--mist:#c4d1c0;--surface:#192a23;--pad:clamp(24px,4.6vw,88px);--display:Display,Impact,'Arial Narrow',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;background:var(--ink);color:var(--paper);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip}body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:40;opacity:.04;transform:translateZ(0);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.8' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
::selection{background:var(--accent);color:var(--ink)}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:7px}.zombies a:focus-visible{outline-color:var(--ink)}img{display:block;width:100%;height:auto;object-fit:cover}h1,h2,h3,p,figure{margin:0}h2,h3{font-family:var(--display);font-weight:400}p{font-size:clamp(16px,1.35vw,20px);line-height:1.65}section{position:relative;isolation:isolate}section[id]{scroll-margin-top:0}.section-pad{padding:45px var(--pad) 95px}.eyebrow,.section-kicker,.hero-topline,.hero-coordinates,.tour-facts span,.story-tag,.story-count,.zombies-photo figcaption,.local-index,.ticket-note{font-size:12px;line-height:1.5;text-transform:uppercase;letter-spacing:.11em}.section-kicker{display:flex;justify-content:space-between;gap:30px;border-top:1px solid var(--line);padding-top:17px}.section-kicker span:last-child{text-align:right;color:var(--muted)}.skip-link{position:fixed;top:-80px;left:20px;background:var(--accent);padding:18px;color:var(--ink);z-index:100}.skip-link:focus{top:10px}.scroll-progress{position:fixed;top:0;left:0;height:3px;background:var(--accent);transform-origin:left;transform:scaleX(0);width:100%;z-index:60}
.site-header{position:absolute;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:25px;height:110px;padding:0 var(--pad);z-index:50;color:var(--paper)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{font-family:var(--display);color:var(--accent);border:1px solid var(--accent);height:47px;width:43px;display:flex;align-items:center;justify-content:center;font-size:30px;line-height:1}.brand-mark span{font-size:15px;writing-mode:vertical-rl;letter-spacing:0}.brand-name{font-weight:800;font-size:12px;line-height:1.3;letter-spacing:.05em}.header-actions{display:flex;gap:20px;align-items:center}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;background:var(--amber);color:var(--ink);font-size:16px;font-weight:700;padding:20px 25px;border:1px solid var(--amber);transition:background .25s,transform .25s,color .25s;min-height:54px}.button:hover{background:var(--accent);border-color:var(--accent);transform:translateY(-3px)}.button span{font-size:24px;line-height:1}.button-small{font-size:14px;padding:13px 18px;min-height:48px;gap:28px}.menu-open .site-header{position:fixed}
.hero{min-height:800px;height:100svh;max-height:1400px;padding:146px var(--pad) 55px;display:flex;flex-direction:column;overflow:hidden;background:#090f0e}.hero-media,.hero-shade{position:absolute;inset:0;z-index:-1}.hero-media{inset:-4%;will-change:transform}.hero-media img{height:100%;object-position:center 60%;filter:saturate(.9)}.hero-shade{background:radial-gradient(ellipse at 80% 20%,#435b4c4d,transparent 58%),linear-gradient(180deg,#090f0ec7,#11241d99 40%,#090f0e99 60%,#090f0ef0)}.hero-topline{display:flex;justify-content:space-between;position:relative;color:#dde1d0}.hero h1{color:var(--accent);margin-top:33px;font-weight:400;position:relative;width:100%;line-height:.92}.haunted-word{color:var(--amber);display:block;font-family:Manticore,var(--display);font-size:clamp(110px,18.8vw,207px);letter-spacing:-.035em;line-height:.94;padding-bottom:3px}.city-word{color:var(--paper);font-family:var(--display);font-size:clamp(73px,11.8vw,228px);letter-spacing:-.005em;display:block;white-space:nowrap}.title-star{color:var(--accent);display:inline-block;font-family:Arial,sans-serif;font-size:.5em;vertical-align:middle;margin-left:.25em;animation:slow-spin 24s linear infinite}.hero-bottom{position:relative;display:flex;align-items:flex-end;justify-content:space-between;margin-top:auto;gap:30px;padding-top:45px}.hero-intro .eyebrow{color:var(--accent)}.hero-intro p{margin-top:13px;font-size:18px}.explore-link{display:flex;gap:26px;align-items:center;font-size:14px;line-height:1.5}.round-arrow{width:65px;height:65px;border:1px solid #6c7b6c;border-radius:50%;display:grid;place-items:center;font-size:28px;transition:background .3s,color .3s,transform .3s}.explore-link:hover .round-arrow{background:var(--accent);color:var(--ink);transform:translateY(5px)}.hero-coordinates{position:absolute;right:var(--pad);top:55%;writing-mode:vertical-rl;font-size:12px;color:#c2cdb9}.marquee{background:var(--amber);color:var(--ink);overflow:hidden;padding:20px 0;position:relative;z-index:2;transform:rotate(-1.5deg);width:102%;margin-left:-1%;margin-top:-13px}.marquee-track{display:flex;gap:45px;width:max-content;align-items:center;animation:marquee 35s linear infinite}.marquee span{font-family:var(--display);font-size:27px;text-transform:uppercase;letter-spacing:.02em}.marquee i{font-style:normal;font-size:26px}
.intro{padding-top:78px;min-height:110svh}.intro h2{font-size:clamp(58px,8.7vw,162px);line-height:1.02;letter-spacing:-.01em;margin-top:80px}.intro h2>span{color:var(--mist)}.intro-bottom{display:flex;justify-content:space-between;align-items:center;margin:35px 0 65px}.intro-bottom p{max-width:535px;margin-right:3%}.large-asterisk{font-size:clamp(80px,13vw,200px);line-height:1;color:var(--amber);display:inline-block;will-change:transform}.tour-facts{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px 0}.tour-facts>div{display:flex;gap:25px;align-items:center;padding:0 35px;border-right:1px solid var(--line)}.tour-facts>div:first-child{padding-left:0}.tour-facts>div:last-child{border:0}.tour-facts strong{font-family:var(--display);font-weight:400;font-size:75px;line-height:1;white-space:nowrap}.tour-facts strong span{font-family:var(--display);font-size:32px;margin-left:4px}.tour-facts>div>span{max-width:140px;color:var(--muted)}
.stories-scroll{height:340svh;background:#0c1713}.stories-pin{height:100svh;min-height:650px;position:sticky;top:0;overflow:hidden}.stories-heading{position:absolute;z-index:3;top:35px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;font-size:12px;letter-spacing:.11em;text-transform:uppercase}.scroll-instruction{color:var(--accent)}.story-track{height:100%;display:flex;will-change:transform}.story{position:relative;flex:0 0 100%;height:100%;padding:120px var(--pad) 110px;display:flex;align-items:center;overflow:hidden}.story-background,.story-scrim{position:absolute;inset:0;height:100%;width:100%;z-index:-1}.story-background{object-position:center;filter:saturate(.65);opacity:.65}.story-scrim{background:linear-gradient(90deg,rgba(7,14,10,.97),rgba(12,24,18,.65) 60%,rgba(16,30,23,.22))}.story-content{position:relative;z-index:1;max-width:65%}.story .eyebrow{color:var(--accent)}.story h2{font-size:clamp(70px,8.5vw,160px);line-height:1;margin:20px 0 25px;letter-spacing:-.015em}.story h2 em{font-style:normal;color:var(--accent)}.story p{max-width:460px;font-size:17px;color:#dfe4d5}.story-tag{display:block;margin-top:22px;color:#b3c0ab}.story-number{position:absolute;right:var(--pad);bottom:105px;font-family:var(--display);font-size:22vw;line-height:.9;color:transparent;-webkit-text-stroke:1px rgba(185,203,183,.25)}.story-history{background:var(--surface);color:var(--paper)}.story-history .eyebrow,.story-history h2 em{color:var(--amber)}.story-history .story-tag,.story-history p{color:#d4decc}.story-ghost h2 em{color:var(--amber)}.history-type{position:absolute;right:-10px;top:20%;font-family:var(--display);font-size:22vw;line-height:1;writing-mode:vertical-rl;opacity:.09;transform:rotate(-8deg)}.story-history .story-number{-webkit-text-stroke-color:#81957d}.story-ufo .story-background{opacity:.95;object-position:70% 50%}.story-ufo .story-scrim{background:linear-gradient(90deg,rgba(7,14,10,.95),rgba(12,24,18,.7) 40%,rgba(16,30,23,.12))}.story-controls{position:absolute;z-index:3;bottom:30px;left:var(--pad);right:var(--pad);display:flex;align-items:center;justify-content:space-between;gap:20px}.story-tabs{display:flex;gap:28px}.story-tabs button{color:#bec9b6;background:none;border:0;border-top:1px solid #718572;padding:17px 0 0;min-width:145px;text-align:left;font-size:14px;transition:color .3s,border .3s}.story-tabs button span{margin-right:12px;opacity:.6}.story-tabs button.is-active{color:var(--accent);border-color:var(--accent)}.story-count{color:#ccd5c1}.stories-pin.history-active .stories-heading,.stories-pin.history-active .story-count,.stories-pin.history-active .story-tabs button{color:#d4decc}.stories-pin.history-active .scroll-instruction{color:var(--amber)}.stories-pin.history-active .story-tabs button.is-active{color:var(--amber);border-color:var(--amber)}
.zombies{background:var(--accent);color:var(--ink);min-height:105svh;padding-bottom:100px}.zombies .section-kicker{border-color:#374b40}.zombies .section-kicker span:last-child{color:#a7b3a7}.zombies-layout{display:grid;grid-template-columns:1.13fr 1fr;gap:55px;margin-top:75px;align-items:center}.zombies h2{font-size:clamp(65px,8vw,150px);line-height:1}.zombies h2 span{color:transparent;-webkit-text-stroke:1.5px var(--ink)}.zombies-description{margin-top:38px;max-width:400px}.text-link{display:inline-flex;justify-content:space-between;gap:40px;font-size:14px;padding-bottom:8px;border-bottom:1px solid #6c7b6c;transition:gap .2s,color .2s}.text-link:hover{gap:55px;color:var(--accent)}.dark-link{margin-top:25px;border-color:var(--ink)}.dark-link:hover{color:var(--ink)}.zombies-photo{position:relative;transform:rotate(3deg);margin:15px 18px 15px 0}.zombies-photo img{aspect-ratio:.83;max-height:650px;object-position:50%;filter:saturate(.6) contrast(1.07)}.zombies-photo figcaption{display:flex;justify-content:space-between;gap:15px;padding:16px 0;color:var(--ink);font-size:12px}.photo-stamp{position:absolute;bottom:80px;left:-35px;border:2px solid var(--accent);background:var(--ink);color:var(--accent);padding:20px 15px;font-family:var(--display);font-size:25px;line-height:1.1;transform:rotate(-12deg)}
.plan{padding-top:55px}.plan-layout{display:grid;grid-template-columns:1fr 1fr;gap:10%;margin-top:80px}.plan h2{font-size:clamp(65px,7vw,130px);line-height:1}.plan h2 span{color:var(--amber)}.plan-title .button{margin-top:35px}.meeting{border-bottom:1px solid var(--line);padding-bottom:38px}.meeting .eyebrow{color:var(--accent)}.meeting h3{font-size:42px;margin:16px 0 10px}.meeting .text-link{margin-top:23px}.faq details{border-bottom:1px solid var(--line);padding:23px 0}.faq summary{font-size:17px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;line-height:1.45}.faq summary::-webkit-details-marker{display:none}.faq summary span{color:var(--mist);font-size:24px;font-weight:300;transition:transform .25s}.faq details[open] summary span{transform:rotate(45deg)}.faq details p{font-size:16px;color:#b6c2af;margin-top:15px;max-width:450px}.faq .text-link{margin-top:15px}
.local{background:#14221c;padding-top:50px}.local-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin:65px 0 55px}.local h2{font-size:clamp(60px,7.5vw,140px);line-height:1}.local h2 span{color:var(--mist)}.local-heading p{font-size:16px;max-width:350px;color:#cbd2c0;margin-bottom:5px}.local-links{border-top:1px solid #3c5143}.local-links>a{position:relative;display:grid;grid-template-columns:160px 1fr 35px;align-items:center;gap:25px;border-bottom:1px solid #3c5143;padding:30px 0;transition:padding .3s,color .3s,background .3s}.local-links>a:hover{padding-left:15px;color:var(--accent);background:#20352a}.local-index{grid-row:span 2;color:#aaba9f;align-self:center}.local h3{font-size:clamp(26px,3vw,55px);line-height:1.1;max-width:90%}.local-description{grid-column:2;font-size:14px;color:#cbd2c0;margin-top:-12px}.local-arrow{grid-column:3;grid-row:1/3;font-size:30px;color:var(--amber)}.tickets{min-height:100svh;padding-bottom:85px;display:flex;flex-direction:column;overflow:hidden}.ticket-background{position:absolute;inset:0;z-index:-1}.ticket-background::after{content:"";position:absolute;inset:0;background:linear-gradient(#090f0ef0,#243c3099 50%,#090f0ef0)}.ticket-background img{height:100%;opacity:.55;object-position:center 65%}.ticket-content{margin:auto;text-align:center;padding-top:65px}.ticket-content>.eyebrow{color:#ccd7c4}.tickets h2{font-size:clamp(80px,13vw,235px);line-height:.97;margin:25px 0 30px}.tickets h2 span{color:var(--accent)}.tickets p{margin-bottom:32px;font-size:18px}.button-large{min-width:270px;font-size:18px;padding:23px 30px}.ticket-note{display:block;font-size:12px;letter-spacing:.06em;margin-top:20px;color:#c4cebb}.phone-link{display:inline-block;margin-top:14px;font-size:14px;color:var(--paper);text-decoration:underline;text-underline-offset:4px}footer{padding:60px var(--pad) 35px;border-top:1px solid var(--line)}.footer-brand{font-family:var(--display);font-size:clamp(30px,7.65vw,145px);color:var(--mist);white-space:nowrap;line-height:1}.footer-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;padding-top:40px;font-size:12px;line-height:1.7;color:#a5b2a1}.footer-bottom a:hover{color:var(--accent)}
.motion-ready .reveal{opacity:0;filter:blur(12px);transform:translateY(45px);transition:opacity .9s ease,filter 1.1s ease,transform 1.1s cubic-bezier(.2,.75,.25,1)}.motion-ready .reveal.in-view{opacity:1;filter:blur(0);transform:translateY(0)}.motion-ready .zombies-photo.reveal{transform:translateY(45px) rotate(3deg)}.motion-ready .zombies-photo.reveal.in-view{transform:translateY(0) rotate(3deg)}.reveal-word-block .word{display:inline-block;opacity:.22;filter:blur(3px);transition:opacity .25s,filter .25s}.reveal-word-block .word.visible{opacity:1;filter:blur(0)}.hero h1{animation:hero-in 1.5s cubic-bezier(.2,.7,.2,1) both}.hero-topline,.hero-bottom{animation:hero-in 1.4s .2s both}@keyframes hero-in{from{opacity:0;filter:blur(12px);transform:translateY(35px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}@keyframes slow-spin{to{transform:rotate(360deg)}}@keyframes marquee{to{transform:translateX(-50%)}}
@media(min-width:1800px){.hero{padding-top:170px}.hero h1{margin-top:45px}.story-content{max-width:1100px}.story p{max-width:550px}.zombies-layout{gap:100px}}
@media(max-width:1100px){.hero{min-height:760px}.tour-facts>div{padding:0 23px;gap:18px}.tour-facts strong{font-size:64px}.zombies-layout{gap:30px}.story-content{max-width:80%}.local-links>a{grid-template-columns:130px 1fr 35px}.plan-layout{gap:6%}.hero-coordinates{display:none}}
@media(max-width:760px){:root{--pad:24px}.site-header{height:90px;gap:12px}.brand-mark{width:35px;height:40px;font-size:27px}.brand-name{font-size:12px}.brand{gap:8px}.header-actions{gap:12px}.button-small{padding:10px 12px;font-size:12px;gap:20px;min-height:44px}.hero{padding-top:124px;min-height:700px;max-height:1050px}.hero-topline{font-size:12px;letter-spacing:.08em}.hero-topline span:last-child{display:none}.hero h1{margin-top:65px}.haunted-word{font-size:21vw;line-height:1.05}.city-word{font-size:12.2vw;margin-top:10px}.title-star{display:none}.hero-media{inset:-4% -25%}.hero-media img{object-position:60% 50%}.hero-bottom{align-items:flex-start;flex-direction:column;gap:32px;padding-top:50px}.hero-intro p{font-size:17px}.hero-intro .eyebrow{font-size:12px}.explore-link{width:100%;justify-content:space-between;font-size:13px}.round-arrow{width:50px;height:50px;font-size:24px}.marquee{padding:15px 0}.marquee span{font-size:23px}.marquee-track{gap:28px}.section-pad{padding:38px var(--pad) 65px}.section-kicker{font-size:12px;letter-spacing:.09em;gap:20px}.section-kicker span:last-child{max-width:140px}.intro{min-height:initial;padding-top:60px}.intro h2{margin-top:65px;font-size:10.7vw;line-height:1.15}.intro-bottom{margin:35px 0 45px;gap:30px;align-items:flex-start}.intro-bottom p{font-size:16px;margin:0}.large-asterisk{font-size:65px}.tour-facts{padding:24px 0}.tour-facts>div{display:block;padding:0 15px}.tour-facts strong{font-size:52px}.tour-facts strong span{font-size:24px}.tour-facts>div>span{font-size:12px;line-height:1.5;display:block;margin-top:10px;max-width:100px;letter-spacing:.07em}.stories-scroll{height:auto}.stories-pin{height:auto;min-height:0;position:relative;overflow:clip}.stories-heading{top:25px;font-size:12px}.scroll-instruction{display:none}.story-track{display:block;height:auto;transform:none!important}.story{height:90svh;min-height:670px;padding:95px var(--pad) 65px}.story-content{max-width:100%}.story h2{font-size:14vw;line-height:1.03;margin:25px 0}.story p{font-size:16px;max-width:350px}.story .eyebrow{font-size:12px}.story-tag{font-size:12px}.story-number{font-size:43vw;bottom:38px;right:20px;opacity:.6;z-index:0}.story-background{object-position:68%}.story-scrim{background:linear-gradient(90deg,#090f0ee8,#172a2399)}.story-ufo .story-scrim{background:linear-gradient(90deg,#090f0ee3,#172a2385)}.story-ufo .story-background{object-position:66%;opacity:.65}.history-type{font-size:45vw;top:10%}.story-controls{display:none}.zombies{padding-bottom:65px}.zombies-layout{grid-template-columns:1fr;gap:48px;margin-top:55px}.zombies h2{font-size:16vw}.zombies-description{max-width:100%;margin-top:28px}.zombies-photo{margin:0 10px;max-width:550px}.zombies-photo img{aspect-ratio:1;max-height:550px}.photo-stamp{left:-17px;bottom:55px;font-size:20px;padding:17px 12px}.zombies-photo figcaption{font-size:12px}.plan-layout{grid-template-columns:1fr;gap:60px;margin-top:50px}.plan h2{font-size:15vw}.plan h2 br:nth-child(2){display:none}.plan h2 span{display:block}.plan h2 span br{display:none}.plan h2 span{font-size:11vw;line-height:1.2;margin-top:10px}.meeting h3{font-size:38px}.faq summary{font-size:16px}.local-heading{display:block;margin:50px 0 40px}.local h2{font-size:16vw}.local-heading p{margin-top:25px}.local-links>a{grid-template-columns:1fr 30px;gap:13px;padding:26px 0}.local-index{grid-column:1;grid-row:1;font-size:12px}.local h3{grid-column:1;font-size:29px;max-width:100%}.local-description{grid-column:1;font-size:13px;margin:0;line-height:1.5}.local-arrow{grid-column:2;grid-row:1/4;align-self:center}.tickets{min-height:800px}.ticket-content{padding-top:70px;width:100%}.ticket-content>.eyebrow{font-size:12px;letter-spacing:.1em}.tickets h2{font-size:19.5vw;line-height:1.08}.tickets p{font-size:16px}.button-large{min-width:240px;font-size:16px}.ticket-note{font-size:12px;max-width:275px;line-height:1.7;margin:22px auto 0}footer{padding:45px var(--pad) 30px}.footer-brand{font-size:7vw}.footer-bottom{align-items:flex-start;flex-direction:column;gap:22px;font-size:12px;padding-top:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.hero-media{transform:none!important}.motion-ready .reveal{opacity:1;filter:none;transform:none}.reveal-word-block .word{opacity:1;filter:none}.stories-scroll{height:auto}.stories-pin{position:relative;height:auto;min-height:0}.story-track{display:block;transform:none!important}.story{min-height:780px;height:auto}.story-controls{display:none}.stories-heading{display:none}.large-asterisk{transform:none!important}}

/* Source typography and photo details. */
@font-face{font-family:SpaceMono;src:url('/assets/space-mono-400.woff2') format('woff2');font-weight:400;font-display:swap}
.eyebrow,.section-kicker,.hero-topline,.hero-coordinates,.story-tag,.story-count,.local-index,.ticket-note{font-family:SpaceMono,monospace}
.story{isolation:isolate}.tour-proof{position:relative;width:38%;max-width:450px;margin:0 30px 0 0;flex-shrink:0;transform:rotate(-3deg)}
.tour-proof img{aspect-ratio:1.85;filter:saturate(.65);object-position:50% 45%}.tour-proof figcaption{font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-top:13px;color:#bdc8b4}.tour-proof .large-asterisk{position:absolute;right:-25px;top:-25px;font-size:75px}
.intro-bottom{gap:45px;margin-top:55px}.intro-bottom p{max-width:500px}.zombies-photo .bz-wordmark{width:160px;height:auto;max-height:none;aspect-ratio:auto;position:absolute;right:15px;top:-40px;filter:none;transform:rotate(-9deg)}
@media(max-width:760px){.tour-proof{width:90%;max-width:400px;margin:0 0 30px}.intro-bottom{flex-direction:column;gap:0;margin-top:45px}.tour-proof .large-asterisk{font-size:60px;right:-20px;top:-20px}.tour-proof img{aspect-ratio:1.9}.zombies-photo .bz-wordmark{width:130px;top:-32px}.section-kicker{letter-spacing:.025em}.section-kicker span:last-child{max-width:42%}.brand-name{font-size:12px}.brand-mark{display:none}.button-small{font-size:14px;gap:14px}.header-actions{gap:9px}.hero-topline{letter-spacing:.04em}.ticket-content>.eyebrow{line-height:1.8}.zombies-photo figcaption{flex-direction:column;gap:2px}.story-content .eyebrow{letter-spacing:.04em}.story h2{font-size:13.5vw}}

/* Title caps match the 1100px breakpoint where the hero coordinates appear. */
.city-word{font-size:clamp(90px,16.3vw,179px)}.hero{min-height:850px}.hero h1{margin-top:35px}.hero-bottom{padding-top:35px}
@media(max-width:760px){.hero{min-height:730px}.hero h1{margin-top:55px}.city-word{font-size:17.2vw;letter-spacing:-.02em}.hero-bottom{padding-top:35px}}
html:not(.motion-ready) .stories-scroll{height:auto}html:not(.motion-ready) .stories-pin{position:relative;height:auto;min-height:0}html:not(.motion-ready) .story-track{display:block}html:not(.motion-ready) .story{min-height:800px}html:not(.motion-ready) .story-controls,html:not(.motion-ready) .stories-heading{display:none}

/* Creator attribution and media appearances. */
.hero-creator {
  font-size:14px;
  letter-spacing:.055em;
  line-height:1.6;
  text-underline-offset:5px;
}
.hero-creator strong { color:var(--accent); font-weight:400; }
.hero-creator:hover { text-decoration:underline; text-decoration-color:var(--accent); }
.creator-credit {
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(0, .9fr) minmax(0, 1.3fr);
  align-items:center;
  gap:clamp(36px, 5vw, 96px);
  padding:60px var(--pad) 54px;
  background:#111d19;
  border-bottom:1px solid var(--line);
  scroll-margin-top:30px;
}
.creator-label, .creator-media-label {
  display:block;
  font-family:SpaceMono,monospace;
  font-size:14px;
  font-weight:400;
  line-height:1.6;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.creator-label { color:var(--amber); }
.creator-credit h2 {
  font-size:clamp(40px, 4.15vw, 76px);
  line-height:1.05;
  margin:12px 0 14px;
}
.creator-credit p { color:#b6c2af; font-size:16px; line-height:1.6; }
.creator-media-label { color:#b6c2af; letter-spacing:.025em; }
.creator-media-list {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:clamp(18px, 2vw, 34px);
  max-width:760px;
  list-style:none;
  margin:25px 0 0;
  padding:0;
}
.creator-media-list li { display:flex; align-items:center; justify-content:center; flex:0 1 var(--logo-width); min-width:0; min-height:62px; }
.creator-media-list li:nth-child(1) { --logo-width:136px; }
.creator-media-list li:nth-child(2) { --logo-width:112px; }
.creator-media-list li:nth-child(3) { --logo-width:48px; }
.creator-media-list li:nth-child(4) { --logo-width:132px; }
.creator-media-list li:nth-child(5) { --logo-width:128px; }
.creator-media-list img {
  width:100%;
  height:auto;
  object-fit:contain;
  filter:brightness(0) invert(1);
  opacity:.76;
  transition:opacity .3s;
}
.creator-media-list li:hover img { opacity:1; }
.creator-media-list .media-history { height:auto; }
@media(max-width:1100px) {
  .creator-credit { grid-template-columns:1fr; gap:32px; }
  .creator-credit h2 { font-size:clamp(40px, 6vw, 66px); }
  .creator-media-list { max-width:760px; gap:32px; }
}
@media(max-width:760px) {
  .hero-creator { font-size:14px; letter-spacing:.015em; }
  .creator-credit { padding:46px var(--pad) 42px; gap:30px; }
  .creator-credit h2 { font-size:clamp(36px, 9vw, 58px); }
  .creator-label, .creator-media-label { font-size:14px; letter-spacing:0; }
  .creator-media-label { font-size:12px; letter-spacing:.025em; }
  .creator-media-list { flex-wrap:nowrap; justify-content:space-between; max-width:450px; gap:clamp(12px, 3vw, 20px); margin-top:18px; }
  .creator-media-list li { flex:0 1 calc(var(--logo-width) * .64); min-height:36px; max-width:none; }
  .creator-media-list img { height:auto; }
}

/* Low, windblown mist. Only transforms animate. The cloud texture is a
   pre-rendered bitmap: as an SVG filter (feTurbulence + blur) WebKit re-ran it
   for every tile paint, stalling Safari for ~1s per scroll step in the stories. */
.fog-bank {
  position:absolute;
  left:0;
  right:0;
  z-index:-1;
  overflow:hidden;
  overflow:clip;
  pointer-events:none;
  user-select:none;
  contain:layout paint;
  mask-image:linear-gradient(transparent, #000 24%, #000 70%, transparent);
  -webkit-mask-image:linear-gradient(transparent, #000 24%, #000 70%, transparent);
}
.fog-bank--ambient {
  bottom:-8%;
  height:clamp(240px, 49svh, 570px);
  opacity:.70;
}
.fog-bank--seam {
  top:clamp(-150px, -14svh, -80px);
  height:clamp(190px, 30svh, 340px);
  opacity:.62;
}
.fog-wisp {
  position:absolute;
  inset:-8% -28%;
  background:url('/assets/fog.webp') center / 100% 100% no-repeat;
  opacity:.53;
  transform:translate3d(-9%, 4%, 0) scale(1.04);
  animation:fog-drift 40s -19s ease-in-out infinite alternate;
  animation-play-state:paused;
}
.fog-wisp:nth-child(2) {
  inset:2% -38% -16%;
  opacity:.43;
  animation-name:fog-counterdrift;
  animation-duration:56s;
  animation-delay:-41s;
}
.fog-wisp:nth-child(3) {
  inset:-25% -12% 10% -55%;
  opacity:.29;
  animation-duration:70s;
  animation-delay:-62s;
}
.fog-in-view .fog-wisp { animation-play-state:running; }
.fog-paused .fog-wisp { animation-play-state:paused; }
.fog-bank--dark .fog-wisp { filter:brightness(.24) saturate(.65); }
.fog-bank--dark { opacity:.41; }
.story .fog-bank--ambient { height:48%; bottom:-6%; }
.fog-bank--crossing {
  inset:0 -12%;
  z-index:2;
  opacity:0;
  mask-image:linear-gradient(transparent 4%, #000 32%, #000 72%, transparent);
  -webkit-mask-image:linear-gradient(transparent 4%, #000 32%, #000 72%, transparent);
}
.fog-bank--crossing .fog-wisp { opacity:.9; inset:-15% -22%; }
.fog-bank--crossing .fog-wisp:nth-child(2) { inset:10% -40% -35%; opacity:.75; }
.fog-bank--crossing .fog-wisp:nth-child(3) { inset:-40% -50% 5%; opacity:.55; }
@keyframes fog-drift {
  0% { transform:translate3d(-9%, 4%, 0) scale(1.04); }
  52% { transform:translate3d(1%, -5%, 0) scale(1.10); }
  100% { transform:translate3d(9%, 2%, 0) scale(1.03); }
}
@keyframes fog-counterdrift {
  0% { transform:translate3d(10%, -4%, 0) scale(1.13) scaleX(-1); }
  58% { transform:translate3d(-2%, 5%, 0) scale(1.05) scaleX(-1); }
  100% { transform:translate3d(-10%, -2%, 0) scale(1.10) scaleX(-1); }
}
@media(max-width:760px) {
  .fog-bank--ambient { height:34svh; min-height:210px; opacity:.54; }
  .fog-bank--seam { top:-70px; height:180px; opacity:.48; }
  .fog-wisp:nth-child(3), .fog-bank--crossing { display:none; }
  .fog-wisp { animation-duration:52s; }
  .fog-bank--dark { opacity:.32; }
}
@media(prefers-reduced-motion:reduce) {
  .fog-bank { opacity:.26; }
  .fog-wisp { animation:none; }
  .fog-wisp:nth-child(3), .fog-bank--crossing { display:none; }
}

/* Moonlight and lantern light, drawn from the supplied town photographs. */
.hero-media img, .story-background { filter:none; }
.hero-shade {
  background:linear-gradient(180deg, #050b09bf, #050b0947 35%, #050b091a 57%, #050b09eb);
}
.haunted-word { color:var(--paper); }
.city-word { color:var(--accent); }
.title-star { color:var(--amber); }
.brand-mark { color:var(--amber); border-color:var(--amber); }
.marquee {
  background:#182720;
  color:var(--paper);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.marquee i { color:var(--amber); }
.tour-facts strong { color:var(--amber); }
.intro .section-kicker { border-top:0; }
.tour-proof { width:43%; max-width:500px; transform:none; }
.tour-proof img { aspect-ratio:1; filter:none; object-position:center; }
.tour-proof figcaption { color:var(--muted); line-height:1.6; }
.intro-bottom { gap:clamp(35px, 6vw, 110px); }
.intro-bottom p { margin-right:0; }
.story-background { opacity:.95; }
.story-ghost .story-scrim, .story-history .story-scrim {
  background:linear-gradient(90deg, #070e0aeb, #0c1812a6 45%, #101e1726);
}
.story-history .story-background { object-position:62% 50%; }
.story-history h2 em, .story-history .eyebrow { color:var(--amber); }
.zombies { background:var(--surface); color:var(--paper); }
.zombies a:focus-visible { outline-color:var(--amber); }
.zombies .section-kicker { border-color:#405244; }
.zombies .section-kicker span:last-child { color:var(--muted); }
.zombies-layout { grid-template-columns:.82fr 1.18fr; gap:clamp(35px, 4vw, 75px); }
.zombies h2 { font-size:clamp(62px, 6.8vw, 128px); }
.zombies h2 span { color:var(--amber); -webkit-text-stroke:0; }
.zombies-description { max-width:440px; color:#cbd2c0; }
.dark-link { color:var(--amber); border-color:#8b795a; }
.dark-link:hover { color:var(--paper); }
.zombies-photo { margin:0; transform:rotate(1deg); }
.zombies-photo .photo-window {
  aspect-ratio:1.6;
  max-height:none;
  object-position:center;
  filter:none;
}
.zombies-photo figcaption { color:var(--muted); }
.photo-stamp { background:var(--ink); color:var(--amber); border-color:var(--amber); }
.motion-ready .zombies-photo.reveal { transform:translateY(45px) rotate(1deg); }
.motion-ready .zombies-photo.reveal.in-view { transform:rotate(1deg); }
/* Reveals run both ways (app.js): something that left through the top comes
   back in from above, something that left through the bottom from below. */
.motion-ready .reveal.from-above:not(.in-view) { transform:translateY(-45px); }
.motion-ready .zombies-photo.reveal.from-above:not(.in-view) { transform:translateY(-45px) rotate(1deg); }
.plan h2 span { color:var(--accent); }
.ticket-background img { opacity:1; object-position:center; }
.ticket-background::after {
  background:linear-gradient(#090f0ef0, #090f0e8c 40%, #090f0e99 65%, #090f0ef5);
}
.tickets h2 span { color:var(--amber); }
.creator-credit { grid-template-columns:minmax(0, 1.15fr) minmax(0, 1fr); gap:48px; }
.creator-copy { display:grid; grid-template-columns:clamp(125px, 11vw, 180px) minmax(0, 1fr); gap:26px; align-items:center; }
.creator-portrait { width:100%; height:auto; aspect-ratio:3/4; object-fit:cover; object-position:44% 42%; }
.creator-credit h2 { font-size:clamp(34px, 3vw, 52px); }
.creator-bio p { max-width:270px; }
@media(max-width:1100px) {
  .creator-credit { grid-template-columns:1fr; gap:34px; }
}
@media(max-width:760px) {
  .hero-media img { object-position:50% 50%; }
  .tour-proof { width:100%; max-width:500px; margin:0 0 32px; }
  .intro-bottom { gap:0; }
  .story-ghost .story-scrim, .story-history .story-scrim {
    background:linear-gradient(90deg, #070e0ade, #0c18128c);
  }
  .zombies-layout { grid-template-columns:1fr; gap:48px; }
  .zombies h2 { font-size:clamp(52px, 14vw, 80px); }
  .zombies-photo { max-width:none; margin:0 5px; }
  .zombies-photo .photo-window { aspect-ratio:1.35; }
  .creator-copy { grid-template-columns:110px minmax(0, 1fr); gap:20px; }
  .creator-credit h2 { font-size:clamp(30px, 7vw, 46px); }
}
@media(prefers-reduced-motion:reduce) {
  .motion-ready .zombies-photo.reveal { transform:none; }
}

/* Clear space for the lettering's tall, irregular ascenders. */
.brand-logo { width:150px; height:auto; object-fit:contain; filter:brightness(0) invert(1); }
.hero { height:auto; min-height:max(850px, 100svh); max-height:none; }
.hero-topline, .hero h1, .hero-bottom { flex-shrink:0; }
.hero-topline { z-index:2; margin-top:clamp(22px, 2vw, 36px); }
.hero h1 { margin-top:clamp(86px, 6.6vw, 132px); }
.creator-bio p { text-wrap:pretty; }
.story-ghost .story-content p, .story-history .story-content p, .zombies-description p { text-wrap:pretty; }
footer { padding:32px var(--pad); }
.footer-bottom { padding-top:0; align-items:center; }
.site-credit { display:inline-flex; align-items:center; gap:12px; font-size:14px; min-height:44px; }
.site-credit-icon { width:36px; height:36px; flex:0 0 36px; border-radius:50%; object-fit:contain; }
.site-credit .site-credit-name { color:var(--paper); text-decoration:underline; text-underline-offset:4px; white-space:nowrap; }
.site-credit:hover .site-credit-name { color:var(--amber); }
@media(max-width:760px) { .footer-bottom { align-items:flex-start; } }

/* Native details remain usable without the animation enhancement. */
.faq details { padding:0; transition:background-color .3s; }
.faq details:hover { background-color:#d9b47b06; }
.faq summary {
  align-items:center;
  padding:22px 4px;
  transform:translateX(0);
  transition:color .25s, transform .4s cubic-bezier(.2,.8,.2,1);
}
.faq summary:hover, .faq summary:focus-visible { color:var(--amber); transform:translateX(4px); }
.faq summary span {
  display:grid;
  place-items:center;
  flex:0 0 32px;
  width:32px;
  height:32px;
  border:1px solid var(--line);
  border-radius:50%;
  color:var(--amber);
  font-size:24px;
  line-height:1;
  transition:transform .65s cubic-bezier(.2,1.4,.3,1), background-color .35s, color .35s, border-color .35s;
}
.faq details[data-expanded="true"] summary span {
  transform:rotate(225deg);
  background:var(--amber);
  border-color:var(--amber);
  color:var(--ink);
}
.faq details[data-expanded="false"] summary span { transform:rotate(0); }
.faq-answer { display:flow-root; padding:0 44px 25px 4px; transform-origin:top center; }
.faq .faq-answer p { margin-top:0; max-width:none; }
.faq .faq-answer p + p { margin-top:12px; }
.faq-answer strong { color:var(--paper); }
@media(max-width:760px) {
  .brand-logo { width:clamp(82px, 25vw, 108px); }
  .hero { min-height:max(760px, 100svh); }
  .hero h1 { margin-top:64px; }
  .faq-answer { padding-right:24px; }
}
@media(prefers-reduced-motion:reduce) {
  .faq summary:hover, .faq summary:focus-visible { transform:none; }
}

/* Keep the main Beer Zombies content centered beneath its section label. */
@media(min-width:761px) {
  .zombies {
    display:flex;
    flex-direction:column;
    min-height:100svh;
    padding-bottom:45px;
  }
  .zombies > .section-kicker { flex-shrink:0; }
  .zombies-layout {
    flex:0 0 auto;
    margin-block:auto;
    padding-block:60px;
  }
}

/* Vector icons render consistently without an emoji font fallback. */
.icon { display:inline-block; width:1em; height:1em; flex:0 0 auto; vertical-align:-.12em; }
.title-star .icon, .large-asterisk .icon, .marquee i .icon { display:block; }
.title-star, .large-asterisk, .marquee i { line-height:1; }
.button .icon { width:1em; height:1em; }
.faq summary .icon { width:18px; height:18px; }
.footer-bottom > a:last-child { display:inline-flex; align-items:center; gap:8px; }
.photo-window { position:relative; overflow:hidden; isolation:isolate; }
.tour-proof .photo-window { aspect-ratio:1; }
.photo-window img { position:absolute; inset:0; width:100%; height:100%; max-height:none; aspect-ratio:auto; object-fit:cover; filter:none; }
@media(max-width:760px) and (prefers-reduced-motion:no-preference) {
  .story { height:auto; min-height:max(670px, 90svh); }
  .story-background { top:-10%; bottom:auto; height:120%; will-change:transform; }
  .story-number { will-change:transform; }
  .motion-ready .story-content { opacity:0; filter:blur(5px); transform:translate3d(0, 28px, 0); transition:opacity .75s, filter .9s, transform .95s cubic-bezier(.2,.75,.25,1); }
  .motion-ready .story-content.in-view { opacity:1; filter:none; transform:translate3d(0, 0, 0); }
  .motion-ready .story-content.from-above:not(.in-view) { transform:translate3d(0, -28px, 0); }
  .photo-window img { top:-8%; bottom:auto; height:116%; will-change:transform; }
  .ticket-background img { position:absolute; top:-8%; height:116%; will-change:transform; }
  .round-arrow .icon { animation:arrow-drift 2.8s ease-in-out infinite; }
  .fog-wisp { animation-duration:44s; }
  .fog-wisp:nth-child(2) { animation-duration:60s; }
}
/* Wider screens: the Beer Zombies photograph gets the same overscan so it can
   drift against the scroll inside its window (driven from app.js). */
@media(min-width:761px) and (prefers-reduced-motion:no-preference) {
  .zombies-photo .photo-window img { top:-10%; bottom:auto; height:120%; will-change:transform; }
}
@keyframes arrow-drift { 0%,100% { transform:translateY(-2px); } 50% { transform:translateY(3px); } }
@media(hover:none) and (prefers-reduced-motion:no-preference) {
  .button:hover { transform:none; }
  .button:active { transform:scale(.97); }
  .text-link:active .icon, .local-links a:active .icon { transform:translate(2px, -2px); }
  .icon { transition:transform .2s; }
}
@media(prefers-reduced-motion:reduce) {
  .hero h1 { translate:none!important; opacity:1!important; }
  .story-content { opacity:1!important; filter:none!important; transform:none!important; }
  .story-background, .story-number, .photo-window img, .ticket-background img { transform:none!important; }
}

/* A concise review cue beneath the final ticket invitation. */
.review-proof { display:inline-flex; align-items:center; gap:18px; max-width:100%; margin-top:22px; padding:14px 0; color:var(--paper); }
.review-proof-score { font-size:32px; line-height:1; font-weight:700; letter-spacing:-.04em; }
.review-proof-score > span { margin-left:3px; font-size:14px; font-weight:400; letter-spacing:0; color:var(--muted); }
.review-proof-copy { display:flex; flex-direction:column; gap:2px; line-height:1.4; }
.review-proof-copy > strong { font-size:16px; color:var(--amber); }
.review-proof-copy > span { font-size:14px; color:var(--muted); }
.review-proof > .icon { width:20px; height:20px; margin-left:8px; color:var(--amber); transition:transform .25s; }
.review-proof:hover > .icon, .review-proof:focus-visible > .icon { transform:translate(2px,-2px); }
@media(max-width:760px) { .review-proof { gap:14px; margin-top:16px; } }

/* A moving photographic atmosphere beneath an oversized, staggered index. */
.tour-highlights { background:var(--ink); overflow:clip; }
.highlights-atmosphere { position:sticky; top:0; height:100svh; margin-bottom:-100svh; overflow:hidden; pointer-events:none; }
.highlights-atmosphere img { position:absolute; inset:-5% 0; height:110%; width:100%; object-fit:cover; opacity:0; transition:opacity 1.1s ease; }
.highlights-atmosphere img.is-active { opacity:.4; }
.highlights-atmosphere [data-topic-image="ghost"] { object-position:70% 50%; }
.highlights-atmosphere [data-topic-image="bodies"] { object-position:68% 55%; }
.highlights-atmosphere [data-topic-image="sky"] { object-position:62% 42%; }
.highlights-atmosphere [data-topic-image="guide"] { object-position:50% 58%; }
.highlights-atmosphere [data-topic-image="celebs"] { object-position:40% 50%; }
.highlights-atmosphere [data-topic-image="esp"] { object-position:45% 50%; }
.highlights-atmosphere::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,var(--ink),#090f0e55 24%,#090f0e77 75%,var(--ink)),linear-gradient(90deg,#090f0e66,#090f0e1a); }
.highlights-content { position:relative; padding-top:100px; padding-bottom:100px; }
.highlights-heading { position:relative; padding-bottom:64px; }
.tour-highlights h2 { position:relative; z-index:1; font-size:clamp(58px,7.8vw,132px); line-height:1.02; }
.tour-highlights h2 span { color:var(--amber); }
.tour-highlights-list { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:32px; row-gap:22px; list-style:none; padding:0; margin:0; }
.topic { grid-column:1 / 11; padding:32px 0 36px 30px; position:relative; min-width:0; }
.topic:nth-child(even) { grid-column:3 / 13; }
.topic-index { display:block; margin-bottom:14px; color:var(--amber); font:400 12px/1.5 'SpaceMono',monospace; text-transform:uppercase; letter-spacing:.12em; }
.topic h3 { font-size:clamp(50px,7.7vw,124px); line-height:1.08; letter-spacing:.005em; color:var(--paper); text-wrap:balance; }
@supports (-webkit-text-stroke:1px #c0ccb9) {
  .topic h3 { color:transparent; -webkit-text-stroke:1px #c0ccb9; }
  .topic.is-current h3 { color:var(--paper); -webkit-text-stroke-color:transparent; }
}
@media(prefers-reduced-motion:no-preference) {
  .topic h3 { transition:color .65s,-webkit-text-stroke-color .65s; }
}
.topic p { max-width:510px; margin-top:16px; color:#c5cebf; font-size:clamp(16px,1.3vw,19px); text-wrap:pretty; }
.topic::before { content:""; position:absolute; top:34px; left:0; height:24px; width:2px; background:var(--amber); opacity:.4; transition:height .65s,opacity .65s; }
.topic.is-current::before { height:calc(100% - 70px); opacity:1; }
.faq { border-top:1px solid var(--line); }
.story { isolation:isolate; }
@media(min-width:761px) and (prefers-reduced-motion:no-preference) {
  .motion-ready .story-background { left:-2%; right:auto; width:104%; will-change:transform; }
  .motion-ready .topic h3 { transform:translateX(-16px); transition:color .65s,-webkit-text-stroke-color .65s,transform .8s cubic-bezier(.2,.75,.25,1); }
  .motion-ready .topic.is-current h3 { transform:translateX(0); }
}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  .motion-ready .topic:hover h3 { color:var(--paper); -webkit-text-stroke-color:transparent; transform:translateX(0); }
}
@media(max-width:760px) {
  .highlights-content { padding-top:65px; padding-bottom:65px; }
  .highlights-heading { padding-bottom:40px; }
  .tour-highlights h2 { font-size:clamp(44px,10vw,76px); }
  .highlights-atmosphere img.is-active { opacity:.3; }
  .highlights-atmosphere [data-topic-image="ghost"] { object-position:86% 50%; }
  .tour-highlights-list { display:block; }
  .topic, .topic:nth-child(even) { padding:24px 0 32px 20px; margin:0; }
  .topic-index { margin-bottom:12px; }
  .topic h3 { font-size:clamp(44px,10vw,76px); }
  .topic p { margin-top:12px; }
  .topic::before { top:26px; }
  .topic.is-current::before { height:calc(100% - 60px); }
}
@media(prefers-reduced-motion:reduce) {
  .highlights-atmosphere img { transition:none; transform:none!important; }
  .topic::before { transition:none; }
}

/* Responsive refinements for the hero, section labels and footer. */
html { overflow-x:clip; }
/* Clip the tilted banner's outer edges without changing the page's scroll container. */
.marquee-shell {
  position:relative;
  z-index:2;
  overflow:hidden;
  width:100%;
  padding-block:2vw;
  margin-top:calc(-13px - 2vw);
  margin-bottom:-2vw;
}
.marquee-shell > .marquee { margin-top:0; }
.hero-intro-sentence { display:block; }
.explore-link { width:auto; gap:0; margin-left:auto; }
.zombies-photo .bz-wordmark { filter:brightness(0) invert(1); }
@media(max-width:760px) {
  .hero-intro p { max-width:30ch; }
  .hero-intro-sentence { text-wrap:balance; }
  .section-kicker > span:nth-child(2) { display:none; }
  .footer-bottom { align-items:center; text-align:center; }
  .site-credit { justify-content:center; max-width:100%; }
}
.tickets .review-proof { margin-top:20px; text-align:left; }
@media(max-width:760px) {
  .creator-credit { text-align:center; }
  .creator-copy { grid-template-columns:minmax(0,1fr); justify-items:center; gap:18px; }
  .creator-portrait { width:110px; }
  .creator-bio p { margin-inline:auto; text-wrap:balance; }
  .creator-media { width:100%; min-width:0; }
  .creator-media-list { margin-inline:auto; }
}

/* One viewport light follows the cursor without intercepting clicks or scrolling.
   No blend mode: macOS Safari mishandles mix-blend-mode on full-viewport fixed
   layers (blend dropped, blank tiles, stalled scrolling). Plain alpha reads the
   same over this dark palette. translateZ pins it to its own compositor layer.
   Touch, coarse pointers, and reduced-motion visitors skip the effect entirely. */
.flashlight { position:fixed; inset:0; z-index:45; overflow:hidden; pointer-events:none; transform:translateZ(0); transition:opacity .3s ease; }
.flashlight::before { content:""; position:absolute; top:0; left:0; width:1000px; height:1000px; background:radial-gradient(circle closest-side, rgba(194,210,170,.10), transparent 70%); transform:translate3d(calc(var(--mouse-x,75vw) - 50%),calc(var(--mouse-y,45vh) - 50%),0); will-change:transform; }
.flashlight.is-hidden { opacity:0; }
@media (hover: none), (pointer: coarse) { .flashlight { display: none; } }
@media (prefers-reduced-motion: reduce) { .flashlight { display: none; } }

/* Mobile Safari scrolls on the compositor. JS parallax updates arrive late and
   hitch when the toolbars collapse. Drive the hero image from a view timeline
   instead; older browsers keep a still photograph rather than a jumpy one. */
@media (hover: none), (pointer: coarse) {
  .hero-media { will-change: auto; }
}
@supports (animation-timeline: view()) or (animation-timeline: scroll()) {
  @media (hover: none), (pointer: coarse) {
    @media (prefers-reduced-motion: no-preference) {
      .hero {
        view-timeline-name: --hero-scroll;
        view-timeline-axis: block;
      }
      .hero-media {
        animation: hero-media-shift linear both;
        animation-timeline: --hero-scroll;
        animation-range: exit 0% exit 100%;
      }
    }
  }
}
@keyframes hero-media-shift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(0, 22svh, 0); }
}

/* Loading screen. Mist gathers over the ink, the title condenses out of it,
   then the fog parts and the veil lifts while the hero makes its entrance.
   Transform and opacity only; the fog is the same pre-rendered bitmap. Shown
   only while html.is-loading (set by the head script), so no-JS visits skip it. */
.loader { display:none; position:fixed; inset:0; z-index:200; overflow:hidden; color:var(--paper); }
.is-loading .loader, .loader.is-parting { display:block; }
.loader.is-parting { pointer-events:none; }
.loader-veil { position:absolute; inset:0; background:radial-gradient(ellipse 95% 75% at 50% 64%, #17281f 0%, #0b1512 48%, #070c0b 100%); transition:opacity 1.1s .3s ease; }
/* Looping animations live on ::before children; the parting transitions run on
   the parents. WebKit skips a transition entirely when the same frame removes an
   animation from that property, so nothing here is ever un-animated mid-flight. */
.loader-lantern { position:absolute; left:50%; top:56%; width:min(120vmin, 1100px); aspect-ratio:1; transform:translate(-50%,-50%); transition:opacity .9s ease, transform .9s ease; }
.loader-lantern::before { content:""; position:absolute; inset:0; background:radial-gradient(circle closest-side, rgba(217,180,123,.28), rgba(217,180,123,.09) 40%, transparent 70%); animation:loader-breathe 3.4s ease-in-out infinite alternate; }
.loader-title { position:absolute; left:50%; top:50%; transform:translate(-50%,-56%); text-align:center; line-height:.9; white-space:nowrap; transition:opacity .7s ease, filter .7s ease, transform .7s ease; }
.loader-word { display:block; animation:loader-condense 1.7s cubic-bezier(.2,.7,.2,1) both; }
.loader-word--haunted { font-family:Manticore,var(--display); font-size:clamp(72px,14vw,220px); letter-spacing:-.035em; color:var(--paper); animation:loader-condense 1.7s cubic-bezier(.2,.7,.2,1) both, loader-flicker 5s 2s linear infinite; }
.loader-word--city { font-family:var(--display); font-size:clamp(44px,7.6vw,120px); letter-spacing:-.005em; color:var(--accent); margin-top:.1em; animation-delay:.18s; }
.loader-word--city .icon { display:inline-block; width:.5em; height:.5em; margin-left:.22em; vertical-align:middle; color:var(--amber); animation:slow-spin 7s linear infinite; }
.loader-fog { position:absolute; inset:0; pointer-events:none; }
.loader-fog span { position:absolute; will-change:transform; transition:transform 1.15s cubic-bezier(.45,0,.2,1), opacity 1s ease; }
.loader-fog span::before { content:""; position:absolute; inset:0; background:url('/assets/fog.webp') center / 100% 100% no-repeat; animation:loader-drift-a 26s -9s ease-in-out infinite alternate; }
.loader-fog--back span:nth-child(1) { left:-30%; right:-30%; bottom:-14%; height:62%; opacity:.58; }
.loader-fog--back span:nth-child(2) { left:-38%; right:-22%; top:-20%; height:46%; opacity:.22; }
.loader-fog--back span:nth-child(2)::before { animation:loader-drift-b 44s -5s ease-in-out infinite alternate; }
.loader-fog--front span:nth-child(1) { left:-40%; right:-20%; bottom:-8%; height:44%; opacity:.42; }
.loader-fog--front span:nth-child(1)::before { animation:loader-drift-b 32s -17s ease-in-out infinite alternate; }
.loader-fog--front span:nth-child(2) { left:-20%; right:-45%; top:36%; height:40%; opacity:.26; }
.loader-fog--front span:nth-child(2)::before { animation-duration:38s; animation-delay:-22s; }
.loader-foot { position:absolute; inset:0; pointer-events:none; transition:opacity .35s ease; }
.loader-status, .loader-coords { position:absolute; bottom:34px; margin:0; font:400 12px/1.5 SpaceMono,monospace; letter-spacing:.11em; text-transform:uppercase; color:var(--muted); }
.loader-status { left:var(--pad); display:flex; align-items:center; animation:hero-in 1.2s .5s both; }
.loader-coords { right:var(--pad); color:#8f9f8d; animation:hero-in 1.2s .65s both; }
.loader-dots { display:inline-flex; margin-left:8px; gap:4px; }
.loader-dots i { width:4px; height:4px; border-radius:50%; background:var(--amber); animation:loader-dot 1.2s ease-in-out infinite; }
.loader-dots i:nth-child(2) { animation-delay:.2s; }
.loader-dots i:nth-child(3) { animation-delay:.4s; }
.loader-progress { position:absolute; left:0; right:0; bottom:0; height:2px; background:#1c2a24; }
.loader-progress span { display:block; height:100%; background:var(--amber); transform-origin:left; transform:scaleX(0); animation:loader-progress 2.8s cubic-bezier(.15,.6,.25,1) forwards; }
/* Parting: fog sweeps outward, the title dissolves, the veil lifts. Animations
   are released so the transitions pick up from wherever the drift left them. */
.loader.is-parting .loader-fog span { opacity:0; }
.loader.is-parting .loader-fog--back span:nth-child(1), .loader.is-parting .loader-fog--front span:nth-child(2) { transform:translate3d(-42%, 5%, 0) scale(1.18); }
.loader.is-parting .loader-fog--back span:nth-child(2), .loader.is-parting .loader-fog--front span:nth-child(1) { transform:translate3d(42%, -5%, 0) scale(1.18); }
.loader.is-parting .loader-lantern { opacity:0; transform:translate(-50%,-50%) scale(1.35); }
.loader.is-parting .loader-title { opacity:0; filter:blur(12px); transform:translate(-50%,-64%) scale(1.05); }
.loader.is-parting .loader-veil, .loader.is-parting .loader-foot { opacity:0; }
/* Hold the hero entrance until the mist parts, so both read as one moment. */
.is-loading .hero h1, .is-loading .hero-topline, .is-loading .hero-bottom { animation-play-state:paused; }
@keyframes loader-condense { from { opacity:0; filter:blur(18px); transform:translateY(12px); } 55% { opacity:1; } to { opacity:1; filter:blur(0); transform:translateY(0); } }
@keyframes loader-flicker { 0%, 40%, 44%, 47%, 100% { opacity:1; } 41.5% { opacity:.45; } 45.5% { opacity:.75; } }
@keyframes loader-breathe { from { opacity:.6; transform:scale(.94); } to { opacity:1; transform:scale(1.06); } }
@keyframes loader-drift-a { from { transform:translate3d(-6%, 2%, 0) scale(1.04); } to { transform:translate3d(6%, -3%, 0) scale(1.12); } }
@keyframes loader-drift-b { from { transform:translate3d(7%, -2%, 0) scale(1.10); } to { transform:translate3d(-7%, 3%, 0) scale(1.03); } }
@keyframes loader-dot { 0%, 100% { opacity:.25; transform:translateY(0); } 50% { opacity:1; transform:translateY(-3px); } }
@keyframes loader-progress { to { transform:scaleX(.86); } }
@media(max-width:760px) {
  .loader-coords { display:none; }
  .loader-fog--back span:nth-child(1) { height:52%; }
}

/* Inertial scrolling drives the scroll position itself, so the browser must not
   add its own easing on top. Sections focused after an in-page glide need no ring. */
.smooth-scroll { scroll-behavior:auto; }
.smooth-scroll [tabindex="-1"]:focus { outline:0; }

/* Mobile menu. A veil darkens the page, the mist rolls in from the edges, and
   the stops condense in one after another with a note on what each one is. The
   meeting point sits at the foot like a field note. Same fog bitmap, transforms
   and opacity only. Open and close carry their own timings: the open has room
   to breathe, the close is quick. The page is locked while it is up. */
.menu-toggle { display:inline-flex; background:none; color:inherit; border:0; min-height:44px; padding:6px 0 6px 6px; align-items:center; gap:10px; font:400 11px/1 SpaceMono,monospace; letter-spacing:.11em; text-transform:uppercase; }
.menu-toggle-lines { display:block; width:22px; }
.menu-toggle-lines i { display:block; height:1px; background:currentColor; margin:7px 0; transition:transform .3s cubic-bezier(.2,.7,.2,1); }
.menu-open .menu-toggle-lines i:first-child { transform:translateY(4px) rotate(45deg); }
.menu-open .menu-toggle-lines i:last-child { transform:translateY(-4px) rotate(-45deg); }
/* The menu carries its own full-width ticket button, so the header's steps aside
   (keeping its space, so the Close control does not shift). */
.menu-open .header-actions .button-small { opacity:0; visibility:hidden; transition:opacity .25s ease, visibility 0s .25s; }
/* Locking the page must not reflow it: keep the scrollbar's gutter reserved. */
html { scrollbar-gutter:stable; }
html.menu-open { overflow:hidden; }
.site-nav { position:fixed; inset:0; z-index:49; overflow-y:auto; overscroll-behavior:contain; color:var(--paper); }
.site-nav::before { content:""; position:fixed; inset:0; background:radial-gradient(ellipse 120% 80% at 50% 100%, #17281f 0%, #0b1512 50%, #070c0b 100%); opacity:0; transition:opacity .35s ease .15s; }
.site-nav.is-open::before { opacity:1; transition:opacity .45s ease; }
.site-nav-fog { position:fixed; inset:0; overflow:hidden; pointer-events:none; }
.site-nav-fog span { position:absolute; opacity:0; transition:transform .5s cubic-bezier(.4,0,.6,1), opacity .4s ease; }
.site-nav-fog span::before { content:""; position:absolute; inset:0; background:url('/assets/fog.webp') center / 100% 100% no-repeat; animation:loader-drift-a 30s ease-in-out infinite alternate; }
.site-nav-fog span:nth-child(1) { left:-35%; right:-35%; bottom:-14%; height:58%; transform:translate3d(-45%, 16%, 0) scale(1.1); }
.site-nav-fog span:nth-child(2) { left:-40%; right:-30%; top:-22%; height:48%; transform:translate3d(40%, -18%, 0) scale(1.1); }
.site-nav-fog span:nth-child(2)::before { animation-name:loader-drift-b; animation-duration:38s; }
.site-nav-fog span:nth-child(3) { left:-30%; right:-40%; top:34%; height:42%; transform:translate3d(-35%, 0, 0) scale(1.1); }
.site-nav-fog span:nth-child(3)::before { animation-duration:44s; animation-delay:-12s; }
.site-nav.is-open .site-nav-fog span { transform:translate3d(0, 0, 0) scale(1); transition:transform 1s cubic-bezier(.2,.7,.2,1), opacity .8s ease; }
.site-nav.is-open .site-nav-fog span:nth-child(1) { opacity:.55; }
.site-nav.is-open .site-nav-fog span:nth-child(2) { opacity:.28; transition-delay:.05s; }
.site-nav.is-open .site-nav-fog span:nth-child(3) { opacity:.3; transition-delay:.1s; }
.site-nav-inner { position:relative; z-index:1; display:flex; flex-direction:column; min-height:calc(100% + 1px); padding:104px var(--pad) 24px; }
.site-nav-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.site-nav-list a { display:grid; grid-template-columns:36px 1fr; align-items:start; padding:13px 0 12px; border-bottom:1px solid var(--line); color:var(--paper); }
.site-nav-list a:focus-visible { outline-offset:-3px; }
.site-nav-index { margin-top:7px; font:400 12px/1 SpaceMono,monospace; letter-spacing:.1em; color:var(--amber); }
.site-nav-label { grid-column:2; font-family:var(--display); font-size:clamp(36px, 10.5vw, 56px); line-height:.95; letter-spacing:-.005em; text-transform:uppercase; transition:color .2s; }
.site-nav-note { grid-column:2; margin-top:7px; font:400 11px/1.5 SpaceMono,monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.site-nav-list a:hover .site-nav-label, .site-nav-list a:active .site-nav-label { color:var(--accent); }
.site-nav-footer { margin-top:auto; padding-top:20px; display:grid; gap:20px; }
.site-nav-cta { width:100%; }
.site-nav-meet { display:grid; grid-template-columns:1fr auto; gap:3px 16px; align-items:end; margin:0; font:400 11px/1.6 SpaceMono,monospace; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.site-nav-meet-label { color:var(--accent); }
.site-nav-meet strong { font-weight:400; color:var(--paper); }
.site-nav-meet a { grid-column:2; grid-row:1 / 3; display:inline-flex; align-items:center; gap:6px; align-self:end; padding-bottom:3px; border-bottom:1px solid #6c7b6c; color:var(--amber); }
.site-nav-meet a .icon { width:11px; height:11px; }
/* Cascade. Rows condense in with a stagger on open and fall away together on close. */
.site-nav-list li, .site-nav-footer { opacity:0; transform:translateY(22px); filter:blur(6px); transition:opacity .25s ease, transform .3s ease, filter .3s ease; }
.site-nav.is-open .site-nav-list li, .site-nav.is-open .site-nav-footer { opacity:1; transform:none; filter:blur(0); transition:opacity .6s ease, transform .7s cubic-bezier(.2,.7,.2,1), filter .6s ease; }
.site-nav.is-open .site-nav-list li:nth-child(1) { transition-delay:.26s; }
.site-nav.is-open .site-nav-list li:nth-child(2) { transition-delay:.34s; }
.site-nav.is-open .site-nav-list li:nth-child(3) { transition-delay:.42s; }
.site-nav.is-open .site-nav-list li:nth-child(4) { transition-delay:.5s; }
.site-nav.is-open .site-nav-footer { transition-delay:.62s; }
/* Wider screens: the stops take the left, centered in the height; tickets and
   the meeting point hold the bottom right. The rows grow with the viewport. */
@media(min-width:761px) {
  .menu-toggle { font-size:12px; gap:12px; }
  .menu-toggle-lines { width:26px; }
  .site-nav-inner { display:grid; grid-template-columns:minmax(0, 1.3fr) minmax(300px, .7fr); column-gap:clamp(48px, 7vw, 140px); align-items:end; padding:150px var(--pad) 48px; }
  .site-nav-list { align-self:center; }
  .site-nav-list a { grid-template-columns:60px 1fr; padding:20px 0 18px; }
  .site-nav-index { margin-top:10px; font-size:13px; }
  .site-nav-label { font-size:clamp(52px, 5.8vw, 92px); transition:color .2s, transform .35s cubic-bezier(.2,.7,.2,1); }
  .site-nav-list a:hover .site-nav-label, .site-nav-list a:focus-visible .site-nav-label { transform:translateX(8px); }
  .site-nav-note { margin-top:9px; font-size:12px; }
  .site-nav-footer { margin-top:0; padding-top:0; gap:26px; }
  .site-nav-meet { font-size:12px; }
}
/* The passer-by. A pre-rendered orb (spirit.webp: a soft luminous body in a
   wide hazy aura, with a little mist clinging to it) crosses the final call
   to action: in low from one side, a hesitation behind the ticket button,
   then away and out of the section. Its light shows beneath the fog
   (.spirit-light sits under the fog bank) and as a sheen across the amber
   word. Three copies of the orb, a couple of frames apart, thicken its glow
   when it slows and blur it slightly when it moves fast, and the image itself
   pulses slowly on a child, so the flight on the parent never has to share a
   property with it.
   app.js drives it with custom properties on .tickets: --dir (1 crosses left
   to right, -1 the reverse), --spirit-duration, --spirit-peak (how much of the
   orb's light shows), --spirit-linger (how far below the section's centre
   the button sits) and --spirit-side (how far from the button's centre it
   should hold, so it peeks out past the edge on any layout). Transform and
   opacity only; the orb is never flipped by a filter, its direction comes
   from the sign of the scale. */
.tickets { --dir:1; --spirit-duration:2800ms; --spirit-peak:.9; --spirit-linger:14vh; --spirit-side:0px; }
.spirit, .spirit-light { position:absolute; z-index:-1; pointer-events:none; }
.spirit { inset:0; }
.spirit i, .spirit-light { position:absolute; left:50%; top:50%; opacity:0; will-change:transform, opacity; }
.spirit i { --trail:1; width:clamp(170px, 26vw, 340px); aspect-ratio:10 / 7; }
.spirit i::before { content:""; position:absolute; inset:0; background:url('/assets/spirit.webp') center / 100% 100% no-repeat; animation:spirit-pulse 3.2s ease-in-out infinite alternate; }
.spirit i:nth-child(2) { --trail:.45; --lag:30ms; }
.spirit i:nth-child(2)::before { animation-duration:3.7s; animation-delay:-1.2s; }
.spirit i:nth-child(3) { --trail:.22; --lag:65ms; }
.spirit i:nth-child(3)::before { animation-duration:4.3s; animation-delay:-2.5s; }
@keyframes spirit-pulse {
  from { transform:scale(.93) rotate(-6deg); }
  to { transform:scale(1.07) rotate(6deg); }
}
.spirit-light { --trail:1; --lag:40ms; width:clamp(340px, 42vw, 560px); aspect-ratio:1; background:radial-gradient(circle closest-side, rgba(246,230,196,.62), rgba(217,180,123,.26) 38%, transparent 70%); }
.tickets.is-haunted .spirit i, .tickets.is-haunted .spirit-light { animation:spirit-rise var(--spirit-duration) var(--lag, 0ms) both; }
.tickets.is-haunted.spirit--dip .spirit i, .tickets.is-haunted.spirit--dip .spirit-light { animation-name:spirit-dip; }
/* The flight is two legs meeting at the hold point beside the button. The
   first leg eases out to a crawl and the second eases in from one, with the
   curves chosen so neither ends at a dead stop: the orb slows, drifts through
   the hold, and gathers speed again without a corner or a pause. Opacity has
   its own keyframes; they do not split the transform legs. */
/* Rising flight: enters low, holds level with the button, leaves high. */
@keyframes spirit-rise {
  0% { opacity:0; transform:translate3d(calc(var(--dir) * -82vw), 26vh, 0) translate(-50%, -50%) rotate(calc(var(--dir) * -3deg)) scale(calc(var(--dir) * .8), .8); animation-timing-function:cubic-bezier(.2,.6,.45,.94); }
  14% { opacity:calc(var(--spirit-peak) * var(--trail) * .6); }
  46% { opacity:calc(var(--spirit-peak) * var(--trail)); transform:translate3d(calc(var(--dir) * -1 * var(--spirit-side)), var(--spirit-linger), 0) translate(-50%, -50%) rotate(calc(var(--dir) * -5deg)) scale(var(--dir), 1); animation-timing-function:cubic-bezier(.55,.06,.8,.4); }
  60% { opacity:calc(var(--spirit-peak) * var(--trail)); }
  100% { opacity:0; transform:translate3d(calc(var(--dir) * 82vw), -36vh, 0) translate(-50%, -50%) rotate(calc(var(--dir) * -17deg)) scale(calc(var(--dir) * 1.08), 1.08); }
}
/* Diving flight: enters high, same hold, leaves down into the fog. */
@keyframes spirit-dip {
  0% { opacity:0; transform:translate3d(calc(var(--dir) * -82vw), -28vh, 0) translate(-50%, -50%) rotate(calc(var(--dir) * 4deg)) scale(calc(var(--dir) * .8), .8); animation-timing-function:cubic-bezier(.2,.6,.45,.94); }
  14% { opacity:calc(var(--spirit-peak) * var(--trail) * .6); }
  46% { opacity:calc(var(--spirit-peak) * var(--trail)); transform:translate3d(calc(var(--dir) * -1 * var(--spirit-side)), var(--spirit-linger), 0) translate(-50%, -50%) rotate(calc(var(--dir) * 4deg)) scale(var(--dir), 1); animation-timing-function:cubic-bezier(.55,.06,.8,.4); }
  60% { opacity:calc(var(--spirit-peak) * var(--trail)); }
  100% { opacity:0; transform:translate3d(calc(var(--dir) * 82vw), 34vh, 0) translate(-50%, -50%) rotate(calc(var(--dir) * 14deg)) scale(calc(var(--dir) * 1.08), 1.08); }
}
/* What the spirit's light touches: the button warms as it hesitates nearby,
   and a pale sheen crosses the amber word in its direction of travel. The
   gradient is always on the word, with the bright band parked off the text,
   so nothing changes about the word until a pass moves it. */
.tickets.is-haunted .button-large { animation:spirit-flare var(--spirit-duration) ease-in-out both; }
@keyframes spirit-flare {
  0%, 22% { box-shadow:0 0 0 0 rgba(217,180,123,0); }
  46% { box-shadow:0 0 90px 14px rgba(217,180,123, calc(var(--spirit-peak) * .34)); }
  100% { box-shadow:0 0 0 0 rgba(217,180,123,0); }
}
@supports (-webkit-background-clip:text) or (background-clip:text) {
  .tickets h2 span { background:linear-gradient(100deg, var(--amber) 0 41%, #f4e5c6 50%, var(--amber) 59% 100%) calc(50% + var(--dir) * 50%) 0 / 300% 100% no-repeat; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
  .tickets.is-haunted h2 span { animation:spirit-sheen var(--spirit-duration) ease-in-out both; }
}
/* A growing background-position slides the image the other way, so the band
   travels with the spirit only when the position runs against --dir. */
@keyframes spirit-sheen {
  from { background-position:calc(50% + var(--dir) * 50%) 0; }
  to { background-position:calc(50% + var(--dir) * -50%) 0; }
}
@media (prefers-reduced-motion: reduce) {
  .spirit, .spirit-light { display:none; }
}
/* Case file 03 plays its locked-off take as scenery; the scroll is its
   timeline (app.js scrubs it). The still artwork stays underneath as the
   poster, and as the whole scene for reduced motion, no JavaScript, or a
   device that never delivers a frame. The clip fades over it once its first
   scroll-mapped frame is up. */
.story-video { object-fit:cover; transition:opacity 1.1s ease; }
.story-ufo .story-video { opacity:0; }
.story-ufo .story-video.is-ready { opacity:.95; }
@media (max-width:760px) { .story-ufo .story-video.is-ready { opacity:.65; } }
/* Interference (opened from app.js when the Ghost Meter becomes the current
   topic). For .72s the grain flares into static, three faint tracking bands
   cross the screen, and the Ghost Meter line jitters and splits into its
   colour channels. Every keyframe holds with steps(1): a glitch is digital,
   it cuts, it does not ease. Bands and static are the only screen-wide
   pieces, and both are layers that already exist or cost nothing to paint. */
.glitch { display:none; position:fixed; inset:0; z-index:41; pointer-events:none; overflow:hidden; }
.is-glitching .glitch { display:block; animation:glitch-flash .72s steps(1, end) both; }
.glitch i { position:absolute; top:0; left:-2%; right:-2%; height:3.5vh; opacity:0; background:linear-gradient(90deg, transparent, rgba(231,233,216,.07) 20%, rgba(231,233,216,.07) 80%, transparent); }
.glitch i:nth-child(2) { height:1.6vh; background:linear-gradient(90deg, transparent, rgba(9,15,14,.5) 15%, rgba(9,15,14,.5) 85%, transparent); }
.glitch i:nth-child(3) { height:6vh; background:linear-gradient(90deg, transparent, rgba(196,209,192,.05) 25%, rgba(196,209,192,.05) 75%, transparent); }
.is-glitching .glitch i { animation:glitch-band-a .72s steps(1, end) both; }
.is-glitching .glitch i:nth-child(2) { animation-name:glitch-band-b; }
.is-glitching .glitch i:nth-child(3) { animation-name:glitch-band-c; }
.is-glitching body::after { animation:glitch-static .72s steps(1, end) both; }
.is-glitching .topic[data-topic="guide"] { animation:glitch-jitter .72s steps(1, end) both; }
.is-glitching .topic[data-topic="guide"] h3 { animation:glitch-split .72s steps(1, end) both; }
@keyframes glitch-flash {
  0% { background:rgba(231,233,216,.025); }
  6% { background:transparent; }
  52% { background:rgba(231,233,216,.02); }
  56%, 100% { background:transparent; }
}
@keyframes glitch-band-a {
  0% { opacity:1; transform:translate3d(6px, 22vh, 0); }
  8% { opacity:0; }
  26% { opacity:1; transform:translate3d(4px, 41vh, 0); }
  34% { opacity:0; }
  70% { opacity:1; transform:translate3d(-5px, 74vh, 0); }
  76%, 100% { opacity:0; }
}
@keyframes glitch-band-b {
  0% { opacity:0; }
  14% { opacity:1; transform:translate3d(-9px, 61vh, 0); }
  22% { opacity:0; }
  52% { opacity:1; transform:translate3d(7px, 15vh, 0); }
  58%, 100% { opacity:0; }
}
@keyframes glitch-band-c {
  0% { opacity:0; }
  26% { opacity:1; transform:translate3d(-3px, 47vh, 0); }
  30% { opacity:0; }
  70% { opacity:1; transform:translate3d(5px, 30vh, 0); }
  74%, 100% { opacity:0; }
}
@keyframes glitch-static {
  0% { opacity:.16; background-position:37px 61px; }
  10% { opacity:.05; background-position:0 0; }
  14% { opacity:.13; background-position:-52px 23px; }
  24% { opacity:.04; background-position:0 0; }
  52% { opacity:.11; background-position:80px -40px; }
  60% { opacity:.04; background-position:0 0; }
  70% { opacity:.09; background-position:-17px 90px; }
  78%, 100% { opacity:.04; background-position:0 0; }
}
@keyframes glitch-jitter {
  0% { transform:translateX(3px); }
  8% { transform:translateX(0); }
  14% { transform:translateX(-4px); }
  22% { transform:translateX(0); }
  26% { transform:translateX(2px); }
  34% { transform:translateX(0); }
  52% { transform:translateX(-3px); }
  58% { transform:translateX(0); }
  70% { transform:translateX(2px); }
  76%, 100% { transform:translateX(0); }
}
@keyframes glitch-split {
  0% { text-shadow:-3px 0 rgba(196,209,192,.8), 3px 0 rgba(217,180,123,.8); }
  8% { text-shadow:none; }
  14% { text-shadow:4px 0 rgba(196,209,192,.8), -4px 0 rgba(217,180,123,.8); }
  22% { text-shadow:none; }
  26% { text-shadow:-2px 0 rgba(196,209,192,.8), 2px 0 rgba(217,180,123,.8); }
  34% { text-shadow:none; }
  52% { text-shadow:3px 0 rgba(196,209,192,.8), -3px 0 rgba(217,180,123,.8); }
  58% { text-shadow:none; }
  70% { text-shadow:-2px 0 rgba(196,209,192,.8), 2px 0 rgba(217,180,123,.8); }
  76%, 100% { text-shadow:none; }
}
/* Case-file decode (driven from app.js). Once armed, the tour facts hold
   their characters invisible and their rules undrawn until the strip scrolls
   into view; then the rules draw in, cycling glyphs show dim, and each locks
   in with a flash of paper before settling to its own colour. The <i>
   wrappers exist only while this runs. */
.tour-facts { position:relative; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.decode-word { display:inline-block; white-space:nowrap; font-style:normal; }
/* Clipped sideways only, so a wide glyph cycling through a narrow slot flickers
   inside it instead of piling onto its neighbours; clip-path leaves the
   inline-block baseline alone where overflow:hidden would move it. */
.decode-char { display:inline-block; text-align:center; font-style:normal; clip-path:inset(-50% 0); }
.tour-facts.is-armed .decode-char { opacity:0; }
.tour-facts.is-armed .decode-char.is-live { opacity:.5; color:var(--muted); }
.tour-facts.is-armed .decode-char.is-set { opacity:1; color:inherit; animation:decode-lock .6s ease-out; }
@keyframes decode-lock { from { color:var(--paper); } }
.tour-facts.is-armed { border-color:transparent; }
.tour-facts.is-armed::before, .tour-facts.is-armed::after { content:""; position:absolute; left:0; right:0; height:1px; background:var(--line); transform:scaleX(0); transform-origin:0 50%; transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.tour-facts.is-armed::before { top:-1px; }
.tour-facts.is-armed::after { bottom:-1px; transition-delay:.15s; }
.tour-facts.is-decoding::before, .tour-facts.is-decoding::after, .tour-facts.is-decoded::before, .tour-facts.is-decoded::after { transform:scaleX(1); }
.tour-facts.is-armed > div { border-right-color:transparent; transition:border-right-color .7s ease; }
.tour-facts.is-decoding > div, .tour-facts.is-decoded > div { border-right-color:var(--line); }
.tour-facts.is-decoding > div:nth-child(2), .tour-facts.is-decoded > div:nth-child(2) { transition-delay:.3s; }

/* The box office. Checkout stays on the page: a veil settles over the town,
   a little mist rolls in, and one lit panel carries Eventbrite's checkout in
   a frame drawn like the rest of the night. The waiting line sits beneath
   the frame, so the moment the checkout paints it is covered; if the widget
   never arrives, the fallback offers the direct line to Beer Zombies.
   Transforms and opacity only; the mist is the same pre-rendered bitmap. */
html.modal-open { overflow:hidden; }
.ticket-modal { position:fixed; inset:0; z-index:120; display:flex; align-items:center; justify-content:center; padding:clamp(14px, 3vw, 44px); }
.ticket-modal[hidden] { display:none; }
.ticket-modal-veil { position:absolute; inset:0; background:radial-gradient(ellipse 120% 85% at 50% 100%, #17281ff2 0%, #0b1512fa 52%, #070c0bfc 100%); opacity:0; transition:opacity .4s ease; }
.ticket-modal.is-open .ticket-modal-veil { opacity:1; }
.ticket-modal-fog { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.ticket-modal-fog span { position:absolute; opacity:0; transition:transform .5s cubic-bezier(.4,0,.6,1), opacity .4s ease; }
.ticket-modal-fog span::before { content:""; position:absolute; inset:0; background:url('/assets/fog.webp') center / 100% 100% no-repeat; animation:loader-drift-a 34s ease-in-out infinite alternate; }
.ticket-modal-fog span:nth-child(1) { left:-35%; right:-35%; bottom:-16%; height:56%; transform:translate3d(-40%, 14%, 0) scale(1.1); }
.ticket-modal-fog span:nth-child(2) { left:-38%; right:-30%; top:-20%; height:44%; transform:translate3d(38%, -16%, 0) scale(1.1); }
.ticket-modal-fog span:nth-child(2)::before { animation-name:loader-drift-b; animation-duration:42s; }
.ticket-modal.is-open .ticket-modal-fog span { transform:translate3d(0, 0, 0) scale(1); transition:transform 1s cubic-bezier(.2,.7,.2,1), opacity .8s ease; }
.ticket-modal.is-open .ticket-modal-fog span:nth-child(1) { opacity:.4; }
.ticket-modal.is-open .ticket-modal-fog span:nth-child(2) { opacity:.2; transition-delay:.06s; }
.ticket-modal-panel { position:relative; width:min(1080px, 100%); max-height:100%; display:flex; flex-direction:column; overflow:auto; overscroll-behavior:contain; background:#0e1b16; border:1px solid var(--line); box-shadow:0 50px 110px -40px #000; padding:clamp(22px, 3vw, 32px) clamp(22px, 3.4vw, 38px) clamp(16px, 2.4vw, 24px); opacity:0; transform:translateY(30px); filter:blur(8px); transition:opacity .3s ease, transform .35s ease, filter .3s ease; }
.ticket-modal.is-open .ticket-modal-panel { opacity:1; transform:none; filter:blur(0); transition:opacity .55s ease .1s, transform .65s cubic-bezier(.2,.7,.2,1) .1s, filter .55s ease .1s; }
.ticket-modal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:22px; padding-bottom:20px; }
.ticket-modal-eyebrow { display:block; font:400 12px/1.5 SpaceMono,monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--amber); }
.ticket-modal-head h2 { margin-top:10px; font-size:clamp(30px, 4.4vw, 52px); line-height:1; letter-spacing:-.005em; }
.ticket-modal-head h2 span { color:var(--amber); }
.ticket-modal-close { flex:0 0 44px; width:44px; height:44px; margin-top:2px; display:grid; place-items:center; background:none; border:1px solid var(--line); border-radius:50%; color:var(--amber); transition:background-color .35s, color .35s, border-color .35s, transform .65s cubic-bezier(.2,1.4,.3,1); }
.ticket-modal-close .icon { width:18px; height:18px; transform:rotate(45deg); }
.ticket-modal-close:hover, .ticket-modal-close:focus-visible { background:var(--amber); border-color:var(--amber); color:var(--ink); transform:rotate(135deg); }
.ticket-modal-stage { position:relative; height:clamp(425px, 62svh, 625px); border:1px solid var(--line); background:#0a1511; }
.ticket-modal-checkout { position:absolute; inset:0; z-index:2; }
.ticket-modal-checkout iframe { position:absolute; inset:0; width:100%!important; height:100%!important; border:0; display:block; }
.ticket-modal-status { position:absolute; inset:0; z-index:1; display:grid; place-content:center; justify-items:center; margin:0; padding:20px; text-align:center; font:400 12px/1.5 SpaceMono,monospace; letter-spacing:.11em; text-transform:uppercase; color:var(--muted); }
.ticket-modal-status .loader-dots { margin-top:10px; }
.ticket-modal-status[hidden] { display:none; }
.ticket-modal-fallback { position:absolute; inset:0; z-index:3; display:grid; place-content:center; justify-items:center; padding:30px; background:#0a1511; text-align:center; }
.ticket-modal-fallback[hidden] { display:none; }
.ticket-modal-fallback h3 { font-size:clamp(24px, 3vw, 34px); line-height:1.1; max-width:17ch; }
.ticket-modal-fallback p { margin:14px 0 0; font-size:15px; line-height:1.65; color:#b6c2af; max-width:38ch; }
.ticket-modal-fallback .text-link { margin-top:22px; color:var(--amber); border-color:#8b795a; }
.ticket-modal-fallback .text-link:hover { color:var(--paper); }
.ticket-modal-note { display:flex; justify-content:space-between; gap:20px; margin:0; padding-top:16px; font:400 11px/1.6 SpaceMono,monospace; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
@media(max-width:760px) {
  .ticket-modal { padding:0; }
  .ticket-modal-panel { width:100%; height:100%; max-height:none; border:0; padding:18px 20px 14px; }
  .ticket-modal-head { padding-bottom:16px; }
  .ticket-modal-head h2 { font-size:clamp(28px, 8.6vw, 38px); }
  .ticket-modal-stage { flex:1; height:auto; min-height:0; }
  .ticket-modal-note { padding-top:12px; }
  .ticket-modal-note span:last-child { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  .ticket-modal-fog { display:none; }
}
