/* luhs.onl — zine theme (light base). zine-dark.css layers the default dark mode on top. */
:root{
  --paper:#e8e6e0; --ink:#0b0b0b; --grey:#7d7a74; --pink:#ff3d8b;
  --anton:'Anton',sans-serif; --mono:'Space Mono',monospace; --hand:'Permanent Marker',cursive; --serif:'Playfair Display',serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:'Archivo',sans-serif;overflow-x:clip}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
::selection{background:var(--ink);color:var(--paper)}

/* photocopy grit: grain + toner streaks */
.grain{position:fixed;inset:-8%;z-index:100;pointer-events:none;opacity:.22;will-change:transform;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1.4 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1s steps(5) infinite}
@keyframes grain{20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}}
.toner{position:fixed;inset:0;z-index:99;pointer-events:none;opacity:.5;
  background:linear-gradient(90deg,transparent 7%,rgba(0,0,0,.06) 7.3%,transparent 7.8%,transparent 61%,rgba(0,0,0,.05) 61.2%,transparent 61.6%,transparent 88%,rgba(0,0,0,.08) 88.1%,transparent 88.4%)}

.tape{position:absolute;width:130px;height:34px;background:rgba(250,250,245,.6);box-shadow:0 1px 3px rgba(0,0,0,.2);z-index:6}
.tape::before,.tape::after{content:"";position:absolute;top:0;bottom:0;width:6px;background:inherit;clip-path:polygon(0 0,100% 10%,40% 25%,100% 40%,30% 55%,100% 70%,40% 85%,100% 100%,0 100%)}
.tape::before{left:-6px;transform:scaleX(-1)}.tape::after{right:-6px}
.torn{clip-path:polygon(0 2%,6% 0,14% 2%,22% 0,31% 1.5%,40% 0,52% 2%,61% .5%,70% 2%,81% 0,90% 1.6%,100% 0,99% 22%,100% 47%,98.6% 70%,100% 100%,92% 98.4%,80% 100%,68% 98%,57% 100%,45% 98.5%,33% 100%,21% 98%,10% 100%,0 98%,1.2% 74%,0 50%,1.5% 26%)}
.hl{background:linear-gradient(transparent 55%,var(--pink) 55%,var(--pink) 88%,transparent 88%);padding:0 3px}
.spk{width:1em;height:1em;display:inline-block;vertical-align:middle}
.spk path{fill:currentColor}

/* glitch text */
.gl{position:relative;display:inline-block}
.gl::before,.gl::after{content:attr(data-text);position:absolute;inset:0;opacity:0;pointer-events:none}
.gl.glitching{animation:jit .12s steps(2) infinite}
.gl.glitching::before{opacity:1;clip-path:inset(15% 0 55% 0);transform:translateX(-8px);background:var(--paper);color:var(--ink)}
.gl.glitching::after{opacity:1;clip-path:inset(60% 0 12% 0);transform:translateX(10px);background:var(--paper);color:var(--pink)}
.ink .gl.glitching::before,.ink .gl.glitching::after{background:var(--ink)}
@keyframes jit{50%{transform:translate(-2px,1px) skewX(6deg)}}

nav{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:10px 24px;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
nav .logo img{height:28px;width:auto}
nav .links{display:flex;gap:24px}
nav .links a:hover{background:var(--paper);color:var(--ink)}
.live-pill{display:inline-flex;align-items:center;gap:8px;background:var(--pink);color:var(--ink);padding:5px 12px;font-weight:700}
.live-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ink);animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}

