body.site-top-navigation .app-shell { grid-template-columns: minmax(0,1fr) !important; }
body.site-top-navigation .app-shell .main { grid-column: 1; padding:0; margin-left: 0; z-index:auto; }
body.site-top-navigation .site-footer { grid-column: 1 / -1; }
body.site-top-navigation .topbar {
  position:sticky !important; left:auto !important; right:auto !important; top:12px !important;
  display:flex; flex-wrap:wrap; gap:12px; height:auto; min-height:78px;
  width:calc(100% - 48px); max-width:1680px; margin:18px auto 0 !important; padding:12px 18px;
  border-radius:40px; border:1px solid rgb(var(--accent-soft-rgb) / .3);
  background:linear-gradient(125deg,rgb(var(--accent-rgb) / .20),rgb(var(--surface-rgb) / .94)), var(--panel-3);
  box-shadow:inset 0 1px 0 #ffffff12,0 12px 35px #0004;
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); z-index:80; top:12px;
}
.site-brand { display:flex; align-items:center; gap:9px; color:var(--text); text-decoration:none; flex-shrink:0; }
.site-brand img { width:42px; height:42px; object-fit:contain; border:1px solid #cde7ff45; border-radius:50%; background:#ffffff0b; }
.site-brand > span { font-size:15px; font-weight:750; letter-spacing:-.3px; }
.site-brand small { display:block; font-size:9px; letter-spacing:2px; color:var(--accent); margin-top:2px; }
.site-quick-nav { display:flex; gap:3px; }
.site-nav-link { display:flex; gap:9px; align-items:center; padding:11px 13px; min-height:44px; border:0; border-radius:24px; background:transparent; color:var(--text); font:inherit; font-size:13px; text-align:left; cursor:pointer; text-decoration:none; }
.site-nav-link svg { width:19px; height:19px; flex-shrink:0; }
.site-nav-link:hover,.site-page-menu summary:hover { background:rgb(var(--accent-rgb) / .14); color:var(--text); }
.site-nav-link.active { background:rgb(var(--accent-rgb) / .18); box-shadow:inset 0 0 0 1px rgb(var(--accent-soft-rgb) / .25); color:#fff; }
.site-page-menu { flex-shrink:0; }
.site-page-menu summary { list-style:none; display:flex; align-items:center; gap:9px; min-height:44px; padding:10px 14px; border:1px solid var(--line); border-radius:28px; color:var(--text); font-size:13px; cursor:pointer; }
.site-page-menu summary::-webkit-details-marker { display:none; }
.site-menu-lines { font-size:19px; line-height:1; }
.site-page-menu[open] summary { background:rgb(var(--accent-rgb) / .2); }
.site-menu-panel { position:absolute; top:calc(100% + 12px); left:0; width:min(740px,100%); padding:24px; border-radius:26px; border:1px solid var(--line); background:linear-gradient(145deg,rgb(var(--accent-rgb) / .12),rgb(var(--surface-rgb) / .98)), var(--panel-3); box-shadow:0 24px 70px #0008; backdrop-filter:blur(24px); max-height:calc(100dvh - 170px); overflow:auto; }
.site-menu-heading { display:flex; justify-content:space-between; gap:12px; align-items:center; padding-bottom:20px; }
.site-menu-heading strong { color:var(--text); font-size:17px; }
.site-menu-heading small { color:var(--muted); font-size:12px; }
.site-menu-groups { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.site-menu-groups h2 { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:1.5px; margin:0 0 9px 12px; }
.site-menu-groups .site-nav-link { width:100%; border-radius:12px; margin:2px 0; }
.site-menu-footer { display:flex; flex-wrap:wrap; gap:20px; padding-top:18px; margin-top:18px; border-top:1px solid #ffffff16; }
.site-menu-footer a { color:var(--soft); font-size:12px; text-decoration:none; }
body.site-top-navigation .topbar .global-search { flex:1; min-width:200px; width:auto; grid-template-columns:90px minmax(0,1fr); }
body.site-top-navigation .topbar .global-search .input,body.site-top-navigation .topbar .global-search .select { border-radius:24px; background:#ffffff0b; height:44px; }
body.site-top-navigation .topbar .top-actions { margin-left:auto; gap:5px; }
body.site-top-navigation .topbar .top-utility-button { width:38px; height:40px; border-radius:50%; }
.site-top-navigation :is(.site-nav-link,.site-brand,.site-page-menu summary,.site-menu-footer a):focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(max-width:1350px) { .site-quick-nav .site-nav-link svg { display:none; } .site-brand > span { display:none; } }
@media(max-width:1100px) {
  body.site-top-navigation .topbar .global-search { order:5; flex-basis:100%; }
  body.site-top-navigation .topbar { border-radius:28px; }
  .site-brand > span { display:block; }
}
@media(max-width:640px) {
  body.site-top-navigation .topbar { width:calc(100% - 20px); padding:10px; margin:10px auto 0 !important; top:6px !important; gap:8px; border-radius:25px; }
  .site-brand img { width:36px; height:36px; }
  .site-brand > span,.site-quick-nav { display:none; }
  .site-page-menu summary { padding:8px 12px; }
  body.site-top-navigation .topbar .top-actions { gap:2px; width:auto; flex:0 0 auto; }
  body.site-top-navigation .topbar .site-presence { display:none; }
  .site-menu-panel { width:100%; padding:18px; max-height:calc(100dvh - 160px); }
  .site-menu-groups { grid-template-columns:1fr 1fr; gap:18px 8px; }
  .site-menu-heading small { display:none; }
  body.site-top-navigation .topbar .global-search { min-width:0; }
  body.site-top-navigation .topbar .top-utility-button { width:32px; }
}
@media(max-width:370px) {
  .site-page-menu summary > span:last-child { display:none; }
  .site-page-menu summary { min-width:40px; justify-content:center; }
}
@media(prefers-reduced-motion:reduce) { .site-top-navigation .app-shell { transition:none; } }

@media(max-width:370px) { body.site-top-navigation .topbar .announcement-trigger { display:none; } }

body.site-top-navigation select:not([multiple]) {
  color:var(--text); background-color:var(--panel-2); border:1px solid var(--line);
  border-radius:14px; min-height:44px; padding:10px 14px;
  font:inherit; font-size:14px; cursor:pointer; color-scheme:dark;
  transition:border-color .15s,background-color .15s,box-shadow .15s;
}
body.site-top-navigation select:not([multiple]):hover { border-color:var(--accent); background-color:var(--panel-3); }
body.site-top-navigation select:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
body.site-top-navigation select:disabled { opacity:.5; cursor:not-allowed; }
body.site-top-navigation select option { background:var(--panel-3); color:var(--text); padding:12px; }
@supports (appearance:base-select) {
  body.site-top-navigation select:not([multiple]):not([size]),
  body.site-top-navigation select:not([multiple]):not([size])::picker(select) { appearance:base-select; }
  body.site-top-navigation select:not([multiple]):not([size]) { align-items:center; gap:12px; }
  body.site-top-navigation select::picker-icon { color:var(--accent); transition:rotate .18s; }
  body.site-top-navigation select:open::picker-icon { rotate:180deg; }
  body.site-top-navigation select::picker(select) {
    padding:6px; margin-block:8px; border:1px solid var(--line); border-radius:18px;
    background:linear-gradient(145deg,rgb(var(--accent-rgb) / .12),rgb(var(--surface-rgb) / .98)), var(--panel-3); color:var(--text);
    box-shadow:0 18px 50px #0007,inset 0 1px 0 #ffffff0c;
    min-width:anchor-size(width); max-width:calc(100vw - 24px); max-height:min(360px,60dvh);
    overflow:auto; scrollbar-width:thin; scrollbar-color:var(--accent) transparent;
  }
  body.site-top-navigation select option {
    padding:11px 14px; min-height:44px; gap:12px; border-radius:11px;
    background:transparent; font-size:14px; line-height:1.4;
  }
  body.site-top-navigation select option:hover,
  body.site-top-navigation select option:focus { background:rgb(var(--accent-rgb) / .14); outline:none; }
  body.site-top-navigation select option:checked { background:rgb(var(--accent-rgb) / .2); color:var(--text); font-weight:650; }
  body.site-top-navigation select option::checkmark { color:var(--accent); }
  body.site-top-navigation select option:disabled { opacity:.45; }
  body.site-top-navigation select optgroup { padding:8px 4px; color:var(--soft); font-size:12px; }
  body.site-top-navigation .topbar .global-search { grid-template-columns:minmax(106px,max-content) minmax(0,1fr); }
  body.site-top-navigation .topbar .global-search select { min-width:106px; }
}
body.site-top-navigation :is(.top-auth-popover,.notification-popover,.messages-popover,.ambient-popover,.live-search-dropdown) {
  border-radius:20px; border:1px solid var(--line);
  background:linear-gradient(145deg,rgb(var(--accent-rgb) / .12),rgb(var(--surface-rgb) / .98)), var(--panel-3);
  box-shadow:0 18px 50px #0006,inset 0 1px 0 #ffffff0c;
}
@media(max-width:760px) {
 body.site-top-navigation .site-page-menu { position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom)); z-index:110; }
 body.site-top-navigation .site-page-menu summary { display:flex; gap:9px; padding:12px 18px; min-height:48px; border:1px solid rgb(var(--accent-rgb) / .65); border-radius:26px; background:var(--panel-3); box-shadow:0 8px 28px #0006; backdrop-filter:blur(20px); font-weight:650; }
 body.site-top-navigation .site-page-menu summary > span:last-child { display:inline; }
 body.site-top-navigation .site-menu-panel { position:absolute; top:auto; bottom:calc(100% + 12px); right:0; left:auto; width:min(420px,calc(100vw - 32px)); max-height:calc(100dvh - 130px); padding:18px; }
 body.site-top-navigation .topbar .top-actions { display:flex; width:auto; flex:1; justify-content:flex-end; align-items:center; gap:7px; }
 body.site-top-navigation .topbar .top-utility-button { display:grid !important; place-items:center; width:40px; height:40px; min-height:40px; padding:9px; border:1px solid var(--line); border-radius:13px; background:rgb(var(--accent-rgb) / .07); color:var(--soft); }
 body.site-top-navigation .topbar .top-utility-button svg { width:20px; height:20px; }
 body.site-top-navigation .topbar .top-utility-button:hover,
 body.site-top-navigation .topbar .top-utility-button.active { background:rgb(var(--accent-rgb) / .2); color:var(--text); border-color:var(--accent); }
 body.site-top-navigation .topbar .top-auth-wrap { flex:0 0 40px; width:40px; }
 body.site-top-navigation .global-chat-fab { bottom:calc(80px + env(safe-area-inset-bottom)); }
 body.site-top-navigation:has(.site-page-menu[open]) .global-chat-fab { visibility:hidden; }
}
@media(max-width:360px) {
 body.site-top-navigation .topbar .top-actions { gap:4px; }
 body.site-top-navigation .topbar .top-utility-button { width:36px; height:38px; min-height:38px; padding:8px; }
}
@media(max-width:760px) {
 body.site-top-navigation .site-page-menu summary { width:58px; height:58px; min-height:58px; padding:0; display:grid; place-items:center; border-radius:50%; background:linear-gradient(135deg,var(--accent),var(--accent-2)); border:1px solid rgb(var(--accent-soft-rgb) / .5); color:white; box-shadow:0 16px 34px #0007; }
 body.site-top-navigation .site-page-menu summary > span:last-child { display:none; }
 body.site-top-navigation .site-page-menu .site-menu-lines { font-size:24px; }
}
/* Keep navigation attached to the viewport, even with overflow-clipped ancestors. */
body.site-top-navigation .topbar { position:fixed !important; top:12px !important; left:50% !important; right:auto !important; transform:translateX(-50%); margin:0 !important; z-index:20000 !important; }
body.site-top-navigation .app-shell .main { padding-top:var(--site-topbar-space,112px); }
body.site-top-navigation .content { position:relative; z-index:0; }
html { scroll-padding-top:var(--site-topbar-space,150px); }
.dubby-partner-banner { display:flex; align-items:center; gap:24px; padding:22px 26px; margin:20px 0; border:1px solid #b7ff4d55; border-radius:18px; background:radial-gradient(ellipse at 0 50%,#97d72d22,transparent 65%),#111a14; color:#f5ffed; }
.dubby-partner-brand { display:grid; gap:6px; flex-shrink:0; }
.dubby-partner-brand small { font-size:9px; letter-spacing:1px; color:#b6c4b0; }
.dubby-partner-brand strong { font-size:34px; letter-spacing:-1px; font-weight:900; color:#c8ff62; }
.dubby-partner-copy { flex:1; }
.dubby-partner-copy > strong { font-size:19px; }
.dubby-partner-copy p { margin:6px 0; }
.dubby-partner-copy b { color:#c8ff62; }
.dubby-partner-copy small { color:#b6c4b0; font-size:11px; }
.dubby-partner-banner .button { background:#c8ff62; color:#142006; border-color:#c8ff62; white-space:nowrap; }
@media(max-width:760px) {
 body.site-top-navigation .topbar { top:6px !important; }
 .dubby-partner-banner { flex-wrap:wrap; gap:14px; padding:18px; }
 .dubby-partner-copy { flex-basis:100%; }
 .dubby-partner-banner .button { width:100%; text-align:center; }
}

.dubby-partner-banner { display:grid; grid-template-columns:minmax(180px,1fr) minmax(220px,1.2fr) auto; overflow:hidden; }
.dubby-partner-art { display:block; min-width:0; }
.dubby-partner-art img { display:block; width:100%; height:auto; object-fit:contain; border-radius:10px; }
.dubby-partner-copy > small:first-child { display:block; letter-spacing:1px; font-size:9px; margin-bottom:8px; }
@media(max-width:1000px) { .dubby-partner-banner { grid-template-columns:1fr 1.4fr; } .dubby-partner-banner > .button { grid-column:1 / -1; text-align:center; } }
@media(max-width:600px) { .dubby-partner-banner { grid-template-columns:1fr; text-align:center; } .dubby-partner-art { width:150px; margin:auto; } }

/* Status sits beneath the brand text, retaining its live status popup. */
.site-brand-block { position:relative; flex-shrink:0; padding-bottom:16px; }
body.site-top-navigation .site-brand-block .brand-status-wrap { position:absolute; top:auto; bottom:-2px; left:51px; right:auto; transform:none; }
body.site-top-navigation .site-brand-block .brand-status-label,
body.site-top-navigation .site-brand-block .brand-status-chevron { display:inline; }
body.site-top-navigation .site-brand-block .brand-status-popover { position:fixed; top:calc(100% + 10px); left:12px; max-height:calc(100dvh - 140px); }

/* Balance the logo against the two-line name and status block. */
.site-brand-block .site-brand img { transform:translateY(8px); }

/* Center the name and status as one group beside the logo. */
.site-brand-block .site-brand > span { transform:translateY(-7px); }
body.site-top-navigation .site-brand-block .brand-status-wrap { bottom:4px; }

/* Center Status within the name column, excluding the logo and gap. */
body.site-top-navigation .site-brand-block .brand-status-wrap { right:0; display:flex; justify-content:center; }
