/* All user-facing dropdown surfaces follow the area switcher. */
:root {
  --menu-surface:rgba(38,40,46,.42);
  --menu-blur:blur(18px) saturate(125%);
  --menu-shadow:0 10px 28px #0003;
  --menu-hover:#ffffff16;
  --menu-selected:#ffffff0d;
  --menu-motion:cubic-bezier(.2,.8,.2,1);
}
:is(.area-menu,.time-dropdown,.language-menu,.user-dropdown,.publish-dropdown,.custom-select-drop,.site-select-menu,.ql-snow .ql-picker-options) {
  box-sizing:border-box; padding:var(--menu-padding,4px); border:0!important; border-radius:var(--menu-radius,12px)!important;
  background:var(--menu-surface)!important; color:#fff;
  box-shadow:var(--menu-shadow)!important;
  -webkit-backdrop-filter:var(--menu-blur)!important; backdrop-filter:var(--menu-blur)!important;
  max-width:calc(100vw - 32px); max-height:min(380px,var(--menu-available-height,calc(100dvh - 32px))); overflow:auto;
}
:is(.time-dropdown,.language-menu,.user-dropdown,.publish-dropdown,.custom-select-drop,.site-select-menu) {
  --menu-x:0px;
  transform:translate(var(--menu-x),-7px) scale(.98); transform-origin:50% 0;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .18s ease,transform .22s var(--menu-motion),visibility 0s .22s;
}
.time-dropdown,.publish-dropdown,.custom-select-drop { display:block; }
.area-menu { --menu-radius:16px; --menu-padding:6px; }
.time-dropdown { min-width:128px; max-height:min(380px,calc(100dvh - 100px)); overflow:auto; }
.language-menu { min-width:148px; gap:2px; }
.user-dropdown { min-width:152px; }
.language-selector-login .language-menu,.publish-dropdown { --menu-x:-50%; }
.language-selector-login .language-menu { --menu-font-size:14px; --menu-option-height:38px; --menu-option-padding:9px 32px 9px 12px; min-width:152px; padding:4px; }
:is(.time-dropdown.show,.user-dropdown.show,.publish-dropdown.show,.custom-select.open .custom-select-drop,.language-selector.open .language-menu,.site-select-menu[data-open="true"]) {
  opacity:1; visibility:visible; pointer-events:auto; transform:translate(var(--menu-x),0) scale(1);
  transition:opacity .18s ease,transform .22s var(--menu-motion),visibility 0s;
}
:is(.time-option,.language-menu button,.language-selector-login .language-menu button,.user-dropdown-item,.custom-select-opt,.site-select-option) {
  position:relative; display:flex; align-items:center; gap:8px;
  width:100%; min-height:var(--menu-option-height,34px); box-sizing:border-box; padding:var(--menu-option-padding,7px 30px 7px 12px);
  border:0; border-radius:8px; background:transparent; color:#fff;
  font-family:inherit; font-size:var(--menu-font-size,13px); font-weight:400; line-height:var(--menu-line-height,20px);
  letter-spacing:normal; text-align:left; white-space:normal; overflow-wrap:anywhere;
  cursor:pointer; transition:background .15s ease;
}
:is(.time-option,.user-dropdown-item,.custom-select-opt,.site-select-option) + :is(.time-option,.user-dropdown-item,.custom-select-opt,.site-select-option) { margin-top:2px; }
body :is(.time-option:hover,.language-menu button:hover,.language-selector-login .language-menu button:hover,.user-dropdown-item:hover,.custom-select-opt:hover,.site-select-option:hover) { color:#fff; background:var(--menu-hover); transform:none; }
body :is(.time-option.active,.language-menu button.active,.custom-select-opt.selected,.site-select-option[aria-selected="true"]) { color:#fff!important; background:var(--menu-selected)!important; font-weight:500; }
body :is(.time-option.active:hover,.language-menu button.active:hover,.custom-select-opt.selected:hover,.site-select-option[aria-selected="true"]:hover) { background:#ffffff1c!important; }
:is(.time-option.active,.language-menu button.active,.custom-select-opt.selected,.site-select-option[aria-selected="true"])::after {
  content:''; position:absolute; right:12px; top:50%; width:5px; height:8px;
  margin-top:-6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg);
}
body :is(.time-option,.language-menu button,.user-dropdown-item,.custom-select-opt,.site-select-option):focus-visible { outline:2px solid #fff; outline-offset:-3px; background:var(--menu-hover); }
.user-dropdown-item:last-child { border:0; }
.user-dropdown-logout { color:#fff; }
.ql-snow .ql-picker.ql-expanded .ql-picker-options { animation:site-menu-enter .22s var(--menu-motion); }
.ql-snow .ql-picker:not(.ql-color-picker) .ql-picker-options .ql-picker-item { padding:7px 12px; border-radius:8px; color:#fff; font-size:13px; line-height:20px; }
.ql-snow .ql-picker:not(.ql-color-picker) .ql-picker-options .ql-picker-item::before { font-size:13px!important; line-height:20px; }
.ql-snow .ql-picker .ql-picker-options .ql-picker-item:hover { background:var(--menu-hover); color:#fff; }
.ql-snow .ql-picker .ql-picker-options .ql-picker-item.ql-selected { color:#fff; background:var(--menu-selected); }
.site-select { position:relative; display:block; width:100%; margin:var(--select-margin,12px 0); }
.site-select > select.site-native-select { position:absolute!important; inset:0 auto auto 0!important; width:1px!important; height:1px!important; min-height:0!important; padding:0!important; margin:0!important; border:0!important; opacity:0; clip-path:inset(50%); pointer-events:none; }
.site-select-trigger { position:relative; display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:var(--select-height,36px); padding:var(--select-padding,9px 36px 9px 12px); border:var(--select-border-width,1px) solid var(--select-border-color,var(--color-border,#39393e)); border-radius:var(--select-radius,12px); background:var(--select-background,var(--color-surface,#242427)); color:#fff; font:inherit; font-size:var(--select-font-size,14px); line-height:var(--select-line-height,1.5); text-align:left; cursor:pointer; }
.site-select-trigger::after { content:''; position:absolute; right:18px; top:50%; width:8px; height:8px; margin-top:-6px; border-right:1.5px solid #ddd; border-bottom:1.5px solid #ddd; transform:rotate(45deg); transition:transform .22s var(--menu-motion); }
.site-select-trigger > span { min-width:0; overflow-wrap:anywhere; }
.site-select-trigger[aria-expanded="true"]::after { transform:translateY(4px) rotate(225deg); }
.site-select-trigger:focus-visible { outline:2px solid #fff; outline-offset:3px; }
.site-select-trigger:disabled,.site-select-option:disabled { opacity:.45; cursor:default; }
.site-select-menu { position:fixed; inset:auto; margin:0; z-index:2000; max-width:calc(100vw - 32px); max-height:min(360px,calc(100dvh - 32px)); overflow:auto; }
.site-select-menu[hidden] { display:none; }
.site-select-group { padding:8px 14px; font-size:13px; color:#ddd; }
@keyframes site-menu-enter { from { opacity:0; translate:0 -7px; scale:.98; } to { opacity:1; translate:0 0; scale:1; } }
@media(max-width:480px) { :is(.time-option,.language-menu button,.user-dropdown-item,.custom-select-opt) { --menu-option-height:38px; --menu-option-padding:9px 30px 9px 12px; } }
@media(prefers-reduced-motion:reduce) {
  :is(.area-menu,.time-dropdown,.language-menu,.user-dropdown,.publish-dropdown,.custom-select-drop,.site-select-menu,.site-select-trigger)::after,
  :is(.area-menu,.time-dropdown,.language-menu,.user-dropdown,.publish-dropdown,.custom-select-drop,.site-select-menu),.ql-snow .ql-picker.ql-expanded .ql-picker-options { transition:none!important; animation:none!important; }
}