:root{--bg:#0b0d12;--ink:#e8ebf1;--muted:#8b94a3;--accent:#27e0c6;--panel:#161922;--line:#262b36}
@media (prefers-color-scheme:light){:root{--bg:#fff;--ink:#1a1d24;--muted:#5b6573;--accent:#0a9c8a;--panel:#f6f8fa;--line:#e6e9ef}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
#app{max-width:720px;margin:0 auto;padding:0 20px}
#hero{min-height:62vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px}
.wordmark{font-size:2.6rem;font-weight:700;margin:0;letter-spacing:-.02em}
.wordmark .dot{color:var(--accent)}
.tagline{color:var(--muted);margin:0}
#ask-form{display:flex;gap:8px;width:100%;max-width:560px}
#ask-input{flex:1;padding:14px 18px;border-radius:28px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font-size:1rem;outline:none}
#ask-input:focus{border-color:var(--accent)}
#ask-btn{padding:0 22px;border-radius:28px;border:none;background:var(--accent);color:#04231f;font-weight:650;cursor:pointer}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.chip{background:var(--panel);border:1px solid var(--line);color:var(--muted);border-radius:20px;padding:7px 14px;font-size:.85rem;cursor:pointer}
.chip:hover{color:var(--ink);border-color:var(--accent)}
#dialogue{margin:8px 0 16px}
.bubble{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:8px 0}
.bubble.you{border-color:var(--accent)}
#results{display:grid;gap:12px;padding-bottom:120px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.card header{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.card-name{font-weight:650}
.card-cell{color:var(--accent);font-size:.8rem;font-family:ui-monospace,monospace}
.card-what{margin:.5em 0 .2em}
.card-how{color:var(--muted);font-size:.9rem;margin:0}
.hidden{display:none}
body.searching #hero{min-height:auto;padding:24px 0 8px}
body.searching .tagline,body.searching .chips{display:none}