/* The full header needs ~1100px plus room for a future Shop entry. */
.global-header-inner {
    grid-template-columns: 180px minmax(0, 1fr) 342px;
    gap: 16px;
}
.header-nav { max-width: none; width: auto; }
button.header-nav-summary { border: 0; font-family: inherit; font-size: inherit; cursor: pointer; background: transparent; }
.header-menu-toggle { display: none; }
.header-drawer[hidden], .header-drawer-backdrop[hidden] { display: none; }
.header-drawer-backdrop {
    position: fixed; inset: var(--header-height) 0 0; background: rgb(0 0 0 / .35); z-index: 41;
}
.header-drawer {
    position: fixed; left: 0; top: var(--header-height); bottom: 0;
    width: min(330px, 90vw); overflow-y: auto; overflow-x: hidden;
    background: #002246; color: #fff; z-index: 42; padding: 18px;
    font-family: "Montserrat", sans-serif; box-shadow: 8px 0 24px rgb(0 0 0 / .2);
    animation: header-drawer-enter 180ms ease-out;
}
@keyframes header-drawer-enter { from { transform: translateX(-100%); } to { transform: translateX(0); } }
.header-drawer-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.header-drawer-group-title { font-size: .85rem; color: #d4af37; font-weight: 600; }
.header-menu-toggle, .header-drawer-close {
    align-items: center; justify-content: center; width: 36px; height: 36px;
    border: 0; border-radius: 6px; background: transparent; color: #fff; cursor: pointer;
}
.header-menu-toggle svg { width: 22px; height: 22px; }
.header-drawer-close { display: inline-flex; font-size: 1.8rem; }
.header-drawer nav a { display: block; padding: 13px 10px; color: #fff; text-decoration: none; border-radius: 6px; }
.header-drawer nav a.is-active { text-decoration: underline; text-decoration-color: #d4af37; text-underline-offset: 6px; }
.header-drawer nav a:hover, .header-drawer nav a:focus-visible,
.header-menu-toggle:hover, .header-drawer-close:hover { background: rgb(255 255 255 / .12); }
.header-drawer a:focus-visible, .header-drawer button:focus-visible, .header-menu-toggle:focus-visible { outline: 2px solid #d4af37; outline-offset: -2px; }
.header-drawer-information { border-top: 1px solid rgb(255 255 255 / .2); margin-top: 18px; padding-top: 18px; }
.header-drawer-information p { margin: 0 10px 6px; }
html.header-menu-open { overflow: hidden; scrollbar-gutter: stable; }
@media (max-width: 1199px) {
    .global-header.header-search-focused { top: var(--header-search-viewport-top, 0px); }
    .global-header-inner { grid-template-columns: 36px minmax(0, 1fr) auto; padding: 8px 14px; gap: 10px; }
    .header-menu-toggle { display: inline-flex; }
    .global-header .header-nav { display: none; }
    .header-brand { grid-column: 2; grid-row: 1; max-width: var(--header-left-width); }
    /* Restore the original logo height and intrinsic width; Grid reserves its track. */
    .header-brand-logo { height: 32px; width: auto; max-width: 100%; flex-shrink: 0; }
    .header-actions { grid-column: 3; grid-row: 1; width: auto; max-width: none; justify-self: end; }
    .header-actions > .actor-search-modal-root { flex: 0 1 auto; min-width: 0; }
    /* Measured Montserrat placeholder: 110px + 16px padding + 2px border. */
    .header-actions .actor-search-inline { width: clamp(8rem, 30vw, var(--header-search-width)); min-width: 8rem; }
    /* Use the logo SVG's empty right gutter without changing any Grid tracks.
       The extra width and offset cancel out at the field's right edge. */
    .header-actions .actor-search-inline-input { position: relative; left: -.875rem; width: calc(100% + .875rem); }
    .header-actions .theme-toggle { flex: 0 0 var(--header-control-size); }
    .header-actions .actor-search-inline-results {
        left: auto;
        right: 0;
        width: var(--header-search-results-width, 100%);
        max-height: var(--header-search-results-max-height, min(420px, 56vh));
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
        touch-action: pan-y;
    }
}
@media (max-width: 560px) {
    .global-header-inner { grid-template-columns: 24px minmax(0, 1fr) auto; gap: 3px; padding: 8px 14px 8px 4px; }
    .header-menu-toggle { width: 24px; padding: 0; }
    .header-actions { gap: 4px; }
    .header-actions .actor-search-input { padding-left: 16px; padding-right: 12px; }
    /* Empty WebKit search fields otherwise reserve space for an invisible clear button. */
    .header-actions .actor-search-input:placeholder-shown::-webkit-search-cancel-button { display: none; }
}
@media (prefers-reduced-motion: reduce) { .header-drawer { animation: none; } }

.header-nav-dropdown.is-dismissed .header-nav-menu { opacity: 0; visibility: hidden; pointer-events: none; }

/* Visibility must change immediately so keyboard focus can enter an opening menu. */
.header-nav-menu { transition: opacity 170ms ease, transform 170ms ease; }

html.header-menu-open .global-header { z-index: 110; }

/* Compact Rankings disclosure: hierarchy through indentation, without vertical rules. */
.header-drawer-rankings > summary {
    display: flex; align-items: center; justify-content: space-between;
    padding: 13px 10px; border-radius: 6px; list-style: none; cursor: pointer;
}
.header-drawer-rankings > summary::-webkit-details-marker { display: none; }
.header-drawer-rankings > summary.is-active {
    text-decoration: underline; text-decoration-color: #d4af37; text-underline-offset: 6px;
}
.header-drawer-rankings > summary:hover,
.header-drawer-rankings > summary:focus-visible { background: rgb(255 255 255 / .12); }
.header-drawer-rankings > summary:focus-visible { outline: 2px solid #d4af37; outline-offset: -2px; }
.header-drawer-chevron { width: 18px; height: 18px; flex: 0 0 auto; }
.header-drawer-rankings[open] .header-drawer-chevron { transform: rotate(90deg); }
.header-drawer-submenu { margin-left: 18px; }
.header-drawer .header-drawer-submenu a { font-size: .9rem; padding: 8px 10px; }
.header-drawer-submenu-separator { display: block; height: 1px; margin: 3px 10px; background: rgb(255 255 255 / .13); }