/* Das Energi 2026 companion - real-brand overhaul (dark only)
   Cosmic-chrome: electric cyan + hot magenta on space black, condensed festival type. */
@import url('https://fonts.googleapis.com/css2?family=Saira+Condensed:wght@500;600;700;800;900&family=Chakra+Petch:wght@400;500;600;700&display=swap');

:root {
  --bg: #05060d;
  --bg-2: #090a15;
  --bg-3: #0f101e;
  --card: #0d0e1b;
  --card-2: #12132270;
  --line: #23243c;
  --line-soft: #17182a;
  --text: #f1f0ff;
  --dim: #9a9bc0;
  --mute: #585a7e;
  --cyan: #ff2e2e;       /* primary accent is now MASV red (var name kept to avoid churn) */
  --de-cyan: #2ae8ff;    /* Das Energi event cyan, reserved for the DAS ENERGI wordmark + flyer */
  --red: #ff2e2e;
  --red-2: #c20f1a;
  --magenta: #ff2bd6;
  --pink: #ff3d97;
  --violet: #7b3bff;
  --good: #3ff0a0;
  --warn: #ff4d72;
  --grad: linear-gradient(120deg, #ff3b2f 0%, #c20f1a 100%);          /* red, primary CTA/active */
  --grad-energi: linear-gradient(100deg, #2ae8ff 0%, #ff2bd6 100%);   /* DAS ENERGI wordmark only */
  --grad-soft: linear-gradient(120deg, rgba(255,46,46,.16), rgba(194,15,26,.16));
  --chrome: linear-gradient(180deg, #ffffff 0%, #cdd4ee 40%, #79809e 52%, #b9c0dc 60%, #eef1ff 100%);
  --disp: 'Saira Condensed', 'Arial Narrow', sans-serif;
  --ui: 'Chakra Petch', ui-monospace, system-ui, sans-serif;
  --app-w: 560px;
  --nav-h: 70px;
}

* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
/* IMPORTANT: never put overflow-y on html/body - it detaches position:fixed
   (the bottom nav) from the viewport on iOS Safari. scrollbar-gutter alone
   keeps the desktop layout from shifting between short and tall tabs. */
html { scrollbar-gutter: stable; }
body {
  font-family: var(--ui);
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  overscroll-behavior-y: none;
  font-size: 15px;
}
/* clean backdrop: pure black up top fading into a warm maroon glow along the bottom */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(95% 44% at 50% 114%, rgba(214,28,40,.22), transparent 60%),
    linear-gradient(180deg, #000000 0%, #000000 46%, #160510 74%, #2a0a16 100%);
}
body::after { content: none; } /* grain removed: was reading as pixelation */

a { color: inherit; }
.app { max-width: var(--app-w); margin: 0 auto; min-height: 100vh; min-height: 100svh; position: relative; }

/* ===== brand wordmark ===== */
.wm { font-family: var(--disp); font-weight: 800; letter-spacing: .06em; line-height: .9; text-transform: uppercase; }
.wm .das { background: var(--chrome); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.wm .energi { background: var(--grad-energi); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.v2mark { width: 30px; height: 30px; flex-shrink: 0; }
/* top-left real-logo lockup: MASV (PNG pre-baked white wordmark + red chevrons) + Das Energi */
.brand-logos { display: flex; align-items: center; gap: 12px; }
.brand-logos .masv { height: 19px; display: block; opacity: .97; }
.brand-logos .das { height: 28px; display: block; }
.brand-logos .sep { width: 1px; height: 22px; background: var(--line); display: block; }

/* ============================================================= LOGIN ===== */
.auth { position: fixed; inset: 0; z-index: 200; display: none; flex-direction: column; justify-content: center; padding: 28px; overflow: hidden; }
.auth.show { display: flex; }
.auth-bg { position: absolute; inset: 0; z-index: 0; background: #000; }
.auth-inner { position: relative; z-index: 1; max-width: 400px; width: 100%; margin: 0 auto; }
.auth-logo { text-align: center; margin-bottom: 26px; }
.auth-logo .wm { font-size: clamp(46px, 16vw, 74px); }
.auth-logo .auth-logo-masv { display: block; width: min(225px, 57vw); max-width: 100%; height: auto; margin: 0 auto 18px; } /* 75% of the Das Energi logo width */
.auth-logo .auth-logo-img { display: block; width: min(300px, 76vw); max-width: 100%; height: auto; margin: 0 auto; }
.auth-logo .sub { font-family: var(--ui); font-size: 11px; letter-spacing: .42em; color: var(--dim); text-transform: uppercase; margin-top: 8px; }
.auth-card { background: rgba(10,11,22,.72); border: 1px solid var(--line); border-radius: 20px; padding: 22px; backdrop-filter: blur(14px); }
.auth-tabs { display: flex; gap: 6px; background: var(--bg-2); border-radius: 12px; padding: 4px; margin-bottom: 18px; }
.auth-tab { flex: 1; text-align: center; padding: 10px; border-radius: 9px; font-weight: 700; font-size: 13px; letter-spacing: .04em; color: var(--mute); cursor: pointer; text-transform: uppercase; transition: .2s; }
.auth-tab.on { background: var(--grad); color: #05060d; }
.field { margin-bottom: 13px; }
.field label { display: block; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--mute); margin-bottom: 6px; }
.field input { width: 100%; background: var(--bg); border: 1px solid var(--line); border-radius: 11px; padding: 13px 14px; color: var(--text); font-family: var(--ui); font-size: 15px; }
.field input:focus { outline: none; border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(255,46,46,.14); }
.auth-btn { width: 100%; border: none; border-radius: 12px; padding: 15px; font-family: var(--disp); font-weight: 800; font-size: 18px; letter-spacing: .06em; text-transform: uppercase; background: var(--grad); color: #05060d; cursor: pointer; margin-top: 4px; transition: .15s; }
.auth-btn:active { transform: scale(.985); }
.auth-alt { text-align: center; margin-top: 16px; font-size: 12px; color: var(--mute); }
.auth-alt a { color: var(--cyan); cursor: pointer; text-decoration: none; }
.auth-guest { display: block; text-align: center; margin-top: 20px; color: var(--dim); font-size: 12px; letter-spacing: .04em; cursor: pointer; text-decoration: none; }
.auth-guest:hover { color: var(--text); }
.auth-legal { text-align: center; font-size: 10px; color: var(--mute); margin-top: 14px; line-height: 1.5; }

/* ============================================================= APPBAR ===== */
.appbar { position: sticky; top: 0; z-index: 60; margin: 0 26px; background: rgba(5,6,13,.86); backdrop-filter: blur(18px); border-bottom: 1px solid var(--line-soft); }
.appbar::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 24px; background: linear-gradient(to bottom, var(--bg) 0%, transparent 100%); pointer-events: none; z-index: 5; }
.appbar-top { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; padding-top: calc(20px + env(safe-area-inset-top)); cursor: default; }
.brand { display: flex; align-items: center; gap: 10px; }
.brand .wm { font-size: 22px; }
.brand .yr { font-family: var(--disp); font-weight: 700; color: var(--mute); font-size: 22px; }
.net { display: flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 5px 10px; border-radius: 100px; border: 1px solid var(--line); color: var(--good); }
.net .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--good); box-shadow: 0 0 8px var(--good); }
.net.off { color: var(--cyan); } .net.off .dot { background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }
.count-row { display: flex; align-items: center; gap: 9px; padding: 0 0 11px; }
.count-row .cd { display: flex; align-items: flex-end; gap: 5px; font-variant-numeric: tabular-nums; }
.count-row .cd .cu { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.count-row .cd .cu b { font-family: var(--disp); font-weight: 800; font-size: 22px; color: var(--text); letter-spacing: .01em; -webkit-text-fill-color: currentColor; }
.count-row .cd .cu i { font-size: 8px; font-style: normal; text-transform: uppercase; letter-spacing: .07em; color: var(--mute); margin-top: 3px; }
.count-row .cd .csep { font-family: var(--disp); font-weight: 800; font-size: 18px; color: var(--mute); align-self: flex-start; }
.count-row .cd .cd-live { font-family: var(--disp); font-weight: 800; font-size: 19px; color: var(--red); letter-spacing: .04em; }
.count-row .meta { font-size: 11px; color: var(--mute); letter-spacing: .05em; }
.expander { color: var(--mute); font-size: 12px; display: flex; align-items: center; gap: 5px; margin-left: auto; }
.expander svg { width: 16px; height: 16px; transition: transform .4s; }
.appbar.open .expander svg { transform: rotate(180deg); }
.hero-flyer { max-height: 0; overflow: hidden; transition: max-height .5s cubic-bezier(.16,1,.3,1); border-top: 1px solid transparent; }
.appbar.open .hero-flyer { max-height: 78vh; border-top-color: var(--line-soft); }
.hero-flyer img { width: 100%; display: block; }

/* ============================================================= VIEWS ===== */
.view { display: none; padding: 18px 26px calc(var(--nav-h) + 34px + env(safe-area-inset-bottom)); animation: fade .3s ease; }
.view.active { display: block; }
@keyframes fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.vhead { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.vhead h1 { font-family: var(--disp); font-weight: 800; font-size: 34px; letter-spacing: .01em; text-transform: uppercase; line-height: .95; }
.vhead .sub { font-size: 12px; color: var(--mute); letter-spacing: .04em; }
.beta-note { font-size: 11px; color: var(--mute); background: var(--bg-2); border: 1px dashed var(--line); border-radius: 9px; padding: 8px 11px; margin-bottom: 14px; line-height: 1.45; }
.beta-note b { color: var(--dim); }

/* ===== HOME ===== */
.home-hero { position: relative; border-radius: 18px; overflow: hidden; border: 1px solid var(--line); margin-bottom: 18px; background: #070712; cursor: pointer; display: block; }
.home-hero img { width: 100%; display: block; }
.hero-cta { position: absolute; bottom: 11px; right: 12px; background: var(--grad); color: #fff; font-family: var(--disp); font-weight: 800; font-size: 12.5px; letter-spacing: .04em; text-transform: uppercase; padding: 7px 13px; border-radius: 100px; box-shadow: 0 5px 16px rgba(0,0,0,.45); }
.home-hero:active { transform: scale(.992); }
/* hero is the clean flyer poster, tap to enlarge (date + venue live in the flyer art and Festival Info below) */

.sect-label { font-family: var(--ui); font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--cyan); margin: 0 2px 11px; display: flex; align-items: center; gap: 9px; }
.sect-label::before { content: ""; width: 18px; height: 2px; background: var(--grad); }

.tickets { display: grid; gap: 11px; margin-bottom: 24px; }
.tix { display: flex; align-items: center; gap: 14px; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 15px; position: relative; overflow: hidden; }
.tix::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--grad); }
.tix.vip::before { background: linear-gradient(180deg, #ffd76a, #ff3b2f); }
.tix.plan::before { background: linear-gradient(180deg, var(--cyan), var(--violet)); }
.tix-tier { font-family: var(--disp); font-weight: 800; font-size: 13px; letter-spacing: .08em; padding: 5px 10px; border-radius: 7px; background: var(--bg-2); border: 1px solid var(--line); color: var(--dim); min-width: 56px; text-align: center; }
.tix.vip .tix-tier { color: #ffd76a; border-color: rgba(255,215,106,.4); }
.tix-meta { flex: 1; min-width: 0; }
.tix-meta .nm { font-family: var(--disp); font-weight: 700; font-size: 19px; letter-spacing: .01em; text-transform: uppercase; }
.tix-meta .sb { font-size: 12px; color: var(--dim); }
.tix-cta { border: none; border-radius: 11px; padding: 11px 15px; font-family: var(--ui); font-weight: 700; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; background: var(--grad); color: #05060d; cursor: pointer; white-space: nowrap; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.tix-cta:active { transform: scale(.97); }
.tix-cta svg { width: 14px; height: 14px; }

.linklist { display: grid; gap: 9px; }
.linkrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--card); border: 1px solid var(--line-soft); border-radius: 13px; padding: 14px; color: var(--text); text-decoration: none; font-size: 14px; font-weight: 600; }
.linkrow:active { transform: scale(.99); }
.linkrow .ic { color: var(--cyan); }
.socials { display: flex; gap: 9px; margin-top: 12px; }
.socials a { flex: 1; text-align: center; background: var(--card); border: 1px solid var(--line-soft); border-radius: 12px; padding: 12px; color: var(--dim); text-decoration: none; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.info-meta { font-size: 13.5px; color: var(--dim); line-height: 1.8; margin-bottom: 18px; }
.info-meta b { color: var(--text); }

/* ===== day tabs / chips / schedule ===== */
.daytabs { display: flex; gap: 8px; margin-bottom: 12px; }
.daytab { flex: 1; border: 1px solid var(--line); background: var(--bg-2); border-radius: 13px; padding: 10px 4px; text-align: center; cursor: pointer; transition: .15s; }
.daytab b { display: block; font-family: var(--disp); font-size: 17px; font-weight: 800; letter-spacing: .08em; }
.daytab span { font-size: 11px; color: var(--mute); }
.daytab.active { border-color: transparent; background: var(--grad); color: #05060d; }
.daytab.active span { color: rgba(5,6,13,.72); }
.chips { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 8px; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip { white-space: nowrap; font-size: 12px; font-weight: 600; padding: 7px 14px; border-radius: 100px; border: 1px solid var(--line); background: var(--bg-2); color: var(--dim); cursor: pointer; }
.chip.active { color: var(--text); border-color: var(--cyan); background: rgba(255,46,46,.1); }
.stage-blurb { font-size: 12px; color: var(--cyan); font-weight: 600; margin: 2px 2px 12px; }
.stage-blurb:empty { display: none; }
.timehead { font-family: var(--disp); font-size: 15px; font-weight: 700; color: var(--mute); letter-spacing: .12em; padding: 14px 2px 8px; }

.set { display: flex; align-items: center; gap: 12px; background: var(--card); border: 1px solid var(--line-soft); border-radius: 15px; padding: 11px; margin-bottom: 9px; cursor: pointer; transition: .12s; }
.set:active { transform: scale(.992); }
.set.head { border-color: rgba(255,46,46,.4); background: linear-gradient(100deg, rgba(255,46,46,.07), var(--card) 62%); }
.set.clash { border-color: rgba(255,77,114,.5); }
.av { width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center; font-family: var(--disp); font-weight: 800; font-size: 20px; color: #05060d; position: relative; overflow: hidden; }
.ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.set-meta { flex: 1; min-width: 0; }
.set-meta .nm { font-family: var(--disp); font-size: 18px; font-weight: 700; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.set-meta .sb { font-size: 12px; color: var(--dim); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.stg { color: var(--cyan); font-weight: 700; letter-spacing: .03em; }
.tag-hl { font-size: 9px; font-family: var(--disp); font-weight: 800; letter-spacing: .08em; color: var(--red); border: 1px solid rgba(255,46,46,.5); border-radius: 4px; padding: 1px 5px; }
.clash-flag { font-size: 9px; font-weight: 800; letter-spacing: .06em; color: var(--warn); border: 1px solid rgba(255,77,114,.45); background: rgba(255,77,114,.08); border-radius: 5px; padding: 2px 6px; }
.set-meta > .clash-flag { margin-top: 6px; }
.heart { width: 40px; height: 40px; flex-shrink: 0; border: none; background: transparent; cursor: pointer; display: grid; place-items: center; border-radius: 11px; }
.heart svg { width: 22px; height: 22px; }
.empty { text-align: center; color: var(--mute); padding: 56px 20px; }
.empty .big { font-size: 34px; margin-bottom: 12px; }
.empty .big svg { width: 46px; height: 46px; }
.empty p { font-size: 14px; line-height: 1.5; }

/* ===== lineup ===== */
.poster { display: block; position: relative; border-radius: 16px; overflow: hidden; margin-bottom: 14px; border: 1px solid var(--line); }
.poster img { width: 100%; display: block; }
.poster-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 12px 9px; font-size: 11px; font-weight: 700; letter-spacing: .04em; color: var(--text); background: linear-gradient(transparent, rgba(5,6,13,.94)); }
.search { width: 100%; background: var(--bg-2); border: 1px solid var(--line); border-radius: 12px; padding: 13px 15px; color: var(--text); font-family: var(--ui); font-size: 14px; margin-bottom: 14px; }
.search::placeholder { color: var(--mute); }
.search:focus { outline: none; border-color: var(--cyan); }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.acard { background: var(--card); border: 1px solid var(--line-soft); border-radius: 16px; padding: 16px 13px; cursor: pointer; position: relative; overflow: hidden; text-align: center; transition: .12s; }
.acard:active { transform: scale(.99); }
.ab { width: 88px; height: 88px; border-radius: 50%; margin: 0 auto 11px; display: grid; place-items: center; font-family: var(--disp); font-weight: 800; font-size: 33px; color: #05060d; position: relative; overflow: hidden; }
.acard .an { font-family: var(--disp); font-size: 17px; font-weight: 700; letter-spacing: .01em; }
.acard .ag { font-size: 11px; color: var(--mute); margin-top: 1px; }
.acard .mini-heart { position: absolute; top: 9px; right: 9px; width: 28px; height: 28px; border-radius: 50%; background: rgba(5,6,13,.62); display: grid; place-items: center; }
.acard .mini-heart svg { width: 15px; height: 15px; }

/* ===== MAP (real, pan/zoom) ===== */
.map-tabs { display: flex; gap: 7px; margin-bottom: 12px; }
.map-tab { flex: 1; text-align: center; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 9px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg-2); color: var(--dim); cursor: pointer; }
.map-tab.on { border-color: var(--cyan); color: var(--text); background: rgba(255,46,46,.1); }
.mapframe { position: relative; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: #000; aspect-ratio: 1 / 1; touch-action: none; }
#mapLayer { position: absolute; left: 50%; top: 50%; width: 100%; transform-origin: center; }
.fmap { shape-rendering: geometricPrecision; text-rendering: geometricPrecision; }
.mapframe img { display: block; width: 100%; height: auto; user-select: none; -webkit-user-drag: none; }
.map-hint { position: absolute; left: 12px; bottom: 12px; z-index: 3; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--dim); background: rgba(5,6,13,.7); border: 1px solid var(--line); border-radius: 100px; padding: 5px 10px; pointer-events: none; }
.map-zoom { position: absolute; right: 12px; bottom: 12px; z-index: 3; display: flex; flex-direction: column; gap: 6px; }
.map-zoom button { width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); background: rgba(5,6,13,.78); color: var(--text); font-size: 20px; font-weight: 700; cursor: pointer; display: grid; place-items: center; }
.map-locate { position: absolute; right: 12px; bottom: 106px; z-index: 3; width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); background: rgba(5,6,13,.78); color: var(--text); cursor: pointer; display: grid; place-items: center; }
.map-locate svg { width: 19px; height: 19px; }
.map-locate.on { color: var(--de-cyan); border-color: var(--de-cyan); box-shadow: 0 0 14px rgba(42,232,255,.5); }
.mpoi .ml { display: none; }
.fmap.zoomed .mpoi .ml { display: block; }
.fzone.pulse .zfill { animation: zonePulse .9s ease-in-out 3; }
@keyframes zonePulse { 50% { filter: brightness(1.55) saturate(1.35); } }
.loc-card { margin-top: 14px; background: var(--card); border: 1px solid var(--line-soft); border-radius: 16px; padding: 16px; }
.loc-name { font-family: var(--disp); font-size: 20px; font-weight: 800; letter-spacing: .01em; }
.loc-addr { font-size: 13px; color: var(--dim); margin-top: 2px; }
.loc-btns { display: flex; gap: 10px; margin-top: 14px; }
.loc-btn { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; border-radius: 12px; padding: 13px; font-weight: 800; font-size: 14px; letter-spacing: .01em; border: 1px solid transparent; }
.loc-btn svg { width: 18px; height: 18px; }
.loc-btn:active { transform: scale(.98); }
.loc-btn.apple { background: #fff; color: #05060d; }
.loc-btn.google { background: var(--grad); color: #05060d; }
.loc-sub { font-size: 11px; color: var(--mute); margin-top: 12px; line-height: 1.5; }

/* ===== bottom nav (V2 center, raised) ===== */
.nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; max-width: calc(var(--app-w) - 52px); margin: 0 auto; height: calc(var(--nav-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); display: flex; align-items: stretch; background: rgba(8,9,18,.94); backdrop-filter: blur(20px); border-top: 1px solid var(--line); }
.nav::before { content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 30px; background: linear-gradient(to top, #1f0813 0%, transparent 100%); pointer-events: none; }
.nav button { flex: 1; background: none; border: none; color: var(--mute); cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 10px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; position: relative; }
.nav button svg { width: 23px; height: 23px; }
.nav button.active { color: var(--cyan); }
.nav button .nbadge { position: absolute; top: 8px; left: 56%; background: var(--magenta); color: #fff; font-size: 9px; font-weight: 800; min-width: 16px; height: 16px; border-radius: 8px; display: grid; place-items: center; padding: 0 4px; }
/* home is a standard nav item (lightning bolt), no raised center treatment */

/* ===== artist modal ===== */
.modal { position: fixed; inset: 0; z-index: 90; display: none; }
.modal.open { display: block; }
.modal .scrim { position: absolute; inset: 0; background: rgba(3,3,9,.74); backdrop-filter: blur(5px); }
.sheet { position: absolute; left: 0; right: 0; bottom: 0; max-width: var(--app-w); margin: 0 auto; background: var(--bg-2); border-top: 1px solid var(--line); border-radius: 24px 24px 0 0; padding: 8px 18px calc(26px + env(safe-area-inset-bottom)); animation: slideup .3s cubic-bezier(.16,1,.3,1); max-height: 86vh; overflow-y: auto; }
@keyframes slideup { from { transform: translateY(100%); } to { transform: none; } }
.grab { width: 42px; height: 4px; border-radius: 4px; background: var(--line); margin: 6px auto 16px; }
.sheet .hero-av { width: 86px; height: 86px; border-radius: 50%; display: grid; place-items: center; font-family: var(--disp); font-weight: 800; font-size: 34px; color: #05060d; margin-bottom: 14px; position: relative; overflow: hidden; }
.sheet h2 { font-family: var(--disp); font-size: 32px; font-weight: 800; letter-spacing: .01em; text-transform: uppercase; }
.sheet .gtag { display: inline-block; font-size: 12px; font-weight: 700; color: var(--cyan); margin-top: 2px; letter-spacing: .04em; }
.sheet .when { margin-top: 14px; background: var(--card); border: 1px solid var(--line-soft); border-radius: 12px; padding: 13px; font-size: 14px; }
.sheet .when .row { display: flex; justify-content: space-between; gap: 10px; }
.sheet .when .row + .row { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); }
.sheet .when .k { color: var(--mute); font-size: 12px; }
.sheet .when .v { font-weight: 700; }
.sheet .when .v.stg { color: var(--cyan); }
.sheet p.bio { margin-top: 14px; font-size: 14px; line-height: 1.6; color: var(--dim); }
.acts { display: flex; gap: 9px; margin-top: 16px; }
.btn { flex: 1; border: none; border-radius: 12px; padding: 14px; font-weight: 800; font-size: 14px; letter-spacing: .02em; cursor: pointer; text-decoration: none; text-align: center; display: flex; align-items: center; justify-content: center; gap: 7px; font-family: var(--ui); }
.btn.fav { background: var(--bg-3); color: var(--text); border: 1px solid var(--line); }
.btn.fav.on { background: var(--grad); color: #05060d; }
.btn.spotify { background: #1db954; color: #fff; }
.btn.ig { background: linear-gradient(45deg, #f09433, #dc2743 48%, #bc1888); color: #fff; }

/* install toast */
.install { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(var(--nav-h) + 18px + env(safe-area-inset-bottom)); z-index: 80; max-width: 480px; width: calc(100% - 32px); display: none; align-items: center; gap: 12px; background: var(--bg-3); border: 1px solid var(--cyan); border-radius: 14px; padding: 12px 14px; box-shadow: 0 18px 44px rgba(0,0,0,.55); }
.install.show { display: flex; }
.install .it { flex: 1; font-size: 12px; line-height: 1.4; color: var(--dim); }
.install .it b { color: var(--text); display: block; font-size: 13px; }
.install button { border: none; border-radius: 9px; padding: 9px 13px; font-size: 12px; font-weight: 800; cursor: pointer; }
.install .yes { background: var(--grad); color: #05060d; }
.install .no { background: transparent; color: var(--mute); }

/* ---------- auth: forgot link + notice ---------- */
.auth-forgot { text-align: right; margin: -3px 0 11px; }
.auth-forgot a { color: var(--dim); font-size: 12px; cursor: pointer; }
.auth-forgot a:hover { color: var(--text); }
.auth-notice { margin-top: 11px; padding: 9px 12px; border-radius: 9px; font-size: 12.5px; line-height: 1.45; border: 1px solid var(--line); background: rgba(255,255,255,.03); color: var(--text); }
.auth-notice.ok { border-color: rgba(63,240,160,.4); background: rgba(63,240,160,.08); color: #9affd0; }
.auth-notice.err { border-color: rgba(255,77,114,.45); background: rgba(255,77,114,.08); color: #ff9fb0; }

/* ---------- appbar account button ---------- */
.appbar-actions { display: flex; align-items: center; gap: 10px; }
.acct-btn { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line); background: var(--card); color: var(--text); display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; padding: 0; }
.acct-btn svg { width: 18px; height: 18px; }
.acct-btn:active { transform: scale(.93); }

/* ---------- account / profile sheet ---------- */
.acct { display: flex; flex-direction: column; }
.acct-l { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--dim); margin: 13px 0 5px; font-family: var(--disp); font-weight: 700; }
.acct-ro { font-size: 14px; color: var(--text); padding: 10px 12px; border-radius: 9px; background: rgba(255,255,255,.04); border: 1px solid var(--line); }
.acct-i { font-size: 15px; color: var(--text); padding: 11px 12px; border-radius: 9px; background: var(--bg); border: 1px solid var(--line); outline: none; font-family: var(--ui); width: 100%; }
.acct-i:focus { border-color: var(--cyan); }
.acct-i:disabled { opacity: .55; -webkit-text-fill-color: var(--dim); color: var(--dim); } /* locked until Edit profile */
/* set-time embargo: every time string blurs until the reveal moment */
body.times-locked .stime { filter: blur(6px); opacity: .75; user-select: none; -webkit-user-select: none; pointer-events: none; }
.acct .btn { margin-top: 12px; }
.acct-div { height: 1px; background: var(--line); margin: 17px 0 2px; }
.acct-out { color: #ff9fb0 !important; border-color: rgba(255,77,114,.4) !important; }
.acct-note { margin-top: 11px; font-size: 12.5px; line-height: 1.45; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--line); color: var(--text); }
.acct-note.ok { border-color: rgba(63,240,160,.4); background: rgba(63,240,160,.08); color: #9affd0; }
.acct-note.err { border-color: rgba(255,77,114,.45); background: rgba(255,77,114,.08); color: #ff9fb0; }
.acct-load { color: var(--dim); padding: 22px 0; text-align: center; font-size: 13px; }
.acct-del { color: #ff6b88 !important; border-color: rgba(255,77,114,.55) !important; background: rgba(255,77,114,.10) !important; }
.auth-legal a { color: var(--mute); text-decoration: underline; }
.auth-notice a { color: var(--cyan); cursor: pointer; text-decoration: underline; }

/* ===== home info: icon meta ===== */
.info-meta { display: flex; flex-direction: column; gap: 9px; line-height: 1.4; margin-bottom: 16px; }
.im-row { display: flex; align-items: flex-start; gap: 10px; font-size: 13.5px; color: var(--dim); }
.im-row b { color: var(--text); font-weight: 700; }
.im-ic { flex-shrink: 0; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; color: var(--red); margin-top: 1px; }
.im-ic svg { width: 18px; height: 18px; }

/* ===== direct tickets button ===== */
.info-ticket { display: flex; align-items: center; gap: 11px; padding: 13px 15px; margin-bottom: 11px; border-radius: 12px; background: var(--grad); color: #fff; text-decoration: none; font-family: var(--disp); font-weight: 800; font-size: 16px; letter-spacing: .02em; text-transform: uppercase; box-shadow: 0 6px 20px rgba(255,46,46,.28); }
.info-ticket .it-ic { display: inline-flex; }
.info-ticket .it-ic svg { width: 21px; height: 21px; }
.info-ticket .it-t { flex: 1; }
.info-ticket .it-x svg { width: 17px; height: 17px; opacity: .85; }
.info-ticket:active { transform: scale(.99); }

/* ===== collapsible info tiles ===== */
.info-tile { border: 1px solid var(--line-soft); border-radius: 13px; background: var(--card); overflow: hidden; }
.info-head { width: 100%; display: flex; align-items: center; gap: 12px; padding: 15px; background: none; border: none; color: var(--text); cursor: pointer; font-family: var(--ui); text-align: left; }
.info-head .ih-ic, .info-ext .ih-ic { flex-shrink: 0; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; color: var(--red); }
.info-head .ih-ic svg, .info-ext .ih-ic svg { width: 20px; height: 20px; }
.info-head .ih-t, .info-ext .ih-t { flex: 1; font-size: 15.5px; font-weight: 600; }
.info-head .ih-x { color: var(--dim); display: inline-flex; transition: transform .25s; }
.info-head .ih-x svg { width: 20px; height: 20px; }
.info-tile.open .info-head .ih-x { transform: rotate(180deg); }
.info-body { max-height: 0; overflow: hidden; transition: max-height .4s ease; }
.info-tile.open .info-body { max-height: 4000px; }
.info-inner { padding: 0 16px 16px; }
.info-ext { display: flex; align-items: center; gap: 12px; padding: 15px; text-decoration: none; color: var(--text); }
.info-ext .ih-x { color: var(--red); display: inline-flex; }
.info-ext .ih-x svg { width: 17px; height: 17px; }

/* info body content */
.ib-quick { display: flex; flex-wrap: wrap; gap: 7px; margin: 2px 0 6px; }
.ib-quick span { font-size: 10.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--text); background: rgba(255,46,46,.12); border: 1px solid rgba(255,46,46,.3); border-radius: 20px; padding: 4px 10px; }
.ib-h { font-family: var(--disp); font-weight: 800; font-size: 15px; letter-spacing: .04em; text-transform: uppercase; color: var(--red); margin: 17px 0 7px; }
.ib-q { font-size: 13.5px; font-weight: 700; color: var(--text); margin-top: 11px; }
.ib-a { font-size: 13px; line-height: 1.55; color: var(--dim); margin-top: 3px; }
.ib-btn { display: inline-flex; align-items: center; gap: 8px; margin: 12px 0 4px; padding: 10px 14px; border-radius: 9px; background: rgba(255,46,46,.1); border: 1px solid rgba(255,46,46,.35); color: var(--text); text-decoration: none; font-size: 13.5px; font-weight: 700; }

/* ===== social buttons with icons ===== */
.socials .social-btn { display: flex; align-items: center; justify-content: center; gap: 8px; }
.social-btn .so-ic { display: inline-flex; color: var(--dim); }
.social-btn .so-ic svg { width: 17px; height: 17px; }
.socials .social-btn:active .so-ic { color: var(--text); }

/* ===== nav home icon ===== */
.clash-flag { display: inline-flex; align-items: center; gap: 4px; }
.clash-flag svg { width: 11px; height: 11px; }
.btn.spotify, .btn.ig { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.btn.spotify svg, .btn.ig svg { width: 14px; height: 14px; }

/* ===== map guide: clickable stages + festival key ===== */
.map-guide { margin-top: 18px; }
.map-sect-l { font-family: var(--disp); font-weight: 800; font-size: 12.5px; letter-spacing: .09em; text-transform: uppercase; color: var(--dim); margin: 0 0 10px; }
.stage-grid { display: flex; flex-direction: column; gap: 9px; }
.stage-card { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 13px 14px; border-radius: 13px; border: 1px solid var(--line); background: var(--card); color: var(--text); cursor: pointer; font-family: var(--ui); }
.stage-card:active { transform: scale(.99); }
.stage-card .sc-num { width: 27px; height: 27px; flex-shrink: 0; display: grid; place-items: center; border-radius: 8px; font-family: var(--disp); font-weight: 800; font-size: 15px; color: #fff; background: var(--grad); }
.stage-card .sc-body { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.stage-card .sc-name { font-size: 15px; font-weight: 700; }
.stage-card .sc-blurb { font-size: 11.5px; color: var(--dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stage-card .sc-n { font-size: 11px; color: var(--mute); white-space: nowrap; font-weight: 600; }
.key-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.key-item { display: flex; align-items: center; gap: 9px; padding: 10px 11px; border-radius: 10px; border: 1px solid var(--line-soft); background: var(--card); font-size: 12.5px; color: var(--text); }
.key-item .ki-ic { display: inline-flex; color: var(--red); flex-shrink: 0; }
.key-item .ki-ic svg { width: 17px; height: 17px; }
.stage-row { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; padding: 11px 4px; background: none; border: none; border-bottom: 1px solid var(--line-soft); color: var(--text); cursor: pointer; font-family: var(--ui); }
.stage-row .sr-t { font-family: var(--disp); font-weight: 700; font-size: 13px; color: var(--red); width: 60px; flex-shrink: 0; }
.stage-row .sr-n { flex: 1; font-size: 14px; font-weight: 600; }
.stage-row .sr-h { width: 18px; height: 18px; display: inline-flex; flex-shrink: 0; }
.stage-row .sr-h svg { width: 18px; height: 18px; }

/* ===== GPS: you are here ===== */
.you-here { position: absolute; transform: translate(-50%, -50%); z-index: 5; display: flex; flex-direction: column; align-items: center; pointer-events: none; }
.you-here .yh-dot { width: 15px; height: 15px; border-radius: 50%; background: var(--de-cyan); border: 2px solid #fff; box-shadow: 0 0 0 5px rgba(42,232,255,.28), 0 0 14px rgba(42,232,255,.9); animation: yhpulse 1.8s ease-out infinite; }
.you-here .yh-lbl { margin-top: 5px; font-size: 8.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #fff; background: rgba(5,6,13,.82); border: 1px solid var(--de-cyan); border-radius: 100px; padding: 2px 7px; white-space: nowrap; }
.you-here { transition: left .9s linear, top .9s linear; } /* the dot glides between GPS fixes while you walk */
.you-here .yh-acc { position: absolute; left: 50%; top: 7.5px; transform: translate(-50%, -50%); width: 0; height: 0; border-radius: 50%; background: rgba(42,232,255,.09); border: 1.5px solid rgba(42,232,255,.38); transition: width .9s linear, height .9s linear; z-index: -1; }
@keyframes yhpulse { 0% { box-shadow: 0 0 0 0 rgba(42,232,255,.5), 0 0 14px rgba(42,232,255,.9); } 70% { box-shadow: 0 0 0 13px rgba(42,232,255,0), 0 0 14px rgba(42,232,255,.9); } 100% { box-shadow: 0 0 0 0 rgba(42,232,255,0), 0 0 14px rgba(42,232,255,.9); } }
.gps-row { margin-top: 12px; }
.gps-btn { width: 100%; display: flex; align-items: center; justify-content: center; gap: 9px; padding: 13px; border-radius: 12px; border: 1px solid var(--line); background: var(--card); color: var(--text); font-family: var(--ui); font-weight: 700; font-size: 14px; cursor: pointer; }
.gps-btn svg { width: 18px; height: 18px; color: var(--de-cyan); }
.gps-btn.on { border-color: var(--de-cyan); background: rgba(42,232,255,.09); }
.gps-btn:active { transform: scale(.99); }
.gps-readout { margin-top: 10px; display: flex; align-items: center; gap: 13px; padding: 13px 14px; border-radius: 13px; border: 1px solid var(--line); background: var(--card); }
.gps-readout .gr-arrow { width: 42px; height: 42px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--de-cyan); color: var(--de-cyan); }
.gps-readout .gr-arrow.live { background: rgba(42,232,255,.12); }
.gps-readout .gr-arrow svg { width: 22px; height: 22px; }
.gps-readout .gr-txt { font-size: 13px; line-height: 1.5; color: var(--text); }
.gps-readout .gr-txt b { color: var(--de-cyan); }
.gps-readout.err { border-color: rgba(255,77,114,.4); }
.gps-readout.err .gr-txt { color: #ff9fb0; }

/* ===== interactive vector festival map ===== */
#mapContent { width: 100%; display: block; position: relative; }
.map-hotspots { position: absolute; inset: 0; pointer-events: none; }
.map-hotspots .hot { position: absolute; pointer-events: auto; cursor: pointer; border: 2px solid transparent; border-radius: 16px; background: transparent; transition: background .15s, border-color .15s, box-shadow .15s; -webkit-tap-highlight-color: transparent; }
.map-hotspots .hot:hover, .map-hotspots .hot:active { background: rgba(255,46,46,.16); border-color: var(--cyan); box-shadow: 0 0 22px rgba(255,46,46,.55); }
/* amenity chips traced over the official map: hidden until the legend lights them up */
#mapImg { transition: filter .28s ease; }
#mapContent.poi-active #mapImg { filter: brightness(.34) saturate(.62) contrast(.96); }
.map-hotspots .mk-hot { position: absolute; width: 7.4%; aspect-ratio: 1 / 1; transform: translate(-50%, -50%) scale(.55); pointer-events: none; opacity: 0; box-sizing: border-box; color: #19d3e6; transition: opacity .18s ease, transform .24s cubic-bezier(.2,1.5,.4,1); }
.map-hotspots .mk-glow { position: absolute; inset: -55%; border-radius: 50%; background: radial-gradient(circle, currentColor 0%, transparent 66%); opacity: 0; filter: blur(3px); }
.map-hotspots .mk-dot { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 50%; background: #080a12; border: 2px solid currentColor; box-shadow: 0 0 0 2px rgba(0,0,0,.6), 0 3px 9px rgba(0,0,0,.55), 0 0 14px currentColor; }
.map-hotspots .mk-dot svg { width: 56%; height: 56%; color: currentColor; display: block; }
.map-hotspots .mk-hot { pointer-events: auto; cursor: pointer; } /* the chips ARE the tap targets over the printed icons */
.map-hotspots .mk-hot.sel { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.map-hotspots .mk-hot.hl { opacity: 1; transform: translate(-50%, -50%) scale(1); animation: mkPulse 1.5s ease-in-out .32s infinite; }
.map-hotspots .mk-hot.hl .mk-glow { opacity: .85; animation: mkGlowPulse 1.5s ease-in-out infinite; }
@keyframes mkPulse { 0%, 100% { transform: translate(-50%, -50%) scale(1); } 50% { transform: translate(-50%, -50%) scale(1.09); } }
@keyframes mkGlowPulse { 0%, 100% { opacity: .5; } 50% { opacity: .95; } }
.fmap { width: 100%; height: auto; display: block; }
.fzone .zfill { transition: filter .15s; } /* zones are display-only; taps belong to the amenity markers */
.mpoi { cursor: pointer; }
.mpoi circle, .mpoi rect { transition: stroke .12s, stroke-width .12s; }
.mpoi:hover circle, .mpoi:hover rect, .mpoi.sel circle, .mpoi.sel rect { stroke: var(--de-cyan); stroke-width: 3.5; }
.map-tip { position: absolute; left: 50%; top: 12px; transform: translateX(-50%); z-index: 6; width: max-content; max-width: 88%; display: flex; align-items: center; gap: 11px; text-align: left; background: rgba(5,6,13,.96); border: 1.5px solid var(--de-cyan); color: #fff; font-size: 14.5px; font-weight: 800; letter-spacing: .03em; padding: 11px 16px; border-radius: 15px; opacity: 0; pointer-events: none; transition: opacity .2s; box-shadow: 0 6px 20px rgba(0,0,0,.55), 0 0 16px rgba(42,232,255,.28); }
.map-tip.show { opacity: 1; }
.map-tip .mt-ic { flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(255,255,255,.06); border: 1px solid var(--line); }
.map-tip .mt-ic svg { width: 19px; height: 19px; }
.map-tip .mt-body { min-width: 0; }
.map-tip .mt-body b { display: block; text-transform: uppercase; }
.map-tip .mt-d { display: block; font-weight: 600; font-size: 11.5px; line-height: 1.4; letter-spacing: .01em; text-transform: none; color: #bfe9f2; margin-top: 2px; white-space: normal; }
/* clickable festival key -> highlight markers on the map */
.key-item { cursor: pointer; transition: border-color .15s, background .15s; }
.key-item:active { transform: scale(.98); }
.key-item.on { border-color: var(--de-cyan); background: rgba(42,232,255,.1); }
.fmap.filtering .mpoi:not(.hl) { opacity: .26; transition: opacity .2s; }
.mpoi.hl circle, .mpoi.hl rect { stroke: var(--de-cyan); filter: drop-shadow(0 0 4px #2ae8ff); animation: poiGlow 1s ease-in-out infinite; }
@keyframes poiGlow { 0%, 100% { stroke-width: 3.5; } 50% { stroke-width: 6.5; } }

/* gold VIP ticket button + sold-out bar */
.tix-cta.gold { background: linear-gradient(120deg, #ffe08a, #d9a52b); color: #2a1d00; box-shadow: 0 6px 18px rgba(217,165,43,.3); }
.sold-bar { margin: 2px 0 14px; }
.sold-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 7px; }
.sold-l { font-family: var(--disp); font-weight: 800; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
.sold-p { font-size: 11.5px; font-weight: 700; color: var(--dim); }
.sold-track { height: 9px; border-radius: 100px; background: rgba(255,255,255,.07); border: 1px solid var(--line); overflow: hidden; }
.sold-fill { height: 100%; border-radius: 100px; background: var(--grad); box-shadow: 0 0 10px rgba(255,46,46,.5); transition: width .7s ease; }

/* ===== Info / FAQ page (opened from the profile menu) ===== */
.infopage { position: fixed; inset: 0; z-index: 210; background: var(--bg); display: none; flex-direction: column; }
.infopage.show { display: flex; }
.ip-head { flex-shrink: 0; padding: calc(14px + env(safe-area-inset-top)) 22px 12px; border-bottom: 1px solid var(--line-soft); background: rgba(5,6,13,.92); backdrop-filter: blur(14px); }
.ip-head .brand-logos { margin-bottom: 13px; }
.ip-back { display: inline-flex; align-items: center; gap: 4px; background: var(--bg-2); border: 1px solid var(--line); color: var(--text); font-family: var(--ui); font-weight: 700; font-size: 13px; padding: 8px 15px 8px 9px; border-radius: 100px; cursor: pointer; transition: .15s; }
.ip-back svg { width: 17px; height: 17px; }
.ip-back:active { transform: scale(.96); }
.ip-scroll { flex: 1; overflow-y: auto; padding: 18px 22px calc(36px + env(safe-area-inset-bottom)); max-width: var(--app-w); width: 100%; margin: 0 auto; -webkit-overflow-scrolling: touch; }
.ip-title { font-family: var(--disp); font-weight: 800; font-size: 34px; letter-spacing: .01em; text-transform: uppercase; margin-bottom: 16px; }
.ip-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 6px; }
.ip-btn { display: flex; align-items: center; gap: 9px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 14px 12px; color: var(--text); text-decoration: none; font-weight: 700; font-size: 13px; transition: .15s; }
.ip-btn:active { transform: scale(.985); border-color: var(--cyan); }
.ip-btn-ic { color: var(--cyan); display: flex; flex-shrink: 0; } .ip-btn-ic svg { width: 19px; height: 19px; }
.ip-btn-t { flex: 1; line-height: 1.15; }
.ip-btn-x { color: var(--mute); display: flex; flex-shrink: 0; } .ip-btn-x svg { width: 14px; height: 14px; }
.ip-acc { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.acc-item { border: 1px solid var(--line); border-radius: 12px; background: var(--card); overflow: hidden; }
.acc-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: none; border: none; color: var(--text); font-family: var(--ui); font-weight: 600; font-size: 14px; text-align: left; padding: 14px 15px; cursor: pointer; line-height: 1.3; }
.acc-chev { color: var(--mute); display: flex; flex-shrink: 0; transition: transform .25s; } .acc-chev svg { width: 18px; height: 18px; }
.acc-item.open .acc-chev { transform: rotate(180deg); }
.acc-item.open .acc-q { color: var(--cyan); }
.acc-a { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.acc-item.open .acc-a { max-height: 1000px; }
.acc-a p { padding: 0 15px 14px; color: var(--dim); font-size: 13.5px; line-height: 1.5; }
.pol-list { margin: 0; padding: 2px 15px 14px 32px; }
.pol-list li { color: var(--dim); font-size: 13px; line-height: 1.45; margin-bottom: 5px; }
.ip-foot { text-align: center; color: var(--mute); font-size: 12px; padding: 14px 0 4px; line-height: 1.5; }
.ip-foot a { color: var(--cyan); text-decoration: none; font-weight: 700; }
/* Festival Info button inside the profile/account sheet */
.acct-info { display: flex; align-items: center; gap: 11px; justify-content: flex-start; text-align: left; }
.acct-info .ai-ic { color: var(--cyan); display: flex; } .acct-info .ai-ic svg { width: 18px; height: 18px; }
.acct-info .ai-x { margin-left: auto; color: var(--mute); display: flex; transform: rotate(-90deg); } .acct-info .ai-x svg { width: 16px; height: 16px; }

/* ===== PRE-LAUNCH TEASE (toggle: FESTIVAL.preLaunch in data.js) =====
   Blurs the not-yet-live Schedule / Lineup / Map content while keeping every element in the DOM.
   Home (tickets + flyer hype) stays sharp. Flip preLaunch to false to reveal everything in one switch. */
.lock-note { display: none; align-items: center; gap: 10px; margin: 2px 0 15px; padding: 11px 14px;
  border-radius: 13px; background: rgba(255,46,46,.07); border: 1px solid var(--line); color: var(--dim);
  font-family: var(--ui); font-size: 12.5px; font-weight: 600; letter-spacing: .005em; line-height: 1.35; }
.lock-note svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--cyan); }
.lock-note b { color: #fff; font-weight: 800; }
body.sched-locked .lock-note { display: flex; }
/* Schedule blur lifts the instant set times are revealed (Supabase `reveals` row). Lineup shows in full. */
body.sched-locked #dayTabs, body.sched-locked #stageChips, body.sched-locked #stageBlurb, body.sched-locked #schedList {
  filter: blur(8px); pointer-events: none; user-select: none; -webkit-user-select: none;
}
@media (max-width: 480px) {
  body.sched-locked #dayTabs, body.sched-locked #stageChips, body.sched-locked #stageBlurb, body.sched-locked #schedList { filter: blur(6.5px); }
}
/* TBA placeholder: Map shows "TBA" pre-launch; the real map stays in code, just hidden. */
.tba-block { display: none; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; padding: 60px 24px; min-height: 44vh; }
.tba-big { font-family: var(--disp); font-weight: 800; font-size: 60px; letter-spacing: .05em; line-height: 1; color: #fff; background: var(--grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.tba-sub { color: var(--dim); font-size: 14px; line-height: 1.5; max-width: 270px; }
/* Map TBA shows during pre-launch; Lineup TBA shows only when the lineup reveal is locked (Supabase-driven). */
body.prelaunch #view-map .tba-block { display: flex; }
body.prelaunch #view-map > :not(.vhead):not(.tba-block) { display: none !important; }
body.lineup-locked #view-lineup .tba-block { display: flex; }
body.lineup-locked #view-lineup > :not(.vhead):not(.tba-block) { display: none !important; }

/* genre tags hidden on artists (lineup card + artist sheet) */
.acard .ag, .sheet .gtag { display: none; }