/* Real topbar (same as the rest of the site) for pages still using the
   legacy /assets/style.css content styling. Scoped under .topbar so it
   doesn't collide with old style.css rules (notably .brand, which the
   old dark sidebar also defines). */
:root{--t-line:#e3e5e1;--t-shadow-sm:0 8px 26px rgba(20,25,38,.06)}
.topbar{position:sticky;top:0;z-index:100;background:rgba(245,246,243,.92);backdrop-filter:blur(22px) saturate(145%);border-bottom:1px solid rgba(227,229,225,.86)}
.topbar .shell{max-width:1440px;margin:0 auto;padding:0 24px}
.topbar .nav{height:74px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.topbar .brand{display:flex;align-items:center;gap:11px;font-weight:850;color:#0f1116;text-decoration:none;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.topbar .brand span{display:inline;font-size:16px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#0f1116;font-weight:850}
.topbar .mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#11141b 18%,#2756ff 135%);position:relative;box-shadow:0 10px 25px rgba(39,86,255,.2);flex:none}
.topbar .mark:before,.topbar .mark:after{content:"";position:absolute;width:4px;border-radius:99px;background:#fff}
.topbar .mark:before{height:20px;left:11px;top:8px;transform:rotate(-19deg)}
.topbar .mark:after{height:16px;right:10px;top:10px;transform:rotate(22deg)}
.topbar .navlinks{display:flex;gap:8px;padding:5px;border:1px solid var(--t-line);border-radius:14px;background:rgba(255,255,255,.72)}
.topbar .navlinks a{padding:10px 15px;border-radius:10px;font-size:13px;font-weight:760;color:#555b66;text-decoration:none}
.topbar .navlinks a.active{background:#11141b;color:#fff;box-shadow:0 8px 18px rgba(17,20,27,.14)}
.topbar .actions{display:flex;justify-content:flex-end;align-items:center;gap:10px}
.topbar .icon-btn,.topbar .avatar{border:1px solid var(--t-line);background:rgba(255,255,255,.84);box-shadow:var(--t-shadow-sm);text-decoration:none;color:#0f1116}
.topbar .icon-btn{width:42px;height:42px;border-radius:13px;display:grid;place-items:center}
.topbar .avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:850;background:linear-gradient(145deg,#eef2ff,#fff);color:#264bc1}
.topbar .mobile-btn{display:none;border:1px solid var(--t-line);background:rgba(255,255,255,.84);width:42px;height:42px;border-radius:13px;font-size:17px;cursor:pointer}
.topbar .tb-link{padding:10px 10px;font-size:13px;font-weight:650;color:#6f7480;text-decoration:none;white-space:nowrap}
.topbar .tb-link:hover{color:#0f1116}
.topbar .tb-primary{padding:10px 18px;border-radius:999px;font-size:13px;font-weight:760;color:#fff;background:#11141b;text-decoration:none;white-space:nowrap}
.mobile-menu{display:none;background:#fff;border-bottom:1px solid var(--t-line)}
.mobile-menu.open{display:block}
.mobile-menu a{display:block;padding:14px 22px;border-top:1px solid #eef0ed;font-weight:760;color:#0f1116;text-decoration:none}
@media(max-width:900px){.topbar .navlinks{display:none}.topbar .mobile-btn{display:grid;place-items:center}.topbar .nav{grid-template-columns:1fr auto}}
@media(max-width:560px){.topbar .tb-link{display:none}}