:root{
  --bg:#ffffff; --ink:#111; --muted:#666; --brand:#1e88e5; --card:#f7f9fc; --border:#e7e9ef;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Noto Sans",sans-serif}
.wrap{max-width:900px;margin:0 auto;padding:16px}
.hf-header,.hf-footer{background:#fff;border-bottom:1px solid var(--border)}
.hf-footer{border-top:1px solid var(--border);border-bottom:0}
.hf-header .wrap,.hf-footer .wrap{display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:700;color:var(--brand);text-decoration:none}
nav a{color:var(--ink);text-decoration:none;margin-left:12px}
h1,h2{margin:.6em 0}
.search-box{position:relative;background:var(--card);border:1px solid var(--border);padding:12px;border-radius:10px}
.search-box input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px}
.search-box button{margin-top:8px;padding:10px 14px;border:0;border-radius:8px;background:var(--brand);color:#fff;cursor:pointer}
.hint{color:var(--muted);margin:.4em 0 0}
.suggest{position:absolute;top:86px;left:12px;right:12px;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,.06);display:none;max-height:280px;overflow:auto;z-index:20}
.suggest a{display:block;padding:10px 12px;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--border)}
.suggest a:hover{background:var(--card)}
.recent{list-style:none;padding:0;margin:0}
.recent li{padding:10px 0;border-bottom:1px solid var(--border)}
.recent a{color:var(--brand);text-decoration:none}
.qa{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px}
.answer{margin:10px 0}
.meta{color:var(--muted)}