/* Shared navigation: opaque fallback, restrained glass and measured anchor offsets. */
:root{--header-height:78px}
.header.hub-header{position:sticky;top:0;z-index:80;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:24px;height:auto;min-height:78px;padding:12px max(24px,calc((100% - 1240px)/2));background:#151413;border-bottom:1px solid #ffffff12;box-shadow:0 3px 16px #0d10170a}
@supports ((backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px))){.header.hub-header{background:rgb(20 19 18 / 94%);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}}
.hub-header .brand{margin:0;font-size:22px}
.header-menu{display:contents}
.header-menu-toggle{display:none}
.header.hub-header nav{order:0;width:auto;height:auto;margin:0;padding:0;display:flex;justify-content:center;flex-wrap:wrap;gap:2px 22px;min-width:0}
.header.hub-header nav a:nth-child(n){display:flex;min-height:44px;color:#d6d9df;font-size:14px;white-space:nowrap;transition:color .18s}
.header.hub-header nav a:hover,.header.hub-header nav a[aria-current=page]{color:#7ba7ff}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0}
.hub-header .language-control{margin:0;gap:6px;flex:0 1 auto;min-width:0}
.hub-header .language-caption{display:none}
.hub-header .language-control select{width:132px;min-height:44px;border-color:#ffffff20;background:#ffffff06;border-radius:9px;font-size:14px;padding:8px;transition:border-color .18s,background .18s}
.hub-header .language-control select:hover{border-color:#7ba7ff70;background:#ffffff0b}
.header-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;max-width:100%;padding:10px 16px;border:1px solid #4e89ff;border-radius:10px;background:#3276ff;color:#091121;font-size:14px;font-weight:650;line-height:1.4;text-align:center;transition:background .18s,border-color .18s}
.header-cta span{min-width:0;overflow-wrap:anywhere}
.header-cta svg{width:17px;height:17px;flex:none}
.header-cta:hover{background:#508aff;border-color:#7da8ff;color:#091121}
[dir=rtl] .header-cta svg{transform:scaleX(-1)}
.hub-header :focus-visible{outline:3px solid #8ab1ff;outline-offset:3px}
/* Keep hash targets and keyboard-focused controls below the sticky navigation. */
html{scroll-padding-top:calc(var(--header-height) + 16px)}
#all-tools,#featured-tools,#tool-search{scroll-margin-top:16px}
.skip-link{z-index:100}
@media(min-width:851px){.sidebar{top:var(--header-height);height:calc(100dvh - var(--header-height));min-height:0;max-height:calc(100dvh - var(--header-height));overflow-y:auto}}
@media(max-width:1150px){
  :root{--header-height:130px}
  .header.hub-header{grid-template-columns:auto minmax(0,1fr);gap:2px 20px}
  .header.hub-header nav{grid-column:1/-1;grid-row:2;gap:2px 26px}
  .header-actions{flex-wrap:wrap}
}
@media(max-width:640px){
  :root{--header-height:154px}
  .header.hub-header{padding:10px 16px 5px;gap:4px 14px}
  .hub-header .brand{font-size:18px;gap:7px}
  .header-actions{gap:4px 8px}
  .hub-header .language-control select{width:120px;font-size:16px}
  .hub-header .language-control svg{display:none}
  .header-cta{padding:9px 12px;font-size:13px}
  .header.hub-header nav{justify-content:flex-start;flex-wrap:nowrap;gap:18px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#485163 transparent}
  .header.hub-header nav a:nth-child(n){flex:none;font-size:13px}
}
@media(max-width:360px){.hub-header .brand{font-size:16px}.header.hub-header{column-gap:8px;padding-inline:12px}.header-cta{padding-inline:9px}}
@media(prefers-reduced-transparency:reduce){.header.hub-header{background:#151413;-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(forced-colors:active){.header.hub-header{background:Canvas;border-bottom:1px solid CanvasText;backdrop-filter:none}.header.hub-header nav a:nth-child(n){color:LinkText}.header-cta{border-color:ButtonText}}
@media print{.header.hub-header{position:static;backdrop-filter:none;box-shadow:none}.header-actions{display:none}}

/* Compact mobile navigation; the open panel scrolls independently in landscape. */
@media(max-width:760px){
  :root{--header-height:68px}
  .header.hub-header{grid-template-columns:minmax(0,1fr) auto;gap:0 12px;min-height:68px;padding:10px 16px}
  .hub-header .brand{font-size:20px;gap:9px;justify-self:start}
  .hub-header .brand-mark{width:34px;height:36px}
  .header.hub-header nav{grid-row:auto;flex-direction:column;align-items:stretch;gap:2px;overflow:visible}
  .header.hub-header nav a:nth-child(n){min-height:46px;padding:10px 12px;border-radius:8px;font-size:15px;white-space:normal;overflow-wrap:anywhere}
  .header.hub-header nav a:hover{background:#ffffff07}
  .header-menu{display:block;grid-column:1/-1;padding-top:12px;min-width:0}
  .header-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding:16px 12px 4px;margin-top:10px;border-top:1px solid #ffffff16}
  .hub-header .language-control{display:flex;width:100%;gap:10px}
  .hub-header .language-control svg{display:block}
  .hub-header .language-control select{width:100%;min-width:0;min-height:46px;font-size:16px}
  .header-cta{width:100%;min-height:48px;font-size:15px}
  .hub-header[data-menu-ready] .header-menu-toggle{display:grid;place-items:center;width:46px;height:46px;padding:11px;border:1px solid #ffffff24;border-radius:10px;background:#ffffff06;color:#fff;grid-column:2;grid-row:1;cursor:pointer}
  .header-menu-toggle svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;fill:none}
  .header-menu-toggle .menu-close,.header-menu-toggle[aria-expanded=true] .menu-bars{display:none}
  .header-menu-toggle[aria-expanded=true] .menu-close{display:block}
  .header-menu-toggle:hover{background:#ffffff0d;border-color:#7ba7ff70}
  .hub-header[data-menu-ready] .header-menu{position:absolute;inset-inline:12px;top:calc(100% + 6px);padding:10px 8px 12px;max-height:calc(100vh - var(--header-height) - 22px);max-height:calc(100dvh - var(--header-height) - 22px);overflow-y:auto;overscroll-behavior:contain;background:#1b1917;border:1px solid #323845;border-radius:14px;box-shadow:0 18px 35px #0e152433}
}
@media(max-width:360px){.header.hub-header{padding-inline:12px}.hub-header .brand{font-size:19px}}
@media print{.header-menu-toggle{display:none!important}.header-menu{position:static!important}}