:root {
  color-scheme: dark;
  font-family: Geist, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  background: #292b2d;
  color: #e8e5df;
  --muted: #b3afa7;
  --border: #3b3d40;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid #7194dc; outline-offset: 5px; }
h1, h2, p { margin: 0; }
.icon { width: 16px; height: 16px; flex-shrink: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; transform: translateY(-160%); z-index: 10; background: #232527; padding: 10px; }
.skip-link:focus { transform: none; }
.navigation { max-width: 1240px; margin: auto; padding: 20px 28px; display: flex; align-items: center; justify-content: space-between; font-size: 12px; }
.github-link { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--border); padding: 8px 11px; border-radius: 7px; background: #2d2f31; transition: background .15s; }
.github-link:hover { background: #323437; }
.github-link .icon:last-child { width: 11px; height: 11px; color: var(--muted); }
.nav-links { display: flex; gap: 28px; color: var(--muted); }
.nav-links a:hover { color: #e8e5df; }
main { width: min(700px, calc(100% - 40px)); margin: auto; text-align: center; padding: 56px 0 64px; }
.hero { animation: arrive .5s ease both; }
.app-icon { display: block; margin: 0 auto 24px; object-fit: contain; }
h1 { font-size: 56px; font-weight: 650; line-height: 1.1; letter-spacing: -.045em; }
.subtitle { color: var(--muted); font-size: 18px; line-height: 1.5; margin: 14px auto 28px; }
.downloads { display: flex; gap: 12px; justify-content: center; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 44px; padding: 12px 18px; border: 1px solid var(--border); border-radius: 8px; font-size: 13px; font-weight: 600; transition: transform .15s, background .15s, border-color .15s; }
.button:hover { transform: translateY(-1px); }
.button:active { transform: scale(.98); }
.primary { background: #7194dc; border-color: #7194dc; color: #202736; }
.primary:hover { background: #7fa0e5; border-color: #7fa0e5; }
.secondary { background: #2d2f31; }
.secondary:hover { background: #323437; border-color: #525457; }
.release-meta { margin-top: 18px; display: flex; justify-content: center; gap: 10px; font: 10px/1.6 "Geist Mono", Consolas, monospace; color: var(--muted); }
.features { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-top: 48px; animation: arrive .5s .1s ease both; }
.feature { grid-column: span 2; padding: 22px 14px; border: 1px solid var(--border); background: #2d2f31; border-radius: 10px; }
.feature.platform { grid-column: span 3; padding-block: 20px; }
.feature h2 { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 12px; font-weight: 600; line-height: 1.5; }
.feature h2 .icon { color: var(--muted); width: 15px; height: 15px; }
.feature p { font-size: 11px; color: var(--muted); line-height: 1.6; margin: 8px auto 0; max-width: 185px; }
.platform p { max-width: none; }
.setup-link { display: inline-flex; align-items: center; gap: 7px; margin-top: 24px; padding: 8px; font-size: 12px; color: var(--muted); }
.setup-link .icon { width: 13px; height: 13px; }
.setup-link:hover { color: #e8e5df; }
footer { padding: 24px; text-align: center; color: var(--muted); font-size: 10px; line-height: 1.7; }
footer a { display: inline-block; margin-top: 6px; }
footer a:hover { text-decoration: underline; }
@keyframes arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) {
  .navigation { padding: 16px 20px; }
  .nav-links { gap: 20px; }
  main { padding-block: 40px; }
  h1 { font-size: 44px; }
  .app-icon { width: 80px; height: 80px; margin-bottom: 22px; }
  .subtitle { font-size: 16px; max-width: 290px; }
  .features { grid-template-columns: 1fr 1fr; margin-top: 36px; }
  .feature, .feature.platform { grid-column: auto; }
  .feature:first-child { grid-column: 1 / -1; }
  .feature:first-child p { max-width: none; }
  .feature { padding: 18px 12px; }
  .platform p { max-width: 155px; }
}
@media (max-width: 440px) {
  .downloads { flex-direction: column; max-width: 280px; margin: auto; gap: 10px; }
  .feature h2 { font-size: 11px; gap: 6px; }
  .feature p { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}