.category-navigation { position: relative; z-index: 10; border-bottom: 1px solid var(--line); background: var(--white); }
.category-navigation-shell { position: relative; display: flex; align-items: center; gap: 20px; padding-block: 12px; }
.category-navigation-title { flex: 0 0 110px; color: var(--ink); font-size: .87rem; font-weight: 800; line-height: 1.3; }
.category-navigation-title .eyebrow { margin-bottom: 5px; font-size: .625rem; }
.category-strip { display: flex; align-items: center; flex: 1; min-width: 0; gap: 6px; }
.category-navigation-roots { display: flex; flex-wrap: wrap; flex: 1; min-width: 0; gap: 4px; margin: 0; padding: 4px; list-style: none; }
.category-navigation-roots > li { flex: 1 0 13rem; min-width: 0; scroll-snap-align: start; }
.category-navigation.is-enhanced .category-navigation-roots { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: var(--slate) var(--cloud); overscroll-behavior-x: contain; scroll-snap-type: x proximity; scroll-padding-inline: 4px; }
.category-scroll { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px; height: 44px; color: var(--bridge-indigo); border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--white); cursor: pointer; }
.category-scroll[hidden] { display: none; }
.category-scroll:hover:not(:disabled) { background: var(--cloud); border-color: var(--bridge-indigo); }
.category-scroll:disabled { color: var(--slate); opacity: .4; cursor: default; }
.category-trigger { display: flex; align-items: center; gap: 10px; min-height: 72px; padding: 12px; color: var(--ink); border: 1px solid transparent; border-radius: var(--radius-sm); cursor: pointer; list-style: none; touch-action: manipulation; }
.category-trigger::-webkit-details-marker { display: none; }
.category-trigger > .bi:first-child { flex: 0 0 auto; color: var(--bridge-indigo); font-size: 1.2rem; }
.category-trigger > span { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: .78rem; font-weight: 750; line-height: 1.4; }
.category-trigger > .category-chevron { flex: 0 0 auto; color: var(--slate); font-size: .65rem; transition: transform .15s ease; }
.category-trigger:hover, .category-menu[open] > .category-trigger { color: var(--bridge-indigo); border-color: var(--line); background: var(--cloud); }
.category-menu[open] > .category-trigger { box-shadow: inset 0 -3px 0 var(--sea-green); }
.category-menu[open] > .category-trigger .category-chevron { transform: rotate(180deg); }
.category-trigger:focus-visible, .category-panel a:focus-visible, .category-panel-close:focus-visible { outline: 3px solid var(--bridge-indigo); outline-offset: 2px; }
.category-navigation-all { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; flex: 0 0 auto; padding: 8px 0 8px 8px; font-size: .78rem; font-weight: 750; }
.category-panel { position: absolute; top: 100%; left: 0; right: 0; overflow: hidden; color: var(--ink); border: 1px solid var(--line); border-top: 3px solid var(--sea-green); border-radius: 0 0 var(--radius-md) var(--radius-md); background: var(--white); box-shadow: var(--shadow-soft); }
.category-navigation.is-enhanced .category-panel { position: fixed; top: var(--category-panel-top); left: var(--category-panel-left); right: auto; width: var(--category-panel-width); margin: 0; z-index: 30; }
.category-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 24px; border-bottom: 1px solid var(--line); background: var(--cloud); }
.category-panel-all { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; font-size: .95rem; font-weight: 800; line-height: 1.5; overflow-wrap: anywhere; }
.category-panel-all .bi { flex: 0 0 auto; }
.category-panel-close { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 12px; color: var(--slate); border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--white); font: inherit; font-size: .8rem; cursor: pointer; }
.category-panel-close:hover { color: var(--bridge-indigo); border-color: var(--bridge-indigo); }
.category-panel-close[hidden] { display: none; }
.category-panel-body { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 28px 32px; max-height: min(60vh, 34rem); max-height: min(60dvh, 34rem); overflow-y: auto; padding: 20px 24px 28px; scrollbar-gutter: stable; }
.category-navigation.is-enhanced .category-panel-body { max-height: min(60vh, 34rem, var(--category-panel-height)); max-height: min(60dvh, 34rem, var(--category-panel-height)); }
.category-panel-group { min-width: 0; }
.category-panel-group a { display: flex; align-items: center; min-height: 36px; padding: 7px 8px; color: var(--slate); border-radius: 6px; font-size: .83rem; line-height: 1.5; overflow-wrap: anywhere; }
.category-panel-group > a { margin-bottom: 4px; color: var(--bridge-indigo); font-size: .87rem; font-weight: 800; }
.category-panel-group a:hover { color: var(--bridge-indigo); background: var(--cloud); text-decoration: underline; text-underline-offset: 3px; }
.category-panel-children { margin: 0; padding: 0; list-style: none; }
.category-panel-children .category-panel-children { margin-left: 12px; padding-left: 8px; border-left: 1px solid var(--line); }
.category-skip-link { position: absolute; left: 20px; top: 8px; z-index: 1; padding: 10px 16px; color: var(--white); border-radius: var(--radius-sm); background: var(--bridge-indigo); transform: translateY(-200%); }
.category-skip-link:focus { transform: none; }

@media (max-width: 1100px) {
  .category-navigation-shell { flex-wrap: wrap; gap: 8px 16px; }
  .category-navigation-title { flex: 1; }
  .category-navigation-title .eyebrow { display: none; }
  .category-strip { order: 3; flex-basis: 100%; }
  .category-trigger { min-height: 64px; }
  .category-panel-body { gap: 24px; }
}
@media (max-width: 767px), (max-height: 560px) {
  .category-navigation-shell { flex-wrap: wrap; gap: 8px 16px; padding-block: 12px; }
  .category-navigation-title { flex: 1; }
  .category-navigation-title .eyebrow { display: none; }
  .category-strip { order: 3; flex-basis: 100%; }
  .category-trigger { min-height: 48px; padding: 10px 12px; }
  .category-trigger > span { font-size: .85rem; }
  .category-panel { position: static; margin: 4px 0 12px; border-radius: var(--radius-sm); box-shadow: none; }
  .category-panel-header { gap: 8px; padding: 10px 12px; }
  .category-panel-all { font-size: .87rem; }
  .category-panel-body { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 55vh; max-height: 55dvh; gap: 20px; padding: 12px; }
  .category-panel-group a { min-height: 44px; }
}
@media (max-width: 479px) {
  .category-panel-body { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .category-trigger > .category-chevron { transition: none; }
}