:root{--bg: #f8f8f6;--ink: #1a1a2e;--muted: #6b7280;--card-bg: #fff;--card-border: #e5e7eb;--radius: 12px}*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100vh;background:var(--bg);font-family:Inter,system-ui,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}#app{max-width:900px;margin:0 auto;padding:48px 24px 64px}.page-header{margin-bottom:40px}.page-header h1{font-size:24px;font-weight:500;letter-spacing:-.02em;margin-bottom:6px}.page-desc{font-size:14px;color:var(--muted);line-height:1.5}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius);padding:24px 20px 20px;display:flex;flex-direction:column;align-items:center;gap:12px}.card--empty{opacity:.5}.card-label{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);align-self:flex-start}.icon-wrapper{width:90px;height:90px;cursor:pointer;display:flex;align-items:center;justify-content:center}.icon-wrapper svg{width:100%;height:100%;overflow:visible}.icon-wrapper--placeholder{cursor:default}.card-desc{font-size:12px;color:var(--muted);text-align:center;line-height:1.5}.card-desc code{font-family:ui-monospace,monospace;font-size:11px;background:#f3f4f6;padding:1px 4px;border-radius:3px}@media(prefers-reduced-motion:reduce){.icon-wrapper svg *{transition:none!important}}