/* compatibility specific styles (after base.css). */
.container{max-width:820px}
.picks{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:end}
.field{gap:6px}
.heart{font-size:26px;color:var(--gold);padding-bottom:8px;text-align:center}
button.primary.block{width:100%;margin-top:16px}
#result{margin-top:28px;display:none;flex-direction:column;gap:20px}
.score-wrap{text-align:center}
.pair{font-size:20px;font-weight:700;margin-bottom:14px}
.pair .g{color:var(--gold)}
.ring{position:relative;width:150px;height:150px;margin:0 auto}
.ring svg{transform:rotate(-90deg)}
.ring .num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:800}
.headline{font-size:17px;margin:14px 0 0;color:var(--lav);font-weight:600}
.cats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cat{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}
.cat h3{margin:0 0 6px;font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--gold)}
.cat p{margin:0;font-size:14px;color:var(--muted);line-height:1.5}
.disclaimer{text-align:center}
@media(max-width:620px){.picks{grid-template-columns:1fr;gap:10px}.heart{padding:6px 0}.cats{grid-template-columns:1fr}}