/* Layout: night-sky header with genre mix bar, sticky filter strip, then a responsive grid of artist cards ordered by billing */
:root{
  --night:#120a2e; --night2:#1d1145; --card:#24165a; --ink:#f6f1ff; --soft:#c9b8ff;
  --pink:#ff4fb4; --amber:#ffb627; --cyan:#3fe0ff; --violet:#a874ff; --lime:#7dff9b; --coral:#ff7a59;
  --gold:#ffcc66; --lav:#cc99ff; --orange:#ff7a3d; --peri:#6677ff; --red:#ff4d6d;
  --display:"Unbounded", "Arial Black", system-ui, sans-serif;
  --body:"Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
a,button,.chip,.seg button,.stg-row button,.vote button,.tabs a{touch-action:manipulation}
.ic{width:1em;height:1em;vertical-align:-.15em;flex:none;display:inline-block}
.ic-lg{width:1.3em;height:1.3em;vertical-align:-.22em}
body{margin:0;background:var(--night);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;
  padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));padding-block:0 48px;
  background-image:radial-gradient(circle at 15% -10%, #3a1a7a 0, transparent 45%),radial-gradient(circle at 95% 5%, #5a1150 0, transparent 40%);}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--night)}
.wrap{max-width:1100px;margin:0 auto}
header{padding-block:32px 20px;position:relative}
header::before{content:"";position:absolute;top:-60px;right:-80px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle at 32% 28%, rgba(185,255,210,.9), rgba(63,224,255,.55) 35%, rgba(94,58,219,.35) 60%, transparent 72%);
  filter:blur(6px);pointer-events:none;z-index:-1}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);font-weight:700}
