.mail-interface-container{width:100%;max-width:1200px;box-sizing:border-box;font-family:system-ui,-apple-system,sans-serif}.mail-window{display:grid;grid-template-columns:210px 1fr;background:#fff;border:1px solid #eef0f2;border-radius:12px;height:650px;box-shadow:0 10px 30px #00000005;overflow:hidden}.mail-sidebar{background:#f8f9fa;border-right:1px solid #eef0f2;display:flex;flex-direction:column}.sidebar-header{padding:15px 12px;font-size:11px;font-weight:600;color:#7f8c8d;border-bottom:1px solid #eef0f2;text-transform:uppercase;letter-spacing:.8px}.mail-list{overflow-y:auto;flex-grow:1}.mail-list::-webkit-scrollbar{width:4px}.mail-list::-webkit-scrollbar-track{background:transparent}.mail-list::-webkit-scrollbar-thumb{background:#eef0f2;border-radius:4px}.mail-item{display:flex;align-items:flex-start;gap:10px;padding:14px 12px;border-bottom:1px solid #f1f3f5;cursor:pointer;transition:background .15s ease;text-align:left}.mail-item:hover{background:#f1f3f5}.mail-item.active{background:#fff;box-shadow:inset 3px 0 #5f8c94}.mail-dot{width:5px;height:5px;background:#5f8c94;border-radius:50%;display:inline-block;flex-shrink:0;margin-top:6px}.mail-item.active .mail-dot{background:#bdc3c7}.mail-subject{font-size:13px;font-weight:500;color:#2c3e50;line-height:1.3;word-break:break-word}.mail-item.active .mail-subject{font-weight:600;color:#5f8c94}.mail-content-view{display:flex;flex-direction:column;background:#fff;height:100%;overflow:hidden}.mail-content-header{padding:15px 25px;border-bottom:1px solid #eef0f2;background:#fff;text-align:left}.mail-content-header h4{margin:0 0 6px!important;font-size:16px;font-weight:600;color:#2c3e50;text-transform:none!important;line-height:1.3}.mail-meta-row{display:flex;align-items:center;gap:10px}.meta-avatar{width:32px;height:32px;background:#fff;color:#7f8c8d;border:1px solid #eef0f2;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;overflow:hidden}.meta-avatar img{width:100%;height:100%;object-fit:contain;padding:2px;box-sizing:border-box}.meta-info{font-size:11.5px;color:#2c3e50;line-height:1.3;text-align:left}.meta-to{font-size:10.5px;color:#95a5a6}.mail-body-scroll{flex-grow:1;overflow:auto;padding:20px;background:#fdfdfd;display:block;scrollbar-width:thin;scrollbar-color:#5F8C94 #f1f3f5}.mail-body-scroll::-webkit-scrollbar{width:6px;height:6px}.mail-body-scroll::-webkit-scrollbar-track{background:#f1f3f5;border-radius:10px}.mail-body-scroll::-webkit-scrollbar-thumb{background:#5f8c94;border-radius:10px}.mail-body-scroll::-webkit-scrollbar-thumb:hover{background:#4d737a}.mail-body-scroll img{width:auto;max-width:100%;height:auto;display:block;margin:0 auto;border-radius:4px;box-shadow:0 4px 20px #0000000a}@media(max-width:900px){.mail-window{grid-template-columns:180px 1fr}}@media(max-width:680px){.mail-window{grid-template-columns:1fr;grid-template-rows:220px 1fr;height:750px}.mail-sidebar{border-right:none;border-bottom:1px solid #eef0f2}.mail-body-scroll img{max-width:none;width:100%}}