/* A compact rail on larger windows; the existing mobile drawer stays intact. */
.app-shell .fv-sidebar-toggle { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; color: var(--muted); border: 1px solid var(--control-line); background: var(--surface); }
.app-shell .fv-sidebar-toggle:hover { color: var(--gold-hover); border-color: var(--gold); background: var(--surface-raised); }
.app-shell .sidebar, .app-shell .main-column { transition: width .2s ease, margin-left .2s ease; }
.app-shell .sidebar { overflow-x: hidden; }
.app-shell .overview-layout.overview-priority { grid-template-columns: minmax(0, 1fr); }
.app-shell .overview-priority > .chart-card { order: -1; }
.app-shell .overview-priority > .attention-card { min-width: 0; }
.app-shell .overview-priority .pure-chart { min-height: 340px; height: clamp(340px, 32vw, 420px); margin-top: 20px; }
.app-shell .overview-priority .pure-chart svg { display: block; width: 100%; height: 100%; overflow: visible; }
.app-shell .overview-priority .chart-key { gap: 24px; font-size: 13px; margin-top: 20px; }
.app-shell .overview-priority .chart-caption { line-height: 1.65; margin-top: 14px; }
.app-shell .overview-priority .attention-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 24px; }
.app-shell .overview-priority .attention-list button { min-width: 0; }
@media (min-width: 781px) {
  .app-shell.sidebar-retracted { --workspace-sidebar: 80px; }
  .app-shell.sidebar-retracted .sidebar { width: 80px; padding: 22px 10px 18px; }
  .app-shell.sidebar-retracted .main-column { margin-left: 80px; }
  .app-shell.sidebar-retracted .sidebar-logo { padding: 0 0 22px; display: flex; justify-content: center; }
  .app-shell.sidebar-retracted .sidebar-logo .brand { display: block; width: 38px; height: 38px; background: url('./assets/brand/fitness-vault-ph-logo-icon.svg') center/contain no-repeat; }
  .app-shell.sidebar-retracted .brand-wordmark { display: none; }
  .app-shell.sidebar-retracted .workspace-switch { justify-content: center; padding: 8px 0; margin-bottom: 16px; border-color: transparent; background: transparent; }
  .app-shell.sidebar-retracted .workspace-name, .app-shell.sidebar-retracted .workspace-switch > svg { display: none; }
  .app-shell.sidebar-retracted .sidebar-nav { padding-inline: 0; gap: 10px; }
  .app-shell.sidebar-retracted .nav-group { display: grid; gap: 6px; }
  .app-shell.sidebar-retracted .nav-caption, .app-shell.sidebar-retracted .nav-more > summary { display: none; }
  .app-shell.sidebar-retracted .nav-more { padding-block: 10px 0; }
  .app-shell.sidebar-retracted .nav-more > div { gap: 6px; padding-top: 0; }
  .app-shell.sidebar-retracted .nav-item { justify-content: center; min-width: 44px; min-height: 46px; padding: 12px; gap: 0; }
  .app-shell.sidebar-retracted .nav-item > span, .app-shell.sidebar-retracted .nav-item > small, .app-shell.sidebar-retracted .nav-item .new-dot { display: none; }
  .app-shell.sidebar-retracted .nav-item > svg { width: 21px; height: 21px; flex: 0 0 21px; }
  .app-shell.sidebar-retracted .sidebar-trial { display: none; }
  .app-shell.sidebar-retracted .sidebar-bottom { padding-top: 14px; }
  .app-shell.sidebar-retracted .profile-chip { justify-content: center; gap: 0; padding-top: 14px; }
  .app-shell.sidebar-retracted .profile-chip > span:nth-child(2), .app-shell.sidebar-retracted .profile-chip > svg { display: none; }
}
@media (max-width: 900px) {
  .app-shell .overview-priority .attention-list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 780px) {
  .app-shell .fv-sidebar-toggle { display: none; }
  .app-shell .overview-priority .pure-chart { min-height: 260px; height: 260px; }
  .app-shell .overview-priority .chart-key { gap: 16px; flex-wrap: wrap; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .app-shell .sidebar, .app-shell .main-column { transition: none; }
}
@media print {
  .app-shell .fv-sidebar-toggle { display: none !important; }
  .app-shell.sidebar-retracted .main-column { margin-left: 0 !important; }
}
