/* =====================================================================
   GIGS — Gig Map (gig_map.html)
   ===================================================================== */
#scr-gigs{ background:var(--map-bg); }
.gm-map{ position:absolute; inset:0; overflow:hidden; }
.gm-map svg.base{ position:absolute; inset:0; width:100%; height:100%; }
.radius{ position:absolute; left:50%; top:44%; width:82%; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; border:1.5px dashed rgb(var(--accent-rgb) / .55); background:radial-gradient(circle, rgb(var(--accent-rgb) / .12), rgb(var(--accent-rgb) / .03) 60%, transparent 72%); pointer-events:none; }
.radius span{ position:absolute; top:-10px; left:50%; transform:translateX(-50%); font-family:var(--font-mono); font-size:10px; font-weight:600; padding:3px 8px; border-radius:999px; background:var(--sage-3); color:var(--black); white-space:nowrap; }
.me-dot{ position:absolute; left:50%; top:44%; width:18px; height:18px; margin:-9px 0 0 -9px; border-radius:50%; background:var(--sage-4); border:3px solid #fff; box-shadow:0 0 0 6px rgb(var(--accent-rgb) / .25); }
.me-dot::after{ content:""; position:absolute; inset:-10px; border-radius:50%; border:2px solid var(--sage-4); animation:ping 2s ease-out infinite; }
@keyframes ping{ from{ transform:scale(.4); opacity:1;} to{ transform:scale(2.2); opacity:0;} }
.vpin{ position:absolute; transform:translate(-50%,-100%); display:flex; flex-direction:column; align-items:center; transition:transform .3s var(--ease-spring), opacity .3s; z-index:2; }
.vpin .vp{ position:relative; width:44px; height:44px; border-radius:14px; background-size:cover; background-position:center; border:3px solid var(--sage-3); box-shadow:0 8px 18px rgb(var(--shade-rgb) / calc(.55 * var(--shade-k))); transition:border-color .2s; }
.vpin::after{ content:""; width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent; border-top:9px solid var(--sage-3); margin-top:-2px; transition:border-top-color .2s; }
.vpin .n{ position:absolute; top:-9px; right:-9px; min-width:20px; height:20px; padding:0 5px; border-radius:999px; background:var(--cream); color:var(--black); font-family:var(--font-mono); font-size:10.5px; font-weight:700; display:flex; align-items:center; justify-content:center; border:2px solid var(--map-bg); }
.vpin .lbl{ position:absolute; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%) translateY(4px); white-space:nowrap; font-size:11.5px; font-weight:700; padding:4px 9px; border-radius:999px; background:var(--cream); color:var(--black); opacity:0; transition:opacity .2s, transform .2s; pointer-events:none; }
.vpin.tonight .vp{ border-color:var(--cat-gig); }
.vpin.tonight::after{ border-top-color:var(--cat-gig); }
.vpin.tonight .n{ background:var(--cat-gig); }
.vpin.tonight .vp::before{ content:""; position:absolute; inset:-8px; border-radius:19px; border:2px solid var(--cat-gig); animation:ring 2s ease-out infinite; }
.vpin.mine .vp{ box-shadow:0 0 0 3px var(--black), 0 0 0 5px var(--sage-4), 0 8px 18px rgb(var(--shade-rgb) / calc(.55 * var(--shade-k))); }
@keyframes ring{ from{ transform:scale(.85); opacity:1;} to{ transform:scale(1.35); opacity:0;} }
.vpin.sel{ transform:translate(-50%,-100%) scale(1.22); z-index:5; }
.vpin.sel .vp{ border-color:var(--text); }
.vpin.sel::after{ border-top-color:var(--text); }
.vpin.sel .lbl{ opacity:1; transform:translateX(-50%) translateY(0); }
.vpin.out{ opacity:0; transform:translate(-50%,-80%) scale(.5); pointer-events:none; }
.gm-top{ position:absolute; left:0; right:0; top:0; z-index:20; padding:32px 14px 0; }
.gm-top .row{ display:flex; gap:8px; }
.gm-top .search{ flex:1; }
.gm-top .search input{ border-radius:16px; background:rgb(var(--scrim-rgb) / .78); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-color:var(--field-line); box-shadow:0 10px 24px -12px rgb(var(--shade-rgb) / calc(.8 * var(--shade-k))); }
.glass-btn{ width:46px; height:46px; border-radius:16px; display:flex; align-items:center; justify-content:center; background:rgb(var(--scrim-rgb) / .78); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1.5px solid rgb(var(--ink-rgb) / .14); position:relative; flex-shrink:0; }
.glass-btn.has{ border-color:var(--sage-3); color:var(--sage-4); }
.glass-btn .badge-n{ position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--sage-3); color:var(--black); font-family:var(--font-mono); font-size:10px; font-weight:700; display:flex; align-items:center; justify-content:center; border:2px solid var(--map-bg); }
.fsum{ display:flex; align-items:stretch; gap:4px; margin-top:8px; padding:4px; border-radius:16px; background:rgb(var(--scrim-rgb) / .78); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1.5px solid rgb(var(--ink-rgb) / .14); box-shadow:0 10px 24px -12px rgb(var(--shade-rgb) / calc(.8 * var(--shade-k))); transition:border-color .2s; }
.fsum.active{ border-color:rgb(var(--accent-rgb) / .55); }
.fs-seg{ flex:1; min-width:0; display:flex; align-items:center; gap:8px; padding:6px 8px 6px 10px; border-radius:12px; transition:background .2s; }
.fs-seg .fs-ic{ width:26px; height:26px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:rgb(var(--ink-rgb) / .07); color:var(--cream-dim); flex-shrink:0; }
.fs-seg .fs-tx{ flex:1; min-width:0; display:flex; flex-direction:column; text-align:left; }
.fs-seg small{ font-family:var(--font-mono); font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--cream-dim); }
.fs-seg b{ font-size:12.5px; font-weight:600; color:var(--cream-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fs-seg.on{ background:rgb(var(--accent-rgb) / .18); }
.fs-seg.on .fs-ic{ background:var(--sage-3); color:var(--black); }
.fs-seg.on small{ color:var(--sage-4); }
.fs-seg.on b{ color:var(--cream); font-weight:700; }
.fs-x{ width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgb(var(--ink-rgb) / .12); color:var(--cream); flex-shrink:0; }
.fs-x:hover{ background:rgb(var(--ink-rgb) / .22); }
.fs-sep{ width:1px; background:var(--line); margin:6px 0; }
.gm-locate{ position:absolute; right:14px; bottom:300px; z-index:15; }
/* Venue cards sit at the bottom of the panel, just above the floating nav bar */
.gm-panel{ position:absolute; left:0; right:0; bottom:0; z-index:25; padding-bottom:76px; transition:top .45s var(--ease-out); top:calc(100% - 300px); display:flex; flex-direction:column; justify-content:flex-end; }
.gm-dots{ display:flex; justify-content:center; gap:5px; margin-top:8px; height:6px; }
.gm-dots i{ width:6px; height:6px; border-radius:6px; background:rgb(var(--ink-rgb) / .3); transition:width .25s var(--ease-out), background .25s; }
.gm-dots i.on{ width:18px; background:var(--sage-3); }
.gm-panel .bar{ display:flex; align-items:center; justify-content:space-between; padding:0 16px 10px; }
.gm-panel .bar .cnt{ font-family:var(--font-mono); font-size:11px; padding:6px 10px; border-radius:999px; background:rgb(var(--scrim-rgb) / .78); backdrop-filter:blur(10px); color:var(--sage-4); }
.gm-panel .bar .tg{ display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:12.5px; padding:8px 14px; border-radius:999px; background:var(--cream); color:var(--black); box-shadow:0 10px 24px -10px rgb(var(--shade-rgb) / calc(.8 * var(--shade-k))); }
.gm-car{ gap:10px; padding:0 16px 4px; scroll-snap-type:x mandatory; scroll-padding:0 16px; }
.vc{ flex:0 0 86%; scroll-snap-align:start; display:flex; gap:12px; padding:10px; border-radius:20px; background:var(--charcoal); border:1px solid var(--line); box-shadow:0 18px 36px -16px rgb(var(--shade-rgb) / calc(.9 * var(--shade-k))); text-align:left; transition:border-color .2s; }
.vc.sel{ border-color:rgb(var(--accent-rgb) / .6); }
.vc .cv{ width:92px; height:132px; border-radius:14px; background-size:cover; background-position:center; flex-shrink:0; position:relative; overflow:hidden; }
.vc .cv::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 45%, rgb(var(--scrim-rgb) / .85)); }
.vc .cv .when{ position:absolute; left:6px; right:6px; bottom:6px; z-index:1; font-family:var(--font-mono); font-size:9.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--cat-gig); text-align:center; padding:3px 0; border-radius:8px; background:rgb(var(--scrim-rgb) / .7); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.vc .mid{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.vc .mid .vn{ font-size:15px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vc .mid .g{ font-family:var(--font-mono); font-size:10.5px; color:var(--cream-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:flex; align-items:center; gap:4px; }
.vc .nx{ font-size:12.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
.vc .lu{ display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--cream-dim); min-width:0; text-align:left; }
.vc .lu span:last-child{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vc .lu b{ color:var(--cream); font-weight:600; }
.vc .rowx{ display:flex; gap:6px; margin-top:auto; }
.vc .rowx .btn-go{ flex:1; padding:7px 8px; }
.vc .rowx .btn-ghost{ padding:7px 11px; }
.gm-list{ display:none; flex:1; overflow-y:auto; scrollbar-width:none; background:var(--charcoal); border-radius:24px 24px 0 0; border-top:1px solid var(--line); padding:4px 0 0; }
.gm-list::-webkit-scrollbar{ display:none; }
#scr-gigs.list .gm-panel{ top:150px; }
#scr-gigs.list .gm-car-rail, #scr-gigs.list .gm-dots{ display:none; }
#scr-gigs.list .gm-list{ display:block; animation:sheetUp .4s var(--ease-out); }
#scr-gigs.list .gm-locate{ opacity:0; pointer-events:none; }
.ag-h{ position:sticky; top:0; z-index:2; padding:12px 16px 8px; background:var(--charcoal); font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--sage-4); display:flex; justify-content:space-between; border-bottom:1px solid var(--line); }
.ag-h.tonight{ color:var(--cat-gig); }
.ag{ display:flex; align-items:center; gap:12px; padding:11px 16px; border-bottom:1px solid var(--line); }
.ag .th{ width:50px; height:50px; border-radius:12px; background-size:cover; background-position:center; flex-shrink:0; }
.ag .mid{ flex:1; min-width:0; text-align:left; }
.ag .mid b{ display:block; font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ag .mid small{ display:block; font-size:12px; color:var(--cream-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ag .mid .at{ font-family:var(--font-mono); font-size:10.5px; color:var(--sage-4); margin-top:2px; }
/* venue sheet */
.vs-cover{ margin:-10px -18px 0; height:160px; background-size:cover; background-position:center; position:relative; border-radius:24px 24px 0 0; }
.vs-cover::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgb(var(--scrim-rgb) / .1), var(--surface)); border-radius:inherit; }
.vs-cover .sheet-grab{ position:absolute; left:50%; top:10px; margin-left:-19px; z-index:2; background:rgb(var(--ink-rgb) / .6); }
.vs-head{ position:relative; z-index:2; margin-top:-40px; }
.vs-head h3{ font-size:24px; }
.vs-meta{ display:flex; flex-wrap:wrap; gap:6px 14px; font-family:var(--font-mono); font-size:11px; color:var(--cream-dim); }
.vs-meta span{ display:inline-flex; align-items:center; gap:4px; }
.vs-acts{ display:flex; gap:8px; margin:14px 0 4px; }
.vs-acts > *{ flex:1; padding:10px; }
.vs-sec{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--sage-4); margin:18px 0 10px; }
.gk{ display:flex; gap:12px; padding:12px; border-radius:18px; background:var(--panel); border:1px solid rgb(var(--ink-rgb) / .06); margin-bottom:10px; }
.gk.dim{ opacity:.5; }
.gk.hl{ border-color:rgba(255,159,90,.55); }
.gk .bd{ flex:1; min-width:0; }
.gk .bd b{ display:block; font-size:14.5px; }
.gk .bd .when{ font-family:var(--font-mono); font-size:10.5px; color:var(--cream-dim); margin-top:2px; }
.gk .lu{ display:flex; flex-wrap:wrap; gap:6px; margin:10px 0; }
.lu-chip{ display:inline-flex; align-items:center; gap:6px; padding:3px 10px 3px 3px; border-radius:999px; background:rgb(var(--shade-rgb) / calc(.22 * var(--shade-k))); font-size:12px; font-weight:600; }
.lu-chip:hover{ background:rgb(var(--shade-rgb) / calc(.35 * var(--shade-k))); }
.lu-chip.fol{ background:rgb(var(--accent-rgb) / .16); }
.lu-chip em{ font-style:normal; font-family:var(--font-mono); font-size:9px; letter-spacing:.06em; text-transform:uppercase; color:var(--sage-4); }
.gk .ft{ display:flex; align-items:center; justify-content:space-between; gap:8px; font-family:var(--font-mono); font-size:10.5px; color:var(--cream-dim); }