.bandeja { width: min(1180px, 100%); margin: 0 auto; padding: 40px 20px 40px; display: grid; gap: 28px; }
.b-cab { display: grid; gap: 14px; justify-items: start; }
.b-cab h1 { font-size: clamp(1.9rem, 6vw, 3.2rem); max-width: 18ch; }
.b-intro { margin: 0; max-width: 60ch; color: var(--suave); }
.pestanas { display: flex; gap: 4px 20px; flex-wrap: wrap; border-bottom: 1px solid var(--borde); }
.pestana { min-height: 48px; padding: 10px 2px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--suave); font: 600 1rem var(--texto); cursor: pointer; margin-bottom: -1px; }
.pestana[aria-selected="true"] { color: var(--tinta); border-bottom-color: var(--oro); }
.pestana:hover { color: var(--tinta); }
.vista { display: flex; flex-wrap: wrap; gap: 34px; }
.correo { display: grid; gap: 12px; justify-items: start; }
.correo-meta { margin: 0; font-size: .95rem; color: var(--suave); }
.telefono { position: relative; width: min(calc(100vw - 40px), 380px); height: min(150vw, 760px); border-radius: 40px; padding: 12px; background: #12151d; border: 1px solid rgba(255, 209, 138, .22); }
.telefono::before { content: ""; position: absolute; top: 20px; left: 50%; width: 92px; height: 24px; margin-left: -46px; border-radius: 20px; background: #030509; z-index: 3; }
.pantalla-tel { position: relative; height: 100%; border-radius: 30px; overflow: hidden; background: #fff; display: grid; grid-template-rows: auto auto 1fr; }
.barra-estado { height: 46px; background: #f4f3f1; display: flex; justify-content: space-between; align-items: end; padding: 0 26px 6px; font: 600 .78rem var(--texto); color: #111; }
.cabecera-correo { background: #f4f3f1; border-bottom: 1px solid #e3e0da; padding: 8px 16px 12px; color: #1d1a16; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 2px 10px; align-items: center; }
.avatar { grid-row: span 3; width: 40px; height: 40px; border-radius: 50%; background: #1a1206; color: #FFD18A; display: grid; place-items: center; font: 600 .9rem var(--titulos); }
.cabecera-correo strong { font: 600 .92rem/1.3 var(--texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cabecera-correo span { font-size: .78rem; color: #5c574f; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pantalla-tel iframe { width: 100%; height: 100%; border: 0; background: #fff; display: block; }
.vacio { padding: 26px 0; display: grid; gap: 12px; justify-items: start; max-width: 560px; }
.vacio h2 { font-size: 1.5rem; }
.vacio p { margin: 0; color: var(--suave); }
.b-pide { display: grid; gap: 12px; justify-items: start; padding: 24px 0 0; border-top: 1px solid var(--borde); max-width: 640px; }
.b-pide h2 { font-size: clamp(1.4rem, 4vw, 1.9rem); }
.b-pide p { margin: 0; color: var(--suave); }
.b-pie { display: grid; gap: 6px; justify-items: start; }
.b-estado { margin: 0; color: var(--tinta); }
.b-estado:empty { display: none; }
