/* Two desktop menus, one filtered catalog. All colors/radii come from Smmuzi's current theme. */
.header:has([data-catalog-panel]:not([hidden])) { z-index: 1100; }
.header-catalog { flex: 0 0 auto; }
.header-catalog button, .header-catalog-directions button { font: inherit; color: var(--site-text, #444); cursor: pointer; }
[data-catalog-panel][hidden], .header-catalog [hidden], .header-catalog-directions [hidden] { display: none !important; }
.header-catalog-toggle { position: relative; z-index: 1104; height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0 18px; border: 0; border-radius: 10px; background: var(--site-accent, #ffbe40); }
.header-catalog .header-catalog-toggle { color: var(--site-on-accent-soft, #333); }
.header-catalog-toggle > span { font-size: 22px; line-height: 1; }
.header-catalog-toggle__close, .header-catalog-toggle[aria-expanded="true"] .header-catalog-toggle__open { display: none; }
.header-catalog-toggle[aria-expanded="true"] .header-catalog-toggle__close { display: inline; }
.header-catalog-directions { position: relative; z-index: 1103; display: flex; gap: 8px; padding: 10px 0; }
.header-catalog-directions > button { border: 1px solid transparent; border-radius: 10px; background: transparent; padding: 9px 12px; }
.header-catalog-directions > button:hover, .header-catalog-directions > button[aria-expanded="true"] { background: var(--site-card, #fff); border-color: var(--site-border-soft, #ebe7e7); }
.header-catalog-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 22px; width: 22px; height: 22px; color: var(--site-mark, #fd5a3c); }
.header-catalog-icon img, .header-catalog-icon svg { width: 100%; height: 100%; object-fit: contain; }
.header-catalog-shade { position: fixed; inset: 0; z-index: 1100; background: transparent; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.header-catalog-panel { position: fixed; top: var(--catalog-top, 180px); left: var(--catalog-left, 24px); width: var(--catalog-width, calc(100vw - 48px)); z-index: 1103; max-height: calc(100dvh - var(--catalog-top, 180px) - 18px); overflow: auto; background: var(--site-card, #fff); color: var(--site-text, #444); border: 1px solid var(--site-border-soft, #ebe7e7); border-radius: 20px; box-shadow: 0 12px 32px var(--site-shadow, #0002); }
.header-catalog-heading { display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-bottom: 1px solid var(--site-border-soft, #ebe7e7); }
.header-catalog-heading h2 { flex: 1; margin: 0; font-size: 18px; color: var(--site-title, #222); }
.header-catalog-close, .header-catalog-back { border: 0; background: transparent; min-width: 36px; min-height: 36px; border-radius: 8px; color: var(--site-text-dim, #666); cursor: pointer; }
.header-catalog-close { font-size: 25px !important; }
.header-catalog-close, .header-catalog-back { display: inline-flex; align-items: center; justify-content: center; transition: background-color .15s, color .15s; }
.header-catalog-close:hover, .header-catalog-close:focus-visible, .header-catalog-back:hover { background: var(--site-surface, #f7f5f6); color: var(--site-title, #222); }
.header-catalog-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); }
.header-catalog-choice { padding: 12px; border-right: 1px solid var(--site-border-soft, #ebe7e7); }
.header-catalog-choice button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 38px; text-align: left; padding: 6px 10px; line-height: 1.2; border: 0; border-radius: 10px; background: transparent; font-size: 14px; }
.header-catalog-choice button > span:nth-child(2) { flex: 1; }
.header-catalog-all { display: block; padding: 14px 10px; color: inherit; font-size: 14px; text-decoration: underline; }
.header-catalog-content { min-width: 0; padding: 18px; }
.header-catalog-direction-title { margin: 0 0 18px; color: var(--site-title, #222); font-size: 20px; font-weight: 700; }
.header-catalog-direction-title small { margin-left: 8px; font-size: 12px; font-weight: 400; color: var(--site-text-dim, #666); }
.header-catalog-platform-list { position: relative; display: grid; grid-auto-flow: column; grid-template-rows: repeat(var(--catalog-rows, 11), max-content); grid-auto-columns: minmax(160px, max-content); align-content: start; gap: 1px 10px; padding-right: 276px; min-height: 380px; }
.header-catalog-platform-button { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 30px; padding: 4px 8px; line-height: 1.2; border: 0; border-radius: 10px; background: transparent; color: inherit; text-align: left; text-decoration: none; font-size: 14px !important; }
.header-catalog-platform-button > span:nth-child(2) { max-width: 220px; }
.header-catalog-platform-button > span:nth-child(2) { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.header-catalog-platform-button small, .header-catalog-platform-title small, .header-catalog-group small { color: var(--site-text-dim, #666); font-size: 14px; font-weight: 400; }
.header-catalog-choice button:hover, .header-catalog-choice button[aria-expanded="true"], .header-catalog-platform-button:hover, .header-catalog-platform-button[aria-expanded="true"] { background: var(--site-bg, #f1eef0); }
.header-catalog-platform-button[aria-expanded="true"] { color: var(--site-mark, #fd5a3c); font-weight: 600; }
.header-catalog-sections { position: absolute; top: 0; right: 0; width: 260px; max-height: 100%; overflow-y: auto; overscroll-behavior: contain; padding: 12px; border-radius: 15px; background: var(--site-surface, #f7f5f6); }
.header-catalog-platform-title { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; padding: 0 0 6px; border-bottom: 1px solid var(--site-border-soft, #ebe7e7); font-size: 14px; font-weight: 700; color: var(--site-title, #222); }
.header-catalog-platform-title > span:nth-child(2) { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.header-catalog-group { margin-bottom: 8px; }
.header-catalog-group h5 { margin: 0 0 4px; font-size: 12px; text-transform: uppercase; color: var(--site-text-dim, #666); }
.header-catalog-group a { display: flex; align-items: center; gap: 8px; padding: 4px 6px; line-height: 1.2; border-radius: 8px; color: inherit; font-size: 14px; text-decoration: none; }
.header-catalog-group a > span:nth-child(2) { flex: 1; overflow-wrap: anywhere; }
.header-catalog-group a:hover, .header-catalog-all:hover, .header-catalog-platform-button:hover, .header-catalog-choice button:hover, .header-catalog-directions > button:hover { color: var(--site-mark, #fd5a3c); }
.header-catalog-panel--compact { width: max-content; max-width: calc(100vw - 24px); padding: 24px; }
.header-catalog-panel--compact > .header-catalog-close { position: absolute; top: 12px; right: 12px; z-index: 1; }
.header-catalog-panel--compact .header-catalog-direction-title { padding-right: 35px; }
.header-catalog-panel--compact .header-catalog-platform-list { min-height: 280px; }
.header-catalog-platform-count { display: none; color: var(--site-text-dim, #666); }
.header-catalog-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.header-catalog button:focus-visible, .header-catalog a:focus-visible, .header-catalog-directions button:focus-visible, .header-catalog-directions a:focus-visible { outline: 2px solid var(--site-accent, #ffbe40); outline-offset: 2px; }
@media (max-width: 1023px) {
 .header-catalog-directions { display: none; }
 .header-catalog-toggle { z-index: auto; }
 .header-catalog-panel { inset: 0; width: 100%; max-height: none; height: 100dvh; border: 0; border-radius: 0; overscroll-behavior: contain; }
 .header-catalog-heading { position: sticky; top: 0; z-index: 1; background: var(--site-card, #fff); padding: 10px 12px; }
 .header-catalog-heading h2 { font-size: 18px; }
 .header-catalog-layout { display: block; }
 .header-catalog-choice { border: 0; }
 .header-catalog-choice button { min-height: 56px; border-bottom: 1px solid var(--site-border-soft, #ebe7e7); }
 .header-catalog-platform-count { display: inline; }
 .header-catalog-content { padding: 12px; }
 .header-catalog-direction-title { font-size: 18px; }
 .header-catalog-platform-list { display: block; min-height: 0; padding: 0; }
 .header-catalog-platform { border-bottom: 1px solid var(--site-border-soft, #ebe7e7); }
 .header-catalog-platform-button { min-height: 52px; }
 .header-catalog-sections { position: static; width: auto; max-height: none; padding: 12px; margin-bottom: 12px; overflow: visible; }
 .header-catalog-platform-title { display: none; }
}