/* escaper.com.au (the New Leaderboards design). Dark, room-led: the room's artwork sets the mood; gold, silver and bronze mark the podium. */
:root { --bg:#07080c; --panel:#10131b; --line:#222838; --text:#f3f4f7; --muted:#9aa1b2; --glow:#3d6bff;
  --gold:#f2c14e; --silver:#cfd6e0; --bronze:#d08a52; --red:#d02525; }
* { box-sizing:border-box; }
html { background:var(--bg); }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.5 Inter, system-ui, sans-serif; }
a { color:inherit; }
.vh { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* Header: the room, unmistakably */
.hero { position:relative; padding:18px 16px 0; isolation:isolate; overflow:hidden; text-align:center; }
.hero::before { content:""; position:absolute; inset:0; z-index:-2; background:var(--art) center 38%/cover no-repeat; filter:saturate(1.15); }
.hero::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(7,8,12,.55) 0%, rgba(7,8,12,.35) 40%, var(--bg) 100%); }
.top { display:flex; justify-content:space-between; gap:12px; max-width:1100px; margin:0 auto; font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; }
.top a { text-decoration:none; color:var(--text); }
.top b { color:var(--red); }
.room { max-width:820px; margin:0 auto; padding:clamp(40px, 9vw, 96px) 0 24px; }
.kicker { margin:0 0 14px; font-weight:600; font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:#b9c8ff; }
h1 { margin:0; line-height:1; }
h1 img { width:min(560px, 86%); height:auto; filter:drop-shadow(0 0 22px rgba(61,107,255,.75)); }
/* Square room art (brand assets): the picture with the logo in front, the plain art blurred behind it */
.hero.has-sq::before { inset:-48px; filter:blur(22px) saturate(1.15) brightness(.7); background-position:center; }
h1 img.sq-hero { width:min(400px, 70%); aspect-ratio:1; object-fit:cover; border-radius:18px; filter:none;
  box-shadow:0 24px 60px -12px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.1), 0 0 48px -8px rgba(61,107,255,.45); }
