/* Shared header menus: readable tablet navigation and bounded overlays. */
@media(min-width:1121px){
  body.studio-theme:not([data-public-header="sidebar"]) .studio-site-header .studio-exact-logo{flex:none}
  body.studio-theme:not([data-public-header="sidebar"]) .studio-site-header .studio-header-nav-group>nav[data-studio-exact-nav]{flex:1 1 0;min-width:0}
  body.studio-theme:not([data-public-header="sidebar"]) .studio-site-header .studio-header-nav-group>nav[data-studio-exact-nav]>*{flex:0 0 auto}
  body.studio-theme:not([data-public-header="sidebar"]) .studio-site-header .studio-header-nav-group>nav[data-studio-exact-nav]>.is-desktop-overflow{display:none!important}
  body.studio-theme .studio-site-header .studio-nav-overflow-panel{
    inset-inline-start:auto!important;inset-inline-end:0!important;
    width:260px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 160px);
    overflow-y:auto;overscroll-behavior:contain;
  }
  body.studio-theme .studio-site-header .studio-nav-overflow-heading{
    display:block;padding:10px 9px 4px;font-size:11px;color:var(--studio-color-text-muted);
  }
  body.studio-theme .studio-site-header .studio-nav-overflow-panel>a{white-space:normal!important;min-height:42px!important}
}
body.studio-theme .studio-site-header :is(.studio-tools-popover,.studio-account-popover,.studio-notification-popover,.studio-membership-popover){
  box-sizing:border-box;
  max-width:calc(100vw - 24px);
  max-height:var(--studio-overlay-available-height,calc(100dvh - 140px))!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  overflow-wrap:anywhere;
}
body.studio-theme .studio-site-header :is(button,a):focus-visible{
  outline:2px solid var(--studio-color-link);
  outline-offset:2px;
}
/* Reserve navigation space before the desktop membership text can collide
   with longer translated links. The membership panel still shows every detail. */
