:root { color-scheme: light dark; --ink:#16150f; --paper:#f7f4ec; --muted:#6b665b; --rule:#ded7c8; --accent:#1a6b4c; }
@media (prefers-color-scheme: dark) { :root { --ink:#f2eee4; --paper:#1b1916; --muted:#9c9484; --rule:#322d24; --accent:#7fd9ae; } }
* { box-sizing: border-box; }
body { max-width: 36rem; margin: 0 auto; padding: 5rem 1.25rem 6rem; background: var(--paper); color: var(--ink);
  font: 17px/1.6 -apple-system, BlinkMacSystemFont, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
h1 { font-family: ui-rounded, "SF Pro Rounded", system-ui, sans-serif; font-weight: 800; letter-spacing: -.03em;
  font-size: clamp(2rem, 6vw, 2.75rem); line-height: 1.05; margin: 0 0 .3rem; }
.tagline { color: var(--muted); margin: 0 0 3rem; }
.app { display: grid; grid-template-columns: 64px 1fr; gap: 0 1.1rem; align-items: center;
  padding: 1.4rem 0; border-top: 1px solid var(--rule); text-decoration: none; }
.app:last-of-type { border-bottom: 1px solid var(--rule); }
.app img { width: 64px; height: 64px; border-radius: 14px; display: block; }
.app h2 { margin: 0; font-size: 1.1rem; font-family: ui-rounded, system-ui, sans-serif; letter-spacing: -.01em; }
.app p { margin: .2rem 0 0; color: var(--muted); font-size: .92rem; }
footer { margin-top: 3rem; color: var(--muted); font-size: .85rem; }
footer a { color: var(--accent); }

.soon { font-size: .7rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border: 1px solid var(--rule); border-radius: 100px; padding: .1rem .55rem; margin-left: .45rem; vertical-align: 2px; }