:root { --fg:#1a1a1a; --muted:#5b6470; --accent:#0b5fff; --bg:#fff; --card:#f6f8fa; --rule:#e3e6ea; }
@media (prefers-color-scheme: dark) {
  :root { --fg:#e8eaed; --muted:#9aa3ae; --accent:#6ea0ff; --bg:#111417; --card:#1a1e23; --rule:#2a2f36; }
}
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; }
main { max-width:860px; margin:0 auto; padding:3rem 16px 4rem; }
h1 { margin:0; font-size:2.2rem; }
.lead { margin:.4rem 0 2rem; color:var(--muted); }
.apps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:1rem; }
.apps a { display:flex; flex-direction:column; gap:.25rem; height:100%; padding:1rem 1.1rem; background:var(--card); border:1px solid var(--rule); border-radius:10px; color:inherit; text-decoration:none; }
.apps a:hover, .apps a:focus-visible { border-color:var(--accent); }
.app-title { font-weight:600; font-size:1.1rem; }
.app-host { color:var(--accent); font-size:.9rem; }
.app-desc { color:var(--muted); font-size:.95rem; }