.empty-reader{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:65vh;padding:40px;gap:18px}.empty-monogram{font:41.6px var(--display);letter-spacing:8px;border:1px solid #ced9ed;padding:30px 35px;border-radius:14px;color:#315be8;background:#f6f8ff}.empty-reader h2{font-size:31.2px;font-weight:550;margin-top:20px}.empty-list{padding:50px 28px;text-align:center;line-height:1.9}.empty-list .button{margin-top:18px}.message-item{display:block;width:100%;padding:22px 25px;text-align:left;border-bottom:1px solid var(--line);min-height:120px}.message-item:hover{background:#f3f6fc}.message-item.unread{border-left:3px solid #315be8;background:#f5f8ff}.message-item time{float:right;font-size:14.3px;color:var(--muted)}.message-item h3{font-size:18.2px;margin:10px 0 5px}.message-item p{font-size:15.6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reader-content>h1,.reader-content>p,.reader-content>.message-body{margin:24px 32px}.reader-content>h1{font-size:32.5px}.reader-content>iframe{padding:18px 30px}.reader-content>.button{margin:8px 30px}.reader-toolbar{flex-wrap:wrap;gap:8px}.contact-card>.button{margin:8px 6px 0 0;font-size:15.6px}.contact-card>p{overflow-wrap:anywhere}.compose-attachments>span{display:inline-block;background:#edf2fc;padding:6px 10px;border-radius:5px;margin:4px}.toast{padding:14px 20px;background:#172f4f;color:#fff;border-radius:10px;box-shadow:0 6px 25px #172f4f24}.empty-reader p{line-height:1.9}
@media(max-width:1000px){.mail-workspace.reading-open .message-index{display:none}.mail-workspace.reading-open .reading-pane{display:block;width:100%}.mail-workspace.reading-open{display:block}.reader-content>h1,.reader-content>p,.reader-content>.message-body{margin:20px}.empty-reader{min-height:50vh}}
@media(max-width:720px){.sidebar.open{transform:translateX(0);position:fixed;inset:0 auto 0 0;width:224px;z-index:100}.drawer-backdrop:not([hidden]){display:block;position:fixed;inset:0;background:#12284680;z-index:90}.empty-reader h2{font-size:26px}.reader-toolbar .button{min-height:44px}.contact-card>.button{min-height:44px}}

.compose-dialog{width:min(1120px,calc(100vw - 32px));height:min(900px,calc(100dvh - 32px));max-height:calc(100dvh - 32px)}
.compose-dialog form{height:100%;max-height:100%;overflow:auto}.compose-fields,.compose-format,.compose-footer,.dialog-header{flex-shrink:0}
.compose-body{height:auto;min-height:240px;flex:1 0 240px;resize:vertical;overflow:auto}
.compose-format{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 26px;border-bottom:1px solid var(--line);background:#f5f8fc}
.compose-format label{display:flex;align-items:center;gap:8px;margin:0;font-size:14px}.compose-format select{max-width:220px;font:inherit;padding:8px;border:1px solid #ced9e6;border-radius:6px;background:white;color:var(--text)}
.compose-format button{border:1px solid #ced9e6;border-radius:6px;min-width:42px;height:42px;background:white;font-size:18px}.compose-format button[aria-pressed=true]{background:#e0e8ff;border-color:#315be8;color:#2449c9}.compose-format>span{font-size:13px;color:var(--muted)}
.compose-attachments .attachment-chip{display:flex;align-items:center;gap:8px;padding:5px 10px;border-radius:7px;background:#edf2fc;max-width:100%;font-size:14px}.attachment-chip>span{overflow-wrap:anywhere}.attachment-chip button{flex-shrink:0;min-width:36px;min-height:36px;color:#ad3343;background:white;border-radius:5px;font-size:20px}
#folder-title>span{font:inherit;color:inherit;background:none}.sidebar{width:auto}.nav-button{min-height:46px}.account-text>span{max-width:180px}.mail-app{grid-template-columns:280px minmax(0,1fr)}
@media(max-width:720px){.compose-dialog{width:calc(100vw - 12px);max-width:calc(100vw - 12px);height:calc(100dvh - 12px);max-height:calc(100dvh - 12px)}.compose-dialog form{max-height:100%}.compose-format{padding:10px 16px;gap:8px}.compose-format select{max-width:170px}.compose-format>span{width:100%}.compose-footer{flex-wrap:wrap}.compose-body{min-height:220px}.sidebar.open{width:280px}}

.message-list-entry{position:relative}.message-list-entry .message-item{padding-right:75px}.message-delete{position:absolute;right:12px;top:50%;transform:translateY(-50%);padding:10px 8px;border:1px solid #e2c9ce;border-radius:6px;color:#a73142;background:white;font-size:14px;min-height:40px}.message-delete:hover{background:#fff0f2}.index-footer{height:auto;min-height:42px;flex-wrap:wrap;gap:6px}

.incoming-mail{display:flex;align-items:center;gap:12px;max-width:520px;background:#172f4f;color:white;padding:18px;border-radius:12px;box-shadow:0 12px 40px #10274244}.incoming-mail>div{min-width:0;flex:1}.incoming-mail strong{font-size:18px}.incoming-mail p{font-size:14px;margin:8px 0 0;overflow-wrap:anywhere}.incoming-mail .button{flex-shrink:0}.bubble-close{min-width:32px;min-height:40px;font-size:24px;color:white}.toast-region{max-width:min(520px,calc(100vw - 32px))}

#filter-unread{position:relative;margin-right:8px}.unread-badge{position:absolute;top:-8px;right:-8px;min-width:22px;height:22px;padding:0 5px;display:flex;align-items:center;justify-content:center;background:#cc4655;color:#fff;border-radius:12px;font:600 12px/1 Arial,sans-serif;box-shadow:0 0 0 2px white}.unread-badge:empty{display:none}.segmented{overflow:visible}
.compose-contact-actions{display:flex;gap:8px;flex-wrap:wrap;padding:8px 26px;flex-shrink:0}.compose-contact-actions .button{font-size:14px;min-height:38px}.contact-picker{width:620px}.picker-tools{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:18px 24px}.picker-tools>input{flex:1;min-width:180px}.picker-tools label{display:flex;align-items:center;gap:8px;margin:0}.picker-list{padding:0 24px;max-height:45dvh;overflow:auto}.picker-contact{display:flex;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);cursor:pointer;margin:0}.picker-contact>input{width:20px;height:20px;flex-shrink:0}.picker-contact>span{min-width:0}.picker-contact strong,.picker-contact small{display:block;overflow-wrap:anywhere}.picker-contact small{font-size:14px;color:var(--muted);margin-top:6px}#picker-count{margin-right:auto;color:var(--muted);align-self:center;font-size:14px}

.message-item.unread h3{color:#2449c9;font-weight:700}.message-item.flagged h3{color:#b82d40;font-weight:700}

.compose-recipient-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}
.compose-recipient-row .compose-line{flex:1;min-width:0;border-bottom:0;margin:0}
.compose-recipient-row .compose-line input{min-width:0;width:100%}
.recipient-picker-button{flex-shrink:0;white-space:nowrap;font-size:14px;padding:8px 12px;min-height:36px}
@media(max-width:600px){.compose-recipient-row{gap:5px}.recipient-picker-button{font-size:13px;padding:7px 8px}.compose-recipient-row .compose-line>span{width:52px;flex:0 0 52px}}

/* Each mailbox is an independent workspace; the group switch saves membership. */
.login-mode{display:block;width:100%;padding:11px 12px;margin:0 0 20px;border:1px solid #ced9e6;border-radius:8px;background:white;font:inherit;color:var(--text)}
.sidebar{overflow-y:auto;min-height:0}.sidebar-bottom{flex-shrink:0}.group-status{font-size:13px;color:var(--muted);margin:12px 0 8px;overflow-wrap:anywhere}
.mailbox-tabs{display:flex;flex-direction:column;gap:13px;max-height:34dvh;overflow-y:auto;min-height:0;padding:10px 3px 3px 8px}
.mailbox-tab{position:relative;flex-shrink:0;display:flex;align-items:center;gap:5px;border:1px solid #dfe5ee;border-left:3px solid transparent;border-radius:8px;background:#fff;padding:5px}
.mailbox-tab.selected{border-left-color:#315be8;background:#edf3ff}.mailbox-tab-select{position:relative;flex:1;min-width:0;text-align:left;padding:7px 3px;cursor:pointer}
.mailbox-tab-select strong{display:block;font:600 13px/1.5 var(--mono);overflow-wrap:anywhere}.mailbox-tab-select small{font-size:12px;color:var(--muted)}
.mailbox-unread{position:absolute;top:-9px;left:-7px;z-index:1;pointer-events:none;background:#cc4655;color:#fff;border:2px solid #fff;border-radius:12px;font-size:11px;font-weight:700;line-height:18px;min-width:22px;padding:0 4px;text-align:center;box-shadow:0 1px 3px #0002}
.group-switch{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0;font-size:11px;margin:0;color:var(--muted);cursor:pointer}
.group-switch input{appearance:none;width:30px;height:18px;background:#b8c3d2;border-radius:10px;position:relative;margin:0;cursor:pointer}
.group-switch input:before{content:'';position:absolute;width:12px;height:12px;top:3px;left:3px;border-radius:50%;background:white;transition:left .15s}
.group-switch input:checked{background:#315be8}.group-switch input:checked:before{left:15px}.group-switch input:focus-visible{outline:3px solid #879df5;outline-offset:2px}
.add-mailbox{width:100%;margin-top:10px;font-size:14px;justify-content:center;min-height:42px}.group-settings-dialog{width:620px}.group-mailbox-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 0;border-bottom:1px solid var(--line)}.group-mailbox-row span{overflow-wrap:anywhere;min-width:0}.group-mailbox-row button{flex-shrink:0;font-size:14px}
@media(max-height:850px){.sidebar .nav-button{min-height:36px}.sidebar .nav-caption{margin-top:10px}.sidebar-brand{margin-bottom:16px}.sidebar-bottom .connection-card{padding:8px}.mailbox-tabs{max-height:26dvh}.account-card{padding-top:8px;padding-bottom:8px}}
@media(prefers-reduced-motion:reduce){.group-switch input:before{transition:none}}

.sidebar{overflow:hidden;padding-top:20px}.sidebar-navigation{flex:1;min-height:0;overflow-y:auto;padding-bottom:8px}.sidebar-bottom{margin-top:0;padding-top:10px;border-top:1px solid #ffffff14}.sidebar-bottom .connection-card{display:none}.sidebar-bottom .account-card{padding:4px 0;border:0;margin:0}.sidebar-bottom .account-text>span{display:none}.sidebar-bottom .account-text>strong{font-size:13px;color:#e4ecf9}.sidebar-bottom .group-status{color:#a9bbd2;margin:7px 0}.sidebar-bottom .mailbox-tabs{max-height:24dvh}.sidebar .sidebar-brand{margin-bottom:18px}.sidebar .compose-button{margin-bottom:15px}.sidebar .nav-button{padding-top:7px;padding-bottom:7px;min-height:36px}.sidebar .folder-nav{gap:2px}.sidebar .sidebar-rule{margin:12px 15px}.sidebar .nav-caption{margin-top:0}.mailbox-tab strong{color:#213955}.mailbox-tab small,.group-switch{color:#60728a}.mailbox-tab .group-switch input{border:0;padding:0}.add-mailbox{color:#203653;background:#fff}

.mail-app{height:100dvh;grid-template-rows:minmax(0,1fr);overflow:hidden}.sidebar{height:100dvh;max-height:100dvh;box-sizing:border-box}.sidebar-navigation .compose-button{width:calc(100% - 8px)}.workspace{min-height:0}

/* Keep the active mailbox unmistakable against the dark sidebar. */
.sidebar-bottom .mailbox-tab.selected{background:#214fc6;border-color:#89b4ff;border-left:5px solid #b9d5ff;box-shadow:0 0 0 1px #89b4ff55}
.sidebar-bottom .mailbox-tab.selected strong{color:#fff;font-weight:750}
.sidebar-bottom .mailbox-tab.selected small,.sidebar-bottom .mailbox-tab.selected .group-switch{color:#e2ecff}
.sidebar-bottom .mailbox-tab.selected .group-switch input:checked{background:#91baff}
.sidebar-bottom .mailbox-tab.selected .group-switch input:checked:before{background:#173c98}
.sidebar-bottom .mailbox-tab-select:focus-visible{outline:2px solid #89b4ff;outline-offset:1px;border-radius:4px}