@media(min-width:1121px) and (max-width:1380px){
  body.studio-theme .studio-site-header .studio-membership-card>button{
    width:44px!important;min-width:44px!important;height:44px!important;
    padding:0!important;justify-content:center!important;
  }
  body.studio-theme .studio-site-header :is(.studio-membership-copy,.studio-membership-card>button>em){display:none!important}
}
@media(max-width:1120px){
  body.studio-theme .studio-site-header .studio-header-nav-group>nav[data-studio-exact-nav]{
    grid-template-columns:minmax(0,1fr)!important;
    align-items:start!important;
    gap:4px!important;
    padding:8px!important;
    scroll-padding-block:8px;
  }
  body.studio-theme .studio-site-header .studio-header-nav-group>nav[data-studio-exact-nav]>a,
  body.studio-theme .studio-site-header .studio-nav-parent>button{
    justify-content:space-between!important;
    text-align:start;
    min-height:44px!important;
    padding:10px 12px!important;
  }
  body.studio-theme .studio-site-header .studio-nav-dropdown a{
    min-height:44px!important;
    white-space:normal!important;
  }
  body.studio-theme .studio-site-header :is(.studio-tools-popover,.studio-account-popover,.studio-notification-popover,.studio-membership-popover){
    position:fixed!important;
    top:var(--studio-mobile-header-popover-top,120px)!important;
    inset-inline:12px!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
  }
  body.studio-theme .studio-site-header .studio-notification-preview{
    max-height:none!important;
    overflow:visible!important;
  }
  body.studio-theme .studio-site-header :is(.studio-tools-trigger,.studio-notification-trigger,.studio-exact-square,.studio-account-button,.studio-membership-card>button){
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    touch-action:manipulation;
  }
  body.studio-theme .studio-site-header .studio-membership-card>button{justify-content:center!important}
  body.studio-theme .studio-site-header .studio-guest-login-button>b{display:none!important}
  body.studio-theme .studio-site-header :is(.studio-membership-copy,.studio-membership-card>button>em){display:none!important}
}
@media(min-width:601px) and (max-width:1120px){
  body.studio-theme .studio-site-header .studio-header-nav-group>nav[data-studio-exact-nav],
  body.studio-theme .studio-site-header :is(.studio-tools-popover,.studio-account-popover,.studio-notification-popover,.studio-membership-popover){
    inset-inline-start:auto!important;
    inset-inline-end:12px!important;
    width:min(540px,calc(100% - 24px))!important;
  }
}
/* Compact phones: logo, search and menu; account shortcuts live together. */
.studio-compact-shortcuts,.studio-compact-shortcut-label{display:none}
@media(max-width:600px){
  body.studio-theme .studio-site-header,
  body.studio-theme .studio-site-header.is-scrolled{height:68px!important;min-height:68px!important}
  body.studio-theme .studio-site-header .studio-exact-head{
    display:flex!important;width:calc(100% - 24px)!important;height:68px!important;
    gap:12px!important;padding-block:0;justify-content:space-between;
  }
  body.studio-theme .studio-site-header .studio-header-nav-group{width:auto;min-width:0;flex:1}
  body.studio-theme .studio-site-header .studio-exact-logo img{width:112px;height:36px;object-fit:contain}
  body.studio-theme .studio-site-header .studio-exact-actions{
    width:auto;min-width:0!important;margin-inline:0!important;gap:8px!important;flex:none;
  }
  body.studio-theme .studio-site-header:has([data-notification-badge]:not([hidden])) [data-studio-menu]::after{
    content:"";position:absolute;inset-block-start:4px;inset-inline-end:4px;
    width:7px;height:7px;border-radius:50%;background:var(--studio-color-accent);
    box-shadow:0 0 0 2px var(--studio-component-control-bg);
  }
  body.studio-theme .studio-site-header .studio-compact-shortcuts{
    display:grid;grid-template-columns:repeat(var(--studio-shortcut-count,4),minmax(0,1fr));
    position:fixed;top:calc(var(--studio-mobile-header-popover-top) + 69px);inset-inline:24px;
    height:78px;box-sizing:border-box;padding:4px 6px;gap:4px;
    visibility:hidden;pointer-events:none;z-index:350;
    border:0;border-radius:0;
  }
  body.studio-theme .studio-site-header:has([data-studio-exact-nav].is-open) .studio-compact-shortcuts{
    visibility:visible;pointer-events:auto;
    background:transparent;
  }
  body.studio-theme .studio-site-header .studio-compact-shortcuts>:is(div,form){display:flex!important;justify-content:center;align-items:flex-start!important;align-self:stretch!important;justify-self:stretch!important;width:auto!important;height:auto!important;position:relative;min-width:0}
  body.studio-theme .studio-site-header .studio-compact-shortcuts>:is(div,form)>button{position:relative;margin:0}
  body.studio-theme .studio-site-header .studio-compact-shortcuts>:is(div,form)>button,
  body.studio-theme .studio-site-header .studio-compact-shortcuts>:is(div,form)>button *{visibility:inherit!important}
  body.studio-theme .studio-site-header .studio-compact-shortcut-label{
    display:block;position:absolute;top:48px;inset-inline:0;transform:none!important;text-align:center;
    width:100%!important;max-width:none;height:auto!important;min-height:0!important;
    padding:0!important;margin:0!important;border:0!important;border-radius:0!important;
    background:transparent!important;box-shadow:none!important;
    font:600 11px/1.4 var(--studio-font-family-ui)!important;
    color:var(--studio-color-text)!important;white-space:nowrap;
  }
  body.studio-theme .studio-site-header .studio-compact-shortcuts [class*="popover"].is-open{visibility:visible;pointer-events:auto}
  body.studio-theme .studio-site-header .studio-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.studio-theme .studio-site-header .studio-tools-grid>a{grid-template-columns:minmax(0,1fr);align-content:start}
}
@media(prefers-reduced-motion:reduce){
  body.studio-theme .studio-site-header :is(.studio-nav-dropdown,.studio-tools-popover,.studio-account-popover,.studio-notification-popover,.studio-membership-popover){animation:none!important;transition:none!important}
}

/* Community pages share the same fixed-header clearance as the catalog. */
body.studio-theme .cs-shell{padding-top:var(--studio-page-clearance,116px)!important}
body.studio-theme .studio-forum-page .section-head{flex-wrap:wrap;gap:12px}
body.studio-theme .studio-forum-page .section-head>div{min-width:0;flex:1 1 180px;overflow-wrap:anywhere}
body.studio-theme .studio-forum-page :is(input,textarea,select){box-sizing:border-box;min-width:0;max-width:100%}
@media(max-width:520px){
  body.studio-theme :is(.studio-forum-page,.cs-shell) :is(input,textarea,select){font-size:16px}
  body.studio-theme .cs-room-card footer{flex-wrap:wrap;gap:8px}
}

@media(max-width:1120px){
  body.studio-theme .studio-site-header [data-studio-exact-nav]>a::before,
  body.studio-theme .studio-site-header [data-studio-exact-nav]>a::after{display:none!important}
}

/* Contain the hidden admin drawer's entrance transform on narrow watch pages. */
.a2-control-drawer{overflow:clip}

/* Compact navigation is a single bounded panel. Its original menu nodes are
   restored on desktop, so admin visibility, links and event handlers stay shared. */
