/* claes.syv.ai: shared top bar on every page (injected by the site shell). */
:root { --claes-nav-h: 44px; }
html.claes-has-nav { padding-top: var(--claes-nav-h) !important; box-sizing: border-box; scroll-padding-top: var(--claes-nav-h); }
.claes-nav, .claes-nav * { box-sizing: border-box; margin: 0; }
.claes-nav {
  position: fixed; inset: 0 0 auto 0; height: var(--claes-nav-h); z-index: 2147483000;
  display: flex; align-items: center; gap: 14px; padding: 0 18px;
  background: rgba(20, 20, 19, 0.86); -webkit-backdrop-filter: saturate(140%) blur(14px); backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  font: 500 13px/1 -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, "Helvetica Neue", Arial, sans-serif;
  color: #c3c2b7; letter-spacing: 0; text-align: left;
}
.claes-nav a { color: inherit; text-decoration: none; }
.claes-nav .cn-home { display: inline-flex; align-items: center; gap: 9px; color: #fff; white-space: nowrap; }
.claes-nav .cn-home img { height: 22px; width: auto; display: block; }
.claes-nav .cn-brand { font-weight: 700; font-size: 14px; letter-spacing: -0.01em; }
.claes-nav .cn-sep { color: #5f5e59; }
.claes-nav .cn-claes { color: #c3c2b7; }
.claes-nav .cn-back {
  display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; border-radius: 999px;
  color: #fff; background: rgba(57, 135, 229, 0.16); border: 1px solid rgba(57, 135, 229, 0.45);
  transition: background .15s ease, border-color .15s ease; white-space: nowrap;
}
.claes-nav .cn-back:hover, .claes-nav .cn-back:focus-visible { background: rgba(57, 135, 229, 0.3); border-color: #3987e5; outline: none; }
.claes-nav .cn-links { margin-left: auto; display: flex; gap: 2px; }
.claes-nav .cn-links a { padding: 7px 10px; border-radius: 8px; color: #898781; transition: color .15s ease, background .15s ease; white-space: nowrap; }
.claes-nav .cn-links a:hover, .claes-nav .cn-links a:focus-visible { color: #fff; background: rgba(255, 255, 255, 0.06); outline: none; }
.claes-nav .cn-links a[aria-current="page"] { color: #fff; background: rgba(255, 255, 255, 0.08); }
@media (max-width: 760px) {
  .claes-nav { gap: 10px; padding: 0 12px; }
  .claes-nav .cn-links, .claes-nav .cn-claes, .claes-nav .cn-sep { display: none; }
  .claes-nav .cn-back { margin-left: 0; }
  .claes-nav { width: 100vw; max-width: 100vw; }
}
@media print { .claes-nav { display: none; } html.claes-has-nav { padding-top: 0 !important; } }