
:root{
  --bg:#0b0b0b; --fg:#eaeaea; --mut:#9aa0a6; --link:#8ab4f8; --card:#121212; --accent:#3b82f6;
}
@media (prefers-color-scheme: light){
  :root{ --bg:#ffffff; --fg:#111111; --mut:#6b7280; --link:#1d4ed8; --card:#f7f7f7; --accent:#2563eb; }
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.65 system-ui,-apple-system,Segoe UI,Roboto,Inter,"Noto Sans",sans-serif}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:900px;margin:0 auto;padding:28px}
header{display:flex;gap:20px;align-items:center;margin:32px 0 20px 0}
img.avatar{width:112px;height:112px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,0.1)}
h1{font-size:34px;line-height:1.1;margin:0}
.tag{color:var(--mut);font-size:15px;margin-top:6px}
.card{background:var(--card);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:18px;margin:14px 0}
h2{font-size:20px;margin:0 0 8px 0}
ul{margin:8px 0 0 20px;padding:0}
.footer{margin:40px 0;color:var(--mut);font-size:14px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:720px){ .row{grid-template-columns:1fr} header{flex-direction:column;align-items:flex-start} }
.badge{display:inline-block;background:rgba(59,130,246,0.12);color:var(--fg);border:1px solid rgba(59,130,246,0.35);border-radius:999px;padding:3px 10px;margin-right:6px;font-size:12px}
.contact a{margin-right:12px;white-space:nowrap}
hr.sep{border:none;border-top:1px solid rgba(255,255,255,0.08);margin:20px 0}
