  main.dash-mode{max-width:1400px}
  /* Bloque I — Dashboard de vendedor/agencia: pantalla DESKTOP-FIRST (a
     diferencia del resto de la app, que es mobile-first) con barra
     lateral fija — reemplaza el apilado suelto de tarjetas que tenían
     antes vendedorView/agencyAdminView. Mismo esquema de color que el
     resto (--accent/--surface/--border); el azul/naranja de marca quedan
     como acento puntual (barra activa, alertas), nunca como bloque
     grande — pedido explícito ("tono profesional y sobrio").
     .dash-shell rompe el max-width de <main> con márgenes negativos
     (mismo truco que .auth-screen) para poder usar todo el ancho en
     escritorio; en mobile la barra lateral pasa a ser una tira
     horizontal scrolleable en vez de un cajón hamburguesa aparte —
     simplificación consciente, sigue siendo usable, no es una réplica
     1:1 de un drawer nativo. */
  .dash-shell{display:flex;margin:-20px;min-height:calc(100vh - 61px)}
  @media (max-width:600px){.dash-shell{margin:-10px}}
  .dash-sidebar{width:216px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);min-height:calc(100vh - 61px);padding:16px 10px;position:sticky;top:61px;align-self:flex-start}
  .dash-nav-btn{display:flex;align-items:center;gap:10px;width:100%;background:transparent;color:var(--muted);border:none;text-align:left;padding:10px 12px;margin:0 0 2px;border-radius:var(--radius-sm);font-weight:700;font-size:13.5px;min-height:0}
  .dash-nav-btn:hover{background:var(--surface-2);color:var(--ink)}
  .dash-nav-btn.active{background:var(--accent-light);color:var(--accent-dark)}
  .dash-nav-btn .dash-nav-icon{font-size:15px;width:18px;text-align:center;flex-shrink:0}
  .dash-content{flex:1;min-width:0;padding:20px;max-width:1180px}
  @media (max-width:760px){
    .dash-shell{flex-direction:column}
    .dash-sidebar{position:static;width:100%;min-height:0;display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:2px;padding:8px;border-right:none;border-bottom:1px solid var(--border)}
    .dash-nav-btn{width:auto;white-space:nowrap;flex-shrink:0}
  }

  .dash-alerts{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}
  .dash-alert-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--radius-sm);background:var(--brand-orange-light);border:1px solid #ffdbb0;cursor:pointer;font-size:13px;font-weight:600;color:#7a4a12}
  .dash-alert-item:hover{filter:brightness(.97)}
  .dash-alert-icon{font-size:15px;flex-shrink:0}

  .dash-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px}
  .dash-metric-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;cursor:pointer;transition:border-color .15s,box-shadow .15s;margin:0;display:block;text-align:left;min-height:0}
  .dash-metric-card:hover{background:var(--surface);border-color:var(--accent);box-shadow:var(--shadow-sm)}
  .dash-metric-value{font-size:26px;font-weight:800;color:var(--ink);letter-spacing:-.5px;line-height:1.1}
  .dash-metric-label{font-size:12px;color:var(--muted);font-weight:600;margin-top:4px}

  .dash-section-title{font-size:14px;font-weight:700;margin:0 0 10px}
  .dash-table-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:20px}
  .dash-table-wrap table{font-size:13px;margin:0}
  .dash-table-wrap th{cursor:pointer;user-select:none;white-space:nowrap}
  .dash-table-wrap th:hover{color:var(--ink)}
  .dash-table-wrap th .sort-arrow{opacity:.35;margin-left:3px;font-size:10px}
  .dash-table-wrap th.sorted .sort-arrow{opacity:1;color:var(--accent)}
  .dash-table-wrap tbody tr{cursor:pointer}
  .dash-table-wrap tbody tr:hover{background:var(--surface-2)}
  .dash-table-toolbar{display:flex;gap:8px;padding:12px 14px;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--border)}
  .dash-table-toolbar input[type=search]{flex:1;min-width:160px;margin:0}
  .dash-quick-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px}
  .dash-quick-actions button{margin-top:0}

  .dash-clients-layout{display:flex;gap:16px;align-items:flex-start}
  .dash-clients-list{width:280px;flex-shrink:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);max-height:70vh;overflow-y:auto}
  .dash-client-row{padding:10px 14px;border-bottom:1px solid var(--border);cursor:pointer;display:flex;align-items:center;gap:10px;font-size:13.5px}
  .dash-client-row:hover{background:var(--surface-2)}
  .dash-client-row.active{background:var(--accent-light)}
  .dash-client-detail{flex:1;min-width:0}
  @media (max-width:760px){.dash-clients-layout{flex-direction:column}.dash-clients-list{width:100%;max-height:240px}}
