:root{--bg: #0a0a0f;--bg-card: #12121a;--bg-hover: #1a1a2e;--text: #e8e8f0;--text-dim: #8888a0;--text-muted: #555568;--accent: #f0c040;--border: #2a2a3a;--radius: 12px;--radius-sm: 8px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans SC", sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:var(--font);background:radial-gradient(ellipse at 50% 0%,#12121a,#0a0a0f 70%);color:var(--text);line-height:1.5;min-height:100vh;display:flex;flex-direction:column}.page{flex:1;display:flex;flex-direction:column;max-width:540px;margin:0 auto;width:100%;padding:0 20px}.header{text-align:center;padding:48px 0 32px}.brand{display:flex;align-items:center;justify-content:center;gap:8px}.brand-icon{font-size:28px}.brand-name{font-size:26px;font-weight:800;letter-spacing:-.5px}.brand-tagline{font-size:14px;color:var(--text-dim);margin-top:6px;font-weight:400}.grid{flex:1;display:flex;flex-direction:column;gap:10px;padding-bottom:32px}.card{display:flex;align-items:center;gap:14px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:18px;cursor:pointer;transition:all .2s;text-align:left;width:100%;font-family:var(--font);color:var(--text)}.card:hover:not(:disabled){border-color:var(--accent);transform:translateY(-1px)}.card:disabled{opacity:.5;cursor:not-allowed;border-style:dashed}.card-icon{width:44px;height:44px;border-radius:var(--radius-sm);background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}.card-body{flex:1;min-width:0}.card-title{font-size:15px;font-weight:700;margin-bottom:3px;display:flex;align-items:center;gap:8px}.card-desc{font-size:13px;color:var(--text-dim);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-tags{display:flex;gap:5px;margin-top:6px;flex-wrap:wrap}.tag{font-size:11px;padding:1px 7px;border-radius:5px;background:var(--bg);color:var(--text-muted)}.card-arrow{font-size:16px;color:var(--text-muted);flex-shrink:0;font-weight:700}.card:hover:not(:disabled) .card-arrow{color:var(--accent);transform:translate(3px)}.footer{text-align:center;padding:20px;font-size:12px;color:var(--text-muted);border-top:1px solid var(--border)}.footer a{color:var(--text-dim);text-decoration:none}.footer a:hover{color:var(--accent)}.footer-sep{margin:0 8px}@media(max-width:480px){.header{padding:32px 0 24px}.brand-name{font-size:22px}.page{padding:0 16px}}
