/* ---------- MI INBOX (15-oct-2026) ----------
   La estructura de iCloud Mail con el cristal de la casa: barra lateral de
   buzones y carpetas, lista en medio y lectura a la derecha con su barra de
   botones. En el teléfono una sola columna: la barra lateral entra por la
   izquierda y abrir un correo lo pone delante. Sólo tokens de la casa: sirve
   en claro y en oscuro. */

.correo-vacio{margin:var(--sp-5) auto;color:var(--text-muted);font-size:var(--fs-sm);text-align:center}
.correo-nada-grande{margin:auto;padding:var(--sp-6) var(--sp-4);text-align:center;font-family:var(--font-display);
  font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--text-muted)}

/* Sin bandeja todavía */
.correo-sin{max-width:560px;margin:var(--sp-4) auto 0;text-align:center;display:flex;flex-direction:column;
  align-items:center;gap:var(--sp-3);padding:var(--sp-6) var(--sp-5)}
.correo-sin h3{margin:0;font-family:var(--font-display);color:var(--text-title)}
.correo-sin p{margin:0;color:var(--text-muted)}
.correo-sin .boton{gap:var(--sp-2)}
.correo-sin-icono{width:68px;height:68px;border-radius:50%;display:inline-flex;align-items:center;
  justify-content:center;color:var(--brand-primary);background:var(--surface-tint)}

/* Los botones redondos de icono, los de toda la bandeja */
.correo-icono{flex:none;width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  color:var(--brand-primary);cursor:pointer;border:1px solid transparent;background:transparent;
  transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.correo-icono:hover:not(:disabled){background:var(--surface-tint)}
.correo-icono:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}
.correo-icono:disabled{opacity:.35;cursor:default}
.correo-icono.pequeno{width:28px;height:28px}
.correo-icono.encendido{background:var(--brand-primary);color:var(--text-onbrand)}
.correo-icono.peligro{color:var(--danger-500)}
.solo-movil{display:none}

/* ---------- El armazón: tres columnas ---------- */
.correo{position:relative;display:grid;grid-template-columns:220px minmax(260px,320px) minmax(0,1fr);
  margin-top:var(--sp-4);height:clamp(540px, calc(100svh - 210px), 920px);border-radius:var(--radius-xl);overflow:hidden;
  background:var(--cristal);border:1px solid var(--cristal-borde);
  backdrop-filter:var(--cristal-velo);-webkit-backdrop-filter:var(--cristal-velo);
  transition:grid-template-columns var(--dur-base) var(--ease-standard)}
.correo.lateral-plegado{grid-template-columns:0 minmax(260px,360px) minmax(0,1fr)}
.correo.lateral-plegado .correo-lateral{visibility:hidden}
.correo-lateral,.correo-lista,.correo-lectura{min-height:0;min-width:0;display:flex;flex-direction:column}
.correo-velo{display:none}

/* La barra lateral */
.correo-lateral{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:var(--sp-2) var(--sp-2) var(--sp-3);
  background:color-mix(in srgb,var(--surface-tint) 55%,transparent);border-right:1px solid var(--border-subtle)}
.correo-lateral-cabeza{display:flex;justify-content:space-between;margin-bottom:var(--sp-2)}
.correo-buzones{display:flex;flex-direction:column;gap:2px}
.correo-buzon{display:flex;align-items:center;gap:var(--sp-3);width:100%;padding:8px var(--sp-3);border-radius:var(--radius-md);
  font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-body);text-align:left;cursor:pointer;
  transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.correo-buzon svg{flex:none;color:var(--brand-primary)}
