/* Winners: /winners pages and the badges on app pages (functions/_winners.js). Tokens from ipip.css, so light and dark both work. */
:root{--gold:#c8961a;--silver:#9aa1ad;--bronze:#b8723f;--gold-bg:rgba(200,150,26,.13);--silver-bg:rgba(154,161,173,.15);--bronze-bg:rgba(184,114,63,.13)}
.win{display:grid;gap:14px}
.win .pagehead{margin-bottom:6px}
.win .back{justify-self:start;margin:0}
.win-months{margin:0}
.win-day{gap:10px;padding:18px}
.win-day header a{color:inherit;text-decoration:none}
.win-day header a:hover h2{text-decoration:underline}
.win-day h2{margin:0;font-family:var(--font-display);font-size:17px;font-weight:800;letter-spacing:-.01em}
.win-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.win-list li{display:grid;grid-template-columns:30px 44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 10px;border-radius:18px}
.win-list li.p1{background:var(--gold-bg)}
.win-list img{width:44px;height:44px;border-radius:11px;object-fit:cover;background:var(--chip)}
.win-medal{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;font-variant-numeric:tabular-nums}
.p1 .win-medal{background:var(--gold)}.p2 .win-medal{background:var(--silver)}.p3 .win-medal{background:var(--bronze)}
.win-n{min-width:0}
.win-n a{display:block;font-weight:700;color:var(--ink);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.win-n a:hover{text-decoration:underline}
.win-n small{display:block;font-size:12.5px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.win-list b{font-variant-numeric:tabular-nums;font-size:15px;white-space:nowrap}
.win-list b small{font-weight:500;color:var(--ink2);font-size:12px}
.win-share{padding:18px;gap:10px}
.win-share h2{margin:0;font-size:17px;font-weight:800}
.win-share p{margin:0}
.win-share img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--hair)}
.win-more{margin:4px 0 0}
/* Badges on the app page, under the name */
.win-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.win-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 13px 7px 9px;border-radius:99px;text-decoration:none;color:var(--ink);font-weight:700;font-size:13px;line-height:1.15}
.win-badge svg{width:20px;height:20px;flex:none}
.win-badge small{display:block;font-weight:500;font-size:11.5px;color:var(--ink2)}
.win-badge.p1{background:var(--gold-bg)}.win-badge.p1 svg{color:var(--gold)}
.win-badge.p2{background:var(--silver-bg)}.win-badge.p2 svg{color:var(--silver)}
.win-badge.p3{background:var(--bronze-bg)}.win-badge.p3 svg{color:var(--bronze)}
.win-badge:hover{filter:brightness(.97)}
@media (max-width:480px){
  .win-day{padding:14px}
  .win-list li{grid-template-columns:26px 40px minmax(0,1fr) auto;gap:10px;padding:8px}
  .win-list img{width:40px;height:40px}
  .win-medal{width:24px;height:24px;font-size:13px}
}