/* Compact desktop windows keep the desktop navigation, but give it real space. */
@media (min-width:761px) and (max-width:1240px) {
  :root {--left:205px;--right:0px}
  .app-layout {grid-template-columns:minmax(0,205px) minmax(0,1fr)}
  .context-rail {display:none}
  .calendar-sidebar {min-width:0}
  .mini-grid {grid-template-columns:repeat(7,minmax(0,1fr));min-width:0}
  .mini-grid button {width:min(27px,100%)}
}

@media (min-width:761px) and (max-width:1100px) {
  .app-header .brand,
  .dashboard-mode .app-header .brand {
    width:44px;
    min-width:44px;
    overflow:hidden;
  }
  .app-header .brand .uptodo-logo,
  .dashboard-mode .app-header .brand .uptodo-logo {font-size:29px}
  .app-header .brand .uptodo-word,
  .app-header .brand .uptodo-clockword {display:none}
  .desktop-nav,
  .dashboard-mode .desktop-nav {min-width:0;justify-content:flex-start;gap:clamp(7px,1.2vw,15px)}
  .desktop-nav button,
  .dashboard-mode .desktop-nav button {flex:none;gap:6px}
  .header-actions,
  .dashboard-mode .header-actions {flex:none}
  .app-header .account-chip,
  .dashboard-mode .app-header .account-chip {width:49px;min-width:49px;min-height:49px;padding:3px;justify-content:center;gap:0}
  .app-header .account-chip .avatar,
  .dashboard-mode .app-header .account-chip .avatar {width:42px;height:42px}
  .app-header .account-chip>span:not(.avatar),
  .app-header .account-chip>.account-chevron {display:none}
}

@media (min-width:761px) and (max-width:980px) {
  .dashboard-priority {
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:16px 22px;
    padding:22px 180px 22px 24px;
  }
  .dashboard-priority-label {grid-column:1/-1;grid-row:auto}
  .dashboard-priority-when {grid-column:1;grid-row:auto}
  .dashboard-priority-marker {display:none}
  .dashboard-priority-main {grid-column:2;grid-row:auto}
  .dashboard-priority-action {grid-column:1/-1;grid-row:auto}
  .dashboard-priority.is-empty .dashboard-priority-main {grid-column:1/-1;grid-row:auto}
  .dashboard-priority-meta {flex-wrap:wrap}
  .dashboard-priority-meta small {font-size:15px}
  .dashboard-books {top:36px;right:0;width:160px;height:110px}
}

@media (min-width:761px) and (max-width:900px) {
  .dashboard-workspace {grid-template-columns:minmax(0,1fr)}
  .dashboard-today,.dashboard-family {min-height:0}
  .dashboard-insights {grid-column:1;grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-goal {grid-column:1/-1}
  .dashboard-mode .app-layout {padding:16px}
  .dashboard-priority {padding-right:150px}
  .dashboard-books {width:135px;height:96px}
}

@media (min-width:761px) and (max-width:820px) {
  .app-header,.dashboard-mode .app-header {padding-inline:12px}
  .desktop-nav button,.dashboard-mode .desktop-nav button {font-size:12px}
  .desktop-nav button .icon,.dashboard-mode .desktop-nav button .icon {width:20px;height:20px}
  .dashboard-priority {grid-template-columns:minmax(0,1fr);padding-right:140px}
  .dashboard-priority-when,.dashboard-priority-main {grid-column:1}
  .dashboard-priority-main {grid-row:auto}
  .dashboard-priority.is-empty .dashboard-priority-main {grid-column:1}
  .dashboard-insights {grid-template-columns:minmax(0,1fr)}
  .dashboard-goal {grid-column:1}
}

/* Keep the persistent logo and language controls from covering each other. */
.brand-picker,.auth-mode .brand-picker {bottom:62px}
@media (max-width:760px) {
  .brand-picker {bottom:calc(126px + env(safe-area-inset-bottom))}
  .auth-mode .brand-picker {bottom:62px}
}
