/* Shared editorial navigation: compact masthead, full-screen workspace directory. */
html[data-editorial-navigation] body #nav-rail { display: none !important; }
html[data-editorial-navigation] .cn-header {
  position: relative !important; z-index: 60 !important;
  background: #111619 !important; color: #edf1f7 !important;
}
html[data-editorial-navigation] .cn-header-inner {
  box-sizing: border-box !important; display: flex !important;
  align-items: center !important; justify-content: space-between !important;
  width: min(1480px, calc(100% - 64px)) !important;
  height: 76px !important; min-height: 0 !important; margin: 0 auto !important;
  padding: 0 !important; gap: 24px !important; border: 0 !important;
}
html[data-editorial-navigation] .cn-header :is(.site-brand, .mr-brand) {
  display: flex !important; align-items: center !important; gap: 16px !important;
  color: inherit !important; text-decoration: none !important;
  font: 400 31px/1 'League Gothic', sans-serif !important; letter-spacing: 0 !important;
}
html[data-editorial-navigation] .cn-header :is(.site-brand, .mr-brand) span {
  max-width: 95px !important; padding-left: 16px !important;
  border-left: 1px solid #62717a !important; color: inherit !important;
  font: 400 10px/1.4 Roboto, Arial, sans-serif !important;
  text-transform: uppercase !important;
}
html[data-editorial-navigation] .cn-header-actions {
  display: flex !important; align-items: center !important; gap: 14px !important;
}
html[data-editorial-navigation] .cn-header .cn-shortcut {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  min-height: 36px !important; padding: 0 15px !important;
  border-radius: 5px !important; background: #b7d5fa !important; color: #15222e !important;
  font: 500 13px/1 Roboto, Arial, sans-serif !important; text-decoration: none !important;
  transition: background 160ms ease;
}
html[data-editorial-navigation] .cn-header .cn-shortcut:hover { background: #d0e3fc !important; }
html[data-editorial-navigation] .cn-header #nav-toggle,
#site-navigation .cn-close {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  gap: 12px !important; flex: 0 0 auto !important;
  box-sizing: border-box !important; width: auto !important; min-width: 92px !important;
  height: 40px !important; min-height: 40px !important; padding: 0 15px !important;
  border: 1px solid currentColor !important; border-radius: 30px !important;
  background: transparent !important; color: inherit !important; box-shadow: none !important;
  font: 400 13px/1 Roboto, Arial, sans-serif !important; cursor: pointer !important;
}
html[data-editorial-navigation] .cn-header #nav-toggle span { display: inline !important; font: inherit !important; color: inherit !important; }
html[data-editorial-navigation] .cn-header #nav-toggle svg { width: 18px !important; height: 18px !important; stroke: currentColor !important; fill: none !important; stroke-width: 1.5 !important; }
html[data-editorial-navigation] .cn-header #theme-toggle,
#site-navigation .cn-theme {
  display: grid !important; place-items: center !important; flex: 0 0 40px !important;
  width: 40px !important; height: 40px !important; padding: 0 !important;
  border: 0 !important; border-radius: 50% !important;
  background: transparent !important; color: inherit !important; box-shadow: none !important; cursor: pointer !important;
}
html[data-editorial-navigation] .cn-header #theme-toggle svg { width: 21px !important; height: 21px !important; }
html[data-editorial-navigation] .cn-header :is(#theme-toggle, #nav-toggle):hover { background: #ffffff0d !important; }
html[data-editorial-navigation] .cn-header :is(a, button):focus-visible { outline: 2px solid #b7d5fa !important; outline-offset: 4px; }

html.cn-menu-open, html.cn-menu-open body { overflow: hidden !important; overscroll-behavior: none; }
#site-navigation {
  --cn-bg: #eee6d8; --cn-ink: #192833; --cn-muted: #50616a; --cn-rule: #c9c5bb;
  --cn-accent: #315b80; --cn-hover: #ffffff55;
  box-sizing: border-box; position: fixed; inset: 0;
  width: 100%; max-width: none; height: 100%; height: 100dvh; max-height: none;
  margin: 0; padding: 0; border: 0; border-radius: 0;
  overflow: hidden; overscroll-behavior: contain;
  background: transparent; color: var(--cn-ink);
  font: 400 15px/1.5 Roboto, Arial, sans-serif;
  text-align: left; letter-spacing: 0; box-shadow: none;
  -webkit-font-smoothing: antialiased;
}
html[data-theme='dark'] #site-navigation {
  --cn-bg: #142029; --cn-ink: #b8d6fb; --cn-muted: #c1cdd5;
  --cn-rule: #354550; --cn-accent: #eee4d2; --cn-hover: #ffffff07;
}
#site-navigation:not([open]) { display: none; }
#site-navigation::backdrop { background: transparent; }
/* Safari's floating browser controls sit outside the fixed dialog viewport.
   Paint that area with the native backdrop, using the same reveal clock. */