.studio-compact-only,.studio-compact-icon{display:none}
.studio-navigation-backdrop[hidden]{display:none}
@media(max-width:1120px){
  html.studio-mobile-nav-open{overflow:hidden}
  .studio-navigation-backdrop{
    position:fixed;inset:var(--studio-mobile-header-popover-top,118px) 0 0;
    z-index:300;background:rgb(2 8 18 / .48);
  }
  body.studio-theme .studio-site-header .studio-header-nav-group>nav.studio-navigation-enhanced{
    top:var(--studio-mobile-header-popover-top)!important;
    max-height:calc(100dvh - var(--studio-mobile-header-popover-top) - 12px)!important;
    padding:0!important;gap:0!important;z-index:340!important;
    overflow:hidden!important;border:1px solid var(--studio-component-dialog-border)!important;
    border-radius:22px!important;background:var(--studio-component-dialog-bg)!important;
    box-shadow:0 22px 60px rgb(0 0 0 / .3)!important;
    font-family:var(--studio-font-family-ui);text-align:start;
  }
  body.studio-theme .studio-navigation-enhanced>.studio-explore{display:none!important}
  .studio-navigation-frame{display:flex;flex-direction:column;min-height:0;max-height:inherit;width:100%;min-width:0}
  .studio-navigation-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:68px;box-sizing:border-box;padding:10px 16px;flex:none}
  .studio-navigation-intro{display:grid;gap:2px;min-width:0}
  .studio-navigation-intro strong{font-size:18px!important;font-weight:850!important;line-height:1.4;color:var(--studio-color-heading)}
  .studio-navigation-intro small{font-size:11px!important;line-height:1.5;color:var(--studio-color-text-muted)}
  body.studio-theme .studio-navigation-close{
    width:44px;height:44px;flex:none;border:1px solid var(--studio-component-control-border);
    border-radius:50%;background:var(--studio-component-control-bg);color:var(--studio-color-text);font:28px/1 sans-serif;cursor:pointer;
  }
  .studio-navigation-tabs{display:flex;gap:2px;flex:none;padding:4px;margin:0 12px 10px;border-radius:12px;background:var(--studio-component-control-bg);border:1px solid var(--studio-component-control-border)}
  body.studio-theme .studio-navigation-tab{
    min-width:0;flex:1;min-height:44px;padding:7px 3px;border:0;border-radius:9px;
    font:700 12px/1.5 var(--studio-font-family-ui);white-space:nowrap;
    color:var(--studio-color-text-secondary);background:transparent;cursor:pointer;
  }
  body.studio-theme .studio-navigation-tab[aria-selected="true"]{background:var(--studio-color-accent);color:var(--studio-color-on-accent,#06101d);box-shadow:0 2px 8px rgb(0 0 0 / .12)}
  .studio-navigation-scroll{overflow-y:auto;overscroll-behavior:contain;min-height:0;padding:2px 14px max(14px,env(safe-area-inset-bottom));scroll-padding:10px;scrollbar-width:thin}
  .studio-navigation-panel{display:grid;gap:16px;min-width:0}
  .studio-navigation-panel[hidden]{display:none!important}
  .studio-navigation-categories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:start}
  body.studio-theme .studio-navigation-categories>.studio-compact-category{min-width:0;width:auto;height:auto;margin:0!important}
  body.studio-theme .studio-navigation-categories>:is(a,.studio-nav-parent)>button,
  body.studio-theme .studio-navigation-categories>a{
    display:flex!important;align-items:center;justify-content:flex-start!important;flex-direction:row;gap:6px!important;
    position:relative;width:100%;min-height:54px!important;height:auto!important;box-sizing:border-box;
    border:1px solid var(--studio-component-card-border)!important;border-radius:14px!important;
    padding:9px 6px!important;background:var(--studio-component-card-bg)!important;color:var(--studio-color-text)!important;
    font:750 14px/1.5 var(--studio-font-family-ui)!important;text-align:start;white-space:normal!important;
  }
  body.studio-theme .studio-navigation-categories .studio-compact-icon{display:grid;place-items:center;width:20px;height:24px;flex:none;color:var(--studio-color-link)}
  .studio-compact-icon svg{width:20px;height:20px}
  body.studio-theme .studio-navigation-categories :is(a,button)>span:not(.studio-compact-icon){min-width:0;max-width:100%;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis}
  body.studio-theme .studio-navigation-categories>.studio-nav-parent>button>i{
    position:relative;display:grid;place-items:center;margin-inline-start:auto;flex:none;
    width:20px;height:20px;border:1px solid var(--studio-component-control-border)!important;border-radius:6px;
    background:var(--studio-component-control-bg);color:var(--studio-color-link);transform:none!important;
  }
  .studio-navigation-categories>.studio-nav-parent>button>i::after{
    content:"";width:6px;height:6px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;
    transform:translateY(-2px) rotate(45deg);transition:transform .18s ease;
  }
  body.studio-theme .studio-navigation-categories>.studio-nav-parent.is-open>button>i{background:var(--studio-color-accent);color:var(--studio-color-on-accent);border-color:transparent!important}
  .studio-navigation-categories>.studio-nav-parent.is-open>button>i::after{transform:translateY(2px) rotate(225deg)}
  body.studio-theme .studio-navigation-categories>.studio-nav-parent.is-open{grid-column:1/-1}
  body.studio-theme .studio-navigation-categories>.studio-nav-parent.is-open>button{border-color:var(--studio-color-link)!important;border-radius:14px 14px 0 0!important;background:var(--studio-component-control-bg)!important}
  body.studio-theme .studio-navigation-categories .studio-nav-dropdown{position:static!important;max-height:none!important;overflow:visible!important;margin:0!important;width:auto!important;border-radius:0 0 14px 14px!important;padding:6px!important;box-shadow:none!important;backdrop-filter:none!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px!important}
  body.studio-theme .studio-navigation-categories .studio-nav-dropdown>a{min-height:44px!important;font-size:13px!important;padding:8px!important;gap:8px;min-width:0}
  body.studio-theme .studio-navigation-categories .studio-nav-all{grid-column:1/-1}
  body.studio-theme .studio-navigation-categories :is(a,button)::before,
  body.studio-theme .studio-navigation-categories :is(a,button)::after,
  body.studio-theme .studio-navigation-categories .studio-nav-dropdown::before,
  body.studio-theme .studio-navigation-categories .studio-nav-dropdown::after{display:none!important}
  body.studio-theme .studio-navigation-categories>a.active,
  body.studio-theme .studio-navigation-categories>.active>button{border-color:var(--studio-color-link)!important}
  body.studio-theme .studio-navigation-panel .studio-explore-group{display:block!important;min-width:0;padding:0!important;border:0!important;margin:0!important}
  body.studio-theme .studio-navigation-panel .studio-explore-heading{padding:0!important;margin:2px 0 10px!important;font-size:12px!important;gap:7px!important}
  body.studio-theme .studio-navigation-panel .studio-explore-links{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
  body.studio-theme .studio-navigation-panel .studio-explore-link{
    display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;
    min-width:0;min-height:54px!important;padding:10px!important;border-radius:12px!important;
    border:1px solid var(--studio-component-card-border)!important;background:var(--studio-component-card-bg)!important;
  }
  body.studio-theme .studio-navigation-panel .studio-explore-icon{width:20px!important;height:24px!important;flex:none;background:none!important}
  body.studio-theme .studio-navigation-panel .studio-explore-copy{min-width:0}
  body.studio-theme .studio-navigation-panel .studio-explore-copy strong{font-size:13px!important;line-height:1.5!important;white-space:normal!important;overflow-wrap:anywhere}
  body.studio-theme .studio-navigation-panel .studio-explore-copy small{display:none!important}
  body.studio-theme .studio-navigation-panel .studio-explore-link:hover,
  body.studio-theme .studio-navigation-panel .studio-explore-link.active,
  body.studio-theme .studio-navigation-categories>:is(a,.studio-nav-parent)>button:hover,
  body.studio-theme .studio-navigation-categories>a:hover{background:var(--studio-component-control-bg)!important;border-color:var(--studio-color-link)!important}

}
@media(max-width:600px){
  body.studio-theme .studio-site-header .studio-navigation-frame>.studio-compact-shortcuts{
    position:static;inset:auto;width:auto;margin:0 12px 2px;height:78px;flex:none;
  }
  body.studio-theme .studio-navigation-panel [data-explore-group="membership"] .studio-explore-links{grid-template-columns:minmax(0,1fr)}
  body.studio-theme .studio-site-header .studio-header-nav-group>nav.studio-navigation-enhanced{inset-inline:12px!important}
}
/* On small phones give labels room instead of reducing their type size. */
@media(max-width:480px){
  .studio-navigation-categories,
  body.studio-theme .studio-navigation-panel .studio-explore-links{grid-template-columns:minmax(0,1fr)}
  body.studio-theme .studio-navigation-categories>a,
  body.studio-theme .studio-navigation-categories>.studio-nav-parent>button{gap:10px!important;padding:9px 12px!important}
  body.studio-theme .studio-navigation-categories :is(a,button)>span:not(.studio-compact-icon){white-space:normal!important;overflow:visible;overflow-wrap:anywhere}
  body.studio-theme .studio-navigation-categories .studio-nav-dropdown{grid-template-columns:minmax(0,1fr)!important}
}

@media(prefers-reduced-motion:reduce){.studio-navigation-categories>.studio-nav-parent>button>i::after{transition:none}}

@media(max-width:1120px) and (max-height:480px){
  body.studio-theme .studio-site-header .studio-header-nav-group>nav.studio-navigation-enhanced{overflow-y:auto!important}
  .studio-navigation-frame{max-height:none}
  .studio-navigation-scroll{overflow:visible;flex:none}
}
