:root {
  --bg: #fafafa;
  --card: #ffffff;
  --text: #14141a;
  --text-secondary: #68686f;
  --divider: #e4e4e8;
  --primary: #ff2d95;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #000000;
    --card: #141417;
    --text: #f5f5f7;
    --text-secondary: #9a9aa2;
    --divider: #222226;
    --primary: #ff2d95;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  line-height: 1.6;
}
.wrap {
  max-width: 720px;
  margin: 0 auto;
  padding: 48px 24px 96px;
}
header.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 40px;
}
header.brand .mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, #ff3da6, #e23f76, #ff7a5c);
}
header.brand span {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.3px;
}
h1 {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.5px;
  margin: 0 0 8px;
}
.updated {
  color: var(--text-secondary);
  font-size: 14px;
  margin-bottom: 32px;
}
h2 {
  font-size: 18px;
  font-weight: 700;
  margin: 32px 0 8px;
}
p, li { color: var(--text); font-size: 15px; }
p.muted, li.muted { color: var(--text-secondary); }
a { color: var(--primary); }
.card {
  background: var(--card);
  border: 1px solid var(--divider);
  border-radius: 16px;
  padding: 20px 24px;
}
.links {
  display: flex;
  gap: 16px;
  margin-top: 24px;
}
.placeholder {
  background: rgba(255, 45, 149, 0.12);
  border-radius: 4px;
  padding: 1px 6px;
}
