
:root{--bg-dark:#2b2d42;--bg-light:#edf2f4;--ink:#2b2d42;--muted:#66738f;--teal:#107f67;--green:#48bf84;}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial,sans-serif;color:var(--ink);background:var(--bg-light)}
a{color:var(--teal);text-decoration:none}a:hover{text-decoration:underline}
.layout{display:grid;grid-template-columns:320px 1fr;min-height:100vh}
@media(max-width:880px){.layout{grid-template-columns:1fr}.sidebar{position:static;height:auto}}
.sidebar{background:var(--bg-dark);color:var(--bg-light);padding:28px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:18px;border-right:1px solid rgba(0,0,0,0.06)}
.brand{display:flex;align-items:center;gap:14px}
.avatar{width:64px;height:64px;border-radius:999px;overflow:hidden;border:3px solid var(--teal);background:#1f2233;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800}
.avatar img{width:100%;height:100%;object-fit:cover;display:none}
h1{font-size:22px;margin:0}.tag{color:#d7dde1;font-size:14px}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;font-weight:700;border:1px solid transparent;color:#fff;background:var(--teal)}
.btn.secondary{background:var(--green);color:var(--ink)}.btn.ghost{background:transparent;border-color:#7b88a6;color:#e6ebee}
.btns{display:flex;flex-wrap:wrap;gap:8px}
.nav{margin-top:auto;font-size:14px;color:#cfd6da}.nav a{color:#cfd6da;display:block;padding:6px 0}
.main{padding:36px;max-width:1100px}.section{margin:0 0 26px 0}.section h2{font-size:18px;margin:0 0 10px 0;color:#17202a}
.card{background:#fff;border:1px solid #e7eaee;border-radius:14px;padding:14px;box-shadow:0 1px 0 rgba(0,0,0,0.02)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(max-width:880px){.grid-4{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.grid-2,.grid-4{grid-template-columns:1fr}}
.small{font-size:14px;color:#2b2d42}.muted{color:#66738f}.kicker{font-size:12px;color:#66738f;text-transform:uppercase;letter-spacing:.08em}
.callout{background:#f0fbf7;border:1px solid #bdeada;color:#0d5d4d;border-left:6px solid var(--teal);padding:12px;border-radius:10px}
.table{width:100%;border-collapse:collapse;font-size:14px}.table th,.table td{padding:8px 10px;border-bottom:1px solid #e7eaee;text-align:left}
.ok{color:#0a8f49;font-weight:700}.fail{color:#c93333;font-weight:700}
.footer{padding:20px 36px;color:#66738f;border-top:1px solid #e7eaee;font-size:12px}code.inline{background:#f4f6f8;border:1px solid #e7eaee;border-radius:6px;padding:2px 6px}