.correo-buzon > span:not(.correo-punto){flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.correo-buzon em{font-style:normal;font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--text-muted)}
.correo-buzon:hover{background:var(--surface-tint)}
.correo-buzon.activo{background:var(--brand-primary);color:var(--text-onbrand)}
.correo-buzon.activo svg,.correo-buzon.activo em{color:var(--text-onbrand)}
.correo-buzon.activo .correo-punto svg{color:var(--text-onbrand)}
.correo-buzon.es-vip svg{color:var(--warning-500, #D9A441)}
.correo-buzon.es-vip.activo svg{color:var(--text-onbrand)}
.correo-carpetas-cabeza{display:flex;align-items:center;justify-content:space-between;margin:var(--sp-4) var(--sp-2) var(--sp-1) var(--sp-3);
  font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--text-muted)}
.correo-carpetas-nada{margin:var(--sp-1) var(--sp-3);font-size:var(--fs-xs);color:var(--text-muted)}
.correo-punto{display:inline-flex;color:var(--color)}
.correo-punto svg{color:var(--color)}
.correo-lateral-pie{margin:auto var(--sp-3) 0;padding-top:var(--sp-4);font-size:11px;color:var(--text-muted);overflow-wrap:anywhere}

/* La lista */
.correo-lista{border-right:1px solid var(--border-subtle)}
.correo-buscador{display:flex;align-items:center;gap:var(--sp-2);margin:var(--sp-3) var(--sp-3) 0;padding:7px var(--sp-3);
  border-radius:999px;background:var(--surface-tint);border:1px solid var(--border-subtle);color:var(--text-muted)}
.correo-buscador:focus-within{border-color:var(--brand-primary)}
.correo-buscador input{flex:1;min-width:0;border:0;background:none;outline:none;font:inherit;font-size:var(--fs-sm);color:var(--text-title)}
.correo-lista-titulo{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-3) var(--sp-2) var(--sp-4);
  border-bottom:1px solid var(--border-subtle)}
