/* The colours of the Rows MTG Library app, shared by every page. */
:root {
  --bg: #0a0804;
  --bg-center: #753d32;
  --raised: #211f29;
  --line: #2e2b37;
  --text: #f3f0e9;
  --muted: #a6a1b0;
  --accent: #e6b54a;
  color-scheme: dark;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background: radial-gradient(ellipse at 50% 0%, var(--bg-center) 0%, var(--bg) 60%) fixed var(--bg);
  color: var(--text);
  font: 17px/1.6 'Manrope', system-ui, sans-serif;
}

main { max-width: 720px; margin: 0 auto; padding: 64px 16px; display: flex; flex-direction: column; gap: 28px; }
h1, h2 { font-family: 'Fraunces', Georgia, serif; font-weight: 600; margin: 0; line-height: 1.2; }
h1 { font-size: 40px; }
h2 { font-size: 24px; }
p { margin: 0; }
a { color: var(--accent); }
.muted { color: var(--muted); }

.card {
  display: flex; gap: 16px; align-items: center;
  padding: 20px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--raised); color: var(--text); text-decoration: none;
}
.card:hover { border-color: var(--accent); }
.card img { width: 64px; height: 64px; border-radius: 14px; }
.card strong { display: block; font-size: 19px; }

ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
footer { color: var(--muted); font-size: 14px; }