/* Compact desktop windows; the existing full desktop and phone layouts stay native. */
.brand>img.brand-emblem{display:none!important}
@media(min-width:761px) and (max-width:1280px){
  html .app-shell:has(.sidebar-navigation){display:block!important}
  html .app-shell:has(.sidebar-navigation)>.workspace-area{grid-column:auto;margin-left:72px!important}
  html .app-shell:has(.sidebar-navigation)>aside{position:fixed;left:0;top:0;width:72px;height:100dvh;padding:12px 8px;overflow-y:auto;overflow-x:hidden;transition:width .18s ease}
  html .app-shell:has(.sidebar-navigation)>aside.open{width:244px;padding:18px 14px;box-shadow:20px 0 60px #0008}
  html .app-shell:has(.sidebar-navigation)>.backdrop{display:block;position:fixed;inset:0;border:0;background:#0008;z-index:25}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.brand{height:52px;margin:0 0 14px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:visible;border:0;background:transparent!important}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.brand>img:not(.brand-emblem){display:none}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.brand>img.brand-emblem{display:block!important;position:static;width:48px;height:48px;max-width:100%;object-fit:contain;transform:none;mix-blend-mode:normal;filter:none}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open) .sidebar-navigation button{height:44px;min-height:44px;padding:10px;justify-content:center;gap:0}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open) .sidebar-navigation button>svg{width:20px;height:20px;flex:none}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open) .sidebar-navigation button>span:not(.sidebar-group-chevron){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open) .sidebar-group-chevron,
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.mobile-close,
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.light-sidebar-tip{display:none}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.sidebar-bottom>.side-link,
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.logout{height:44px;min-height:44px;padding:10px;justify-content:center;gap:0;font-size:0}
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.sidebar-bottom>.side-link>svg,
  html .app-shell:has(.sidebar-navigation)>aside:not(.open)>.logout>svg{width:20px;height:20px;flex:none}
  html .app-shell:has(.sidebar-navigation)>aside.open>.mobile-close{display:grid;place-items:center;position:absolute;right:9px;top:9px;border:0;background:var(--control);color:var(--text);border-radius:8px;width:32px;height:32px;cursor:pointer}
  html .app-shell:has(.sidebar-navigation) .topbar .mobile-menu{display:grid;place-items:center;flex:none;width:36px;height:36px;margin:0;border:1px solid var(--line);border-radius:8px;background:var(--control);color:var(--text);cursor:pointer}
  html .app-shell:has(.sidebar-navigation) .topbar{gap:12px;padding-inline:22px}
  html .app-shell:has(.sidebar-navigation) .page-ident{min-width:0;flex:1}
  html .app-shell:has(.sidebar-navigation) .top-actions{gap:6px;margin-left:auto;flex:none}
  html .app-shell:has(.sidebar-navigation) .top-actions .top-chip{height:40px;min-height:40px;padding:0 10px}
  html .app-shell:has(.sidebar-navigation) .top-actions .top-chip.discord,
  html .app-shell:has(.sidebar-navigation) .top-actions .theme-toggle{width:40px;height:40px;min-height:40px;padding:0}
  html .app-shell:has(.sidebar-navigation) .top-actions .top-chip.discord{justify-content:center;align-items:center;gap:0;flex-shrink:0}
  html .app-shell:has(.sidebar-navigation) .top-actions .top-chip.discord>svg{display:block;width:20px;height:20px;flex:none}
  html .app-shell:has(.sidebar-navigation) .top-actions .user-chip{width:40px;height:40px;padding:4px;justify-content:center;gap:0}
  html .app-shell:has(.sidebar-navigation) .top-actions .user-chip>div{width:30px;height:30px;flex:none}
  html .app-shell:has(.sidebar-navigation) .top-actions .top-chip>span,
  html .app-shell:has(.sidebar-navigation) .top-actions .user-chip>span{display:block;position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  html .app-shell .workspace-area:has(.dashboard-greeting)>.topbar{display:grid;grid-template-columns:36px minmax(0,1fr) auto;column-gap:12px;row-gap:10px;align-content:center;height:auto;min-height:112px;padding:16px 22px}
  html .app-shell .workspace-area:has(.dashboard-greeting)>.topbar>.mobile-menu{grid-column:1;grid-row:1}
  html .app-shell .workspace-area .dashboard-greeting{display:contents}
  html .app-shell .workspace-area .dashboard-greeting h1{grid-column:2/-1;grid-row:1;align-self:center;min-width:0;font-size:22px;line-height:1.3;white-space:normal;overflow-wrap:anywhere;letter-spacing:-.4px}
  html .app-shell .workspace-area .dashboard-greeting p{grid-column:2;grid-row:2;align-self:center;max-width:none;min-width:0;margin:0;font-size:10px;line-height:1.5;white-space:normal}
  html .app-shell .workspace-area:has(.dashboard-greeting)>.topbar>.top-actions{grid-column:3;grid-row:2;justify-self:end;margin:0}
  html .app-shell .workspace-area:has(.dashboard-greeting)>main{padding:18px 22px 60px}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid>.metric-card{grid-column:span 2;min-width:0;min-height:106px;padding:15px 14px;gap:10px}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid>.metric-card:nth-child(4),
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid>.metric-card:nth-child(5){grid-column:span 3}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid .metric-icon{width:36px;height:36px;flex:none}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid .metric-icon>svg{width:22px;height:22px}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid .metric-card>div:not(.metric-icon){min-width:0}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid strong{font-size:24px;line-height:1.2;letter-spacing:-.7px;white-space:nowrap}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid b{font-size:11px}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-metric-grid small{display:block;font-size:10px;line-height:1.5;overflow-wrap:anywhere}
  html .app-shell .workspace-area:has(.dashboard-greeting) .dashboard-main-row{grid-template-columns:minmax(0,1fr)}
  html .app-shell .workspace-area:has(.dashboard-greeting) .account-performance-panel,
  html .app-shell .workspace-area:has(.dashboard-greeting) .purple-ranking{min-height:0}
  html .app-shell .workspace-area:has(.dashboard-greeting) .account-line-chart{height:300px}
  html .app-shell .workspace-area:has(.dashboard-greeting) .account-line-chart>svg{min-height:0}
}
@media(prefers-reduced-motion:reduce){html .app-shell:has(.sidebar-navigation)>aside{transition:none}}