h1{font-family:var(--display);font-weight:800;font-size:clamp(28px,6vw,52px);line-height:1.05;margin:8px 0 10px;text-wrap:balance}
h1 span{color:var(--pink)}
.tagline{margin:0 0 8px;font-size:14px;font-weight:600;color:var(--soft)}
.lede{color:var(--soft);max-width:62ch;margin:0}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.fact{background:var(--night2);border:1px solid #3b2a7a;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600}
.fact b{color:var(--cyan)}
.notice{margin-top:16px;background:#2a1650;border-left:4px solid var(--amber);padding:10px 14px;border-radius:6px;font-size:14px;max-width:70ch}
.maplink{display:inline-block;color:var(--cyan);font-weight:700;text-decoration:none;margin-top:4px}
.mix{margin-top:22px}
.stages{margin-top:24px}
.stages h2{font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 8px;color:var(--soft)}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.stage{background:var(--night2);border-radius:10px;padding:10px 12px;border-left:4px solid var(--s);min-width:0}
.stage b{display:block;font-family:var(--display);font-size:14px;font-weight:700}
.stage span{font-size:13px;color:var(--soft)}
.maplinks{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.maplinks a{color:var(--night);background:var(--cyan);font-weight:700;font-size:13.5px;text-decoration:none;padding:8px 12px;border-radius:8px}
.mapnote{font-size:13px;color:var(--soft);margin-top:8px}
.mix h2{font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 8px;color:var(--soft)}
.bar{display:flex;height:22px;border-radius:6px;overflow:hidden}
.bar div{height:100%}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;font-size:13px}
.legend span{display:inline-flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums}
.legend i{width:10px;height:10px;border-radius:2px;display:inline-block}
.filters{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--night);padding-block:12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;border-bottom:1px solid #2e1f66}
.chip{font:600 13px var(--body);color:var(--ink);background:var(--night2);border:1.5px solid #4a3594;border-radius:999px;padding:7px 13px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--night);border-color:var(--ink)}
.chip:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
#q{flex:1 1 160px;min-width:0;font:500 14px var(--body);color:var(--ink);background:var(--night2);border:1.5px solid #4a3594;border-radius:999px;padding:7px 14px}
#q::placeholder{color:#9d88e0}
.count{font-size:13px;color:var(--soft);margin:14px 0 10px;font-variant-numeric:tabular-nums}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.card{background:var(--card);border-radius:12px;padding:14px 14px 12px;display:flex;flex-direction:column;gap:8px;border-top:4px solid var(--g);min-width:0}
.top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.name{font-family:var(--display);font-weight:700;font-size:17px;line-height:1.2;text-wrap:balance;min-width:0;overflow-wrap:anywhere}
.rank{font-size:12px;color:var(--soft);font-variant-numeric:tabular-nums;white-space:nowrap}
.tags{display:flex;flex-wrap:wrap;gap:5px}
.tag{font-size:11.5px;font-weight:700;letter-spacing:.03em;padding:3px 8px;border-radius:5px;background:var(--g);color:var(--night)}
.tag.sun{background:var(--amber)}
.tag.gem{background:transparent;color:var(--lime);border:1.5px solid var(--lime)}
.tag.guess{background:transparent;color:var(--soft);border:1.5px dashed var(--soft)}
.vibe{margin:0;color:var(--soft);font-size:14px}
.links{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.yt{display:inline-flex;align-items:center;gap:7px;text-decoration:none;color:var(--ink);font-weight:700;font-size:13.5px;background:#ff2d55;padding:8px 12px;border-radius:8px}
.yt:hover{background:#ff5577}
.yt svg{width:15px;height:15px;flex:none}
.empty{color:var(--soft);padding:24px 0}
.vote{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.vote button{font:700 13px var(--body);color:var(--ink);background:var(--night2);border:1.5px solid #4a3594;border-radius:8px;padding:8px 4px;cursor:pointer}
.vote button[aria-pressed="true"][data-v="yes"]{background:var(--lime);border-color:var(--lime);color:var(--night)}
.vote button[aria-pressed="true"][data-v="maybe"]{background:var(--amber);border-color:var(--amber);color:var(--night)}
.vote button[aria-pressed="true"][data-v="no"]{background:var(--red);border-color:var(--red);color:var(--night)}
.card.is-no{filter:saturate(.35)}
.card.is-yes{box-shadow:0 0 0 2px var(--lime)}
.tally{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tally span,.tally button{font:inherit;font-weight:700;font-size:13px;border:1.5px solid transparent;cursor:pointer;min-height:44px;padding:6px 12px;border-radius:999px;font-variant-numeric:tabular-nums;background:var(--night2)}
.tally .y{color:var(--lime)}.tally .m{color:var(--amber)}.tally .n{color:var(--red)}.tally .u{color:var(--soft)}
.tally button[aria-pressed="true"]{border-color:currentColor}
.tally button:hover{filter:brightness(1.15)}
.sync{font-size:12.5px;color:var(--soft);margin-top:8px}
.linkbtn{display:inline-flex;align-items:center;gap:6px;margin-top:10px}
.linkbtn[hidden]{display:none}
.link-p{margin:0 0 14px;font-size:14.5px;color:var(--soft);line-height:1.45}
.link-lbl{display:block;font-weight:700;font-size:13px;margin-bottom:6px}
.link-in{width:100%;box-sizing:border-box;min-height:44px;font:600 16px var(--body);color:var(--ink);background:var(--night2);border:1.5px solid #8a78e6;border-radius:12px;padding:8px 14px}
.link-err{min-height:1.2em;margin:6px 0 8px;font-size:13.5px;color:var(--red)}
#linkForm .btns .btn{flex:1 1 100%;cursor:pointer;font:inherit;font-weight:700}
#linkForm .btns .btn[hidden]{display:none}
.intro{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(8,4,24,calc(.82 * var(--bd,1)));backdrop-filter:blur(6px)}
.intro[hidden]{display:none!important}
.intro-card{max-width:380px;width:100%;max-height:calc(100dvh - 40px);overflow-y:auto;background:linear-gradient(160deg,#2a1a66,#1c1250);border:1.5px solid var(--line);border-radius:20px;padding:24px 22px;box-shadow:0 20px 60px -20px rgba(0,0,0,.9)}
.intro-emoji{font-size:30px;margin-bottom:4px}
.intro-card h2{font-family:var(--display);font-size:22px;margin:0 0 14px}
.intro-row{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px}
.intro-ico{font-size:17px;flex:none;width:36px;text-align:center;letter-spacing:-1px}
.intro-row p{margin:0;font-size:14.5px;color:var(--soft);line-height:1.45}
.intro-row b{color:var(--ink)}
.intro-lead{margin:-4px 0 16px;font-size:15px;line-height:1.45;color:var(--ink)}
/* tip boxes: one short line and two big buttons in the services' own colors, so they read at a glance */
.tipbox{margin:14px 0;padding:14px;border-radius:18px;border:1.5px solid rgba(255,79,180,.6);background:linear-gradient(135deg,rgba(255,79,180,.2),rgba(63,224,255,.1));box-shadow:0 0 30px -12px rgba(255,79,180,.8)}
.tipbox[hidden]{display:none}
.tip-h{display:flex;align-items:center;gap:8px;margin:0 0 12px;font:700 16px/1.2 var(--display);color:var(--ink)}
.tip-h .ic{color:var(--pink);width:20px;height:20px}
.tip-end{max-width:520px;margin:22px auto 4px}
.skip{position:absolute;left:12px;top:-60px;z-index:60;padding:10px 14px;border-radius:10px;background:var(--cyan);color:var(--night);font-weight:800;text-decoration:none}
.skip:focus{top:calc(env(safe-area-inset-top,0px) + 8px)}
.intro-go{width:100%;margin-top:4px;background:var(--grad);color:var(--night);border:0;font-weight:800}
.intro-help{flex:none;width:34px;min-height:34px;border-radius:50%;border:1.5px solid var(--line);background:rgba(18,10,46,.6);color:var(--soft);font-size:14px;cursor:pointer;align-self:center}
footer{margin-top:28px;font-size:13px;color:var(--soft);max-width:70ch}
footer a{color:var(--cyan)}
.donate-row{display:flex;flex-wrap:wrap;gap:8px}
.donate-row[hidden]{display:none}
.donate-row .donate{flex:1 1 120px;min-height:52px;border-radius:14px;font-size:16px;font-weight:800;background:var(--grad);color:var(--night);box-shadow:none}
.donate-row .donate[data-service="Venmo"]{background:#0074de;color:#fff}
.donate-row .donate[data-service="Cash App"]{background:#00d632;color:#06140b}
footer .tipbox{max-width:420px;margin:0 0 16px}
/* the lineup already ends with a tip box, so the footer one only shows on Getting there and Map */
body[data-view="lineup"] footer .tipbox{display:none}
/* audit: hover feedback on every button style that lacked it */
.btn:hover,.tabs a:hover,.ftoggle:hover,.vtoggle:hover,.xbtn:hover,.intro-help:hover{filter:brightness(1.15)}
/* audit: sticky menu and filter bar must not cover the focused element; modals don't scroll the page */
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 130px)}
.intro{overscroll-behavior:contain}
/* popups are bottom sheets on phones: they spring up from the bottom and drag down to close (motion.js) */
.intro-card{will-change:transform}
@media (max-width:700px){
  .intro{align-items:flex-end;padding:0}
  .intro-card{max-width:none;border-radius:24px 24px 0 0;border-bottom:0;padding:10px 20px calc(20px + env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 24px - env(safe-area-inset-top,0px))}
  .intro-card::before{content:"";display:block;width:40px;height:5px;border-radius:3px;background:#8a78e6;margin:0 auto 14px}
}
/* the Day and Time switches: one highlight pill slides behind the pressed option (app.js segPill) */
.seg{position:relative}
.seg-pill{position:absolute;left:0;top:0;z-index:0;border-radius:12px;background:var(--grad);box-shadow:0 6px 18px -6px rgba(255,79,180,.7);pointer-events:none;will-change:transform}
.seg.has-pill button{position:relative;z-index:1}
.seg.has-pill button[aria-pressed="true"]{background:transparent!important;box-shadow:none!important}
.vote button{will-change:transform}
@media (max-width:420px){.grid{grid-template-columns:1fr}}
body{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
.view[hidden]{display:none!important}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(3,1fr);background:#1a0f40;border-top:2px solid var(--pink);padding:6px max(10px, env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(10px, env(safe-area-inset-left,0px))}
.tabs a{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:var(--soft);font:700 12.5px var(--body);padding:6px 4px;border-radius:10px;min-height:48px;justify-content:center}
.tabs a span{font-size:20px;line-height:1}
.tabs a[aria-current="page"]{color:var(--night);background:var(--ink)}
.vote button{min-height:44px;font-size:14px}
.links a{flex:1 1 0;justify-content:center;min-height:42px}
.sp{display:inline-flex;align-items:center;gap:7px;text-decoration:none;color:#06140b;font-weight:700;font-size:13.5px;background:#1ed760;padding:8px 12px;border-radius:8px}
.sp svg{width:15px;height:15px;flex:none}
.sec{padding-block:8px}
.sec h2{font-family:var(--display);font-size:clamp(22px,5vw,30px);font-weight:700;margin:22px 0 6px}
.sec h3{font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:24px 0 8px;color:var(--soft)}
.sec p{margin:0 0 8px;max-width:65ch}
.lines{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px}
.line{background:var(--card);border-radius:12px;padding:14px;border-left:6px solid var(--lc);display:flex;flex-direction:column;gap:6px;min-width:0}

.line .ln{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:700;font-size:16px}
.line .ln em{font-style:normal;font-family:var(--body);font-size:11.5px;background:var(--lc);color:var(--night);padding:2px 8px;border-radius:5px}
.line .stop{font-weight:700}
.addr{color:var(--soft);font-size:14px;user-select:all}
.btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:700;font-size:14px;color:var(--night);background:var(--cyan);flex:1 1 140px;text-align:center}
.btn.alt{background:var(--night2);color:var(--ink);border:1.5px solid #4a3594}
.btn.uber{background:var(--ink);color:var(--night)}
.btn.lyft{background:var(--pink);color:var(--night)}
details{font-size:14px;color:var(--soft)}
details summary{cursor:pointer;font-weight:600;color:var(--ink);min-height:32px;display:flex;align-items:center}
details ul{margin:4px 0 0;padding-left:18px}
.times{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.time{background:var(--night2);border-radius:10px;padding:10px 12px}
.time b{display:block;color:var(--amber);font-family:var(--display);font-size:15px}

.gmap{margin-top:18px;background:var(--night2);border-radius:14px;padding:12px;border:1.5px solid #3b2a7a}
.gmap h2{font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 4px;color:var(--soft)}
.gmap .cap{font-size:12.5px;color:var(--soft);margin:0 0 8px}
.gmap .svgwrap svg{display:block;width:100%;height:auto;max-width:760px;margin:0 auto}
.gmap .stg{cursor:pointer}
.gmap .stg:focus-visible circle{stroke:var(--ink);stroke-width:4}
.gmap .stg.on circle.ring{stroke:var(--ink);stroke-width:3.5}
/* lineup top: days, then the map you tap to see a stage's acts, then your picks */
header.lineup-top h1{font-size:clamp(26px,7vw,40px);margin:4px 0 2px}
header.lineup-top .tagline{font-size:12.5px;margin:0 0 12px}
.gmap-top{margin-top:12px;padding:10px 10px 6px}
.maph-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;margin:0 2px 2px}
.maph-row .maph{margin:0}
.maph-clear{font:700 13px var(--body);color:var(--cyan);background:none;border:0;min-height:44px;padding:0 4px;cursor:pointer}
.maph-clear[hidden]{display:none}
.picksrow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}
.picksrow .tally,.picksrow .linkbtn{margin:0}
.sync[hidden]{display:none}
.dayinfo{margin-top:26px}
.dayinfo .mix{margin-top:0}
.ginfo{margin-top:8px;background:var(--card);border-radius:10px;padding:10px 12px;font-size:14px;border-left:5px solid var(--sc,var(--pink));min-height:52px}
.ginfo b{font-family:var(--display);font-size:15px}
.gkey{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;font-size:12.5px;color:var(--soft)}
.gkey span{display:inline-flex;align-items:center;gap:5px}
.gkey i{width:11px;height:11px;border-radius:50%;display:inline-block}
.seg{display:grid;gap:6px;margin-top:14px}
.seg.days,.seg.times3{grid-template-columns:repeat(3,1fr)}
.seg button{font:700 14px var(--body);color:var(--ink);background:var(--night2);border:1.5px solid #4a3594;border-radius:12px;padding:10px 6px;min-height:52px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.seg button small{font-weight:600;font-size:11.5px;color:var(--soft)}
.seg button[aria-pressed="true"]{background:var(--pink);border-color:var(--pink);color:var(--night)}
.seg button[aria-pressed="true"] small{color:var(--night)}
.seg.times3 button[aria-pressed="true"]{background:var(--amber);border-color:var(--amber)}
.stg-row{display:flex;gap:6px;margin-top:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.stg-row::-webkit-scrollbar{display:none}
.stg-row button{flex:none;font:700 13px var(--body);color:var(--ink);background:var(--night2);border:1.5px solid #4a3594;border-radius:999px;padding:8px 13px;min-height:42px;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.stg-row button i{width:10px;height:10px;border-radius:50%;display:inline-block;background:var(--sc)}
.stg-row button[aria-pressed="true"]{background:var(--sc);border-color:var(--sc);color:var(--night)}
.stg-row button[aria-pressed="true"] i{background:var(--night)}
.rowlbl{font:700 11.5px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--soft);margin:12px 0 0}
.tag.where{background:transparent;color:var(--ink);border:1.5px solid var(--sc)}
.estnote{font-size:12.5px;color:var(--amber);margin:6px 0 0}
.tag.when{background:transparent;color:var(--amber);border:1.5px solid var(--amber)}
.tag.when.real{background:var(--amber);color:var(--night)}
.tip{background:#2a1650;border-left:4px solid var(--lime);padding:10px 14px;border-radius:6px;font-size:14px;margin-top:10px;max-width:70ch}
@media (max-width:600px){
  header{padding-block:20px 12px}
  .lede{font-size:14px}
  .filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * max(16px, env(safe-area-inset-left,0px)));padding-inline:max(16px, env(safe-area-inset-left,0px))}
  .filters::-webkit-scrollbar{display:none}
  .chip{flex:none;min-height:40px}
  #q{flex:0 0 170px;min-height:40px}
  .card{padding:16px}
  .name{font-size:18px}
}
@media (prefers-reduced-motion:no-preference){.card{transition:transform .15s}.card:hover{transform:translateY(-2px)}}
/* ===== v2 restyle: electric-sky glass, sharper buttons ===== */
:root{--line:#4a3594;--glass:rgba(36,22,90,.72);--grad:linear-gradient(100deg,#ff4fb4,#a874ff 55%,#3fe0ff)}
body{background-color:var(--night);
  background-image:
    radial-gradient(1.6px 1.6px at 12% 22%, rgba(255,255,255,.9) 50%, transparent 52%),
    radial-gradient(1.2px 1.2px at 68% 8%, rgba(255,255,255,.75) 50%, transparent 52%),
    radial-gradient(1.6px 1.6px at 85% 48%, rgba(255,255,255,.8) 50%, transparent 52%),
    radial-gradient(1.2px 1.2px at 35% 72%, rgba(255,255,255,.65) 50%, transparent 52%),
    radial-gradient(1.2px 1.2px at 6% 60%, rgba(255,255,255,.7) 50%, transparent 52%),
    radial-gradient(1.6px 1.6px at 94% 85%, rgba(255,255,255,.6) 50%, transparent 52%),
    radial-gradient(1.2px 1.2px at 52% 38%, rgba(255,255,255,.55) 50%, transparent 52%),
    radial-gradient(1.6px 1.6px at 22% 90%, rgba(255,255,255,.7) 50%, transparent 52%),
    radial-gradient(1200px 500px at 10% -10%,#3b1a86 0,transparent 60%),
    radial-gradient(900px 500px at 100% 0,#5c1257 0,transparent 55%),
    radial-gradient(900px 700px at 50% 120%,#0f2a6b 0,transparent 60%),
    radial-gradient(700px 500px at 100% 100%,#0a3a3a 0,transparent 55%),
    radial-gradient(650px 450px at 0% 40%,#3a1a5c 0,transparent 55%);
  background-size:280px 280px,340px 340px,310px 310px,260px 260px,300px 300px,330px 330px,250px 250px,290px 290px,auto,auto,auto,auto,auto;
  background-repeat:repeat,repeat,repeat,repeat,repeat,repeat,repeat,repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat;
  background-attachment:fixed}
h1{letter-spacing:-.01em}
h1 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(168,116,255,.55))}
.eyebrow{color:var(--cyan)}
.brand{display:inline-block;font:800 11.5px var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--night);background:var(--grad);padding:5px 11px;border-radius:999px;margin-bottom:10px;box-shadow:0 0 24px -4px rgba(255,79,180,.65)}
.fact{background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(8px)}
.notice,.tip{border-radius:12px;background:var(--glass)}
.rowlbl{display:flex;align-items:center;gap:8px}
.rowlbl::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}
/* segmented day + time */
.seg{background:var(--glass);border:1px solid var(--line);border-radius:16px;padding:5px;gap:5px}
.seg button{background:transparent;border:0;border-radius:12px;min-height:54px;transition:background .15s,color .15s}
.seg button:hover{background:rgba(255,255,255,.06)}
.seg button[aria-pressed="true"]{background:var(--grad);color:var(--night);box-shadow:0 6px 18px -6px rgba(255,79,180,.7)}
.seg.times3 button[aria-pressed="true"]{background:linear-gradient(100deg,#ffb627,#ff7a59);box-shadow:0 6px 18px -6px rgba(255,182,39,.6)}
/* chips */
.chip,.stg-row button{background:var(--glass);border:1.5px solid var(--line);border-radius:12px;min-height:40px;padding:8px 14px;transition:border-color .15s,background .15s}
.chip:hover,.stg-row button:hover{border-color:#7d6cd9}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--night);border-color:var(--ink)}
#q{border-radius:12px;background:var(--glass);border-color:var(--line);min-height:40px}
.dd{font:600 13px var(--body);color:var(--ink);background-color:var(--night2);border:1.5px solid var(--line);border-radius:12px;padding:8px 30px 8px 14px;min-height:40px;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--soft) 50%),linear-gradient(135deg,var(--soft) 50%,transparent 50%);background-position:calc(100% - 16px) center,calc(100% - 11px) center;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.dd:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.dd option{background-color:var(--night2);color:var(--ink)}
.filters{background:linear-gradient(var(--night),rgba(18,10,46,.92));backdrop-filter:blur(10px)}
/* cards: gradient edge glass, background tinted and left stripe colored by genre */
.card{border:1.5px solid transparent;border-top:1.5px solid transparent;border-radius:18px;padding:16px;gap:10px;background:linear-gradient(160deg,color-mix(in srgb,var(--g) 22%,#2a1a66),color-mix(in srgb,var(--g) 10%,#1c1250)) padding-box,linear-gradient(140deg,var(--g),rgba(74,53,148,.6) 45%,rgba(74,53,148,.25)) border-box;box-shadow:0 10px 30px -18px rgba(0,0,0,.9),inset 4px 0 0 var(--g)}
.card.is-yes{background:linear-gradient(160deg,color-mix(in srgb,var(--g) 18%,#1f3a4a),#1c1250) padding-box,linear-gradient(140deg,var(--lime),var(--g)) border-box;box-shadow:0 10px 30px -14px rgba(125,255,155,.45)}
.card.is-maybe{background:linear-gradient(160deg,color-mix(in srgb,var(--g) 18%,#2a1a66),#1c1250) padding-box,linear-gradient(140deg,var(--amber),rgba(74,53,148,.5)) border-box}
.card.is-no{filter:saturate(.35)}
.card.is-no .name,.pcard.is-no h3{color:var(--soft)}
.name{font-size:18px}
.rank{background:rgba(255,255,255,.07);border-radius:999px;padding:2px 8px;color:var(--soft)}
.tag{border-radius:999px;padding:3px 9px;font-size:11.5px}
/* vote: joined segmented control, icon-only so it can share a row with the listen links */
.vote{gap:0;background:rgba(18,10,46,.6);border:1.5px solid var(--line);border-radius:12px;overflow:hidden}
.vote button{border:0;border-radius:0;background:transparent;min-height:44px;font-size:13.5px}
.vote button+button{border-left:1.5px solid var(--line)}
.vote button:hover{background:rgba(255,255,255,.06)}
/* listen buttons: icon-only squares */
.links{gap:8px}
.yt,.sp{border-radius:12px;background:transparent;color:var(--ink);border:1.5px solid;transition:background .15s,color .15s}
.yt{border-color:#ff2d55}
.yt:hover{background:#ff2d55}
.sp{border-color:#1ed760}
.sp:hover{background:#1ed760;color:#06140b}
.links a{flex:0 0 44px;width:44px;height:44px;padding:0;justify-content:center;min-height:44px}
/* vote + listen links share one row; the links group wraps below only when it won't fit (B2B cards) */
.actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;align-items:flex-start}
.actions .vote{flex:none;display:flex}
.actions .vote button{width:58px;height:44px;min-height:44px;padding:2px 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.actions .vote button .vk-i{font-size:16px;line-height:1}
.actions .vote button .vk-l{font-size:10.5px;font-weight:800;letter-spacing:.01em;line-height:1}
.actions .links{flex:none}
.yt svg,.sp svg{width:20px;height:20px}
/* travel + map */
.btn{border-radius:12px;box-shadow:0 6px 16px -10px rgba(63,224,255,.8)}
.btn.alt{background:var(--glass);box-shadow:none}
.line,.time,.stage{border-radius:16px;background:var(--glass);backdrop-filter:blur(8px)}
.gmap{background:var(--glass);border-radius:20px;border-color:var(--line)}
.ginfo{border-radius:12px;background:rgba(18,10,46,.7);line-height:1.6}
/* bottom nav: glass bar */
.tabs{background:rgba(22,12,58,.86);backdrop-filter:blur(14px);border-top:1px solid var(--line)}
.tabs a{border-radius:14px}
.tabs a[aria-current="page"]{background:var(--grad);color:var(--night)}
/* top menu */
body{padding-bottom:48px}
.tabs{position:sticky;top:env(safe-area-inset-top,0px);bottom:auto;left:auto;right:auto;z-index:20;display:flex;justify-content:center;gap:6px;margin-inline:calc(-1 * max(16px, env(safe-area-inset-left,0px)));padding:8px max(16px, env(safe-area-inset-right,0px)) 8px max(16px, env(safe-area-inset-left,0px));border-top:0;border-bottom:1px solid var(--line);background:rgba(18,10,46,.88);backdrop-filter:blur(14px)}
.tabs a{flex:0 1 auto;flex-direction:row;gap:6px;min-height:38px;padding:6px 14px;font-size:13px;border:1.5px solid var(--line)}
.tabs a span{font-size:15px}
.tabs a[aria-current="page"]{border-color:transparent}
.filters{top:calc(env(safe-area-inset-top,0px) + 55px)}
/* iPhone home-screen app (Graham, Oct 27): the menu sticks below the status bar, so the page starts below it too;
   otherwise the menu sits on top of "Your Festival" when the page opens */
body{padding-top:env(safe-area-inset-top,0px)}
header{padding-block:22px 14px}
.brand{font-size:13px;padding:6px 13px}
h1{font-size:clamp(26px,6.4vw,50px);margin:10px 0 6px}
.seg.times3{grid-template-columns:repeat(4,1fr)}
.seg.times3 button{font-size:13px;padding:8px 2px}
.seg.times3 button[data-t="party"][aria-pressed="true"]{background:linear-gradient(100deg,#a874ff,#3fe0ff);box-shadow:0 6px 18px -6px rgba(63,224,255,.6)}
.pcard{border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:9px;min-width:0;border:1.5px solid transparent;background:linear-gradient(160deg,#241a70,#141045) padding-box,linear-gradient(140deg,var(--pc),rgba(74,53,148,.35)) border-box}
.pcard .pt{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.pcard h3{font-family:var(--display);font-size:17px;margin:0;line-height:1.2;overflow-wrap:anywhere}
.pcard .meta{font-size:14px;color:var(--soft);display:grid;gap:2px}
.pcard .meta b{color:var(--ink)}
.badge{flex:none;font-size:11px;font-weight:800;letter-spacing:.04em;padding:3px 9px;border-radius:999px;background:var(--pc);color:var(--night)}
.badge.unoff{background:transparent;color:var(--soft);border:1.5px dashed var(--soft)}
.lineup{display:flex;flex-wrap:wrap;gap:6px}
.lineup a{font-size:13px;font-weight:700;color:var(--ink);text-decoration:none;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid var(--line)}
.lineup a.main{border-color:var(--pc)}
.pcard.is-yes{background:linear-gradient(160deg,#1f3a4a,#141045) padding-box,linear-gradient(140deg,var(--lime),var(--pc)) border-box}
.pcard.is-no{filter:saturate(.35)}
.pnote{font-size:13px;color:var(--soft);margin:0}
.thu{grid-column:1/-1;font:700 12px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--soft);margin-top:6px}
@media (max-width:600px){.tabs a{padding:6px 10px;font-size:12.5px}.seg.times3 button small{font-size:10.5px}}
/* ===== v3: design critique + accessibility pass ===== */
:root{--line:#8a78e6;--line-soft:#3b2a7a}
.rowlbl::after{background:linear-gradient(90deg,var(--line-soft),transparent)}
:focus-visible{outline:3px solid var(--cyan)!important;outline-offset:2px}
.stg:focus{outline:none}
.stg:focus-visible .ring{stroke:#3fe0ff;stroke-width:5}
.tabs{border-bottom-color:var(--line-soft)}
.tabs a{min-height:44px}
.intro-help{width:44px;min-height:44px}
.chip,.stg-row button,#q,.dd{min-height:44px}
.flink{display:inline-flex;align-items:center;min-height:44px;padding-inline:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tally{gap:6px}.tally span,.tally button{padding:5px 10px;font-size:12.5px}
.mix h2{font-size:12.5px}.legend{font-size:12px}
/* sticky control bar */
.ctrl{position:sticky;top:calc(env(safe-area-inset-top,0px) + 61px);z-index:15;margin-inline:calc(-1 * max(16px, env(safe-area-inset-left,0px)));padding:8px max(16px, env(safe-area-inset-right,0px)) 8px max(16px, env(safe-area-inset-left,0px));background:rgba(18,10,46,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft);margin-top:14px}
.ctrl .seg{margin-top:0}
.ctrl .seg button{min-height:46px;padding:6px 2px;font-size:13px}
.ctrl .seg button small{font-size:10.5px}
.ctrlrow{display:flex;gap:6px;margin-top:6px}
.ftoggle,.vtoggle{min-height:44px;border-radius:12px;background:var(--glass);border:1.5px solid var(--line);color:var(--ink);font:700 13.5px var(--body);padding:8px 12px;cursor:pointer;display:flex;align-items:center;gap:6px}
.ftoggle{flex:1;min-width:0;text-align:left}
.ftoggle .fsum{color:var(--amber);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.ftoggle .chev{margin-left:auto;color:var(--soft)}
.ftoggle[aria-expanded="true"] .chev{transform:rotate(180deg)}
.fpanel:not(.open){display:none}
.fpanel{max-height:55vh;overflow-y:auto;padding-bottom:4px}
.fpanel .filters{position:static;top:auto;background:none;backdrop-filter:none;border:0;padding:6px 0 0;margin:0;flex-wrap:wrap;overflow:visible}
.estnote{margin:10px 0 0}
/* one selected style (stage chips keep their stage colors) */
.seg.times3 button[aria-pressed="true"],.seg.times3 button[data-t="party"][aria-pressed="true"]{background:var(--grad);box-shadow:0 6px 18px -6px rgba(255,79,180,.7)}
.chip[aria-pressed="true"],.vtoggle[aria-pressed="true"]{background:var(--grad);color:var(--night);border-color:transparent}
/* card: time + stage right under the name */
.card .name{margin:0;font-family:var(--display);font-weight:700;font-size:18px;line-height:1.2}
.when2{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-weight:700;font-size:14px;color:var(--amber);font-variant-numeric:tabular-nums}
.when2 .sdot{display:inline-flex;align-items:center;gap:6px;color:var(--ink)}
.when2 .sdot i{width:10px;height:10px;border-radius:50%;background:var(--sc);display:inline-block}
.xbtn{display:none;min-width:44px;min-height:44px;border-radius:12px;background:transparent;border:1.5px solid var(--line);color:var(--ink);font-size:16px;cursor:pointer}
.top{align-items:center}
/* compact list */
.grid.compact{grid-template-columns:1fr;gap:8px}
.grid.compact .card{padding:10px 12px;gap:8px;border-radius:14px}
.grid.compact .card:not(.open) .tags,.grid.compact .card:not(.open) .vibe,.grid.compact .card:not(.open) .links{display:none}
.grid.compact .rank{display:none}
.grid.compact .xbtn{display:inline-flex;align-items:center;justify-content:center}
.grid.compact .card.open .xbtn{transform:rotate(180deg)}
.grid.compact .name{font-size:16px}
/* contrast */
.yt:hover{background:#d6003b;border-color:#d6003b}
.btn.alt{border-color:var(--line)}
.pcard .sub{font-size:13.5px;font-weight:700;color:var(--soft);margin-top:2px}
.sec h1.vh{font-family:var(--display);font-size:clamp(22px,5vw,30px);font-weight:700;margin:22px 0 6px;line-height:1.2}
.sec h2.hs{font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:24px 0 8px;color:var(--soft)}
details summary{min-height:44px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ===== day themes (Oct 26): each festival day has its own colors. --grad drives every highlight
   (Day / Time pill, the title's "Rave", selected chips), so switching days re-themes the app.
   Dark text sits on all of these, so every stop stays light enough for AA. ===== */
body[data-day="fri"]{--grad:linear-gradient(100deg,#ff4fb4,#ff7a59 55%,#ffb627);--day-glow:rgba(255,122,89,.6);--day-line:#ff7a59;
  --day-orb:radial-gradient(circle at 32% 28%, rgba(255,214,150,.9), rgba(255,122,89,.55) 35%, rgba(255,79,180,.35) 60%, transparent 72%)}
body[data-day="sat"]{--grad:linear-gradient(100deg,#ff4fb4,#a874ff 55%,#3fe0ff);--day-glow:rgba(168,116,255,.6);--day-line:#a874ff;
  --day-orb:radial-gradient(circle at 32% 28%, rgba(185,255,210,.9), rgba(63,224,255,.55) 35%, rgba(94,58,219,.35) 60%, transparent 72%)}
body[data-day="sun"]{--grad:linear-gradient(100deg,#3fe0ff,#7dff9b 55%,#ffcc66);--day-glow:rgba(63,224,255,.6);--day-line:#3fe0ff;
  --day-orb:radial-gradient(circle at 32% 28%, rgba(255,240,170,.9), rgba(125,255,155,.5) 35%, rgba(63,224,255,.35) 60%, transparent 72%)}
body[data-day] header::before{background:var(--day-orb)}
body[data-day] .seg-pill{box-shadow:0 6px 18px -6px var(--day-glow)}
body[data-day] .gmap-top{border-color:var(--day-line);box-shadow:0 0 34px -16px var(--day-glow)}

/* ===== My Plan (Oct 26): your day in time order ===== */
.planbtn{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:6px 14px;border-radius:999px;background:var(--grad);color:var(--night);font:800 13px var(--body);text-decoration:none;box-shadow:0 6px 18px -8px var(--day-glow,rgba(255,79,180,.7))}
.plan .seg.days{margin-top:6px}
.plan-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;margin:12px 0 6px}
.plan-sum{margin:0;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.plan-maybe{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;color:var(--soft);cursor:pointer}
.plan-maybe input{width:20px;height:20px;accent-color:var(--amber)}
.plan-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;max-width:640px}
.plan-item{display:grid;grid-template-columns:92px 1fr;gap:12px;align-items:start;padding:12px 14px;border-radius:16px;background:var(--glass);border:1.5px solid var(--line-soft);box-shadow:inset 4px 0 0 var(--sc)}
.plan-item.is-maybe{border-style:dashed}
.plan-item.is-now{border-color:var(--lime);box-shadow:inset 4px 0 0 var(--sc),0 0 26px -12px var(--lime)}
.pt-time{font-weight:800;font-size:14px;color:var(--amber);font-variant-numeric:tabular-nums;line-height:1.3}
.pt-body{min-width:0}
.pt-name{margin:0;font-family:var(--display);font-weight:700;font-size:16px;line-height:1.2;overflow-wrap:anywhere}
.pt-stage{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:4px;font-size:13.5px;font-weight:700;color:var(--ink)}
.pt-stage i{width:10px;height:10px;border-radius:50%;background:var(--sc);display:inline-block}
.pt-pick{font-size:12px;font-weight:800;color:var(--soft)}
.is-yes .pt-pick{color:var(--lime)}
.is-maybe .pt-pick{color:var(--amber)}
.pt-flags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.pf{font-size:12px;font-weight:800;padding:3px 9px;border-radius:999px}
.pf.now{background:var(--lime);color:var(--night)}
.pf.next{background:var(--cyan);color:var(--night)}
.pf.clash{background:transparent;color:var(--red);border:1.5px solid var(--red)}
.plan-move{font-size:12.5px;font-weight:700;color:var(--soft);padding:0 0 0 104px}
.plan-move::before{content:"\2193  "}
.plan-after{margin-top:10px;font:700 12px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.plan-empty{padding:16px;border-radius:16px;background:var(--glass);border:1.5px dashed var(--line);color:var(--soft);max-width:640px}
.plan-empty b{color:var(--ink)}
@media (max-width:420px){.plan-item{grid-template-columns:78px 1fr;gap:10px;padding:10px 12px}.plan-move{padding-left:90px}.pt-time{font-size:13px}}
/* five items in the top menu: drop the icons on small phones so everything fits */
@media (max-width:480px){.tabs{gap:4px}.tabs a{padding:6px 9px;font-size:12px}.tabs a span{display:none}}

/* ===== stage logo (Oct 26): sunrise on the LED screen, then day-colored lasers that sweep and cross ===== */
.titlerow{display:flex;align-items:center;gap:12px}
.titletext{min-width:0}
.titlerow h1{margin-top:0}
.brandmark{flex:none;width:clamp(72px,20vw,96px);aspect-ratio:1;padding:0;border:0;border-radius:22%;overflow:hidden;background:#160c3a;cursor:pointer;box-shadow:0 10px 30px -14px var(--day-glow,rgba(168,116,255,.6))}
.brandmark svg{display:block;width:100%;height:100%}
.rp-em{transform-box:view-box}
.rp-l{transform-origin:150px 318px}.rp-c{transform-origin:256px 300px}.rp-r{transform-origin:362px 318px}
.rp-run .rp-screen{animation:rpRise .9s cubic-bezier(.2,.9,.3,1.1) both}
.rp-run .rp-grow{animation:rpGrow .55s cubic-bezier(.34,1.56,.64,1) both}
.rp-run .rp-l .rp-grow{animation-delay:.75s}.rp-run .rp-c .rp-grow{animation-delay:.95s}.rp-run .rp-r .rp-grow{animation-delay:1.15s}
.rp-run .rp-l{animation:rpSwayL 3.2s ease-in-out 1.8s infinite alternate}
.rp-run .rp-r{animation:rpSwayR 3.2s ease-in-out 1.8s infinite alternate}
.rp-run .rp-c{animation:rpSwayC 2.6s ease-in-out 1.8s infinite alternate}
.rp-run .rp-spots{animation:rpFade .6s ease-out .2s both}
.rp-fog1{animation:rpDrift 9s ease-in-out infinite alternate}
.rp-fog2{animation:rpDrift 11s ease-in-out -4s infinite alternate-reverse}
@keyframes rpRise{from{transform:translateY(120px)}to{transform:none}}
@keyframes rpGrow{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes rpFade{from{opacity:0}to{opacity:.07}}
@keyframes rpSwayL{from{transform:rotate(-10deg)}to{transform:rotate(12deg)}}
@keyframes rpSwayR{from{transform:rotate(10deg)}to{transform:rotate(-12deg)}}
@keyframes rpSwayC{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
@keyframes rpDrift{from{transform:translateX(-26px)}to{transform:translateX(26px)}}
@media (prefers-reduced-motion:reduce){.brandmark *{animation:none!important}}
/* the glowing orb behind the header washed out the title and tagline; the stage logo carries the color now */
header::before,body[data-day] header::before{display:none}

/* picks row under the map (Oct 26): My Plan and Link phones side by side, then the four counts in one even row */
.picksrow{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"plan link" "tally tally";gap:8px;margin-top:12px}
.picksrow .planbtn{grid-area:plan;justify-content:center}
.picksrow .linkbtn{grid-area:link;justify-content:center;margin:0;min-height:44px}
.picksrow:has(#linkBtn[hidden]) .planbtn{grid-column:1/-1}
.picksrow .tally{grid-area:tally;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:0;padding:4px;border-radius:16px;background:var(--glass);border:1px solid var(--line-soft)}
.picksrow .tally button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:50px;padding:4px 2px;border-radius:12px;background:transparent;border:1.5px solid transparent}
.picksrow .tally button[aria-pressed="true"]{border-color:currentColor;background:rgba(255,255,255,.05)}
.picksrow .tally .tn{font:800 18px/1.1 var(--display);font-variant-numeric:tabular-nums}
.picksrow .tally .tl{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:700;white-space:nowrap}
.picksrow .tally .tl .ic{width:.95em;height:.95em}
@media (max-width:360px){.picksrow .tally .tl .ic{display:none}}
/* the old tally styled every span as a pill; the number and label inside a count are plain text */
.picksrow .tally button span{min-height:0;padding:0;border:0;border-radius:0;background:none}
/* one line under the map (Oct 26): a compact My Plan button, then the four counts; Link phones (linked phones only) wraps below */
.picksrow{grid-template-columns:auto 1fr;grid-template-areas:"plan tally" "link link";align-items:stretch}
.picksrow:has(#linkBtn[hidden]) .planbtn{grid-column:auto}
.picksrow .planbtn{flex-direction:column;justify-content:center;gap:2px;min-height:58px;padding:6px 12px;border-radius:16px;font-size:12.5px;line-height:1.1;white-space:nowrap}
.picksrow .planbtn .ic{width:1.35em;height:1.35em}
.picksrow .tally{gap:2px;padding:3px}
.picksrow .tally button{min-height:50px;padding:3px 1px}
.picksrow .tally .tl{font-size:11px}
@media (max-width:400px){.picksrow .tally .tl .ic{display:none}.picksrow .tally .tn{font-size:17px}}

/* the day's sound sits right under the day switch (Oct 26), compact so the map stays near the top */
.lineup-top .mix{margin-top:12px}
.lineup-top .mix h2{margin:0 0 6px}
.lineup-top .bar{height:14px;border-radius:999px;background:var(--glass)}
.lineup-top .bar div{min-width:0}
.lineup-top .bar div+div{box-shadow:inset 2px 0 0 #160c3a}
.lineup-top .legend{gap:4px 12px;margin-top:6px;font-size:12px}
.lineup-top .legend i{width:8px;height:8px;border-radius:50%}

/* add to home screen bar (Oct 26): pinned to the bottom on phone browsers, above Safari's toolbar, never in the app */
body.has-a2hs{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
.a2hs{position:fixed;z-index:40;left:max(10px, env(safe-area-inset-left,0px));right:max(10px, env(safe-area-inset-right,0px));bottom:calc(10px + env(safe-area-inset-bottom,0px));
  display:flex;align-items:center;gap:10px;max-width:520px;margin-inline:auto;padding:8px 8px 8px 12px;border-radius:18px;
  background:rgba(29,17,69,.94);backdrop-filter:blur(14px);border:1.5px solid rgba(63,224,255,.55);box-shadow:0 12px 30px -12px rgba(0,0,0,.9),0 0 24px -10px rgba(63,224,255,.7)}
.a2hs[hidden]{display:none!important}
.a2hs-ico{flex:none;color:var(--cyan);display:flex}
.a2hs p{margin:0;flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.a2hs p b{font-size:14px}
.a2hs p span{font-size:12.5px;color:var(--soft)}
.a2hs .a2hs-how{flex:none;min-width:64px;padding:10px 14px}
.a2hs-x{flex:none;width:44px;height:44px;border-radius:12px;border:0;background:transparent;color:var(--soft);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px}
.a2hs-steps{margin:0 0 14px;padding-left:22px;display:grid;gap:10px;color:var(--soft);font-size:15px;line-height:1.45}
.a2hs-steps b,.a2hs-note b{color:var(--ink)}
.a2hs-steps li::marker{color:var(--cyan);font-weight:800}
.a2hs-note{margin:0 0 14px;font-size:13.5px;color:var(--soft);line-height:1.45}
#introA2hsSteps{display:block;margin-top:4px}

/* one-line confirmation after opening #notrack or #track */
.toast{position:fixed;z-index:60;left:50%;transform:translateX(-50%);top:calc(64px + env(safe-area-inset-top,0px));margin:0;max-width:calc(100% - 32px);width:max-content;
  padding:10px 16px;border-radius:14px;background:rgba(29,17,69,.96);border:1.5px solid rgba(63,224,255,.55);color:var(--ink);font-weight:600;font-size:14px;box-shadow:0 12px 30px -12px rgba(0,0,0,.9)}

.love-x{width:100%;margin-top:12px}

/* the Show your love card (Oct 27, Graham: "really fun, makes you want to push it"): a big glowing heart in the
   day colors that pops in on a spring and throws little hearts, a gradient title, and big tip buttons that lift */
.love-card{position:relative;text-align:center;
  background:radial-gradient(260px 160px at 50% 0,rgba(255,79,180,.28),transparent 70%),linear-gradient(160deg,#2a1a66,#1c1250);
  border-color:rgba(255,79,180,.55);box-shadow:0 20px 60px -20px rgba(0,0,0,.9),0 0 50px -18px rgba(255,79,180,.8)}
.love-art{position:relative;display:block;width:120px;height:108px;margin:0 auto 6px;padding:0;border:0;background:none;cursor:pointer;
  filter:drop-shadow(0 0 22px rgba(255,79,180,.65)) drop-shadow(0 0 40px rgba(63,224,255,.3));-webkit-tap-highlight-color:transparent}
.love-art:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;border-radius:20px}
.love-big,.love-shine{position:absolute;inset:6px 10px;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21.2S3.6 16 3.6 9.6A4.6 4.6 0 0 1 12 7a4.6 4.6 0 0 1 8.4 2.6c0 6.4-8.4 11.6-8.4 11.6Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21.2S3.6 16 3.6 9.6A4.6 4.6 0 0 1 12 7a4.6 4.6 0 0 1 8.4 2.6c0 6.4-8.4 11.6-8.4 11.6Z'/%3E%3C/svg%3E") center/contain no-repeat}
.love-big{background:linear-gradient(135deg,#ff4fb4,#a874ff,#3fe0ff,#7dff9b,#ffb627,#ff7a59,#ff4fb4);background-size:500% 500%}
.love-shine{background:radial-gradient(28px 18px at 32% 30%,rgba(255,255,255,.75),transparent 70%)}
.love-spark{position:absolute;width:18px;height:18px;fill:var(--amber)}
.love-spark.s1{left:-4px;top:8px;fill:var(--cyan)}
.love-spark.s2{right:-6px;top:0;width:22px;height:22px}
.love-spark.s3{right:2px;bottom:6px;width:13px;height:13px;fill:var(--pink)}
.love-h{font-size:26px!important;margin:0 0 8px!important;text-wrap:balance}
.love-h span{background:linear-gradient(100deg,#ff4fb4,#a874ff 55%,#3fe0ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.love-letter{margin:4px 0 16px;padding:14px 16px 12px;text-align:left;border-radius:16px;
  background:rgba(18,10,46,.55);border:1.5px solid rgba(168,116,255,.45);display:grid;gap:12px}
.love-note{display:grid;gap:8px}
/* "Hi, I'm Graham": his cartoon avatar (site/avatar.jpg, avatar F, Oct 27) and name */
.love-hi{display:flex;align-items:center;gap:12px}
.love-avatar{flex:none;width:64px;height:64px;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  font:800 24px var(--display);color:var(--night);background:linear-gradient(135deg,#ff4fb4,#a874ff 55%,#3fe0ff);
  box-shadow:0 0 0 2px var(--night),0 0 0 4px rgba(255,79,180,.7),0 0 22px -4px rgba(255,79,180,.8)}
.love-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.love-hi .hi-name{margin:0;font:800 19px var(--display);color:var(--ink);line-height:1.2}
.love-hi .hi-name span{background:linear-gradient(100deg,#ff4fb4,#a874ff 55%,#3fe0ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.love-note p{margin:0;font-size:15px;line-height:1.5;color:var(--ink)}
.love-note .love-sig{justify-self:end;margin-top:2px;font-family:var(--display);font-weight:700;font-size:14px;
  background:linear-gradient(100deg,#ff4fb4,#a874ff 55%,#3fe0ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.love-small{margin:12px 0 0;font-size:13px;color:var(--soft)}
#loveDlg .donate-row{display:flex;flex-wrap:wrap;gap:10px}
#loveDlg .donate{min-height:60px;font-size:18px;border-radius:16px;box-shadow:0 10px 24px -10px rgba(0,0,0,.8);transition:transform .12s,box-shadow .12s}
#loveDlg .donate[data-service="Venmo"]{box-shadow:0 10px 26px -10px rgba(0,116,222,.95)}
#loveDlg .donate[data-service="Cash App"]{box-shadow:0 10px 26px -10px rgba(0,214,50,.9)}
#loveDlg .donate:active{transform:scale(.96)}
@media (hover:hover){#loveDlg .donate:hover{transform:translateY(-2px)}}
.love-burst{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.love-fly{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;animation:love-fly 1.1s cubic-bezier(.2,.7,.3,1) both}
.love-fly svg{width:100%;height:100%;fill:currentColor;filter:drop-shadow(0 0 6px currentColor)}
@keyframes love-fly{0%{transform:translate(0,0) scale(.2);opacity:0}15%{opacity:1}
  70%{opacity:1}100%{transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(var(--s));opacity:0}}
@media (prefers-reduced-motion:no-preference){
  .love-big{animation:love-sheen 9s ease-in-out infinite alternate}
  .love-spark{animation:love-twinkle 2.4s ease-in-out infinite}
  .love-spark.s2{animation-delay:.8s}.love-spark.s3{animation-delay:1.6s}
}
@keyframes love-sheen{to{background-position:100% 100%}}
@keyframes love-twinkle{0%,100%{transform:scale(1) rotate(0);opacity:1}50%{transform:scale(.55) rotate(25deg);opacity:.55}}

/* "Insomniac team" notes: a P.S. on the Show your love card and a line in the footer, hidden until config.partnerLink is set */
.love-ps{margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(168,116,255,.35);font-size:13.5px;line-height:1.45;color:var(--soft);text-align:left}
.love-ps a{color:var(--cyan);font-weight:700}
footer .partner{margin:0 0 14px;padding:12px 14px;border-radius:14px;background:rgba(36,22,90,.55);border:1.5px solid var(--line);color:var(--ink);line-height:1.5}
footer .partner b{color:var(--ink)}

/* Quick start opens with the same "Hi, I'm Graham" row (Oct 27): avatar, name, then the welcome line under the name */
.intro-hi{margin:-4px 0 16px}
.intro-hi .intro-lead{margin:4px 0 0;font-size:14.5px}

/* Quick start (Oct 27): the pick words in their button colors; My Plan as a mini copy of its gradient button so it stands out */
.intro .pk-yes{color:var(--lime)}
.intro .pk-maybe{color:var(--amber)}
.intro .pk-no{color:#ff7088}
.intro .pk-plan{display:inline-block;padding:1px 9px;border-radius:999px;background:var(--grad);color:var(--night);font-weight:800;line-height:1.35;white-space:nowrap;box-shadow:0 4px 14px -6px var(--day-glow,rgba(255,79,180,.8))}

/* "Graham" in both Hi rows: the festival colors roll through his name (Graham asked, Oct 27; still under Reduce Motion) */
.love-hi .hi-name span{background:linear-gradient(90deg,#ff4fb4,#a874ff,#3fe0ff,#7dff9b,#ffb627,#ff7a59,#ff4fb4);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-reduced-motion:no-preference){.love-hi .hi-name span{animation:name-roll 6s linear infinite}}
@keyframes name-roll{to{background-position:-300% 0}}

/* Show your love note (Oct 27): the words that matter in festival colors */
.love-note .hl-love{color:#ff6fc2}
.love-note .hl-music{color:var(--cyan)}
.love-note .hl-fest{color:#c29bff}
.love-note .hl-people{color:var(--lime)}
.love-note .hl-vibe{color:var(--amber)}
.love-note .hl-smile,.love-or .hl-smile{color:#ffd166}
.love-note .love-sig{background:linear-gradient(90deg,#ff4fb4,#a874ff,#3fe0ff,#7dff9b,#ffb627,#ff7a59,#ff4fb4);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-reduced-motion:no-preference){.love-note .love-sig{animation:name-roll 6s linear infinite}}

/* tip amount chips on the Show your love card (Oct 27): pick $5 / $10 / $20 / Any, the tip buttons open with it filled in */
.tip-amts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 10px}
.tip-amts[hidden]{display:none}
.tip-amts button{min-height:46px;border-radius:12px;border:1.5px solid #8a78e6;background:var(--night2);color:var(--ink);font:800 16px var(--body);cursor:pointer}
.tip-amts button[aria-pressed="true"]{background:var(--grad);color:var(--night);border-color:transparent;box-shadow:0 6px 18px -8px var(--day-glow,rgba(255,79,180,.8))}
.tip-amts button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.donate .tip-amt{font-weight:800}

/* "Send me a note" on the love card (Oct 27): a quiet outline button under the tip buttons, shown when contactEmail is set */
.love-mail{display:flex;width:100%;flex:none;margin-top:10px;gap:7px}
.love-mail .ic{width:17px;height:17px;color:var(--cyan)}
.love-or{margin:16px 0 0;padding-top:12px;border-top:1px solid rgba(168,116,255,.35);font-size:14px;line-height:1.45;color:var(--ink);text-wrap:balance}

/* ===== Oct 28 upgrade, part 1: acts on the first screen (Graham: people should see acts right away) ===== */
/* a tighter header: smaller logo and title, the day's sound on one slim line next to the Stages button */
.brandmark{width:64px}
header.lineup-top{padding-block:14px 8px}
header.lineup-top h1{font-size:25px;line-height:1.05;margin:0 0 3px}
header.lineup-top .tagline{font-size:12px;line-height:1.35;margin:0}
.lineup-top .seg.days{margin-top:10px}
.lineup-top .seg.days button{min-height:46px;padding:4px 6px}
.mixrow{display:flex;align-items:center;gap:10px;margin-top:8px}
.lineup-top .mixrow .mix{flex:1;min-width:0;margin:0;display:flex;align-items:center;gap:8px}
.lineup-top .mixrow .mix h2{flex:none;margin:0;font-size:10.5px;letter-spacing:.08em}
.lineup-top .mixrow .bar{flex:1;min-width:40px;height:8px}
.stagesbtn{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;max-width:56%;padding:6px 12px;border-radius:12px;background:var(--glass);border:1.5px solid var(--line);color:var(--ink);font:700 13px var(--body);cursor:pointer}
.stagesbtn span:not(.chev){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stagesbtn .chev{color:var(--soft)}
.stagesbtn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.stagesbtn[hidden]{display:none}
.gmap-top{margin-top:8px}
.gmap-top[hidden]{display:none}
.lineup-top .picksrow{margin-top:8px}
.picksrow .planbtn{min-height:52px}
/* the tally is a filter: each count reads as a tappable chip */
.picksrow .tally{background:none;border:0;padding:0;gap:4px}
.picksrow .tally button{min-height:52px;border:1.5px solid var(--line-soft);background:var(--glass)}
.picksrow .tally button:hover{border-color:#7d6cd9}
.picksrow .tally button[aria-pressed="true"]{border-color:currentColor}
/* the genre legend lives in the Filters panel now */
.fpanel .legend{margin:10px 0 2px;font-size:12px;display:flex;flex-wrap:wrap;gap:4px 12px}
.fpanel .legend i{width:8px;height:8px;border-radius:50%}

/* sticky bar: time switch, then Filters + search + Details. The filter panel scrolls away with the page. */
.ctrl{padding-block:6px}
.ctrl .seg button{min-height:44px;padding:3px 2px;font-size:12.5px;line-height:1.15}
.ctrl .seg button .ic{display:none}
.ctrlrow{gap:6px}
.ftoggle{flex:none;min-width:44px}
.fcount{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--grad);color:var(--night);font:800 11.5px/20px var(--body);text-align:center}
.fcount:empty{display:none}
.qbox{flex:1;min-width:0;display:flex;align-items:center;gap:6px;min-height:44px;padding:0 10px;border-radius:12px;background:var(--glass);border:1.5px solid var(--line);color:var(--soft);cursor:text}
.qbox:focus-within{border-color:var(--cyan)}
.qbox input#q{flex:1;min-width:0;width:100%;border:0;background:none;padding:0;min-height:40px;font:600 15px var(--body);color:var(--ink);outline:none;border-radius:0}
.qbox input#q::placeholder{color:var(--soft);opacity:1}
.vtoggle{flex:none;gap:6px;padding:6px 10px}
.vt-s{min-width:30px;padding:2px 7px;border-radius:999px;font-size:11.5px;font-weight:800;text-align:center;background:var(--night2);border:1.5px solid var(--line);color:var(--soft)}
.vtoggle[aria-checked="true"] .vt-s{background:var(--grad);border-color:transparent;color:var(--night)}
#actfilters{margin-top:6px}
.fpanel{max-height:none;overflow:visible}
.fchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.fchips[hidden]{display:none}
.fchip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:6px 12px;border-radius:999px;background:var(--grad);color:var(--night);border:0;font:800 13px var(--body);cursor:pointer}
.fchip .ic{width:14px;height:14px}
.fchip.all{background:var(--glass);color:var(--ink);border:1.5px solid var(--line)}
.estnote{margin:8px 0 0;font-size:12px}
.count{margin:6px 0 8px;font-size:12.5px}

/* compact cards: name, time and stage, genre + one-line vibe, picks, a listen button and expand */
.card .actions{align-items:center}
.card .lbtn{display:none}
.card .actions .xbtn{margin-left:auto}
.grid.compact .card{padding:10px 12px;gap:5px}
.grid.compact .card:not(.open) .gv{display:flex;align-items:center;gap:7px;min-width:0}
.grid.compact .card:not(.open) .tags{flex:none;display:flex}
.grid.compact .card:not(.open) .tags .tag:not(:first-child){display:none}
.grid.compact .card:not(.open) .vibe{display:block;flex:1;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grid.compact .card .actions{flex-wrap:wrap;margin-top:3px}
.grid.compact .card .lbtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:var(--glass);border:1.5px solid var(--line);color:var(--ink);cursor:pointer}
.grid.compact .card .lbtn .ic{width:16px;height:16px}
.grid.compact .card .lbtn[aria-expanded="true"]{background:var(--grad);color:var(--night);border-color:transparent}
.grid.compact .card.open .lbtn{display:none}
.grid.compact .card.listen:not(.open) .links{display:flex}
.gv{display:grid;gap:8px}
.cclash{display:flex;align-items:center;gap:6px;width:fit-content;margin:0;padding:3px 10px;border-radius:999px;border:1.5px solid var(--red);color:var(--red);font-size:12.5px;font-weight:800}
.cclash .ic{width:13px;height:13px}
@keyframes card-flash{from{box-shadow:0 0 0 3px var(--cyan)}to{box-shadow:0 0 0 3px transparent}}
.card.flash{animation:card-flash 1.6s ease-out}
/* search found the act on another day */
.jumps{grid-column:1/-1;display:grid;gap:8px}
.jump{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 10px;min-height:52px;padding:10px 14px;border-radius:14px;background:var(--glass);border:1.5px solid var(--cyan);color:var(--ink);font:600 14px var(--body);text-align:left;cursor:pointer}
.jump b{font-family:var(--display);font-weight:700}
.jump-go{color:var(--cyan);font-weight:800;font-size:13px}
.empty.jump-h{padding:6px 0 2px;grid-column:1/-1}
.linkish{background:none;border:0;padding:0 2px;min-height:44px;color:var(--cyan);font:700 14px var(--body);text-decoration:underline;cursor:pointer}
.ctrl{margin-top:4px}
.grid.compact{gap:7px}
.grid.compact .card{padding:9px 12px;gap:4px}
.grid.compact .card .actions{margin-top:2px}
/* add to home screen: the benefit first, then the warning (Oct 28) */
.a2hs-warn{display:block;margin-top:4px;color:var(--amber);font-weight:700}
.a2hs-box{display:flex;align-items:center;gap:12px;margin-top:18px;padding:12px 14px;border-radius:16px;background:var(--glass);border:1.5px solid var(--line);max-width:640px}
.a2hs-box[hidden]{display:none}
.a2hs-box p{margin:0;flex:1;min-width:0;font-size:13.5px;line-height:1.45}
.a2hs-box .a2hs-ico{flex:none;color:var(--cyan)}
.a2hs-box .a2hs-how{flex:none;min-width:64px}

/* ===== Oct 28 upgrade, part 2: one "Made by Graham" door instead of the floating pills ===== */
.door{border:0;background:none;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;color:var(--ink)}
.door-menu:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
/* Graham's avatar in the top menu opens the sheet */
.door-menu{position:relative;flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center}
.door-menu img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1.5px solid var(--line)}
.door-heart{position:absolute;right:1px;bottom:3px;width:17px;height:17px;border-radius:50%;background:var(--night);display:grid;place-items:center}
.door-heart .ic{width:11px;height:11px;color:#ff6fc2}
/* the sheet */
.mbg-tag{margin:2px 0 0;font-size:13.5px;font-weight:700;color:var(--soft)}
.mbg-card .love-letter{margin-bottom:12px}
.mbg-opt{margin-top:10px;padding:14px;border-radius:16px;text-align:left;background:var(--glass);border:1.5px solid var(--line-soft)}
.mbg-opt h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font:700 16px var(--display);color:var(--ink)}
.mbg-opt h3 .ic{width:18px;height:18px;color:var(--cyan)}
.mbg-opt>p{margin:0 0 10px;font-size:14px;line-height:1.45;color:var(--ink)}
.mbg-opt .love-small{margin:10px 0 0;text-align:center}
.mbg-go{display:flex;width:100%;flex:none;gap:7px;font-weight:800}
.mbg-go .ic{width:17px;height:17px}
.mbg-more{margin:0 0 10px;font-size:13.5px}
.mbg-more summary{min-height:44px;display:flex;align-items:center;color:var(--cyan);font-weight:700;cursor:pointer}
.mbg-more .love-note{display:grid;gap:6px;padding:4px 2px 0;color:var(--ink)}
.mbg-more .love-note p{margin:0}
.mbg-row{margin-top:12px;display:grid;gap:8px}
.mbg-row .love-or{margin:6px 0 0}
.mbg-row .love-mail{margin-top:0}
.share-app{display:flex;width:100%;flex:none;gap:7px}
.share-app .ic{width:17px;height:17px;color:var(--cyan)}
.mbg-card .a2hs-box{margin-top:12px;text-align:left}
.usedby{margin:2px 0 0;font-size:13px;font-weight:700;color:var(--soft)}

/* ===== Oct 28 upgrade, part 3: ask after value ===== */
/* Quick start leads with what the app is and the dates; the tip buttons sit small, under Let's go */
.intro-card .intro-what{margin:0;font-size:22px;line-height:1.15;text-wrap:balance}
.intro-what-p{margin:4px 0 10px;font-size:15px;color:var(--ink)}
.intro-what-p b{color:var(--amber)}
.intro-card .usedby{margin:-4px 0 10px}
.tipbox.tip-small{margin-top:12px;padding:10px 12px;border-radius:14px}
.tipbox.tip-small .tip-h{font-size:13.5px;margin:0 0 8px}
.tipbox.tip-small .donate{min-height:44px;padding:8px 10px;font-size:14px}
/* the one-time "Your plan's ready" card */
.tm-card{text-align:center}
.tm-h{display:flex;align-items:center;justify-content:center;gap:8px;margin:4px 0 4px!important;font-size:22px!important}
.tm-h .ic{width:22px;height:22px;color:var(--amber)}
.tm-p{margin:0 0 12px;font-size:15px;color:var(--ink);display:flex;align-items:center;justify-content:center;gap:6px}
.tm-p .ic{width:17px;height:17px;color:var(--cyan)}
.tm-card .share-app{margin-top:10px}
/* "Built by Graham Lucht, app builder" */
.builtby{margin:22px 0 0;padding:12px 14px;border-radius:14px;border:1.5px dashed var(--line);font-size:13.5px;line-height:1.5;color:var(--soft);max-width:640px}
.builtby b{color:var(--ink)}
.builtby-go{display:inline-flex;align-items:center;min-height:44px;color:var(--cyan);font-weight:800;text-decoration:none;margin:-10px 0}
.builtby-go:hover{text-decoration:underline}

/* ===== Oct 28 upgrade, part 4: sharing ===== */
.plan-share{display:grid;grid-template-columns:1fr;gap:8px;margin-top:16px;max-width:640px}
.share-plan{display:flex;gap:8px;min-height:52px;font-weight:800;background:var(--grad);color:var(--night)}
.share-plan .ic{width:18px;height:18px}
.plan-share .share-app{margin:0}
.toast .ic{width:15px;height:15px;color:var(--lime);vertical-align:-2px}

/* ===== Oct 28 upgrade, parts 5 to 8: used-by line, quiz, next-year list, festival vote ===== */
/* "Not sure who to see?" sits after the third act */
.quizcta{grid-column:1/-1}
.quiz-open{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:10px 14px;border-radius:14px;cursor:pointer;text-align:left;
  background:var(--glass);border:1.5px dashed var(--day-line,#a874ff);color:var(--ink);font:600 14px var(--body)}
.quiz-open .ic{width:20px;height:20px;color:var(--amber);flex:none}
.quiz-open b{font-family:var(--display);font-weight:700;margin-right:4px}
.quiz-step{margin:0;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}
.quiz-h{margin:2px 0 8px!important}
.quiz-hint{margin:0 0 10px;font-size:13.5px;color:var(--soft)}
.quiz-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.quiz-opt{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:56px;padding:10px 12px;border-radius:14px;cursor:pointer;text-align:left;
  background:var(--night2);border:1.5px solid var(--line);color:var(--ink);font:700 14px var(--body)}
.quiz-opt small{font-weight:600;font-size:12px;color:var(--soft)}
.quiz-opt[aria-pressed="true"]{background:var(--grad);border-color:transparent;color:var(--night)}
.quiz-opt[aria-pressed="true"] small{color:var(--night)}
.quiz-nav{display:flex;gap:8px;margin-top:14px}
.quiz-nav .btn{flex:1;min-height:48px}
.quiz-nav .btn[hidden]{display:none}
.quiz-nav .btn:disabled{opacity:1;filter:saturate(.35);cursor:not-allowed}
.quiz-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.quiz-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:14px;background:var(--glass);border:1.5px solid var(--line-soft);box-shadow:inset 4px 0 0 var(--sc)}
.quiz-item>div{min-width:0;display:grid;gap:1px}
.qi-name{font:700 15px var(--display)}
.qi-meta{font-size:13px;font-weight:700;color:var(--amber)}
.qi-vibe{font-size:12.5px;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qi-clash{font-size:12px;font-weight:800;color:var(--red)}
.qi-go{flex:none;display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:6px 12px;border-radius:12px;cursor:pointer;background:var(--night2);border:1.5px solid var(--line);color:var(--ink);font:800 13px var(--body)}
.qi-go[aria-pressed="true"]{background:var(--lime);border-color:var(--lime);color:var(--night)}
/* festival vote card */
.fest-vote{margin-top:14px;padding:14px;border-radius:16px;background:var(--glass);border:1.5px solid var(--line-soft);text-align:left}
.fest-vote:empty{display:none}
.fv-h{display:flex;align-items:center;gap:8px;margin:0 0 4px;font:700 16px var(--display);color:var(--ink)}
.fv-h .ic{width:18px;height:18px;color:var(--amber)}
.fv-p{margin:0 0 10px;font-size:14px;color:var(--ink)}
.fv-list{display:flex;flex-wrap:wrap;gap:6px}
.fv-b{display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:6px 12px;border-radius:999px;cursor:pointer;text-decoration:none;
  background:var(--night2);border:1.5px solid var(--line);color:var(--ink);font:700 13px var(--body)}
.fv-b[aria-pressed="true"]{background:var(--grad);border-color:transparent;color:var(--night)}
.fv-b .ic{width:13px;height:13px}
.fv-other{border-style:dashed}
.fv-thanks{margin:12px 0 8px;font-weight:800;color:var(--lime)}
/* next-year list */
.next-year{margin-top:14px}
.next-year:empty{display:none}
.ny-h{margin:0 0 8px;font-size:14px;font-weight:700;color:var(--ink)}
.ny-go{display:flex;gap:8px;width:100%;min-height:48px;font-weight:800;background:var(--glass);color:var(--ink);border:1.5px solid var(--cyan)}
.ny-go .ic{width:18px;height:18px;color:var(--cyan)}
#v-lineup>.fest-vote,#v-lineup>.next-year{max-width:640px}
.next-year[hidden]{display:none}
/* listening: the YouTube Music / Spotify buttons get their own row under the picks */
.grid.compact .card.listen:not(.open) .links{order:9;flex-basis:100%;gap:8px}
/* keep "Search all days" readable next to the Filters count */
.ftoggle{padding:8px 10px}
.qbox{padding:0 8px;gap:5px}
.qbox input#q{font-size:14px}
.vtoggle{padding:6px 8px;gap:5px}
.vt-s{min-width:28px;padding:1px 6px;font-size:11px}
/* the day's sound (Graham, Oct 28): the label on two lines, and the color bar grown to fill that height */
.lineup-top .mixrow .mix h2{line-height:1.15;font-size:11px}
.lineup-top .mixrow .mix h2 span{display:block}
.lineup-top .mixrow .bar{height:28px;border-radius:9px}
.lineup-top .bar div+div{box-shadow:inset 2px 0 0 #160c3a}
/* Made by Graham sheet (Graham, Oct 28): a close button that stays pinned at the top while the sheet scrolls,
   and the Insomniac box stands out with a glowing gradient edge */
.mbg-top{position:sticky;top:0;z-index:3;display:flex;justify-content:flex-end;height:0;margin:0 -10px}
.mbg-close{display:grid;place-items:center;width:44px;height:44px;margin-top:-2px;border-radius:50%;cursor:pointer;
  background:rgba(18,10,46,.88);border:1.5px solid var(--line);color:var(--ink);backdrop-filter:blur(8px);box-shadow:0 6px 18px -8px rgba(0,0,0,.6)}
.mbg-close .ic{width:18px;height:18px}
.mbg-close:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.mbg-opt.mbg-ins{border:2px solid transparent;
  background:linear-gradient(160deg,rgba(255,79,180,.18),rgba(63,224,255,.10)) padding-box,linear-gradient(#1d1145,#1d1145) padding-box,linear-gradient(120deg,#ff4fb4,#a874ff 50%,#3fe0ff) border-box;
  box-shadow:0 10px 30px -14px rgba(255,79,180,.75)}
.mbg-ins h3{font-size:19px}
.mbg-ins h3 .ic{width:20px;height:20px;color:#ff6fc2}
.mbg-ins>p{font-weight:700}
.mbg-ins .mbg-go{background:var(--grad);color:var(--night);border:0;box-shadow:0 8px 22px -10px rgba(255,79,180,.8)}
/* pop-ups float on phones (Graham, Oct 28: full-screen sheets "take over"): a gap on both sides and below,
   all corners rounded, and room at the top so the app stays in view behind. They still spring up and drag down. */
@media (max-width:700px){
  .intro{padding:calc(56px + env(safe-area-inset-top,0px)) max(10px, env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(10px, env(safe-area-inset-left,0px))}
  .intro-card{border-radius:24px;border-bottom:1.5px solid var(--line);padding-bottom:20px;max-height:100%;
    box-shadow:0 24px 60px -20px rgba(0,0,0,.7),0 0 0 1px rgba(246,241,255,.04)}
}
.intro-card .donate-row .donate{white-space:nowrap;padding-inline:10px;font-size:15.5px}
/* top menu (Graham, Oct 28): "Getting there" is "Travel" here (the tab's own title still says Getting there),
   which makes room for a share icon next to Graham's avatar */
.menu-share{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;cursor:pointer;
  background:var(--glass);border:1.5px solid var(--line);color:var(--ink)}
.menu-share .ic{width:19px;height:19px;color:var(--cyan)}
.menu-share:hover{filter:brightness(1.15)}
.menu-share:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
/* Map tab (Graham, Oct 28): our map first; the official-map and directions buttons sit at the bottom */
.map-more{margin-top:20px;max-width:640px}
.map-more p{margin:0 0 10px;color:var(--soft)}
/* stage dots pulse on the maps (Graham, Oct 28: "so you can see where they are"). Like the stage logo and the
   rolling name, an approved exception to the no-animated-indicators rule; Reduce Motion shows them still. */
.gmap .stg .pulse{opacity:0;transform-box:fill-box;transform-origin:center;pointer-events:none}
@media (prefers-reduced-motion:no-preference){
  .gmap .stg .pulse{animation:stage-pulse 2.8s ease-out infinite}
}
@keyframes stage-pulse{0%{transform:scale(1);opacity:.75}75%,100%{transform:scale(2.1);opacity:0}}
/* Graham's avatar in the top menu sends out a pulse of light every few seconds, a "hi, I'm up here" (Graham,
   Oct 28; made brighter the same day: a white glow from behind plus a rainbow ring that spreads out).
   An approved exception to the no-animated-indicators rule; Reduce Motion shows it still. */
.door-menu{isolation:isolate}
.door-menu img{position:relative;z-index:1}
.door-heart{z-index:2}
.door-menu::before,.door-menu::after{content:"";position:absolute;inset:4px;border-radius:50%;z-index:0;pointer-events:none;opacity:0}
.door-menu::before{background:radial-gradient(circle,#fff 0,rgba(255,255,255,.85) 38%,rgba(255,240,255,.35) 58%,rgba(255,255,255,0) 72%)}
.door-menu::after{background:conic-gradient(#ff4fb4,#ffb627,#7dff9b,#3fe0ff,#a874ff,#ff4fb4);
  -webkit-mask:radial-gradient(circle,transparent 54%,#000 58%,#000 68%,transparent 72%);mask:radial-gradient(circle,transparent 54%,#000 58%,#000 68%,transparent 72%)}
@media (prefers-reduced-motion:no-preference){
  .door-menu::before{animation:door-glow 6s ease-out 1.5s infinite}
  .door-menu::after{animation:door-ring 6s ease-out 1.5s infinite}
}
@keyframes door-glow{0%{transform:scale(.9);opacity:0}7%{transform:scale(1.45);opacity:1}28%{transform:scale(1.9);opacity:0}100%{transform:scale(1.9);opacity:0}}
@keyframes door-ring{0%{transform:scale(1) rotate(0deg);opacity:0}6%{opacity:1}34%{transform:scale(2.5) rotate(90deg);opacity:0}100%{transform:scale(2.5) rotate(90deg);opacity:0}}
.mbg-me{display:inline-flex;align-items:center;gap:4px;min-height:44px;margin:-8px 0 -12px;color:var(--cyan);font:800 13.5px var(--body);text-decoration:none}
.mbg-me:hover{text-decoration:underline}
.mbg-me[hidden]{display:none}
/* "Send me a note" box (Oct 28): the same glass panel, labels and fields as the rest of the app; posts to a Google Form behind the scenes */
.note-form{display:grid;gap:0;padding:14px;border-radius:16px;text-align:left;background:var(--glass);border:1.5px solid var(--line-soft)}
.note-form[hidden],.note-done[hidden]{display:none}
.note-form .link-lbl{margin:10px 0 6px;color:var(--ink)}
.note-form .link-lbl:first-child{margin-top:0}
.note-opt{font-weight:600;color:var(--soft)}
.note-in{min-height:108px;resize:vertical;line-height:1.45;padding:10px 14px}
.note-form .link-in::placeholder{color:var(--soft);opacity:1}
.note-form .link-err{margin:6px 0 4px}
.note-form .link-err:empty{min-height:0;margin:4px 0 0}
.note-form .mbg-go{margin-top:6px}
.note-form .mbg-go:disabled{opacity:1;filter:saturate(.6);cursor:progress}
.note-form .love-small{margin:8px 0 0;text-align:center}
.note-done{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;text-align:left;background:var(--glass);border:1.5px solid var(--line-soft)}
.note-done .love-avatar{width:48px;height:48px}
.note-done p{margin:0;font-size:14px;line-height:1.45;color:var(--ink)}
.note-done .note-done-h{font:700 16px var(--display);margin-bottom:2px}
.note-done .love-sig{font-family:var(--display);font-weight:700;color:var(--pink)}
.note-again{min-height:44px;margin:2px 0 -10px;padding:0;background:none;border:0;color:var(--cyan);font:800 13.5px var(--body);cursor:pointer}
.note-again:hover{text-decoration:underline}
.love-mail[hidden]{display:none}
/* My Plan chips (Oct 28): the day as rows of small stage-colored chips, Going left, Maybe instead right */
.plan-chips{display:grid;gap:6px;max-width:640px;margin:4px 0 8px}
.plan-chips[hidden],.plan-list[hidden]{display:none}
.pc-head{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 2px;font:800 11.5px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.pc-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start;padding:6px;border-radius:14px;background:var(--glass);border:1.5px solid var(--line-soft)}
.pc-row.is-clash{border-color:var(--red)}
.pc-go,.pc-alt{display:grid;gap:5px;justify-items:start;min-width:0}
.pc-chip{display:flex;align-items:baseline;gap:5px;max-width:100%;min-width:0;min-height:36px;padding:6px 10px;border-radius:999px;cursor:pointer;
  font:700 12.5px/1.25 var(--body);white-space:nowrap;color:var(--night);background:var(--sc);border:1.5px solid var(--sc)}
.pc-chip span{overflow:hidden;text-overflow:ellipsis;min-width:0}
.pc-chip b{flex:none;font-weight:800}
.pc-chip.is-maybe{color:var(--ink);background:var(--night2);border-style:dashed}
.pc-chip.is-maybe b{color:var(--amber)}
.pc-chip.is-now{box-shadow:0 0 0 2px var(--ink),0 0 16px 2px var(--sc)}
.pc-chip.is-next{box-shadow:0 0 0 2px var(--cyan)}
.pc-chip.party{cursor:default}
.pc-free{padding:8px 4px;font:700 12.5px var(--body);color:var(--soft)}
.pc-clash{padding:2px 8px;border-radius:999px;font:800 11px var(--body);color:var(--night);background:var(--red)}
.pc-after{margin-top:6px;padding:0 2px;font:800 11.5px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.plan-item.pi-flash{box-shadow:0 0 0 2px var(--cyan),0 0 18px var(--cyan)}
/* My Plan day ribbon (Oct 28): the whole day across the screen, Going and Maybe rows in the stage colors */
.plan-tl{display:grid;gap:4px;margin:6px 0 10px;padding:10px 12px 10px 8px;border-radius:16px;background:var(--glass);border:1.5px solid var(--line-soft);max-width:640px}
.plan-tl[hidden]{display:none}
.rb-row{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:6px}
.rb-lbl{font:800 11px var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
.rb-track{position:relative;height:22px}
.rb-head .rb-track{height:16px}
.rb-hr{position:absolute;top:0;transform:translateX(-50%);font:800 11px var(--body);color:var(--soft);white-space:nowrap}
.rb-hr.is-five{color:var(--amber)}
.rb-rows{position:relative;display:grid;gap:5px}
.rb-guides{position:absolute;inset:-4px 0 -4px 54px;pointer-events:none}
.rb-guides i{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--amber);opacity:.65}
.rb-guides b{position:absolute;top:-2px;bottom:-2px;width:2px;margin-left:-1px;background:var(--ink);font-size:0;z-index:2}
.rb-bar{position:absolute;top:0;bottom:0;min-width:6px;border-radius:7px;background:var(--sc);border:1.5px solid var(--sc)}
.rb-bar.is-maybe{background:color-mix(in srgb,var(--sc) 22%,transparent);border-style:dashed}
.rb-bar.is-clash{box-shadow:0 0 0 2px var(--red)}
.rb-bar.is-now{box-shadow:0 0 0 2px var(--ink),0 0 12px 2px var(--sc)}
.rb-key{display:flex;flex-wrap:wrap;gap:4px 12px;margin:4px 0 0 54px;font:700 12px var(--body);color:var(--soft)}
.rb-key span{display:inline-flex;align-items:center;gap:5px}
.rb-key i{width:10px;height:10px;border-radius:3px;background:var(--sc)}
.rb-title{margin:14px 2px 0;font:800 11.5px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.rb-title[hidden]{display:none}
/* chips look 36px tall; the invisible margin makes each one a 44px tap target */
.pc-chip{position:relative}
.pc-chip::after{content:"";position:absolute;inset:-4px -2px}
/* picks links and comparing with a friend (Oct 28) */
.plan-link{display:grid;gap:6px;margin-top:8px;max-width:640px}
.plan-link-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.plan-link-btns .btn{margin:0;gap:6px;justify-content:center}
.plan-link .love-small{margin:0;text-align:center}
.pk-row{display:grid;grid-template-columns:1fr auto;gap:8px}
.pk-row .btn{margin:0}
#pkForm .link-lbl{margin-top:10px}
.intro-bring{margin-top:8px}
.a2hs-copy{display:grid;gap:8px;margin:10px 0 4px;padding:12px;border-radius:14px;background:var(--glass);border:1.5px solid var(--line-soft)}
.a2hs-copy[hidden]{display:none}
.a2hs-copy p{margin:0;font-size:14px;line-height:1.45;color:var(--ink)}
.a2hs-copy .btn{margin:0;gap:6px}
.cmp-bar{display:grid;gap:6px;margin:4px 0 8px;max-width:640px}
.cmp-bar[hidden]{display:none}
.cmp-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.cmp-l{font:800 11.5px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--soft);margin-right:2px}
.cmp-rm{min-height:44px;padding:0 6px;background:none;border:0;color:var(--cyan);font:800 13px var(--body);cursor:pointer}
.cmp-sum{margin:0;font-size:14px;line-height:1.45;color:var(--ink)}
.cmp-sum .pc-f{position:static;display:inline-grid;vertical-align:-3px}
.pc-f{flex:none;display:grid;place-items:center;width:20px;height:20px;margin:-2px -4px -2px 2px;border-radius:50%;font:800 11px/1 var(--body);font-style:normal;color:var(--night);background:var(--ink);box-shadow:0 0 0 2px var(--night)}
.pc-f.is-maybe{color:var(--ink);background:var(--night);box-shadow:0 0 0 1.5px var(--ink)}
.pc-only{display:flex;flex-wrap:wrap;gap:5px}
.pc-chip.is-friend{color:var(--ink);background:var(--night2);border-color:var(--sc)}
.pc-chip.is-friend b{color:var(--sc)}
.pc-chip.is-friend.is-fmaybe{border-style:dashed}
.rb-bar.is-friend{background:transparent;border:2px solid var(--sc)}
.cmp-sum .pc-f{margin:0 2px}
.rb-lbl .pc-f{margin:0}
#pkForm .btns .btn{flex:1 1 100%}