:root{--brand:#0a66ff;--brand-ink:#0b3ea8;--accent:#12b981;--ink:#23262d;--muted:#6b7280;--bg:#f7f8fa;--card:#fff;--radius:12px;--shadow:0 8px 30px rgba(0,0,0,.06);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--container:1100px}
*{box-sizing:border-box}html,body{margin:0;padding:0}body{font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-4)}
.section{padding:var(--space-7) 0}.hstack{display:flex;align-items:center;gap:var(--space-3)}.stack>*+*{margin-top:var(--space-4)}
.site-header{background:#fff;position:sticky;top:0;z-index:10;border-bottom:1px solid #eceff3}.navbar{height:64px}
.brand{display:flex;align-items:center;gap:.75rem;font-weight:800;letter-spacing:.2px}.brand img{height:30px}.brand-name{color:var(--brand-ink)}
.banner{background:#fff7e6;border-bottom:1px solid #ffe0a3;color:#7a4d00;padding:.55rem .9rem;text-align:center;font-weight:600}
.hero{padding:var(--space-7) 0 var(--space-6);text-align:center;background:#fff}.hero h1{font-size:clamp(28px,4vw,40px);margin:.25rem 0}.lead{color:var(--muted);max-width:680px;margin:0 auto var(--space-5)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.7rem 1.1rem;font-weight:700;border-radius:10px;background:var(--brand);color:#fff;border:1px solid transparent;transition:.15s}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow);text-decoration:none}.btn.ghost{background:#fff;color:var(--brand);border-color:#cfe0ff}.btn.success{background:var(--accent)}
.grid{display:grid;gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.card{background:var(--card);border:1px solid #e8ecf2;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .15s;position:relative}
.card:hover{transform:translateY(-2px)}.card .media{aspect-ratio:16/10;width:100%;object-fit:cover;display:block}.card .body{padding:var(--space-4)}
.card h3{margin:0 0 var(--space-2);font-size:1.05rem}.card p{margin:0;color:var(--muted)}.ribbon{position:absolute;top:10px;left:10px;background:#0a66ff;color:#fff;padding:.28rem .5rem;border-radius:6px;font-size:.72rem;font-weight:700}
.site-footer{color:var(--muted);font-size:.9rem;padding:var(--space-6) 0}
.match-wrap{display:flex;justify-content:center}.match-card{background:#fff;border:1px solid #e8ecf2;border-radius:18px;box-shadow:var(--shadow);width:min(720px,92vw);overflow:hidden}
.match-card img{width:100%;aspect-ratio:16/10;object-fit:cover}.match-card .body{padding:var(--space-5)}
.actions{display:flex;gap:var(--space-4);justify-content:center;margin-top:var(--space-4)}
.pill{display:inline-block;padding:.35rem .6rem;background:#f1f5ff;color:#3556b9;border-radius:999px;font-size:.8rem;font-weight:700;margin-right:.4rem}
.keyline{border-top:1px solid #eef1f6;margin-top:var(--space-4);padding-top:var(--space-4)}
.chat{max-width:900px;margin:0 auto;padding:var(--space-6) var(--space-4)}
.chat-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}.chat-header img{height:54px;width:96px;object-fit:cover;border-radius:8px;border:1px solid #eef1f6}
.chat-title{font-weight:800;margin:0}.thread{background:#fff;border:1px solid #e8ecf2;border-radius:16px;padding:var(--space-4);box-shadow:var(--shadow);max-height:50vh;overflow:auto}
.msg{display:flex;gap:var(--space-3);margin-bottom:var(--space-3)}.msg .bubble{padding:.6rem .8rem;border-radius:12px;border:1px solid #e8ecf2;background:#fff;max-width:72%}
.msg.you{justify-content:flex-end}.msg.you .bubble{background:#eef6ff;border-color:#dce9ff}
.chat-input{display:flex;gap:.5rem;margin-top:var(--space-3)}.chat-input input{flex:1;padding:.7rem .9rem;border:1px solid #d6dbe3;border-radius:10px}
.form{background:#fff;border:1px solid #e8ecf2;border-radius:12px;padding:1rem 1.2rem;box-shadow:var(--shadow)}label{display:block;font-weight:700;margin-top:.75rem}
input,textarea{width:100%;padding:.6rem .75rem;border:1px solid #d6dbe3;border-radius:10px}.small{font-size:.9rem;color:var(--muted)}