:root {
  --ink: #1b1422; --purple: #2a1840; --purple-2: #4b2a7a; --gold: #f2b632; --cream: #f4efe2; --green: #2fbf4a;
  --ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --serif: Georgia, "Times New Roman", serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--purple); color: var(--cream); font-family: var(--ui); }
body { min-height: 100vh; padding: calc(env(safe-area-inset-top, 0px) + 24px) 16px 32px; }
header { max-width: 1100px; margin: 0 auto 24px; }
h1 { margin: 0; font: italic 700 clamp(30px, 6vw, 48px)/1.1 var(--serif); color: var(--gold); }
h1 span { color: var(--cream); }
header p { margin: 6px 0 0; opacity: 0.85; }
main { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.card { background: var(--ink); border: 2px solid var(--purple-2); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.shot { display: block; aspect-ratio: 16 / 10; background: #000; overflow: hidden; }
.shot img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.body { padding: 14px 16px 18px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
h2 { margin: 0; font-size: 22px; }
.ver { font-size: 13px; font-weight: 700; color: var(--gold); letter-spacing: 0.05em; vertical-align: middle; }
.body p { margin: 0; line-height: 1.4; }
.needs { font-size: 13px; opacity: 0.75; }
.play { margin-top: auto; display: block; text-align: center; padding: 14px; border-radius: 12px; background: var(--gold);
  color: var(--purple); font-weight: 900; letter-spacing: 0.15em; text-decoration: none; }
.play:hover, .play:focus-visible { background: #ffd35c; }
.dl { display: block; text-align: center; padding: 10px; border-radius: 12px; border: 2px solid rgba(244, 239, 226, 0.4);
  color: var(--cream); text-decoration: none; font-size: 14px; font-weight: 700; }
footer { max-width: 1100px; margin: 28px auto 0; font-size: 12px; opacity: 0.6; line-height: 1.5; }