@media (max-width: 800px), (hover: none) and (pointer: coarse) {
  #site-navigation::backdrop { background-color: rgb(238 230 216 / var(--cn-reveal-opacity, 0)); }
  html[data-theme='dark'] #site-navigation::backdrop { background-color: rgb(20 32 41 / var(--cn-reveal-opacity, 0)); }
}
#site-navigation .cn-scrim { position: absolute; inset: 0; background: #000; opacity: 0; pointer-events: none; }
#site-navigation .cn-surface {
  position: absolute; inset: 0; overflow: auto; overscroll-behavior: contain;
  background: var(--cn-bg); clip-path: circle(0% at 100% 0%);
}
#site-navigation[open] .cn-scrim { will-change: opacity; }
#site-navigation.cn-closing { pointer-events: none; }
#site-navigation * { box-sizing: border-box; }
#site-navigation :is(a, button) { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
#site-navigation a { color: inherit; text-decoration: none; }
#site-navigation button { font: inherit; color: inherit; cursor: pointer; text-transform: none; letter-spacing: 0; box-shadow: none; }
#site-navigation :is(a, button):focus-visible { outline: 2px solid var(--cn-accent); outline-offset: 4px; }
#site-navigation svg { display: inline-block; flex: 0 0 auto; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#site-navigation .cn-sheet {
  display: flex; flex-direction: column;
  width: min(1480px, calc(100% - 64px)); min-height: 100%; margin: 0 auto;
}
#site-navigation .cn-top { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; flex: 0 0 76px; gap: 24px; background: var(--cn-bg); }
#site-navigation .cn-top::before { content: ''; position: absolute; z-index: -1; inset: 0 -32px; background: var(--cn-bg); }
#site-navigation .cn-brand { display: inline-flex; align-items: center; gap: 16px; font: 400 31px/1 'League Gothic', sans-serif; }
#site-navigation .cn-brand span { border-left: 1px solid var(--cn-rule); padding-left: 16px; font: 400 10px/1.4 Roboto, Arial, sans-serif; text-transform: uppercase; }
#site-navigation .cn-top-actions { display: flex; align-items: center; gap: 14px; }
#site-navigation .cn-theme .theme-sun,
html[data-theme='dark'] #site-navigation .cn-theme .theme-moon { display: none; }
html[data-theme='dark'] #site-navigation .cn-theme .theme-sun { display: block; }
#site-navigation :is(.cn-close, .cn-theme):hover { background: var(--cn-hover) !important; }
#site-navigation .cn-close svg { width: 18px; height: 18px; }
#site-navigation .cn-body { flex: 1 0 auto; display: grid; grid-template-columns: 1.12fr 1fr; align-content: center; gap: clamp(40px, 6vw, 100px); padding: clamp(36px, 6vh, 80px) 0; }
#site-navigation .cn-main { align-self: start; min-width: 0; }
#site-navigation :is(.cn-category-toggle, .cn-home) {
  display: flex; align-items: center; width: 100%; min-width: 0;
  min-height: 64px; margin: 0; padding: 7px 0;
  border: 0; border-radius: 0; text-align: left; background: none;
  gap: 20px; color: var(--cn-ink);
}
#site-navigation .cn-index { flex: 0 0 24px; align-self: center; font: 400 11px/1 Roboto, Arial, sans-serif; color: var(--cn-muted); }
#site-navigation .cn-title { font: 400 clamp(42px, 5.4vw, 80px)/1.02 'League Gothic', sans-serif; text-transform: uppercase; letter-spacing: -.01em; }
#site-navigation :is(.cn-category-toggle, .cn-home) .cn-title { color: var(--cn-ink); transition: transform 220ms ease; }
#site-navigation .cn-category-toggle[aria-expanded='true'] .cn-title { color: var(--cn-accent); }
#site-navigation :is(.cn-category-toggle, .cn-home):hover .cn-title { transform: translateX(5px); }
#site-navigation .cn-home > svg { width: 25px; height: 25px; margin-left: auto; }
#site-navigation .cn-plus { position: relative; width: 18px; height: 18px; margin-left: auto; flex: 0 0 18px; color: var(--cn-muted); }
#site-navigation .cn-plus::before, #site-navigation .cn-plus::after { content: ''; position: absolute; left: 1px; top: 8px; width: 16px; height: 1px; background: currentColor; }
#site-navigation .cn-plus::after { transform: rotate(90deg); transition: transform 200ms; }
#site-navigation [aria-expanded='true'] .cn-plus::after { transform: rotate(0); }
#site-navigation .cn-details { padding-top: 12px; min-width: 0; }
#site-navigation #cn-workspaces { border-top: 1px solid var(--cn-rule); padding: 24px 0 0; }
#site-navigation #cn-workspaces[hidden] { display: none; }
#site-navigation .cn-eyebrow { margin: 0 0 22px; color: var(--cn-muted); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
#site-navigation h2 { margin: 0 0 14px; font: 400 27px/1.2 Roboto, Arial, sans-serif; letter-spacing: -.02em; text-transform: none; color: var(--cn-ink); }
#site-navigation h2 a { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
#site-navigation h2 a svg { width: 27px; height: 27px; }
#site-navigation .cn-description { max-width: 390px; margin: 0; font: 400 14px/1.6 Roboto, Arial, sans-serif; color: var(--cn-muted); }
#site-navigation .cn-link-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 22px; margin-top: 36px; }
#site-navigation .cn-link-group h3 { margin: 0 0 7px; font: 500 11px/1.5 Roboto, Arial, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--cn-muted); }
#site-navigation .cn-link-group a { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 7px 0; font: 400 14px/1.4 Roboto, Arial, sans-serif; }
#site-navigation .cn-link-group a svg { width: 13px; height: 13px; margin-left: auto; opacity: 0; transform: translate(-3px, 3px); transition: opacity 160ms, transform 160ms; }
#site-navigation .cn-link-group a:hover { color: var(--cn-accent); }
#site-navigation .cn-link-group a:is(:hover, :focus-visible) svg { opacity: 1; transform: none; }
#site-navigation a[aria-current='page'] { text-decoration: underline; text-underline-offset: 5px; }
#site-navigation .cn-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding: 24px 0 28px; border-top: 1px solid var(--cn-rule); font-size: 12px; color: var(--cn-muted); }
#site-navigation .cn-footer a { display: flex; align-items: center; gap: 14px; color: var(--cn-ink); }
#site-navigation .cn-footer svg { width: 17px; height: 17px; }
#site-navigation :is(.cn-close, .cn-theme):active { transform: scale(.97); }
@media (max-width: 1050px) and (min-width: 801px) {
  #site-navigation .cn-body { gap: 36px; grid-template-columns: 1fr 1fr; }
  #site-navigation .cn-title { font-size: 49px; }
  #site-navigation :is(.cn-category-toggle, .cn-home) { gap: 12px; }
}
@media (max-width: 800px) {
  html[data-editorial-navigation] .cn-header-inner { width: calc(100% - 36px) !important; height: 68px !important; gap: 12px !important; }
  html[data-editorial-navigation] .cn-header :is(.site-brand, .mr-brand) { font-size: 29px !important; }
  html[data-editorial-navigation] .cn-header :is(.site-brand, .mr-brand) span { display: none !important; }
  html[data-editorial-navigation] .cn-header-actions { gap: 6px !important; }
  html[data-editorial-navigation] .cn-header .cn-shortcut { display: none !important; }
  html[data-editorial-navigation] .cn-header #nav-toggle, #site-navigation .cn-close { min-width: 92px !important; height: 44px !important; }
  html[data-editorial-navigation] .cn-header #theme-toggle, #site-navigation .cn-theme { height: 44px !important; width: 44px !important; flex-basis: 44px !important; }
  #site-navigation .cn-sheet { width: calc(100% - 36px); }
  #site-navigation .cn-top { flex-basis: 68px; gap: 12px; }
  #site-navigation .cn-top::before { inset-inline: -18px; }
  #site-navigation .cn-brand { font-size: 29px; }
  #site-navigation .cn-brand span { display: none; }
  #site-navigation .cn-top-actions { gap: 6px; }
  #site-navigation .cn-body { display: block; align-content: start; padding: 38px 0; }
  #site-navigation .cn-title { font-size: clamp(34px, 9.8vw, 60px); line-height: 1.08; }
  #site-navigation :is(.cn-category-toggle, .cn-home) { min-height: 65px; padding: 12px 0; gap: 12px; }
  #site-navigation .cn-index { flex-basis: 19px; font-size: 10px; }
  #site-navigation .cn-category { border-top: 1px solid var(--cn-rule); }
  #site-navigation .cn-details { display: none; }
  #site-navigation #cn-workspaces { margin: 0 0 20px 31px; border: 0; padding: 10px 0 12px; }
  #site-navigation .cn-eyebrow { display: none; }
  #site-navigation h2 { font-size: 20px; margin-bottom: 12px; }
  #site-navigation .cn-description { font-size: 13px; }
  #site-navigation .cn-link-groups { grid-template-columns: 1fr; gap: 20px; margin-top: 26px; }
  #site-navigation .cn-link-group a { min-height: 44px; font-size: 15px; }
  #site-navigation .cn-link-group a svg { opacity: .7; transform: none; }
  #site-navigation .cn-footer { padding-bottom: max(24px, env(safe-area-inset-bottom)); font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  #site-navigation, #site-navigation * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}