.correo-lista-titulo > div{flex:1;min-width:0}
.correo-lista-titulo h3{margin:0;font-family:var(--font-display);font-size:var(--fs-h4);color:var(--text-title);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.correo-lista-titulo p{margin:0;font-size:var(--fs-xs);color:var(--text-muted)}
.correo-filas{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;display:flex;flex-direction:column}
.correo-fila{display:flex;align-items:flex-start;gap:6px;width:100%;padding:var(--sp-3) var(--sp-3) var(--sp-3) var(--sp-2);
  text-align:left;cursor:pointer;border-bottom:1px solid var(--border-subtle);
  transition:background var(--dur-fast) var(--ease-standard)}
.correo-fila:hover{background:var(--surface-tint)}
.correo-fila.abierta{background:color-mix(in srgb,var(--brand-primary) 13%,transparent)}
.correo-fila-marca{flex:none;width:14px;display:flex;justify-content:center;padding-top:5px;color:var(--warning-500, #D9A441)}
.correo-azul{display:block;width:9px;height:9px;border-radius:50%;background:var(--brand-primary)}
.correo-fila-texto{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.correo-fila-arriba{display:flex;align-items:baseline;gap:var(--sp-2)}
.correo-fila-quien{flex:1;min-width:0;font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-title);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.correo-fila-clip{flex:none;color:var(--text-muted)}
.correo-fila time{flex:none;font-size:11px;color:var(--text-muted)}
.correo-fila-asunto{font-size:var(--fs-sm);color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.correo-fila-asunto small{font-size:11px;font-weight:var(--fw-semibold);color:var(--text-muted)}
.correo-fila-resumen{font-size:var(--fs-xs);color:var(--text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.correo-fila.sin-leer .correo-fila-quien,.correo-fila.sin-leer .correo-fila-asunto{font-weight:var(--fw-bold);color:var(--text-title)}
.correo-borrador-rotulo{flex:none;font-size:var(--fs-xs);color:var(--danger-500)}
.correo-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.correo-chip{font-size:10px;font-weight:var(--fw-semibold);padding:1px 8px;border-radius:999px;
  color:var(--color);background:color-mix(in srgb,var(--color) 15%,transparent)}
.correo-mas{align-self:center;margin:var(--sp-3) 0}
.densidad-compacta .correo-fila{padding-top:var(--sp-2);padding-bottom:var(--sp-2)}
.densidad-compacta .correo-fila-texto{flex-direction:row;flex-wrap:wrap;column-gap:var(--sp-2)}
.densidad-compacta .correo-fila-arriba{flex:1 1 100%}

/* La lectura */
.correo-lectura{background:color-mix(in srgb,var(--surface-card) 45%,transparent)}
.correo-barra{display:flex;align-items:center;gap:var(--sp-1);padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--border-subtle)}
.correo-barra-centro{flex:1;display:flex;align-items:center;justify-content:center;gap:2px;min-width:0}
.correo-menu-caja{position:relative}
.correo-menu{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);z-index:20;min-width:220px;max-height:60vh;
  overflow-y:auto;padding:var(--sp-1);border-radius:var(--radius-lg);background:var(--surface-card);
  border:1px solid var(--border-subtle);box-shadow:var(--shadow-xl)}
.correo-menu[hidden]{display:none}
.correo-menu-derecha{left:auto;right:0;transform:none}
.correo-menu p{margin:var(--sp-2) var(--sp-3) 2px;font-size:11px;font-weight:var(--fw-bold);color:var(--text-muted)}
.correo-menu button{display:flex;align-items:center;gap:var(--sp-2);width:100%;padding:8px var(--sp-3);border-radius:var(--radius-md);
  font-size:var(--fs-sm);color:var(--text-body);text-align:left;cursor:pointer}
.correo-menu button svg{flex:none;color:var(--brand-primary)}
.correo-menu button span{flex:1}
.correo-menu button b{color:var(--brand-primary)}
.correo-menu button:hover{background:var(--surface-tint)}
.correo-leido{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:var(--sp-4) var(--sp-5) var(--sp-5)}
.correo-asunto{margin:0 0 var(--sp-2);font-family:var(--font-display);font-size:var(--fs-h3);color:var(--text-title);overflow-wrap:anywhere}
.correo-leido > .correo-chips{margin-bottom:var(--sp-3)}
.correo-mensaje{margin-top:var(--sp-3);border-radius:var(--radius-lg);background:var(--surface-card);border:1px solid var(--border-subtle);overflow:hidden}
.correo-mensaje.mio{border-color:color-mix(in srgb,var(--brand-primary) 30%,var(--border-subtle))}
.correo-mensaje header{display:flex;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4)}
.correo-avatar{flex:none;width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--text-onbrand);background:var(--brand-primary)}
.correo-avatar.pequeno{width:32px;height:32px;font-size:11px}
.correo-mensaje-quien{flex:1;min-width:0;display:flex;flex-direction:column;font-size:var(--fs-sm);color:var(--text-title)}
.correo-mensaje-quien span{font-size:var(--fs-xs);color:var(--text-muted);overflow-wrap:anywhere}
.correo-mensaje header time{flex:none;font-size:11px;color:var(--text-muted);text-align:right}
.correo-estrella{display:inline-flex;vertical-align:-2px;color:var(--warning-500, #D9A441)}
.correo-marco{display:block;width:100%;min-height:60px;border:0;background:#fff;border-top:1px solid var(--border-subtle)}
.correo-imagenes{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;padding:var(--sp-2) var(--sp-4);font-size:var(--fs-xs);
  color:var(--text-body);background:var(--surface-tint);border-top:1px solid var(--border-subtle)}
.correo-imagenes svg{flex:none;color:var(--brand-primary)}
.correo-imagenes span{flex:1;min-width:180px}
.correo-imagenes button{font-weight:var(--fw-bold);color:var(--brand-primary);cursor:pointer}
.correo-adjuntos{list-style:none;margin:0;padding:var(--sp-2) var(--sp-4);display:flex;flex-wrap:wrap;gap:var(--sp-2);
  border-top:1px solid var(--border-subtle)}
.correo-adjuntos li{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;
  font-size:var(--fs-xs);color:var(--text-body);background:var(--surface-tint)}
.correo-adjuntos small{color:var(--text-muted)}

/* ---------- Ventanas: redactar y ajustes ---------- */
.correo-modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:var(--sp-4)}
.correo-modal[hidden]{display:none}
#correo-redaccion{background:color-mix(in srgb,#000 28%,transparent)}
.correo-fondo{position:absolute;inset:0;background:color-mix(in srgb,#000 32%,transparent)}
.correo-ventana{position:relative;display:flex;flex-direction:column;border-radius:var(--radius-xl);background:var(--surface-card);
  border:1px solid var(--border-subtle);box-shadow:var(--shadow-xl);overflow:hidden;animation:correo-entra var(--dur-base) var(--ease-standard)}
@keyframes correo-entra{from{opacity:0;transform:translateY(12px) scale(.98)}}
.correo-ventana-cabeza{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--border-subtle)}
.correo-ventana-cabeza h3{flex:1;margin:0;font-family:var(--font-display);font-size:var(--fs-body);color:var(--text-title);text-align:center}
.correo-ventana-cabeza .boton{gap:6px;padding-block:8px}

.correo-redactar{width:min(720px,100%);height:min(640px, calc(100svh - 48px))}
.correo-campos{display:flex;flex-direction:column}
.correo-campo{display:flex;align-items:center;gap:var(--sp-3);margin:0 var(--sp-4);padding:8px 0;border-bottom:1px solid var(--border-subtle)}
.correo-campo > span{flex:none;width:58px;font-size:var(--fs-sm);color:var(--text-muted)}
.correo-campo input{flex:1;min-width:0;border:0;background:none;outline:none;font:inherit;font-size:var(--fs-sm);color:var(--text-title);padding:4px 0}
.correo-campo-fijo{flex:1;min-width:0;margin:0;padding:4px 0;font-size:var(--fs-sm);color:var(--text-title);overflow-wrap:anywhere}
.correo-campo.oculto-cc{display:none}
.correo-enlace{align-self:flex-end;margin:4px var(--sp-4) 0;font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--brand-primary);cursor:pointer}
.correo-texto{flex:1;min-height:160px;margin:0;padding:var(--sp-3) var(--sp-4);border:0;resize:none;outline:none;
  background:none;font:inherit;font-size:var(--fs-sm);line-height:1.6;color:var(--text-title)}
.correo-ventana-pie{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-top:1px solid var(--border-subtle)}
.correo-ventana-pie span{flex:1;font-size:var(--fs-xs);color:var(--text-muted)}
.correo-ventana-pie span.peligro{color:var(--danger-500)}

/* Ajustes, con el menú a la izquierda como iCloud */
.correo-ajustes{flex-direction:row;width:min(860px,100%);height:min(620px, calc(100svh - 48px))}
.correo-ajustes-menu{flex:none;width:230px;display:flex;flex-direction:column;gap:2px;padding:var(--sp-3) var(--sp-2);
  overflow-y:auto;background:var(--surface-tint);border-right:1px solid var(--border-subtle)}
.correo-ajustes-menu > .correo-icono{margin:0 0 var(--sp-2) var(--sp-1)}
.correo-ajustes-opcion{display:flex;align-items:center;gap:var(--sp-3);width:100%;padding:9px var(--sp-3);border-radius:var(--radius-md);
  font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-body);text-align:left;cursor:pointer}
.correo-ajustes-opcion svg{flex:none;color:var(--brand-primary)}
.correo-ajustes-opcion:hover{background:color-mix(in srgb,var(--brand-primary) 9%,transparent)}
.correo-ajustes-opcion.activa{background:var(--surface-card);color:var(--text-title);box-shadow:0 1px 3px color-mix(in srgb,#000 10%,transparent)}
.correo-ajustes-cuerpo{flex:1;min-width:0;overflow-y:auto;overscroll-behavior:contain;padding:var(--sp-5) var(--sp-6) var(--sp-6)}
.correo-ajustes-cuerpo h3{margin:0 0 var(--sp-3);font-family:var(--font-display);font-size:var(--fs-h3);color:var(--text-title)}
.correo-ajustes-cuerpo h4{margin:var(--sp-5) 0 var(--sp-2);font-family:var(--font-display);color:var(--text-title)}
.correo-ajuste-bloque{display:flex;flex-direction:column;gap:var(--sp-2);margin-top:var(--sp-4);padding:var(--sp-4);
  border-radius:var(--radius-lg);background:var(--surface-tint);border:1px solid var(--border-subtle)}
.correo-ajuste-bloque .boton{align-self:flex-start}
.correo-ajuste-rotulo{margin:0;font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--text-title)}
.correo-ajuste-valor{margin:0;font-size:var(--fs-body);color:var(--brand-primary);font-weight:var(--fw-semibold);overflow-wrap:anywhere}
.correo-ajuste-ayuda{margin:0;font-size:var(--fs-xs);color:var(--text-muted)}
.correo-ajuste-fila{display:flex;gap:var(--sp-2);align-items:center}
.correo-ajuste-fila .correo-entrada{flex:1}
.correo-entrada{min-width:0;width:100%;padding:9px var(--sp-3);border-radius:var(--radius-md);border:1px solid var(--border-strong);
  background:var(--surface-card);font:inherit;font-size:var(--fs-sm);color:var(--text-title)}
.correo-entrada:focus{outline:none;border-color:var(--brand-primary)}
.correo-firma{resize:vertical;margin-top:var(--sp-2)}
.correo-casilla{display:flex;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1px solid var(--border-subtle);cursor:pointer}
.correo-casilla input{margin-top:3px;accent-color:var(--brand-primary);width:17px;height:17px;flex:none}
.correo-casilla > span{flex:1;display:flex;flex-direction:column;gap:2px;font-size:var(--fs-sm);color:var(--text-title)}
.correo-casilla b{font-weight:var(--fw-semibold)}
.correo-casilla small{font-size:var(--fs-xs);color:var(--text-muted)}
.correo-ajuste-bloque .correo-casilla:last-child{border-bottom:0;padding-bottom:0}
.correo-casilla-fila{align-items:center;cursor:default}
.correo-casilla-fila .correo-entrada{width:auto;flex:none}
.correo-ajuste-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-2)}
.correo-ajuste-lista li{display:flex;align-items:center;gap:var(--sp-2)}
.correo-ajuste-lista .correo-entrada{flex:1}
.correo-ajuste-texto{flex:1;min-width:0;display:flex;flex-direction:column;font-size:var(--fs-sm);color:var(--text-title);overflow-wrap:anywhere}
.correo-ajuste-texto small{font-size:var(--fs-xs);color:var(--text-muted)}
.correo-bandejas li{padding:var(--sp-2);border-radius:var(--radius-md);background:var(--surface-card)}
.correo-bandejas .boton{padding:6px 12px;font-size:var(--fs-xs)}
.correo-colores{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.correo-color{width:26px;height:26px;border-radius:50%;background:var(--color);cursor:pointer;border:2px solid transparent;
  box-shadow:inset 0 0 0 2px var(--surface-card)}
.correo-color.elegido{border-color:var(--color)}
.correo-medidor{height:8px;border-radius:999px;background:var(--surface-tint);overflow:hidden;margin:var(--sp-2) 0 4px;border:1px solid var(--border-subtle)}
.correo-medidor span{display:block;height:100%;border-radius:inherit;background:var(--brand-primary)}
.correo-direccion{display:flex;align-items:center;gap:var(--sp-2)}
.correo-direccion .correo-entrada{flex:1}
.correo-direccion span{flex:none;font-size:var(--fs-sm);color:var(--text-muted)}

/* El aviso de abajo, con su «Deshacer» */
.correo-tostada{position:fixed;left:50%;bottom:var(--sp-5);z-index:120;display:flex;align-items:center;gap:var(--sp-4);
  max-width:calc(100vw - 32px);padding:10px var(--sp-4);border-radius:999px;font-size:var(--fs-sm);
  color:var(--surface-card);background:var(--text-title);box-shadow:var(--shadow-xl);
  opacity:0;pointer-events:none;transform:translate(-50%,12px);transition:opacity var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard)}
.correo-tostada.visible{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.correo-tostada.peligro{background:var(--danger-500);color:#fff}
.correo-tostada button{font-weight:var(--fw-bold);color:inherit;text-decoration:underline;cursor:pointer}

/* ---------- Tableta: sin la barra lateral fija ---------- */
@media (max-width:1024px){
  .correo{grid-template-columns:200px minmax(240px,320px) minmax(0,1fr)}
  .correo-leido{padding:var(--sp-3) var(--sp-4) var(--sp-4)}
}

/* ---------- Teléfono: una columna ---------- */
@media (max-width:720px){
  .solo-movil{display:inline-flex}
  .solo-pc{display:none}
  .correo,.correo.lateral-plegado{display:block;height:clamp(520px, calc(100svh - 150px), 900px)}
  .correo-lista,.correo-lectura{position:absolute;inset:0;border-right:0}
  .correo-lectura{display:none}
  .correo.leyendo .correo-lectura{display:flex}
  .correo.leyendo .correo-lista{display:none}
  .correo-lateral,.correo.lateral-plegado .correo-lateral{position:absolute;top:0;bottom:0;left:0;z-index:5;width:min(280px,82%);visibility:hidden;
    background:var(--surface-card);transform:translateX(-102%);transition:transform var(--dur-base) var(--ease-standard),visibility 0s var(--dur-base)}
  .correo.con-lateral .correo-lateral{visibility:visible;transform:none;transition:transform var(--dur-base) var(--ease-standard)}
  .correo-velo{display:block;position:absolute;inset:0;z-index:4;background:color-mix(in srgb,#000 30%,transparent);
    opacity:0;pointer-events:none;transition:opacity var(--dur-base) var(--ease-standard)}
  .correo.con-lateral .correo-velo{opacity:1;pointer-events:auto}
  .correo-lista-titulo{padding-left:var(--sp-2)}
  .correo-barra{padding:var(--sp-2)}
  .correo-barra-centro{justify-content:flex-end}
  .correo-leido{padding:var(--sp-3)}
  .correo-asunto{font-size:var(--fs-h4)}
  .correo-mensaje header{padding:var(--sp-3)}
  .correo-mensaje header{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:var(--sp-3);row-gap:2px}
  .correo-mensaje header .correo-avatar{grid-row:1 / span 2}
  .correo-mensaje header time{text-align:left}
  .correo-menu{left:auto;right:0;transform:none}
  .correo-modal{padding:0;align-items:flex-end}
  .correo-redactar{width:100%;height:calc(100svh - 24px);border-radius:var(--radius-xl) var(--radius-xl) 0 0}
  .correo-ajustes{flex-direction:column;width:100%;height:calc(100svh - 24px);border-radius:var(--radius-xl) var(--radius-xl) 0 0}
  .correo-ajustes-menu{width:auto;flex-direction:row;align-items:center;overflow-x:auto;overflow-y:hidden;
    padding:var(--sp-2);border-right:0;border-bottom:1px solid var(--border-subtle);scrollbar-width:none}
  .correo-ajustes-menu::-webkit-scrollbar{display:none}
  .correo-ajustes-menu > .correo-icono{margin:0}
  .correo-ajustes-opcion{width:auto;flex:none;padding:8px var(--sp-3);white-space:nowrap}
  .correo-ajustes-cuerpo{padding:var(--sp-4)}
  .correo-ajuste-fila{flex-wrap:wrap}
  .correo-ajuste-fila .boton{flex:1}
  .correo-bandejas li{flex-wrap:wrap}
  .correo-bandejas .correo-ajuste-texto{flex-basis:calc(100% - 48px)}
  .correo-bandejas .boton{margin-left:40px}
  .correo-tostada{bottom:var(--sp-3);border-radius:var(--radius-lg)}
}

@media (prefers-reduced-motion:reduce){
  .correo-ventana{animation:none}
  .correo,.correo-lateral,.correo-velo{transition:none}
}

/* ---------- Panel, pantalla «Correos»: las bandejas del equipo ---------- */
.correos-panel{display:flex;flex-direction:column;gap:var(--sp-4)}
.correos-panel h3{margin:0;font-family:var(--font-display);color:var(--text-title)}
.correos-plan{display:flex;align-items:center;gap:var(--sp-5);padding:var(--sp-4) var(--sp-5)}
.correos-plan > div:first-child{flex:none}
.correos-plan .correos-cifra{margin:0;font-family:var(--font-display);font-size:var(--fs-h2);font-weight:var(--fw-bold);color:var(--text-title);line-height:1}
.correos-plan .correos-cifra span{font-size:var(--fs-body);font-weight:var(--fw-semibold);color:var(--text-muted)}
.correos-plan .correos-plan-dice{margin:4px 0 0;font-size:var(--fs-xs);color:var(--text-muted)}
.correos-medidor{flex:1;height:10px;border-radius:999px;background:var(--surface-tint);border:1px solid var(--border-subtle);overflow:hidden}
.correos-medidor span{display:block;height:100%;border-radius:inherit;background:var(--brand-primary)}
.correos-asignar,.correos-lista{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-5)}
.correos-cabeza{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap}
.correos-asignar .campo-ayuda{margin:0}
.campo-ayuda.peligro{color:var(--danger-500)}
.correos-campos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.correos-campos .campo{margin:0}
.correos-direccion{display:flex;align-items:center;gap:var(--sp-2);min-width:0}
.correos-direccion input{flex:1;min-width:0;width:0}
.correos-direccion span{flex:none;font-size:var(--fs-sm);color:var(--text-muted)}
.correos-asignar .entrada:has(input[readonly]){background:var(--surface-tint)}
.correos-asignar input[readonly]{background:transparent;color:var(--text-title);cursor:default}
.correos-verbos{display:flex;justify-content:flex-end}
.correos-lista ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-2)}
.correos-lista li{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--radius-lg);
  background:var(--surface-card);border:1px solid var(--border-subtle)}
.correos-avatar{flex:none;width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--text-onbrand);background:var(--brand-primary)}
.correos-quien{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;font-size:var(--fs-sm);color:var(--text-title);overflow-wrap:anywhere}
.correos-quien b,.correos-quien small{max-width:100%}
.correos-quien small{font-size:var(--fs-xs);color:var(--text-muted)}
.correos-acciones{flex:none;display:flex;gap:var(--sp-2);margin-left:auto}
.correos-acciones .boton{padding:6px 14px;font-size:var(--fs-xs)}
.correos-peligro{color:var(--danger-500)}
@media (max-width:860px){ .correos-campos{grid-template-columns:1fr} }
@media (max-width:560px){
  .correos-plan{flex-direction:column;align-items:stretch;gap:var(--sp-3);padding:var(--sp-4)}
  .correos-medidor{flex:none}
  .correos-asignar,.correos-lista{padding:var(--sp-4)}
  .correos-verbos .boton{flex:1}
  .correos-lista li{flex-wrap:wrap}
  .correos-lista li{padding:var(--sp-2) var(--sp-3);gap:var(--sp-2)}
  .correos-avatar{width:32px;height:32px;font-size:11px}
  .correos-quien{flex-basis:calc(100% - 44px)}
  .correos-quien b{font-size:var(--fs-xs)}
  .correos-acciones{width:100%;padding-left:40px}
}
.correos-alias-lista{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px;max-width:100%;min-width:0}
.correos-alias-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-width:0;padding:3px 4px 3px 8px;
  border-radius:var(--radius-sm);font-size:var(--fs-xs);color:var(--text-title);background:var(--surface-tint)}
.correos-alias-chip i{flex:none;font-style:normal;font-size:10px;font-weight:var(--fw-bold);letter-spacing:.04em;text-transform:uppercase;color:var(--brand-primary)}
.correos-alias-chip span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:var(--fw-semibold)}
.correos-alias-chip button{flex:none;width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-size:15px;line-height:1;color:var(--text-muted);cursor:pointer}
.correos-alias-chip button:hover{background:var(--cristal);color:var(--danger-500)}
.correos-alias-chip:not(:has(button)){padding-right:8px}
.correo-chip-alias{--color:var(--brand-primary)}
.correo-desde{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:var(--fs-sm);color:var(--text-title);padding:4px 0;outline:none;cursor:pointer}
.correo-ajuste-espacio{margin-top:var(--sp-3)}