html, body { scrollbar-width: none; }
html::-webkit-scrollbar, body::-webkit-scrollbar { width: 0; height: 0; }
#topnav { padding: 14px 4vw; gap: 24px; background: var(--bg); }
#topnav .brand { flex-shrink: 0; }
#topnav .nav-tabs { margin: 0 auto; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 12px; }
#topnav .nav-tab { padding: 10px 12px; border-radius: 8px; font-size: 12px; white-space: nowrap; }
#topnav .nav-tab.active { background: var(--surface-2, #292929); color: var(--text); }
#topnav .nav-tab.active::after { display: none; }
#topnav .nav-right { gap: 8px; }
#topnav .nav-icon-btn { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 10px; }
#topnav .avatar { width: 38px; height: 38px; border-radius: 12px; margin-left: 4px; }
#settings-drawer #theme-switch { display: flex; gap: 8px; }
#settings-drawer .theme-btn { width: auto; height: auto; padding: 10px 16px; border-radius: 8px; }
.password-reset-panel { margin: 16px 0; font-size: 13px; }
.password-reset-panel summary { cursor: pointer; color: var(--muted); }
.password-reset-panel form { padding-top: 16px; }
#password-status, #reset-password-status { font-size: 13px; line-height: 1.6; margin-top: 12px; }
@media (max-width: 1150px) {
  #topnav { flex-wrap: wrap; gap: 12px; }
  #topnav .nav-right { margin-left: auto; }
  #topnav .nav-tabs { order: 3; width: 100%; display: flex; flex-wrap: wrap; overflow: visible; }
  #topnav .nav-tab { flex: 1; text-align: center; }
}
@media (max-width: 520px) {
  #topnav { padding: 12px 16px; }
  #topnav .brand { font-size: 11px; gap: 7px; }
  #topnav .nav-right { gap: 5px; }
  #topnav .nav-tab { padding: 9px 7px; font-size: 11px; }
  #topnav .nav-tabs { gap: 2px; }
}
/* One shared highlight moves between the selected controls. */
#topnav .nav-tabs,.settings-nav { position:relative;isolation:isolate; }
.selection-indicator { position:absolute;left:0;top:0;pointer-events:none;background:var(--surface-2);border-radius:8px;z-index:-1;transition:transform .36s cubic-bezier(.22,1,.36,1),width .36s cubic-bezier(.22,1,.36,1),height .36s cubic-bezier(.22,1,.36,1); }
#topnav .nav-tab.active { background:transparent; }
#settings-drawer { width:860px;padding:0;border-radius:20px;overflow:auto; }
#settings-drawer .drawer-head { padding:26px 30px;margin:0;border-bottom:1px solid var(--line); }
#settings-drawer .drawer-title { font-size:24px; }
#settings-drawer .profile-eyebrow { display:none; }
#settings-drawer .account-layout { grid-template-columns:170px minmax(0,1fr);gap:0;margin:0;min-height:510px; }
.settings-nav { display:flex;flex-direction:column;align-self:start;gap:6px;margin:22px 14px; }
.settings-nav button { text-align:left;padding:13px 16px;border:0;border-radius:8px;background:transparent;color:var(--muted);font:inherit;font-size:13px;cursor:pointer; }
.settings-nav button.active { color:var(--text);font-weight:600; }
.settings-content { border-left:1px solid var(--line);padding:28px 32px;min-width:0; }
#settings-drawer .settings-section { border:0;border-radius:0;padding:0;margin:0; }
#settings-drawer .settings-panel > .settings-section + .settings-section { margin-top:28px;padding-top:24px;border-top:1px solid var(--line); }
#settings-drawer .settings-label { font-size:19px;letter-spacing:-.4px;margin-bottom:12px; }
#settings-drawer .account-picture-row { padding:20px;background:var(--surface-2);border-radius:14px;margin-top:20px; }
#settings-drawer .account-picture-row .avatar-preview { width:76px;height:76px;border-radius:22px; }
#settings-drawer .field input { border-radius:9px;padding:12px 14px; }
#settings-drawer .account-divider { margin:24px 0; }
#settings-drawer .btn { border-radius:9px;min-height:40px; }
#hero-controls { display:flex;align-items:center;gap:14px;margin-top:24px;font-size:12px;color:var(--muted); }
#hero-controls[hidden],.settings-panel[hidden] { display:none; }
#hero-controls button { width:34px;height:34px;border:1px solid var(--line);border-radius:50%;background:var(--bg);color:var(--text);cursor:pointer;font-size:18px; }
#hero-controls button:hover { background:var(--surface-2); }
@media(max-width:650px) {
  #settings-drawer .drawer-head { padding:20px; }
  #settings-drawer .account-layout { display:flex;flex-direction:column;min-height:0; }
  .settings-nav { flex-direction:row;flex-wrap:wrap;margin:12px;gap:2px;align-self:stretch; }
  .settings-nav button { flex:1;text-align:center;padding:11px 7px;font-size:12px; }
  .settings-content { border-left:0;border-top:1px solid var(--line);padding:22px 20px; }
  #settings-drawer .account-picture-row { padding:14px;gap:12px; }
}
@media(prefers-reduced-motion:reduce) { .selection-indicator { transition:none; } }
