/* Fonts load from Google Fonts via the in every page head. Self-hosting was tried on 2026-07-18 and reverted the same day: the /fonts/*.woff2 paths hung behind the GitHub Pages CDN on the custom domain (origin served them fine, the edge did not), and a font preload in pointing at a hanging URL stalled page loads badly enough that phones timed out. Do not re-self-host without first confirming the custom domain serves a brand-new path reliably. */ :root{--bg:#0c0c0d;--card:#17171a;--ink:#f2f2ee;--dim:#9b9b94;--hot:#6b7036;--hotink:#8f9850;--on-hot:#f2f2ee;--line:#2c2c31;--tape:#d8d4c5;--free:#aebf5a;--sliding:#7fb0a8;--age:#d59b46;--benefit:#d98cb0;--soldout:#9b9b94;--shadow:rgba(107,112,54,.5);--scrim:rgba(12,12,13,.82)} *{box-sizing:border-box} /* The `hidden` attribute must ALWAYS win. The UA rule for it is only [hidden]{display:none} at the lowest specificity, so any rule here that sets an explicit display (.dbtn{display:inline-flex}, .drow.dcancel{display:inline-block}, …) silently beats it and the element renders anyway. That shipped twice: every show in the detail sheet showed "this show was cancelled" and a "dm for the address" button, on shows that were neither. This file had already worked around it eleven times with per-component .foo[hidden]{display:none} rules; this is that fix done once, for everything. JS toggling .hidden can now be trusted. */ [hidden]{display:none!important} body{margin:0;background-color:var(--bg);color:var(--ink);font:16px/1.5 "Special Elite","Courier New",monospace; background-image:radial-gradient(1000px 520px at 50% -140px,rgba(107,112,54,.32),rgba(107,112,54,0) 72%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.11'/%3E%3C/svg%3E"); background-repeat:no-repeat,repeat} a{color:var(--hotink)} /* typography polish: balanced heading line-breaks + orphan-free prose. Progressive enhancement — silently ignored where unsupported. */ h1,h2,h3,.ehead{text-wrap:balance} .glead,.post p,.dcap,.emptybig p{text-wrap:pretty} header{padding:2.2rem 1rem .3rem;text-align:center} header .logo{width:170px;height:170px;display:block;margin:0 auto .6rem;filter:drop-shadow(0 0 14px rgba(255,255,255,.18));transition:transform .2s} header .logo.tl{transform:rotate(-6deg) scale(1.04)} header .logo.tr{transform:rotate(6deg) scale(1.04)} h1{margin:0;font-family:"Special Elite","Courier New",monospace;font-weight:400;font-size:clamp(2.4rem,11vw,4.4rem);letter-spacing:.02em; text-transform:uppercase;transform:rotate(-2deg);text-shadow:4px 4px 0 var(--hot)} header .tag{color:var(--dim);margin:.7rem 0 0;font-size:.95rem} /* one-line mission subtitle: reads as "what is this?" for a first-time visitor and carries the real search terms (alt scene / genres / house + all-ages) in crawlable body text, which ranks far harder than any meta tag */ header .lede{color:var(--dim);max-width:54ch;margin:.5rem auto 0;font-size:.82rem;line-height:1.5} header h1 a{color:inherit;text-decoration:none} .homelink{display:block;text-decoration:none} .links{display:flex;flex-wrap:wrap;gap:1rem .6rem;justify-content:center;max-width:680px;margin:0 auto;padding:.8rem 1rem .2rem} .links a{font-size:.85rem;text-decoration:none;color:#111;background:var(--tape);padding:.4rem .9rem; border:2px solid #111;box-shadow:3px 3px 0 var(--hot);text-transform:uppercase;letter-spacing:.05em} .links a:nth-child(odd){transform:rotate(-1.5deg)}.links a:nth-child(even){transform:rotate(1.2deg)} .links a:hover{background:var(--hot);color:var(--on-hot);box-shadow:3px 3px 0 var(--tape)} /* the CALENDAR / ARCHIVE mode switch under the wordmark: the site's two halves as one segmented control. Deliberately NOT a tape button (those are the off-site links) but a single stamped ink box split down the middle, two equal halves, no tilt. The half you're on is filled green; the other reads dim and links across. */ .modebar{position:sticky;top:var(--a2hs-h,0px);z-index:44;display:flex;justify-content:center; background:var(--bg);border-bottom:2px solid var(--line); padding:.22rem 1rem;padding-top:calc(.22rem + env(safe-area-inset-top))} /* .modetabs is a