/* Potholes W*F press kit (v0.9.37). The game's colours: night purple, Mardi Gras gold. */
:root { --bg: #14121b; --panel: #1f1b2b; --text: #ece8f2; --muted: #a9a2b8; --gold: #f0b030; --link: #7cc7ff; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
main { max-width: 56rem; margin: 0 auto; padding: 24px 16px 56px; }
a { color: var(--link); }
.head { display: flex; gap: 16px; align-items: center; margin-bottom: 8px; }
.icon { border-radius: 22px; flex: none; }
.kicker { margin: 0; color: var(--gold); text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.8rem; font-weight: 700; }
h1 { font-size: clamp(1.8rem, 6vw, 2.6rem); line-height: 1.05; margin: 0.1em 0 0.2em; }
.lede { margin: 0; color: var(--muted); }
h2 { font-size: 1.15rem; margin: 2em 0 0.6em; color: var(--gold); }
.meta { color: var(--muted); font-size: 0.9rem; }
.facts { display: grid; grid-template-columns: 9rem 1fr; gap: 10px 16px; margin: 0; padding: 16px; background: var(--panel); border-radius: 12px; }
.facts dt { font-weight: 700; color: var(--gold); }
.facts dd { margin: 0; }
.stores { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 6px; }
.store { display: inline-block; padding: 10px 18px; border-radius: 10px; background: var(--gold); color: #1a1420; font-weight: 800; text-decoration: none; }
.shots, .assets { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 14px; }
.shots li { width: calc(50% - 7px); max-width: 170px; }
.shots img { width: 100%; height: auto; border-radius: 10px; display: block; }
.shots span, .assets span { display: block; font-size: 0.85rem; color: var(--muted); margin-top: 4px; }
.assets li { background: var(--panel); border-radius: 12px; padding: 12px; }
.assets img { display: block; max-width: 100%; height: auto; border-radius: 8px; }
.assets li.wide { flex: 1 1 280px; }
@media (max-width: 560px) {
  .facts { grid-template-columns: 1fr; gap: 2px; }
  .facts dd { margin-bottom: 10px; }
  .head { align-items: flex-start; }
  .icon { width: 72px; height: 72px; }
}