/* Contest page: hero with a live countdown, prize podium, my checklist, standings, rules, past weeks. */
.page-contest { grid-template-columns: minmax(0, 1fr); gap: 22px; }
.c-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: end; padding: 18px 4px 4px; }
.c-hero-text { display: grid; gap: 10px; max-width: 720px; }
.c-hero .kicker {
  justify-self: start; padding: 5px 12px; border-radius: 999px; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--gold); background: rgba(255, 201, 64, 0.1); box-shadow: 0 0 0 1px rgba(255, 201, 64, 0.35) inset;
}
.c-hero h1 { font-size: clamp(28px, 3.8vw, 50px); line-height: 1.04; font-weight: 800; letter-spacing: -0.03em; }
.c-hero .muted { font-size: var(--step-1); max-width: 56ch; }
.c-clock { display: grid; gap: 4px; min-width: 220px; padding: 18px 22px; text-align: center; justify-items: center; }
.c-count { font: 800 clamp(26px, 2.6vw, 36px)/1.1 var(--display); color: var(--gold); letter-spacing: -0.02em; text-shadow: 0 0 24px rgba(255, 201, 64, 0.35); }
.c-off { padding: 16px 20px; color: var(--mute); font-weight: 700; }

.c-prizes h2, .c-me h2, .c-table h2, .c-rules h2, .c-history h2 { font-size: 1.05rem; margin-bottom: 14px; }
.c-prize-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.c-prize {
  --hue: 262; display: grid; gap: 6px; padding: 18px; border-radius: var(--r-lg); position: relative; overflow: hidden; isolation: isolate;
  background: linear-gradient(160deg, hsl(var(--hue) 60% 22% / 0.95), rgba(22, 19, 49, 0.96) 70%);
  box-shadow: var(--shadow), 0 0 0 1px hsl(var(--hue) 80% 70% / 0.2) inset;
}
.c-prize::before { content: ""; position: absolute; z-index: -1; width: 200px; height: 200px; right: -70px; top: -90px; border-radius: 50%; background: radial-gradient(closest-side, hsl(var(--hue) 90% 62% / 0.4), transparent); }
.c-prize-1 { --hue: 42; }
.c-prize-2 { --hue: 215; }
.c-prize-3 { --hue: 20; }
.c-place { font-size: 0.75rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mute); }
.c-amount { font: 800 clamp(20px, 2vw, 28px)/1.1 var(--display); letter-spacing: -0.02em; color: var(--ink); }
.c-prize-1 .c-amount { color: var(--gold); }

.c-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.c-stat { display: grid; gap: 2px; padding: 12px 14px; border-radius: var(--r); background: var(--well); box-shadow: 0 0 0 1px var(--line) inset; }
.c-stat strong { font: 800 1.25rem/1.2 var(--display); color: var(--gold); }
.c-verdict { font-weight: 800; color: var(--mute); margin: 0 0 10px; }
.c-verdict.is-ok { color: var(--win); }
.c-checks { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.c-checks li { display: flex; gap: 10px; align-items: center; color: var(--mute); }
.c-checks li.is-ok { color: var(--ink); }
.c-mark { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 0.8rem; font-weight: 900; flex: none;
  background: rgba(255, 255, 255, 0.06); box-shadow: 0 0 0 1px var(--line-2) inset; }
.is-ok .c-mark { color: #04170d; background: var(--win); box-shadow: 0 0 14px -4px var(--win); }
.c-actions { display: flex; flex-wrap: wrap; gap: 10px; }

.c-standings tr.is-me td { background: rgba(255, 201, 64, 0.07); }
.c-prize-cell { font-weight: 800; color: var(--gold); }
.c-paid { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; font-size: 0.7rem; font-weight: 800; color: var(--mute); background: rgba(255, 255, 255, 0.06); }
.c-paid.is-paid { color: #04170d; background: var(--win); }

.c-rules ol { margin: 0; padding-left: 22px; display: grid; gap: 8px; color: var(--mute); }
.c-rules li::marker { color: var(--violet-2); font-weight: 800; }
.c-note { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }

.c-week-block { border-radius: var(--r); background: var(--well); box-shadow: 0 0 0 1px var(--line) inset; margin-bottom: 10px; }
.c-week-block summary { display: flex; justify-content: space-between; gap: 12px; padding: 12px 14px; cursor: pointer; font-weight: 800; list-style: none; }
.c-week-block summary::-webkit-details-marker { display: none; }
.c-week-block .table-wrap, .c-week-block .empty { padding: 0 8px 8px; }

@media (max-width: 760px) {
  .c-hero { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .c-clock { justify-items: start; text-align: left; }
  .c-stats { grid-template-columns: 1fr 1fr; }
}
