/* Deliberately unstyled: system fonts, no brand. Layout + seat states only. */
:root{--sold:#ddd;--line:#999;--primary:#000;--on-primary:#fff;--accent:#ddd;--on-accent:#000}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font:16px/1.4 system-ui,sans-serif;color:#000;background:#fff}
.app{display:grid;grid-template-columns:360px minmax(0,1fr);height:100vh}
.side{display:flex;flex-direction:column;overflow-y:auto;border-right:1px solid var(--line)}
.banner{padding:16px;background:var(--primary);color:var(--on-primary)}
.brand{color:inherit;font-weight:700;text-decoration:none;display:block}
.brand img{display:block;max-height:64px;max-width:100%}
.venue{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
.venue span{font-size:.85em;color:#555}
.venue a,.btn{align-self:flex-end;flex:none;display:inline-block;padding:8px 18px;border:1px solid var(--primary);background:var(--accent);color:var(--on-accent);font:inherit;font-weight:700;font-size:.85em;text-decoration:none;white-space:nowrap}
.venue a:hover{filter:brightness(.93)}
h1{font-size:1.5rem;margin:0;padding:16px;border-bottom:1px solid var(--line)}
.row{padding:12px 16px;border-bottom:1px solid var(--line)}
.row summary{cursor:pointer}
.basket{margin-top:auto;padding:16px;border-top:1px solid var(--line)}
.basket h2{display:flex;justify-content:space-between;font-size:1rem;margin:0 0 8px}
.basket ul{list-style:none;margin:0 0 8px;padding:0;max-height:180px;overflow:auto}
.basket li{display:flex;gap:8px;align-items:center;padding:4px 0;border-bottom:1px solid #eee}
.basket li span{flex:1}
.basket li i{width:12px;height:12px;border-radius:50%;border:1px solid #000}
.total{display:flex;justify-content:space-between;font-weight:700}
#go{width:100%;padding:12px;font:inherit;font-weight:700;background:var(--accent);color:var(--on-accent);border:1px solid var(--primary)}
#fine{font-size:.8em;color:#555;min-height:1.2em}
.main{display:flex;flex-direction:column;min-width:0;min-height:0;position:relative}
.bands{display:flex;gap:8px;padding:8px 12px;overflow-x:auto;border-bottom:1px solid var(--line)}
.chip{flex:none;display:flex;align-items:center;gap:8px;padding:8px 12px;font:inherit;background:#fff;border:1px solid var(--line)}
.chip[aria-pressed="true"]{border:2px solid #000;font-weight:700}
.chip i{width:14px;height:14px;border-radius:50%;border:1px solid #000}
.stagewrap{flex:1;min-height:0;overflow:auto}
#plan{display:block;margin:0 auto;width:100%;max-width:1100px;height:auto}
.seat{cursor:pointer;stroke:#000;stroke-width:1.3}
.seat.sold{fill:var(--sold)!important;stroke:#bbb;cursor:not-allowed}
.seat.dim{opacity:.2}
.seat.sel{fill:#000!important}
.seat:not(.sold):hover{stroke-width:3}
.tick{fill:none;stroke:#fff;stroke-width:2;pointer-events:none}
.lbl{font-size:20px;font-weight:700;fill:#000}
.rl{font-size:9px;fill:#666}
.stagebox{fill:#fff;stroke:#000;stroke-width:2}
.stagetxt{font-size:22px;font-weight:700;fill:#000}
.zoom{position:absolute;right:16px;bottom:48px;display:flex;flex-direction:column;gap:6px}
.zoom button{padding:8px 10px;font:inherit;background:#fff;border:1px solid #000}
.legend{display:flex;gap:16px;padding:8px 16px;border-top:1px solid var(--line);font-size:.8em}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:12px;height:12px;border-radius:50%;border:1px solid #000;display:inline-block}
.legend i.sold{background:var(--sold);border-color:#bbb}.legend i.sel{background:#000}
.tip{position:fixed;pointer-events:none;background:#fff;border:1px solid #000;padding:4px 8px;font-size:.8em;opacity:0;white-space:nowrap}
.tip.on{opacity:1}
.err{padding:48px 24px}
@media (max-width:900px){
  .app{display:flex;flex-direction:column;height:auto;min-height:100vh}
  .side,.main{display:contents}
  .banner{order:1}.venue{order:2}h1{order:3}#when{order:4}
  .bands{order:5;position:sticky;top:0;background:#fff;z-index:2}
  .stagewrap{order:6;min-height:60vh}
  .row:not(#when){order:7}.legend{order:8;padding-bottom:110px}
  .basket{order:9;position:fixed;left:0;right:0;bottom:0;background:#fff;margin:0;padding:10px 14px}
  .basket ul,#empty,#fine{display:none}
  .zoom{position:fixed;bottom:150px}
}

/* display only: no pointer cursors, hover feedback on seats stays */
.display-only button,.display-only summary,.display-only .seat,.display-only .seat.sold{cursor:default}

/* ---------- calendar variant (no datetime/plan in the URL) ---------- */
.is-cal #when,.is-cal .basket,.is-cal .bands,.is-cal .stagewrap,.is-cal .zoom,.is-cal .legend{display:none}
.calendar{flex:1;min-height:0;overflow:auto;padding:16px 20px;--good:#8fd19e;--medium:#e0a030;--low:#f08070;--out:#bbb}
.cal-filters{display:flex;gap:8px;flex-wrap:wrap}
.cal-head{display:flex;justify-content:center;align-items:center;gap:32px;margin:16px 0 10px;font-weight:700;font-size:1.2rem}
.cal-head button{border:0;background:none;font:inherit;font-size:1.8rem;line-height:1;color:#aaa;padding:0 8px}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid #ccc;border-left:1px solid #ccc}
.cal-dows{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.cal-dow{text-align:center;font-size:.75em;font-weight:700;color:#000;padding:4px 0}
.cal-day{min-height:116px;padding:6px 6px 8px;display:flex;flex-direction:column;gap:4px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;font-size:.85em;min-width:0}
.cal-day .n{text-align:center;color:#000}
.cal-day.other .n,.cal-day.past .n{color:#aaa}
.cal-day .dash{text-align:center;color:#aaa;margin-top:12px}
.cal-day.today{outline:1px solid #000;outline-offset:-1px}
.perf{display:flex;flex-direction:column;padding:6px 8px;background:#f3f3f3;border-left:6px solid var(--out);color:#000;text-decoration:none;line-height:1.25}
.perf b{font-size:.95em}.perf span{font-size:.85em;color:#555}
.perf.good{border-left-color:var(--good)}.perf.medium{border-left-color:var(--medium)}.perf.low{border-left-color:var(--low)}
a.perf:hover{background:#e8e8e8}
.perf.out b{text-decoration:line-through;color:#888}
.cal-none{padding:16px 0;color:#555}
.cal-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:.8em;color:#222}
.cal-foot .key{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.cal-foot .sw{display:inline-block;width:12px;height:12px;margin-left:10px}
.sw.good{background:var(--good)}.sw.medium{background:var(--medium)}.sw.low{background:var(--low)}.sw.out{background:var(--out)}
@media (max-width:900px){
  .calendar{order:5;padding:12px}
  .cal-day{min-height:70px;padding:3px;font-size:.7em}
  .perf{padding:3px 4px;border-left-width:4px}
  .perf span{display:none}
}

/* ---------- waitlist / presale takeover ---------- */
.takeover{position:fixed;inset:0;z-index:100;background:#fff;overflow:auto;display:flex;flex-direction:column}
.takeover[hidden]{display:none}
.to-banner{background:var(--primary);color:var(--on-primary);padding:16px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.to-banner a.brand img{max-height:64px;display:block}
.to-banner .back{padding:8px 18px;border:1px solid var(--on-primary);background:var(--accent);color:var(--on-accent);font-weight:700;font-size:.85em;text-decoration:none}
.to-body{width:100%;max-width:560px;margin:0 auto;padding:32px 20px 56px}
.to-body h1{font-size:1.8rem;margin:0 0 4px;padding:0;border:0}
.to-body .sub{margin:0 0 16px;font-weight:700}
.to-body p{margin:0 0 14px}
.to-body label.f{display:block;font-weight:700;margin:14px 0 4px}
.to-body input[type=email],.to-body input[type=tel]{display:block;width:100%;padding:10px;font:inherit;border:1px solid #000}
.to-body .or{margin:10px 0 0;color:#555;font-size:.9em}
.to-body .consent{display:flex;gap:10px;align-items:flex-start;margin:16px 0 0;font-size:.85em;line-height:1.45}
.to-body .consent input{margin-top:3px;flex:none;width:18px;height:18px}
.to-body .fine{font-size:.78em;color:#444;line-height:1.45;margin:14px 0 0}
.to-body button[type=submit]{margin-top:18px;width:100%;padding:14px;font:inherit;font-weight:700;background:var(--accent);color:var(--on-accent);border:1px solid var(--primary)}
.to-body .err{color:#b00020;font-weight:700;min-height:1.3em;margin:12px 0 0;padding:0}
.to-body a{color:inherit}
.display-only .to-body,.display-only .to-body *{pointer-events:none;cursor:default}