h1 .word { display:block; font:clamp(64px, 14vw, 150px)/.95 Anton, sans-serif; text-transform:uppercase; letter-spacing:.01em; text-shadow:0 0 28px rgba(0,0,0,.8), 0 4px 0 rgba(0,0,0,.5); }
.sub { margin:16px auto 0; max-width:34em; color:#d6dbe8; }
.tabs { display:inline-flex; gap:4px; margin:12px auto 28px; padding:4px; border:1px solid var(--line); border-radius:999px; background:rgba(16,19,27,.8); backdrop-filter:blur(6px); }
.tabs button { font:600 14px Inter, sans-serif; color:var(--muted); background:none; border:0; padding:8px 16px; border-radius:999px; cursor:pointer; }
.tabs button[aria-selected=true] { background:var(--text); color:var(--bg); }

main { max-width:1100px; margin:0 auto; padding:0 16px 48px; }

/* Podium: 2nd · 1st · 3rd */
.podium { display:grid; grid-template-columns:1fr 1.22fr 1fr; align-items:end; gap:clamp(8px, 2.4vw, 28px); max-width:940px; margin:0 auto; }
.place { --c:var(--gold); display:flex; flex-direction:column; text-align:center; min-width:0; }
.place.p2 { --c:var(--silver); } .place.p3 { --c:var(--bronze); }
.shot { position:relative; margin:0; aspect-ratio:3/4; border-radius:14px; overflow:hidden; border:3px solid var(--c); background:var(--panel);
  box-shadow:0 0 0 1px rgba(0,0,0,.4), 0 18px 40px -12px color-mix(in srgb, var(--c) 45%, transparent); }
.p1 .shot { box-shadow:0 0 0 1px rgba(0,0,0,.4), 0 0 60px -6px color-mix(in srgb, var(--gold) 60%, transparent); }
.shot img { width:100%; height:100%; object-fit:cover; display:block; }
.medal { position:absolute; left:50%; bottom:-1px; translate:-50% 0; width:clamp(34px, 6vw, 52px); aspect-ratio:1; display:grid; place-items:center;
  border-radius:50% 50% 0 0; background:var(--c); color:#14110a; font:clamp(18px, 3.4vw, 30px)/1 Anton, sans-serif; padding-top:4px; }
.nophoto { position:absolute; inset:0; display:grid; place-content:center; gap:6px; background:var(--art) center 46%/cover; }
.nophoto::before { content:""; position:absolute; inset:0; background:rgba(7,8,12,.62); }
.nophoto b, .nophoto span { position:relative; }
.nophoto b { font:clamp(44px, 9vw, 96px)/1 Anton, sans-serif; color:var(--c); }
.nophoto span { font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.who { padding:12px 2px 10px; }
.who h3 { margin:0; font-size:clamp(14px, 2.2vw, 20px); font-weight:800; overflow-wrap:anywhere; }
.time { margin:2px 0 0; font:clamp(28px, 5.4vw, 52px)/1.05 Anton, sans-serif; color:var(--c); letter-spacing:.02em; }
.p1 .time { font-size:clamp(34px, 6.8vw, 68px); }
.meta { margin:4px 0 0; font-size:clamp(11px, 1.6vw, 14px); color:var(--muted); }
.plinth { display:grid; place-items:center; border-radius:10px 10px 0 0; font:clamp(20px, 4vw, 40px)/1 Anton, sans-serif; color:rgba(0,0,0,.55);
  background:linear-gradient(180deg, var(--c), color-mix(in srgb, var(--c) 55%, #000)); }
.p1 .plinth { height:clamp(70px, 13vw, 140px); } .p2 .plinth { height:clamp(48px, 9vw, 100px); } .p3 .plinth { height:clamp(32px, 6vw, 70px); }
.place.empty { --c:#2a3040; } .place.empty .plinth { height:40px; color:var(--muted); }

/* Room numbers */
.stats { display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; margin:0 auto; max-width:940px; background:var(--line); border:1px solid var(--line); border-top:0; }
.stats div { background:var(--panel); padding:16px 12px; text-align:center; }
.stats dt { font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.stats dd { margin:4px 0 0; font:30px/1.1 Anton, sans-serif; }
.stats dd small { font:600 14px Inter, sans-serif; color:var(--muted); }
.stats .beat { color:var(--gold); }

/* Section headings (more rooms) */
.chase { max-width:940px; margin:48px auto 12px; font:28px/1.1 Anton, sans-serif; letter-spacing:.02em; text-transform:uppercase; }
.none { text-align:center; color:var(--muted); padding:48px 0; }

.cta { max-width:940px; margin:48px auto 0; padding:28px 16px; text-align:center; border:1px solid var(--line); border-radius:14px;
  background:radial-gradient(120% 140% at 50% 0%, rgba(61,107,255,.22), transparent 60%), var(--panel); }
.cta p { margin:0 0 14px; font:24px/1.2 Anton, sans-serif; letter-spacing:.02em; }
.cta a { display:inline-block; padding:12px 22px; border-radius:999px; background:var(--red); color:#fff; font-weight:800; text-decoration:none; }
footer { max-width:1100px; margin:0 auto; padding:0 16px 32px; font-size:13px; color:var(--muted); text-align:center; }

/* City pages and room tiles */
.list { padding-top:18px; }
.list .top { margin-bottom:40px; }
.list .kicker { text-align:left; }
.list h1 { font:clamp(36px, 7vw, 64px)/1 Anton, sans-serif; text-transform:uppercase; letter-spacing:.01em; }
.list .sub { margin:12px 0 28px; color:var(--muted); }
.rooms { list-style:none; margin:0 auto; padding:0; max-width:940px; display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:14px; }
.list .rooms { max-width:none; }
.rooms a { position:relative; display:flex; flex-direction:column; justify-content:end; align-items:center; gap:10px; aspect-ratio:3/4; padding:16px 12px; border-radius:14px; text-decoration:none; overflow:hidden;
  background:linear-gradient(180deg, rgba(7,8,12,.15) 30%, rgba(7,8,12,.92)), var(--art) center 40%/cover, var(--panel); border:1px solid var(--line); transition:transform .15s, border-color .15s; }
.rooms a.has-sq { aspect-ratio:auto; justify-content:start; padding:0 0 14px; background:var(--panel); }
.rooms a.has-sq img.sq { width:100%; height:auto; max-height:none; aspect-ratio:1; object-fit:cover; filter:none; }
.rooms a:hover, .rooms a:focus-visible { transform:translateY(-3px); border-color:var(--gold); }
.rooms img { width:88%; max-height:34%; object-fit:contain; filter:drop-shadow(0 2px 10px rgba(0,0,0,.8)); }
.rooms b { font:28px/1.1 Anton, sans-serif; text-align:center; }
.lead { font-size:13px; color:var(--muted); text-align:center; }
.lead em { display:block; font:normal 26px/1.1 Anton, sans-serif; color:var(--gold); }

@media (max-width:640px) {
  .stats { grid-template-columns:repeat(2, 1fr); }
  .shot { border-width:2px; border-radius:10px; }
  .meta { display:none; }
  .rooms { grid-template-columns:repeat(2, 1fr); gap:10px; }
}

/* escaper.com.au: logo in the top bar, venue sections on the home page, the rules page */
.top .brand { display:inline-flex; align-items:center; gap:10px; }
.top .brand img { height:46px; width:auto; }
.top span a { color:var(--text); text-decoration:none; }
.venue { margin-top:8px; }
.venue .chase { margin-left:0; }
.list .chase { max-width:none; }
.prose { max-width:760px; }
.rules { padding-left:1.2em; line-height:1.7; }
.rules li { margin-bottom:10px; }
.cta-row { margin-top:28px; }
.btn { display:inline-block; padding:12px 22px; border-radius:999px; background:var(--red); color:#fff; font-weight:800; text-decoration:none; }
footer a { color:var(--text); }
.kiosk-link { margin-left:12px; vertical-align:middle; font:600 13px Inter, sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); text-decoration:none;
  border:1px solid var(--line); border-radius:999px; padding:5px 12px; }
.kiosk-link:hover, .kiosk-link:focus-visible { color:var(--text); border-color:var(--red); }
.kicker a { position:relative; z-index:2; color:inherit; text-decoration:none; } .kicker a:hover, .kicker a:focus-visible { text-decoration:underline; } /* above the room name, whose tall type overlaps it */
.stats-note { max-width:940px; margin:8px auto 0; font-size:12px; color:var(--muted); text-align:center; }
