@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');

.barstimeportal, .barstimeportal-wall { --bars-cream:#f2e5cb; --bars-amber:#e7a64d; --bars-ink:#130e0b; --bars-mono:"DM Mono",monospace; --bars-serif:"Libre Baskerville",Georgia,serif; font-family:var(--bars-serif); color:var(--bars-cream); }
.barstimeportal { position:fixed; z-index:10000; inset:0; min-height:100svh; overflow:hidden; isolation:isolate; background:var(--bars-ink); }
.barstimeportal *, .barstimeportal-wall * { box-sizing:border-box; }
.barstimeportal__background,.barstimeportal__scrim,.barstimeportal-wall__background { position:absolute; inset:0; }
.barstimeportal__background { z-index:-3; background-position:center; background-size:cover; transform:scale(1.015); transition:transform 1.9s cubic-bezier(.2,.75,.15,1),filter 1.4s ease; }
.barstimeportal__background--exterior { background-image:url('../img/bar-exterior.png'); }
.barstimeportal__background--interior { background-image:url('../img/bar-interior.png'); }
.barstimeportal__scrim { z-index:-2; background:linear-gradient(90deg,rgba(8,5,4,.88),rgba(8,5,4,.38) 43%,rgba(8,5,4,.14) 68%,rgba(8,5,4,.5)); }
.barstimeportal__scrim--interior { background:linear-gradient(90deg,rgba(7,4,3,.73),transparent 48%,rgba(7,4,3,.54)); }
.barstimeportal__copy { position:absolute; z-index:1; left:clamp(1.4rem,7vw,8rem); top:clamp(5.8rem,19vh,13rem); max-width:min(36rem,73vw); text-shadow:0 2px 20px rgba(0,0,0,.8); }
.barstimeportal__eyebrow { margin:0 0 1rem; color:#f0bd72; font:500 clamp(.67rem,.8vw,.83rem)/1.5 var(--bars-mono); letter-spacing:.17em; text-transform:uppercase; }
.barstimeportal h1,.barstimeportal h2,.barstimeportal-wall h1 { margin:0; font-weight:400; letter-spacing:-.04em; line-height:.99; }
.barstimeportal h1,.barstimeportal-wall h1 { font-size:clamp(3.5rem,8.5vw,8.2rem); }
.barstimeportal h2 { font-size:clamp(2.4rem,5vw,5.6rem); }
.barstimeportal__lede { margin:1.5rem 0 .4rem; font-size:clamp(1.15rem,2vw,1.7rem); font-style:italic; }
.barstimeportal__note { max-width:28rem; margin:0; color:rgba(242,229,203,.75); font-size:clamp(.85rem,1.2vw,1.05rem); line-height:1.65; }
.barstimeportal__door { position:absolute; z-index:2; top:7%; bottom:17%; left:44%; width:23%; border:0; border-radius:8px; background:transparent; cursor:pointer; }
.barstimeportal__door:hover,.barstimeportal__door:focus-visible { background:rgba(235,158,61,.09); box-shadow:inset 0 0 44px 12px rgba(236,156,56,.38); outline:2px solid rgba(242,229,203,.7); outline-offset:5px; }
.barstimeportal__invitation { position:absolute; z-index:2; left:53%; bottom:10%; transform:translateX(-50%); color:#f7d99e; font-size:clamp(1rem,1.5vw,1.3rem); font-style:italic; text-shadow:0 1px 13px #000; pointer-events:none; }
.barstimeportal__enter,.barstimeportal-wall__cta { position:absolute; z-index:2; left:clamp(1.4rem,7vw,8rem); bottom:clamp(4.3rem,12vh,8rem); padding:.9rem 1.25rem; border:1px solid rgba(242,229,203,.78); color:var(--bars-cream); background:rgba(20,12,8,.51); cursor:pointer; font:500 .75rem/1 var(--bars-mono); letter-spacing:.14em; text-decoration:none; text-transform:uppercase; transition:background .25s,color .25s,transform .25s; }
.barstimeportal__enter:hover,.barstimeportal__enter:focus-visible,.barstimeportal-wall__cta:hover,.barstimeportal-wall__cta:focus-visible { background:var(--bars-cream); color:var(--bars-ink); transform:translateY(-2px); }
.barstimeportal__skip { position:absolute; z-index:2; right:1.5rem; bottom:1.4rem; border:0; color:rgba(242,229,203,.77); background:transparent; cursor:pointer; font:.72rem var(--bars-mono); letter-spacing:.06em; text-decoration:underline; text-underline-offset:.32em; }
.barstimeportal__interior[hidden] { display:none; }
.barstimeportal__inside-copy { position:absolute; z-index:1; left:clamp(1.25rem,4.5vw,5rem); top:clamp(1.5rem,4.6vh,4rem); text-shadow:0 2px 20px rgba(0,0,0,.8); }
.barstimeportal__objects { position:absolute; z-index:2; inset:0; }
.barstimeportal__object { position:absolute; display:grid; gap:.35rem; min-width:8.8rem; color:var(--bars-cream); opacity:.92; text-decoration:none; text-shadow:0 1px 12px #000; transition:transform .25s,color .25s,opacity .25s; }
.barstimeportal__object span { font-size:clamp(1.12rem,1.75vw,1.65rem); font-style:italic; }
.barstimeportal__object small { color:#efc57c; font:.61rem/1.4 var(--bars-mono); letter-spacing:.12em; text-transform:uppercase; }
.barstimeportal__object:hover,.barstimeportal__object:focus-visible { color:#fff6e3; opacity:1; transform:translateY(-5px); outline:0; }
.barstimeportal__object--music { left:3.7%; bottom:26%; }.barstimeportal__object--bars { right:6%; top:29%; }.barstimeportal__object--wall { right:6%; bottom:16%; }.barstimeportal__object--shop { left:56%; top:38%; }
.barstimeportal__skip--inside { right:1.5rem; bottom:1.4rem; }
.barstimeportal__nav { position:absolute; z-index:3; top:1.3rem; right:clamp(1rem,3vw,3rem); display:flex; flex-wrap:wrap; gap:.8rem 1.5rem; font:.68rem var(--bars-mono); letter-spacing:.08em; text-shadow:0 1px 9px #000; text-transform:uppercase; }
.barstimeportal__nav a { color:rgba(242,229,203,.84); text-decoration:none; }.barstimeportal__nav a:hover,.barstimeportal__nav a:focus-visible { color:#fff; text-decoration:underline; text-underline-offset:.35em; }
.barstimeportal__mini-player { position:fixed; z-index:5; right:clamp(1rem,2.5vw,2.5rem); bottom:clamp(1rem,2.5vw,2.5rem); width:min(19rem,calc(100vw - 2rem)); border:1px solid rgba(239,197,124,.7); padding:.9rem; color:var(--bars-cream); background:linear-gradient(135deg,rgba(51,25,16,.98),rgba(17,9,6,.98)); box-shadow:0 1rem 3rem rgba(0,0,0,.72),0 0 1.8rem rgba(212,111,42,.2); }.barstimeportal__mini-player[hidden] { display:none; }.barstimeportal__mini-close { position:absolute; z-index:1; top:.4rem; right:.45rem; width:1.7rem; height:1.7rem; border:1px solid rgba(242,229,203,.35); border-radius:50%; color:var(--bars-cream); background:rgba(13,7,5,.75); cursor:pointer; font-size:1.1rem; line-height:1; }.barstimeportal__mini-close:hover,.barstimeportal__mini-close:focus-visible { color:var(--bars-ink); background:#f4ce8e; outline:0; }.barstimeportal__mini-kicker { margin:0 2rem .28rem 0; color:#efc57c; font:.57rem var(--bars-mono); letter-spacing:.13em; text-transform:uppercase; }.barstimeportal__mini-song { overflow:hidden; margin:.25rem 0 .75rem; font-size:.82rem; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }.barstimeportal__mini-video { aspect-ratio:16/9; overflow:hidden; border:1px solid rgba(239,197,124,.45); background:#000; }.barstimeportal__mini-video iframe { display:block; width:100%; height:100%; border:0; }.barstimeportal__mini-link { display:inline-block; margin-top:.7rem; color:#f4ce8e; font:.6rem var(--bars-mono); letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }.barstimeportal__mini-link:hover,.barstimeportal__mini-link:focus-visible { color:#fff6e3; text-decoration:underline; text-underline-offset:.3em; outline:0; }
.barstimeportal__panel { width:min(50rem,calc(100vw - 2rem)); max-height:min(44rem,calc(100svh - 2rem)); overflow:auto; border:1px solid rgba(239,197,124,.46); padding:clamp(2rem,5vw,4.5rem); color:var(--bars-cream); background:linear-gradient(125deg,#29140f,#100906 72%); box-shadow:0 1.5rem 5rem rgba(0,0,0,.75); font-family:var(--bars-serif); }.barstimeportal__panel::backdrop { background:rgba(4,2,1,.75); backdrop-filter:blur(3px); }
.barstimeportal__close { position:absolute; right:1rem; top:.7rem; border:0; color:var(--bars-cream); background:transparent; cursor:pointer; font-size:2rem; }.barstimeportal__panel h2 { font-size:clamp(2.6rem,6vw,5.5rem); }.barstimeportal__panel p { max-width:36rem; color:rgba(242,229,203,.84); line-height:1.75; }.barstimeportal__panel-kicker { color:#efc57c!important; font:.68rem var(--bars-mono); letter-spacing:.15em; text-transform:uppercase; }
.barstimeportal__panel-list { display:grid; gap:.75rem; margin-top:2.2rem; }.barstimeportal__panel-list article { border-top:1px solid rgba(242,229,203,.23); padding:1rem 0; }.barstimeportal__panel-list h3 { margin:0 0 .25rem; font-size:1.25rem; font-weight:400; }.barstimeportal__shop-item { display:block; color:inherit; text-decoration:none; transition:color .2s ease,transform .2s ease; }.barstimeportal__shop-item:hover,.barstimeportal__shop-item:focus-visible { color:#efc57c; outline:none; transform:translateX(.35rem); }.barstimeportal__shop-item span { color:#efc57c; font:.62rem var(--bars-mono); letter-spacing:.08em; text-transform:uppercase; }.barstimeportal__panel-link { display:inline-block; margin-top:1.7rem; color:#f4ce8e; font:.68rem var(--bars-mono); letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
.barstimeportal--entering .barstimeportal__background--exterior { transform:scale(1.34); filter:brightness(1.38) saturate(1.1); }.barstimeportal--entering .barstimeportal__copy,.barstimeportal--entering .barstimeportal__door,.barstimeportal--entering .barstimeportal__invitation,.barstimeportal--entering .barstimeportal__enter,.barstimeportal--entering > .barstimeportal__skip { opacity:0; transition:opacity .45s ease; }
.barstimeportal-wall { min-height:100svh; position:relative; display:grid; place-items:center; overflow:hidden; isolation:isolate; background:#160e0b; text-align:center; }.barstimeportal-wall__background { z-index:-2; background:linear-gradient(rgba(20,10,7,.49),rgba(20,10,7,.82)),url('../img/the-wall.png') center/cover; filter:saturate(.68) sepia(.16); transition:transform .9s cubic-bezier(.2,.75,.15,1),filter .9s ease; }.barstimeportal-wall__content { width:min(41rem,calc(100% - 2.5rem)); padding:4rem 0; text-shadow:0 2px 20px #000; }.barstimeportal-wall__back { display:inline-block; margin-bottom:clamp(4rem,13vh,9rem); color:rgba(242,229,203,.83); font:.7rem var(--bars-mono); letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }.barstimeportal-wall__line { margin:1.5rem 0; font-size:clamp(1.35rem,2.2vw,1.9rem); font-style:italic; }.barstimeportal-wall__description { max-width:34rem; margin:auto; color:rgba(242,229,203,.82); line-height:1.7; }.barstimeportal-wall__cta { position:static; display:inline-block; margin-top:2.1rem; }.barstimeportal-wall__fallback { display:block; margin-top:1.55rem; color:rgba(242,229,203,.8); font:.68rem var(--bars-mono); letter-spacing:.05em; text-decoration:none; }
.barstimeportal-wall--crossing .barstimeportal-wall__background { transform:scale(1.18); filter:saturate(.94) sepia(.05) brightness(1.55); }.barstimeportal-wall--crossing .barstimeportal-wall__content { opacity:0; transform:scale(.98); transition:opacity .55s ease,transform .55s ease; }
@media (max-width:760px) { .barstimeportal__background--exterior { background-position:56% center; }.barstimeportal__scrim { background:linear-gradient(180deg,rgba(8,5,4,.45),rgba(8,5,4,.2) 40%,rgba(8,5,4,.91)); }.barstimeportal__copy { top:auto; bottom:23%; max-width:min(30rem,calc(100vw - 2.8rem)); }.barstimeportal h1,.barstimeportal-wall h1 { font-size:clamp(3.2rem,14vw,5.1rem); }.barstimeportal__note,.barstimeportal__invitation { display:none; }.barstimeportal__door { top:4%; bottom:37%; left:18%; width:69%; }.barstimeportal__enter { left:50%; bottom:10%; transform:translateX(-50%); white-space:nowrap; }.barstimeportal__nav { left:1rem; right:1rem; justify-content:center; gap:.55rem 1rem; font-size:.59rem; }.barstimeportal__inside-copy { max-width:16rem; }.barstimeportal__inside-copy h2 { font-size:2.1rem; }.barstimeportal__background--interior { background-position:58% center; }.barstimeportal__object { min-width:0; }.barstimeportal__object span { font-size:.96rem; }.barstimeportal__object small { font-size:.54rem; }.barstimeportal__object--music { left:3%; bottom:34%; }.barstimeportal__object--bars { right:3%; top:28%; }.barstimeportal__object--wall { right:3%; bottom:19%; }.barstimeportal__object--shop { left:43%; top:47%; max-width:7rem; } }
@media (prefers-reduced-motion:reduce) { .barstimeportal *,.barstimeportal *::before,.barstimeportal *::after,.barstimeportal-wall *,.barstimeportal-wall *::before,.barstimeportal-wall *::after { transition-duration:.01ms!important; animation-duration:.01ms!important; } }
@media (max-width:760px) { .barstimeportal__mini-player { right:1rem; bottom:1rem; width:min(17rem,calc(100vw - 2rem)); } }