/* HERO: moshed photocopy + ornate logo */
.hero{position:relative;min-height:calc(100vh - 48px);padding:50px 24px 40px;overflow:hidden;display:grid;grid-template-columns:1.1fr 1fr;gap:20px;align-items:center}
.copy{position:relative;aspect-ratio:1146/968;transform:rotate(-2.5deg);box-shadow:14px 16px 0 rgba(0,0,0,.85)}
.copy .torn{position:absolute;inset:0;background:#000;overflow:hidden}
.copy canvas{width:100%;height:100%;display:block;filter:contrast(1.3)}
.copy .tape.t1{top:-14px;left:12%;transform:rotate(-8deg)}
.copy .tape.t2{bottom:-10px;right:10%;transform:rotate(6deg)}
.copy .stamp{position:absolute;right:-18px;top:18px;z-index:7;font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.15em;border:3px solid var(--pink);color:var(--pink);padding:8px 12px;transform:rotate(9deg);background:rgba(232,230,224,.85)}
.right{position:relative;z-index:3}
.right .mark{width:100%;max-width:640px;filter:invert(1)}
.right .stack{font-family:var(--anton);text-transform:uppercase;line-height:.84;font-size:clamp(56px,8.5vw,140px);margin-top:-10px}
.right .stack>div{display:block;width:max-content}
.right .mark{filter:invert(1) drop-shadow(.6px 0 0 #000) drop-shadow(-.6px 0 0 #000) drop-shadow(0 .6px 0 #000)}
.right .stack .o{color:transparent;-webkit-text-stroke:2px var(--ink)}
.right .stack .x{background:var(--ink);color:var(--paper);padding:0 .12em;display:inline-block;transform:rotate(-1.5deg)}
.right .note{font-family:var(--hand);font-size:clamp(20px,2vw,30px);color:var(--pink);transform:rotate(-4deg);margin:18px 0 22px 10px}
.btns{display:flex;gap:14px;flex-wrap:wrap}
.btn{font-family:var(--mono);font-weight:700;text-transform:uppercase;font-size:13px;padding:15px 22px;border:3px solid var(--ink);background:var(--paper);box-shadow:6px 6px 0 var(--ink);transition:.1s;display:inline-flex;gap:10px;align-items:center}
.btn:hover{transform:translate(3px,3px);box-shadow:3px 3px 0 var(--ink)}
.btn.dark{background:var(--ink);color:var(--paper)}
.sticker{position:absolute;width:104px;z-index:8;cursor:grab;touch-action:none;
  filter:drop-shadow(3px 3px 0 #fff) drop-shadow(-3px -3px 0 #fff) drop-shadow(3px -3px 0 #fff) drop-shadow(-3px 3px 0 #fff) drop-shadow(5px 7px 3px rgba(0,0,0,.35));transition:filter .2s}
.sticker:hover{filter:drop-shadow(3px 3px 0 #fff) drop-shadow(-3px -3px 0 #fff) drop-shadow(3px -3px 0 #fff) drop-shadow(-3px 3px 0 #fff) drop-shadow(5px 7px 3px rgba(0,0,0,.35))}

/* ticker */
.ticker{background:var(--ink);color:var(--paper);overflow:hidden;white-space:nowrap;transform:rotate(-1.4deg);margin:10px -20px;position:relative;z-index:6;border-block:2px solid var(--paper);outline:3px solid var(--ink)}
.ticker div{display:inline-block;padding:12px 0;font-family:var(--anton);font-size:30px;letter-spacing:.04em;text-transform:uppercase;animation:tick 26s linear infinite}
.ticker .spk{margin:0 20px;color:#bbb;width:22px;height:22px}
.ticker em{font-family:var(--serif);font-style:italic;text-transform:none;font-weight:400;color:#cfcfcf}
@keyframes tick{to{transform:translateX(-50%)}}

section{padding:110px 24px;max-width:1300px;margin:0 auto;position:relative}
.hd{display:flex;align-items:center;gap:18px;margin-bottom:44px;flex-wrap:wrap}
.hd .num{font-family:var(--mono);font-size:13px;background:var(--ink);color:var(--paper);padding:4px 10px}
h2{font-family:var(--anton);font-size:clamp(60px,9.5vw,140px);line-height:.88;text-transform:uppercase}
h2 .s{font-family:var(--serif);font-style:italic;text-transform:none;font-weight:400}
.hd .note{font-family:var(--hand);color:var(--pink);font-size:26px;transform:rotate(-3deg)}

/* schedule flyer */
.flyer{border:3px solid var(--ink);background:#f7f6f2;position:relative;transform:rotate(-.5deg);box-shadow:12px 12px 0 var(--ink)}
.flyer .tape.t1{top:-16px;left:40px;transform:rotate(-6deg)}.flyer .tape.t2{top:-16px;right:50px;transform:rotate(4deg)}
.row{display:grid;grid-template-columns:150px 1fr 170px;align-items:center;border-bottom:2px dashed var(--ink);padding:16px 28px;font-family:var(--mono);transition:.12s}
.row:last-child{border:0}
.row:hover{background:var(--ink);color:var(--paper)}
.row .d{font-family:var(--anton);font-size:40px}
.row .g{font-size:15px;text-transform:uppercase}
.row .t{text-align:right;font-weight:700;font-size:18px}
.row.x{color:var(--grey)}.row.x .g{text-decoration:line-through}
.row.now{background:var(--ink);color:var(--paper)}
.row.now .d::after{content:" ✦";color:#aaa;font-size:24px}
.row.now .t::after{content:" ← tonight";font-family:var(--hand);font-weight:400;color:var(--pink)}

.receipts{display:flex;gap:28px;margin-top:80px;flex-wrap:wrap;justify-content:center}
.receipt{background:#fbfbf8;width:240px;padding:24px 20px 36px;font-family:var(--mono);font-size:13px;text-align:center;box-shadow:0 8px 20px rgba(0,0,0,.15);
  -webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%}
.receipt:nth-child(1){transform:rotate(-3deg)}.receipt:nth-child(2){transform:rotate(2deg) translateY(16px)}.receipt:nth-child(3){transform:rotate(-1deg)}
.receipt .n{font-family:var(--anton);font-size:58px;margin:8px 0}
.receipt small{font-size:11px;color:var(--grey);display:block;border-top:2px dashed var(--ink);margin-top:10px;padding-top:10px}

/* ink flood section */
.ink{background:var(--ink);color:var(--paper);position:relative}
.ink::before,.ink::after{content:"";position:absolute;left:0;right:0;height:26px;background:var(--ink)}
.ink::before{top:-25px;clip-path:polygon(0 100%,0 55%,4% 70%,9% 30%,15% 62%,22% 40%,28% 75%,35% 20%,41% 58%,48% 35%,55% 70%,61% 25%,68% 60%,74% 38%,81% 72%,87% 28%,93% 64%,100% 40%,100% 100%)}
.ink::after{bottom:-25px;clip-path:polygon(0 0,100% 0,100% 50%,94% 30%,88% 72%,81% 40%,75% 66%,68% 22%,62% 60%,55% 35%,49% 74%,42% 30%,36% 64%,29% 25%,23% 70%,16% 38%,10% 66%,5% 28%,0 60%)}
.ink .hd .num{background:var(--paper);color:var(--ink)}
.ink h2 .s{color:var(--paper)}
.watch{display:grid;grid-template-columns:1.5fr 1fr;gap:44px;align-items:start}
.main-vid{position:relative;border:1px solid #444;padding:10px}
.main-vid .c{position:absolute;width:20px;height:20px;color:#ddd}
.main-vid .c.tl{top:-10px;left:-10px}.main-vid .c.br{bottom:-10px;right:-10px}
.main-vid canvas{width:100%;aspect-ratio:16/9;display:block}
.main-vid .play{position:absolute;inset:10px;display:grid;place-items:center;pointer-events:none}
.main-vid .play span{width:92px;height:92px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;font-size:30px}
.main-vid p{font-family:var(--mono);font-size:12px;letter-spacing:.15em;margin-top:12px;color:#aaa;text-transform:uppercase}
.pol{display:block;background:#f4f3ef;color:var(--ink);padding:10px 10px 46px;margin-bottom:26px;position:relative;transition:.2s}
.pol:nth-child(odd){transform:rotate(2deg)}.pol:nth-child(even){transform:rotate(-2deg)}
.pol:hover{transform:rotate(0) scale(1.03)}
.pol .im{aspect-ratio:16/9;background:center/cover}
.pol p{position:absolute;bottom:12px;left:14px;font-family:var(--hand);font-size:18px}

/* about collage */
.about{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.collage{position:relative;aspect-ratio:1}
.collage .scrap{position:absolute;left:0;top:6%;width:72%;width:62%;aspect-ratio:1;background:url(assets/headshot-chrome.jpg) center/cover;transform:rotate(-5deg);box-shadow:8px 10px 0 rgba(0,0,0,.8)}
.collage .cut{position:absolute;right:-4%;bottom:0;width:58%;filter:grayscale(.2) contrast(1.1) drop-shadow(4px 4px 0 #fff) drop-shadow(-4px -4px 0 #fff) drop-shadow(4px -4px 0 #fff) drop-shadow(-4px 4px 0 #fff);transform:rotate(4deg)}
.collage .tape{top:2%;left:24%;transform:rotate(-4deg)}
.collage .lbl{position:absolute;left:4%;bottom:6%;font-family:var(--hand);font-size:24px;transform:rotate(-6deg)}
.bio{font-size:21px;line-height:1.55}
.bio p{margin-bottom:20px}
.bio .q{font-family:var(--serif);font-style:italic;font-size:clamp(28px,3vw,40px);line-height:1.15;margin:30px 0;padding-left:24px;border-left:3px solid var(--ink)}
.tags{display:flex;flex-wrap:wrap;gap:10px}
.tags span{font-family:var(--mono);font-weight:700;font-size:12px;text-transform:uppercase;border:2px solid var(--ink);padding:6px 12px;background:#f7f6f2}
.tags span:nth-child(3n){background:var(--ink);color:var(--paper)}

/* ticket links */
.tix{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tik{display:flex;border:3px solid var(--ink);background:#f7f6f2;transition:.12s;box-shadow:6px 6px 0 var(--ink)}
.tik:hover{transform:translate(-3px,-3px) rotate(-1deg);box-shadow:10px 10px 0 var(--ink)}
.tik .l{flex:1;padding:20px}
.tik h3{font-family:var(--anton);font-size:34px;text-transform:uppercase;font-weight:400}
.tik p{font-family:var(--mono);font-size:12px;color:var(--grey)}
.tik .r{width:64px;border-left:3px dashed var(--ink);display:grid;place-items:center;writing-mode:vertical-rl;font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.2em}
.tik.disc{grid-column:span 3;background:#000 url(assets/luhs-glow-banner.webp) right center/cover;color:var(--paper);position:relative;overflow:hidden}
.tik.disc::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#000 35%,transparent)}
.tik.disc>*{position:relative}
.tik.disc h3{font-size:clamp(44px,6vw,86px)}
.tik.disc .r{border-color:var(--paper);background:var(--paper);color:var(--ink)}

.partners{display:flex;gap:44px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:70px;padding:28px;background:var(--ink)}
.partners img{height:34px;width:auto}
.partners b{font-family:var(--hand);color:var(--pink);font-size:22px;font-weight:400}

/* fan wall */
.wall{columns:4 220px;column-gap:22px}
.wall figure{break-inside:avoid;margin-bottom:22px;background:#f7f6f2;padding:8px;box-shadow:0 6px 16px rgba(0,0,0,.18);position:relative;transition:.2s}
.wall figure:nth-child(odd){transform:rotate(-2deg)}.wall figure:nth-child(even){transform:rotate(1.5deg)}
.wall figure:hover{transform:rotate(0) scale(1.04);z-index:2}

.wall figcaption{font-family:var(--hand);font-size:18px;padding:8px 4px 2px}
.wall .add{border:3px dashed var(--ink);background:transparent;box-shadow:none;aspect-ratio:3/4;display:grid;place-items:center;text-align:center;font-family:var(--anton);font-size:34px;text-transform:uppercase}

footer{background:var(--ink);color:var(--paper);padding:110px 24px 40px;margin-top:100px;position:relative;text-align:center}
footer::before{content:"";position:absolute;left:0;right:0;top:-25px;height:26px;background:var(--ink);clip-path:polygon(0 100%,0 55%,4% 70%,9% 30%,15% 62%,22% 40%,28% 75%,35% 20%,41% 58%,48% 35%,55% 70%,61% 25%,68% 60%,74% 38%,81% 72%,87% 28%,93% 64%,100% 40%,100% 100%)}
footer .mark{width:min(620px,85%);margin:0 auto;filter:drop-shadow(0 0 14px rgba(255,255,255,.4))}
footer .big{font-family:var(--anton);font-size:clamp(46px,8vw,120px);line-height:.9;text-transform:uppercase;margin-top:30px}
footer .big .s{font-family:var(--serif);font-style:italic;text-transform:none;font-weight:400;color:var(--paper)}
footer .cr{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:20px;margin-top:60px;font-family:var(--mono);font-size:12px;text-align:left;border-top:1px solid #333;padding-top:30px}
footer .cr b{display:block;color:#999;font-size:10px;letter-spacing:.15em;text-transform:uppercase;margin-bottom:4px}

@media(max-width:900px){
  nav .links{display:none}
  .hero{grid-template-columns:1fr;padding:30px 16px}
  .sticker{width:66px}
  section{padding:80px 16px}
  .row{grid-template-columns:80px 1fr;padding:14px 16px}.row .t{grid-column:2;text-align:left}
  .watch,.about{grid-template-columns:1fr}
  .tix{grid-template-columns:1fr}.tik.disc{grid-column:auto}
}

/* ===== live site components ===== */
.nav-right{display:flex;align-items:center;gap:10px}
.icon-btn{width:34px;height:34px;display:grid;place-items:center;border:1px solid #555;background:transparent;color:inherit;cursor:pointer;font-size:15px}
.icon-btn:hover{background:var(--paper);color:var(--ink)}
.live-pill.off{background:transparent;color:var(--paper);border:1px solid #555;font-weight:400}
.live-pill.off::before{background:#777;animation:none}

/* schedule rows built by site.js */
.row .d small{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--grey)}
.row .g .slot+.slot{margin-top:6px}
.row.today .d::after{content:" ← today";font-family:var(--hand);font-size:18px;color:var(--pink);white-space:nowrap}
.row.now{background:var(--pink);color:var(--ink)}
.row.now .d::after{content:" ● LIVE";font-family:var(--mono);font-size:13px;color:var(--ink)}
.row.now .t::after{content:none}
.sched-empty{padding:28px;font-family:var(--mono);text-align:center}
.sched-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:26px;font-family:var(--mono);font-size:12px;color:var(--grey)}

/* video embeds */
.yt{position:relative;aspect-ratio:16/9;background:#000}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt .poster{position:absolute;inset:0;background:center/cover;cursor:pointer;display:grid;place-items:center}
.yt .poster span{width:92px;height:92px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;font-size:30px;transition:.2s}
.yt .poster:hover span{transform:scale(1.08)}
.vid-title{font-family:var(--mono);font-size:12px;letter-spacing:.08em;margin-top:12px;text-transform:uppercase}
.pol .im{background-color:#222}

/* live corner player */
.live-card{position:fixed;right:20px;bottom:20px;z-index:80;width:min(420px,calc(100vw - 32px));background:var(--ink);color:var(--paper);border:3px solid var(--pink);box-shadow:8px 8px 0 var(--pink);transform:translateY(140%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.live-card.show{transform:none}
.live-card header{display:flex;align-items:center;gap:10px;padding:8px 10px;font-family:var(--mono);font-size:12px}
.live-card header .t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-card header b{background:var(--pink);color:var(--ink);padding:2px 8px}
.live-card .x{background:none;border:0;color:inherit;font-size:20px;cursor:pointer;line-height:1;padding:0 4px}
.live-card .frame{aspect-ratio:16/9;background:#000}
.live-card iframe{width:100%;height:100%;border:0;display:block}
.live-card footer{display:flex;justify-content:space-between;padding:8px 10px;margin:0;background:none;text-align:left;font-family:var(--mono);font-size:11px;color:#aaa}
.live-card footer::before{content:none}
.live-card footer a{color:var(--paper);text-decoration:underline}

/* popups */
.modal{position:fixed;inset:0;z-index:120;display:none;place-items:center;padding:16px;background:rgba(0,0,0,.7);backdrop-filter:blur(3px)}
.modal.open{display:grid}
.modal .sheet{position:relative;width:min(460px,100%);background:#f7f6f2;color:var(--ink);border:3px solid var(--ink);box-shadow:12px 12px 0 var(--pink);padding:34px 28px 28px;transform:rotate(-1deg);text-align:center;animation:pop .25s cubic-bezier(.2,.9,.3,1.3)}
@keyframes pop{from{transform:rotate(-1deg) scale(.85);opacity:0}}
.modal .sheet .tape{top:-16px;left:50%;margin-left:-65px;transform:rotate(-3deg)}
.modal .close{position:absolute;top:8px;right:12px;background:none;border:0;font-size:26px;cursor:pointer;color:var(--ink)}
.modal h3{font-family:var(--anton);font-size:clamp(40px,8vw,58px);line-height:.9;text-transform:uppercase;font-weight:400}
.modal p{font-family:var(--mono);font-size:13px;margin:14px 0 22px}
.code-box{display:flex;border:3px solid var(--ink);margin:0 auto 18px;max-width:320px}
.code-box code{flex:1;padding:14px;font-family:var(--anton);font-size:30px;letter-spacing:.06em;background:#fff}
.code-box button{border:0;border-left:3px solid var(--ink);background:var(--ink);color:var(--paper);font-family:var(--mono);font-weight:700;padding:0 16px;cursor:pointer;text-transform:uppercase}
.modal .btn{justify-content:center}

/* partners are buttons now */
.partners button{background:none;border:0;cursor:pointer;padding:6px;transition:transform .15s}
.partners button:hover{transform:scale(1.08) rotate(-2deg)}
.partners button img{height:34px;width:auto}
.partners .hint{font-family:var(--mono);font-size:11px;color:#999;width:100%;text-align:center}

/* crew (collaborators) */
.crew{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:22px}
.crew a{display:block;background:#f7f6f2;color:var(--ink);padding:8px 8px 12px;box-shadow:0 6px 14px rgba(0,0,0,.18);transition:.15s;text-align:center}
.crew a:nth-child(odd){transform:rotate(-2deg)}.crew a:nth-child(even){transform:rotate(2deg)}
.crew a:hover{transform:rotate(0) scale(1.05)}
.crew img{width:100%;aspect-ratio:1;object-fit:cover}
.crew b{display:block;font-family:var(--hand);font-weight:400;font-size:18px;margin-top:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wall .add{cursor:pointer;transition:.15s}
.wall .add:hover{background:var(--ink);color:var(--paper)}

/* headshot slot (hidden until the image exists) */
.headshot{display:none}
.headshot.ok{display:block}
.wall .add{width:100%;font:inherit;font-family:var(--anton);font-size:34px;color:inherit;display:grid;margin-bottom:22px;break-inside:avoid}
.wall figcaption a{text-decoration:underline}
footer .cr a{text-decoration:underline}
@media(max-width:900px){
  .row{grid-template-columns:96px 1fr;gap:2px 10px}
  .row .d{font-size:30px}
  .row.today .d::after,.row.now .d::after{display:block;font-size:14px}
  .live-card{right:16px;bottom:16px}
  .partners{gap:24px}
}

/* ===== touch screens (no hover) ===== */
@media (hover:none){
  /* everything that turned color on hover is just in color */

  .sticker{filter:drop-shadow(3px 3px 0 #fff) drop-shadow(-3px -3px 0 #fff) drop-shadow(3px -3px 0 #fff) drop-shadow(-3px 3px 0 #fff) drop-shadow(5px 7px 3px rgba(0,0,0,.35))}
  /* don't leave rows/cards stuck in their hover look after a tap */
  .row:hover{background:inherit;color:inherit}
  .row.now:hover{background:var(--pink);color:var(--ink)}
  .pol:hover,.wall figure:hover,.crew a:hover,.tik:hover,.btn:hover,.partners button:hover{transform:none}
  .btn:active,.tik:active{transform:translate(3px,3px)}
}

/* ===== phones: fewer moving parts, bigger tap targets ===== */
@media (max-width:900px){
  .grain{animation:none;inset:0}
  .hero .copy{max-width:520px;margin:0 auto;width:100%}
  .right .note{margin-left:0}
  .btns .btn{flex:1 1 220px;justify-content:center}
  nav{padding:8px 16px}
  .icon-btn{width:40px;height:40px}
  .live-pill{padding:8px 12px}
  .ticker div{font-size:22px}
  .hd{gap:10px;margin-bottom:30px}
  .hd .note{font-size:20px}
  .flyer{transform:none;box-shadow:8px 8px 0 var(--ink)}
  .receipts{gap:18px;margin-top:50px}
  .receipt{width:min(240px,100%)}
  .crew{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
  .crew b{font-size:14px}
  .wall{columns:2;column-gap:14px}
  .wall figure,.wall .add{margin-bottom:14px}
  .wall .add{font-size:26px}
  .partners{padding:20px 16px}
  .modal .sheet{transform:none;padding:30px 18px 22px}
  .code-box code{font-size:24px}
  .live-card{right:12px;left:12px;bottom:12px;width:auto}
  footer .cr{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){
  .grain,.ticker div{animation:none}
}
@media (max-width:900px){
  .sticker:nth-of-type(1),.sticker:nth-of-type(3){display:none}
  .row.x .t{display:none}
}
@media (max-width:900px){
  .receipts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .receipt{width:auto;padding:14px 6px 22px;font-size:9px;letter-spacing:-.02em}
  .receipt .n{font-size:30px;margin:6px 0}
  .receipt small{font-size:8px}
  .receipt:nth-child(2){transform:rotate(2deg) translateY(8px)}
  .tix{grid-template-columns:1fr 1fr;gap:12px}
  .tik.disc{grid-column:span 2}
  .tik .l{padding:12px}
  .tik h3{font-size:24px}
  .tik p{font-size:10px}
  .tik .r{width:30px;font-size:9px;letter-spacing:.1em}
  .tik{box-shadow:4px 4px 0 var(--ink)}
}

/* drifting sparkles (from the Abyss concept) - behind all content */
#sparks{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}

/* sticker clicked: black and white (click again for color) */
.sticker.bw,.sticker.bw:hover{filter:grayscale(1) contrast(1.2) drop-shadow(3px 3px 0 #fff) drop-shadow(-3px -3px 0 #fff) drop-shadow(3px -3px 0 #fff) drop-shadow(-3px 3px 0 #fff) drop-shadow(5px 7px 3px rgba(0,0,0,.35))}