.topbar{position:sticky;top:0;z-index:50;backdrop-filter: blur(10px);background: rgba(246,248,255,.75);border-bottom:1px solid rgba(226,232,240,.7);}
.topbar__inner{max-width:var(--container);margin:0 auto;padding:12px 16px;display:flex;align-items:center;gap:12px;justify-content:space-between;}
.brand{display:flex;align-items:center;gap:10px;font-weight:1000;letter-spacing:-.2px}
.brand__mark{width:34px;height:34px;border-radius:14px;display:grid;place-items:center;background: linear-gradient(135deg, rgba(91,124,255,1), rgba(34,197,94,1));color:#fff;box-shadow: 0 12px 24px rgba(91,124,255,.18);}
.nav{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.nav a{padding:9px 12px;border-radius:12px;border:1px solid transparent;color:var(--muted);font-weight:900}
.nav a[aria-current="page"]{color:var(--text);background:#fff;border-color:var(--border);box-shadow:0 8px 18px rgba(15,23,42,.06)}
.footer{margin-top:30px}
.footer__inner{border-top:1px solid rgba(226,232,240,.8);padding-top:18px;display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:13px}