.mail-list{width:100%;overflow:auto}
.mail-row{width:100%;display:grid;grid-template-columns:minmax(120px,220px) minmax(200px,1fr) auto;gap:16px;align-items:center;border:0;border-bottom:1px solid #e5e7eb;background:#f8faff;padding:12px 18px;text-align:left;color:#202124;cursor:pointer}
.mail-row:hover{box-shadow:inset 3px 0 #0b57d0;background:white}
.mail-row .sender,.mail-row .summary{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reader{max-width:1000px;margin:auto;padding:26px;overflow-wrap:anywhere}
.reader button{border:0;background:#eaf1fb;border-radius:18px;padding:9px 14px}
.reader #meta{color:#5f6368;margin:14px 0 24px}
.reader article{white-space:pre-wrap;line-height:1.55}
.empty{text-align:center;color:#5f6368;padding:60px 20px}
@media(max-width:760px){.mail-row{grid-template-columns:minmax(90px,130px) 1fr}.mail-row>span:last-child{display:none}}
@media(max-width:520px){.mail-row{grid-template-columns:1fr;padding:12px}.mail-row .sender{font-weight:700}.reader{padding:18px}}