:root{--accent:#0077cc;--muted:#666}
body{font-family:Inter,Arial,Helvetica,sans-serif;margin:0;padding:0;color:#222;line-height:1.65;background:#fff}
.header{background:linear-gradient(90deg,rgba(0,119,204,0.06),transparent);padding:18px 0;border-bottom:1px solid #eee}
.container{max-width:1100px;margin:0 auto;padding:20px}
nav.main{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
nav.main a{color:var(--accent);text-decoration:none;font-weight:600}
.breadcrumb{font-size:0.95rem;margin:12px 0}
.breadcrumb a{color:var(--muted);text-decoration:none;margin-right:8px}
h1{font-size:1.6rem;margin:6px 0}
.lead{font-size:1.05rem;color:#333}
.card{background:#fff;border:1px solid #f0f0f0;padding:14px;border-radius:8px;margin:12px 0;box-shadow:0 1px 2px rgba(0,0,0,0.03)}
footer{padding:18px 0;border-top:1px solid #eee;margin-top:28px;color:#666;font-size:0.95rem}
img.responsive{max-width:100%;height:auto;border-radius:6px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:12px}
details{margin:8px 0;padding:8px;border-radius:6px;background:#fafafa}
@media (max-width:600px){nav.main{font-size:0.95rem}}