/* Styles every generated page: 155 event pages and 108 venue hubs.

   One file, so the whole long tail follows the homepage's design system rather
   than sitting in the old grey-dashboard look a visitor arrives at from search.
   Tokens and rules are kept in step with the homepage deliberately: same bone
   and ink, same flare, same hard borders and 2px offset shadows, same rule that
   flare carries black text and small flare text uses the darkened token. */
:root{
  color-scheme:light dark;
  --bone:#F4F1EB; --card:#FFFFFF; --sunk:#E8E3DA;
  --ink:#100F0E; --ink-2:#54504A;
  --line:#DCD6CB; --hard:#100F0E;
  --flare:#FF3B14; --on-flare:#100F0E; --flare-text:#C42D0B;
  --volt:#1B2CFF; --on-volt:#FFFFFF;
}
@media(prefers-color-scheme:dark){:root{
  --bone:#0C0C0D; --card:#18181B; --sunk:#212126;
  --ink:#F7F4EE; --ink-2:#A8A29A;
  --line:#2C2C31; --hard:#F7F4EE;
  --flare:#FF5C33; --on-flare:#0C0C0D; --flare-text:#FF5C33;
  --volt:#8296FF; --on-volt:#0C0C0D;
}}

*{box-sizing:border-box}
body{margin:0;background:var(--bone);color:var(--ink);font-size:17px;line-height:1.5;
  font-family:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:3px solid var(--volt);outline-offset:2px;border-radius:4px}

.bar{border-bottom:2px solid var(--hard);padding:13px 24px;background:var(--bone)}
.mark{font-family:"Bricolage Grotesque","Instrument Sans",sans-serif;font-weight:800;
  font-size:21px;letter-spacing:-.045em;text-decoration:none;display:inline-flex;
  align-items:center;gap:9px}
/* The clock at 10:00, drawn in CSS so the generated pages need no inline SVG. */
.mark::before{content:"";width:20px;height:20px;flex:none;border:2.5px solid var(--ink);
  border-radius:50%;position:relative}
.mark .tld{color:var(--flare-text)}

main{max-width:760px;margin:0 auto;padding:32px 24px 10px}
h1,h2,h3{margin:0;font-family:"Bricolage Grotesque","Instrument Sans",sans-serif;
  font-weight:800;letter-spacing:-.035em;line-height:1.02}
h1{font-size:clamp(30px,4.6vw,46px);letter-spacing:-.045em;margin:16px 0 0;text-wrap:balance}
h2{font-size:26px;margin:44px 0 12px}

.crumbs{font-size:13px;font-weight:600;color:var(--ink-2)}
.crumbs a{color:var(--ink-2)}

/* The answer is the point of the page, so it is the biggest thing after the
   question and it never sits behind a subscribe wall. */
.answer{font-size:20px;font-weight:600;line-height:1.4;margin:20px 0 0;max-width:58ch;
  border-left:5px solid var(--flare);padding-left:20px}
.verified{font-size:13px;font-weight:600;color:var(--ink-2);margin:16px 0 0}
.verified a{font-weight:700}

p{max-width:62ch;font-weight:500}
.note{font-size:14px;color:var(--ink-2);margin-top:14px}

table{width:100%;border-collapse:collapse;font-size:15px;margin-top:8px}
th{text-align:left;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-2);padding:0 14px 9px 0;border-bottom:3px solid var(--hard)}
td{padding:12px 14px 12px 0;border-bottom:2px solid var(--line);vertical-align:top;font-weight:500}
td:first-child{font-weight:700}

.sub{background:var(--card);border:2px solid var(--hard);border-radius:20px;
  box-shadow:0 5px 0 var(--hard);padding:24px;margin:48px 0 12px}
.sub h2{margin-top:0;font-size:25px}
.sub p{font-size:16px}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--flare);
  color:var(--on-flare);text-decoration:none;padding:13px 26px;border:2px solid var(--hard);
  border-radius:999px;font-weight:700;font-size:16px;min-height:52px;
  box-shadow:0 2px 0 var(--hard)}
.btn:hover{transform:translateY(1px);box-shadow:0 1px 0 var(--hard)}

.hub{list-style:none;padding:0;margin:26px 0 0}
.hub li{padding:0;border-bottom:2px solid var(--line)}
.hub a{display:block;padding:14px 0;font-weight:700;font-size:17px;text-decoration:none;
  letter-spacing:-.02em}
.hub a:hover{color:var(--flare-text)}
.hub span{display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-top:3px;
  letter-spacing:0}

footer{background:var(--ink);color:var(--bone);margin-top:52px;padding:34px 24px 48px;
  font-size:14px;font-weight:500}
footer > *{max-width:760px;margin-left:auto;margin-right:auto}
footer a{font-weight:700}