*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
  background: #000;
  color: #f5f5f7;
  line-height: 1.6;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
.page { max-width: 720px; margin: 0 auto; padding: 40px 20px 60px; }
.crumbs { font-size: 14px; margin-bottom: 20px; }
.crumbs a, .footer a, .more a { color: #0a84ff; text-decoration: none; }
.crumbs a:hover, .footer a:hover, .more a:hover { text-decoration: underline; }
h1 { font-size: 32px; font-weight: 700; letter-spacing: -0.5px; margin-bottom: 12px; }
h2 { font-size: 20px; font-weight: 650; margin: 28px 0 12px; }
.lede, .note { font-size: 17px; color: #d1d1d6; margin-bottom: 16px; }
.note { font-size: 15px; color: #8e8e93; }
ol, ul { padding-inline-start: 1.25rem; display: grid; gap: 12px; }
li { font-size: 16px; }
.guides { display: grid; gap: 12px; margin-top: 20px; }
.guide, .btn {
  display: block;
  background: #1c1c1e;
  border-radius: 14px;
  padding: 16px 18px;
  text-decoration: none;
  color: inherit;
}
.guide:hover, .btn:hover { background: #2c2c2e; }
.guide strong, .btn strong { display: block; font-size: 16px; font-weight: 600; margin-bottom: 4px; color: #f5f5f7; }
.guide span, .btn span { display: block; font-size: 13px; color: #8e8e93; }
.actions { display: grid; gap: 10px; margin-top: 12px; }
@media (min-width: 560px) {
  .actions { grid-template-columns: 1fr 1fr; }
}
.more { margin-top: 28px; display: grid; gap: 8px; }
.footer { text-align: center; margin-top: 48px; padding-top: 24px; border-top: 1px solid #1c1c1e; }
.footer .sep { color: #48484a; margin: 0 8px; }
.footer p { font-size: 13px; color: #48484a; margin-top: 12px; }