/* Compact blue mail layout, guided by the user's JustEmails reference. */
:root{color:var(--text);background:var(--bg)}::selection{background:var(--accent-pale-2);color:var(--accent-strong)}input,textarea{caret-color:var(--blue)}*{scrollbar-width:thin;scrollbar-color:var(--border-strong) var(--bg)}a{text-underline-offset:3px}header{min-height:64px;padding:14px 22px}header strong{font-size:21px;display:flex;align-items:center;gap:6px}header strong::before{content:"";display:block;width:9px;height:9px;border-radius:50%;background:var(--blue);margin-right:4px}header strong span{color:var(--muted)}#workspace-navigation{padding:8px 22px;gap:8px}#workspace-navigation button{padding:8px 18px;min-height:38px;font-size:13px}#workspace{grid-template-columns:242px minmax(330px,390px) minmax(300px,1fr);min-height:calc(100vh - 121px)}aside{background:var(--surface-2);padding:20px 14px}aside #compose{box-shadow:0 3px 7px var(--accent-glow);font-weight:650;display:flex;align-items:center;justify-content:center;gap:8px}aside nav{margin-top:0}aside nav button,aside #drafts-button{display:flex;align-items:center;gap:10px;min-height:36px;padding:7px 10px;margin-bottom:4px;color:var(--text-2);font-size:13px}aside nav button[aria-current]{background:var(--accent-pale);color:var(--text)}aside label{margin-top:20px}aside label select{font-size:12px}.sidebar-label{margin:24px 10px 10px;font-size:10px;text-transform:uppercase;letter-spacing:1.2px;font-weight:700;color:var(--muted)}.ui-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 17px}.folder-heading{margin-top:20px;padding-top:20px;border-top:0}.folder-heading strong{font-size:10px;color:var(--muted);letter-spacing:1px}.folder-heading button{min-height:32px}.company-folder{font-size:13px;padding:8px 10px;min-height:35px;border-radius:5px}#list-panel{padding:0;background:var(--surface)}#search-form{padding:14px;margin:0;background:var(--surface-2);border-bottom:1px solid var(--border)}#search-form input{background:var(--surface-2);border-color:var(--border);font-size:13px}#search-form button{padding:8px 12px;font-size:12px}#reader{background:var(--surface);padding:0 24px 28px}#reader h2{font-size:20px;margin:26px 0 12px;line-height:1.4;letter-spacing:-.25px}#reader>.fine{font-size:12px;line-height:1.7;border-bottom:1px solid var(--border);padding-bottom:20px}#reader pre{font-size:14px;max-width:75ch;color:var(--text);line-height:1.8}.message-row{padding:4px 10px 4px 5px;border-bottom:1px solid var(--border);min-height:105px}.message-row:has(.message[aria-current]){background:var(--surface-3);box-shadow:inset 1px 0 var(--blue)}.message-row:hover{background:var(--surface-3)}.message{border:0;padding:12px 5px;background:transparent;overflow:hidden}.message:hover{background:transparent}.message-head{display:flex;align-items:center;gap:7px;min-width:0;margin-bottom:6px}.message-head strong{font-size:13px;font-weight:550;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.message.unread .message-head strong{font-weight:750;color:var(--text)}.message .domain-badge{display:inline-block;background:var(--accent-pale);color:var(--accent-strong);border-radius:10px;padding:2px 7px;font-size:10px;line-height:1.3;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;margin:0}.message .message-date{margin:0;font-size:10px;white-space:nowrap;color:var(--muted)}.message .message-subject{font-size:13px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:5px}.message.unread .message-subject{font-weight:650}.message .message-preview{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:5px}.message .message-address{font-size:10px;color:var(--muted);margin:0}.star-button{padding:14px 0;min-height:44px;flex-basis:34px;background:transparent!important;color:var(--faint)!important}.star-button .ui-icon{width:15px;height:15px}.star-button[aria-pressed=true]{color:var(--accent)!important}.star-button[aria-pressed=true] .ui-icon{fill:var(--accent);stroke:var(--accent)}.star-button:disabled{opacity:.6}.reader-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;position:sticky;top:0;background:var(--surface);border-bottom:1px solid var(--border);padding:12px 0;z-index:2}.reader-toolbar button{font-size:12px;background:transparent;color:var(--text-2);min-height:36px;padding:7px 9px;border-color:transparent}.reader-toolbar button:hover{background:var(--accent-pale)}.reader-toolbar button:disabled{color:var(--faint);background:var(--surface-2)}.reader-toolbar select{font-size:12px;width:auto;max-width:190px;min-height:36px;padding:7px 10px}.reader-back{display:none}.reader-extra{font-size:12px;position:relative}.reader-extra summary{padding:9px;cursor:pointer;color:var(--text-2)}.reader-extra[open]{background:var(--surface-3);border-radius:8px}.reader-extra button{display:block;width:100%;text-align:left}.connection-settings{border-top:1px solid var(--border);margin-top:24px;padding-top:16px}.connection-settings summary{font-size:12px;color:var(--muted);cursor:pointer}.connection-settings label{font-size:12px}.connection-details{font-size:10px}.empty-state{margin:0;padding:36px 22px;color:var(--muted);line-height:1.6}.reply-status{color:var(--accent-strong)}.organizer{background:var(--bg)}.record-row[aria-current]{background:var(--accent-pale)}.record-editor{box-shadow:none}.calendar-day{min-height:92px}.calendar-controls button{background:var(--surface-3);color:var(--accent-strong)}.login-card .eyebrow{display:none}
@media(min-width:1600px){#workspace{grid-template-columns:250px 430px minmax(350px,1fr)}}
@media(max-width:1050px){#workspace{grid-template-columns:220px minmax(0,1fr)}#workspace:not(.reading-message) #reader{display:none}#workspace.reading-message #list-panel{display:none}#workspace.reading-message #reader{display:block;grid-column:2;border-top:0;min-height:70vh}.reader-back{display:block}.reader-toolbar{position:static}.reader-toolbar select{max-width:180px}}
@media(max-width:600px){header{padding:12px 16px}#workspace-navigation{padding:8px 10px;gap:2px}#workspace-navigation button{padding:8px 6px}#workspace{display:block}aside{padding:16px}aside nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}aside nav button{justify-content:center;padding:8px 2px;font-size:12px;gap:5px}.sidebar-label{margin:16px 4px 8px}aside #drafts-button{width:auto;margin-top:6px}.folder-heading{padding-top:0;margin-top:14px}#company-folders{display:flex;flex-wrap:wrap;gap:6px}.company-folder{width:auto;background:var(--surface-3)!important;margin:0}.connection-settings{margin-top:14px;padding-top:12px}aside>p.fine{display:none}#workspace.reading-message aside{display:none}#workspace.reading-message #reader{grid-column:auto;min-height:75vh}#reader{padding:0 16px 24px}.reader-toolbar{position:static}.message-row{min-height:102px}#list-panel{padding:0}.message .domain-badge{max-width:90px;font-size:9px}#mail-status{font-size:12px}.reader-toolbar .actions{flex-wrap:wrap}}
@media(prefers-reduced-motion:no-preference){button{transition:background-color .12s ease-out,color .12s ease-out}}

@media(min-width:1051px){#workspace{grid-template-columns:242px var(--mail-list-width,390px) 12px minmax(280px,1fr)}#list-panel{border-right:0}#mail-divider{cursor:col-resize;touch-action:none;background:var(--surface-2);position:relative;outline-offset:-2px}#mail-divider::after{content:"";position:absolute;left:5px;top:0;bottom:0;width:2px;background:var(--border)}#mail-divider:hover,#mail-divider:focus-visible,#mail-divider[data-dragging]{background:var(--accent-pale-2)}#mail-divider:focus-visible{outline:2px solid var(--accent)}}
@media(max-width:1050px){#mail-divider{display:none}}

.signature-preview{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--surface-3);border:1px solid var(--border);padding:16px;border-radius:8px;min-height:70px}#settings-dialog form{display:grid;gap:14px}#settings-dialog select,#settings-dialog textarea{width:100%}

#reader .reader-toolbar .reader-back{display:inline-flex;align-items:center;padding:10px 14px;min-height:42px;border:1px solid var(--accent-pale-2);border-radius:8px;background:var(--accent-pale);color:var(--accent-strong);font-size:13px;font-weight:650}#reader .reader-toolbar .reader-back:hover{background:var(--accent-pale-2)}.conversation-history{border-top:1px solid var(--border);margin-top:28px;padding-top:16px}.conversation-history details{border:1px solid var(--border);border-radius:8px;margin:10px 0;padding:12px}.conversation-history summary{cursor:pointer;line-height:1.6}.conversation-history a{display:block;margin:8px 0}
.mailbox-addresses{margin-top:10px;display:flex;flex-direction:column;gap:4px}.mailbox-addresses .mailbox-address{display:flex;width:100%;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:8px 7px;font-size:11px;text-align:left;color:var(--text-2);background:transparent}.mailbox-address>span:first-child{overflow-wrap:anywhere;min-width:0;flex:1}.mailbox-address[aria-current]{background:var(--accent-pale)!important;color:var(--accent-strong)!important}.unread-count{flex:0 0 auto;min-width:24px;padding:3px 6px;text-align:center;border-radius:12px;font-size:11px;background:var(--surface-3);color:var(--muted)}.unread-count.has-unread{background:var(--accent);color:var(--on-accent);font-weight:700}
.bulk-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:10px 12px;background:var(--surface-3);border-bottom:1px solid var(--border)}.bulk-toolbar button,.bulk-toolbar select{font-size:12px;min-height:34px;padding:6px 8px;width:auto;max-width:180px}.bulk-all{display:flex;align-items:center;gap:6px;margin:0;font-size:12px;white-space:nowrap}.bulk-all input,.message-select{width:17px;height:17px;accent-color:var(--blue);flex-shrink:0}.message-select{margin:17px 5px 0}.bulk-count{font-size:12px;color:var(--text-2)}.message-row.is-selected{background:var(--accent-pale)}.message-row .star-button{flex-basis:24px}
/* Keep message navigation and reading independently visible. */
html,body{min-width:0}#workspace>*{min-width:0}#reader{overflow-wrap:anywhere}#reader:focus{outline:none}.message-head{flex-wrap:wrap}.message .message-date{flex-basis:100%;white-space:normal;font-size:11px}.message-timestamps{display:grid;gap:4px;font-size:12px;color:var(--muted);margin:0 0 18px}.mail-view-controls{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.mail-view-controls button{font-size:12px;min-height:36px}.mail-view-controls button[aria-pressed=true]{background:var(--pale);color:var(--accent-strong);border:1px solid var(--accent-pale-2)}.email-html{width:100%;display:block;border:1px solid var(--border);background:#fff;min-height:280px}.mail-text-body{white-space:pre-wrap;overflow-wrap:anywhere}.mail-text-body a,.attachment-list a,.attachment-viewer a{color:var(--accent-strong);text-decoration:underline}.attachment-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--border)}.attachment-row>span:first-child{flex:1 1 200px;overflow-wrap:anywhere}.attachment-row button{min-height:36px}.attachment-viewer{width:min(1000px,94vw);max-height:92dvh}.attachment-viewer iframe{display:block;border:1px solid var(--border);width:100%;height:65dvh;margin-top:12px}.attachment-viewer h2{overflow-wrap:anywhere}.date-sort-label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;padding:8px 14px;border-bottom:1px solid var(--border);font-size:12px;color:var(--muted)}.date-sort-label select{width:auto;font-size:12px;padding:6px 8px;min-height:36px}.company-section{margin-top:14px}.company-section .folder-heading{display:list-item;cursor:pointer;padding:10px 0;margin:0;font-size:12px}.company-section .folder-heading strong{font-size:12px;color:var(--text-2);letter-spacing:0}.company-section input{margin:6px 0;width:100%;min-height:36px;font-size:12px}.company-section>button{font-size:12px;min-height:34px;margin:4px 0 8px}#company-folders{max-height:230px;overflow:auto;display:block}.company-folder{display:block;width:100%;text-align:left;overflow-wrap:anywhere}.company-folder[hidden]{display:none!important}
@media(min-width:601px){body{height:100dvh;display:flex;flex-direction:column;overflow:hidden}header,#notice,#workspace-navigation,#mail-status{flex-shrink:0}#workspace{flex:1;min-height:0;height:0;overflow:hidden}#workspace aside,#list-panel,#reader{height:100%;min-height:0;overflow-y:auto;overscroll-behavior:contain}#list-panel{position:relative}#search-form{position:sticky;top:0;z-index:3}#reader .reader-toolbar{position:sticky;top:0}#workspace.reading-message #reader{min-height:0}#login{overflow:auto}}
@media(max-width:600px){#workspace,#reader,#list-panel{height:auto}#workspace-navigation{flex-wrap:wrap}.reader-toolbar select{max-width:100%;min-width:0}.reader-toolbar>*{max-width:100%}#search-form{display:flex;flex-wrap:wrap;gap:6px}#search-form input{flex:1;min-width:0}.company-section{margin-top:10px}#company-folders{max-height:150px}.message-head strong{flex-basis:55%}.message .domain-badge{max-width:100px}}
@media(min-width:601px){#organizer{flex:1;min-height:0;overflow:auto}.company-section .company-folder{min-height:36px}#reader .mail-text-body{max-width:none}}

/* Compact scan rows: sender/date first, subject/snippet together. */
#list-panel{container-type:inline-size;container-name:mail-list}
#search-form{padding:8px 12px;gap:8px}#search-form input{padding:8px 10px;min-height:36px}#search-form button{min-height:36px;padding:8px 12px}
.bulk-toolbar{gap:8px;padding:8px 12px;background:var(--surface);min-height:48px}.bulk-toolbar:not(.has-selection){flex-wrap:wrap}.bulk-toolbar .date-sort-label{margin-left:auto;border:0;padding:0;gap:8px;white-space:nowrap}.bulk-toolbar .date-sort-label select{max-width:130px;padding:4px 6px;min-height:32px}.bulk-toolbar .date-sort-label{font-size:0}.bulk-all{font-size:12px}.bulk-toolbar.has-selection{background:var(--surface-3)}.bulk-toolbar button{min-height:32px}
.message-row{align-items:center;min-height:56px;padding:0 8px;gap:4px}.message-select{margin:0 4px 0 0;width:15px;height:15px}.message-row .star-button{flex:0 0 24px;min-height:36px;padding:8px 0;display:flex;align-items:center;justify-content:center}.message-row .message{display:grid;grid-template-columns:minmax(0,1fr) auto 58px;grid-template-areas:"sender mailbox date" "summary summary summary";gap:2px 6px;min-height:0;padding:6px 2px;line-height:1.4;position:relative}.message-head{display:contents}.message-head strong{grid-area:sender;display:block;font-size:13px;line-height:18px;margin:0}.message .domain-badge{grid-area:mailbox;display:block;max-width:100px;padding:1px 5px;font-size:9px;margin:0}.message .message-date{grid-area:date;display:block;font-size:11px;line-height:18px;white-space:nowrap;text-align:right;margin:0;flex-basis:auto}.message-summary{grid-area:summary;display:flex!important;gap:4px;min-width:0;overflow:hidden;margin:0!important;line-height:18px}.message .message-subject{flex:0 1 auto;min-width:0;max-width:100%;font-size:12px;line-height:18px;margin:0}.message .message-preview{flex:1 4 32px;min-width:0;font-size:12px;line-height:18px;margin:0}.message-preview:not(:empty)::before{content:"— ";color:var(--muted)}.message .message-address{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}.message-row:hover{background:var(--surface-3)}.message:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
@container mail-list (min-width:620px){.message-row{min-height:36px}.message-row .message{grid-template-columns:minmax(110px,135px) minmax(0,1fr) auto 62px;grid-template-areas:"sender summary mailbox date";padding:6px 2px;gap:8px}.message-head strong,.message .message-subject,.message .message-preview{font-size:13px;line-height:20px}.message-row .star-button{min-height:32px;padding:6px 0}.message .domain-badge{max-width:110px}}
@media(pointer:coarse){.message-row{min-height:60px}.message-row .star-button{flex-basis:32px;min-height:44px}.message-select{width:20px;height:20px}}
@media(max-width:600px){.bulk-toolbar{padding:8px}.bulk-toolbar .date-sort-label{gap:4px}.message-row{min-height:60px}.message-row .message{padding:8px 2px}.message .domain-badge{max-width:85px}}

/* Attachment indicator keeps the compact list row height. */
.message-row .message{grid-template-columns:minmax(0,1fr) auto 16px 58px;grid-template-areas:"sender mailbox attachment date" "summary summary summary summary"}.message .message-attachment{grid-area:attachment;display:flex;align-items:center;justify-content:center;color:var(--muted);margin:0}.message-attachment .ui-icon{width:15px;height:15px}
@container mail-list (min-width:620px){.message-row .message{grid-template-columns:minmax(110px,135px) minmax(0,1fr) auto 16px 62px;grid-template-areas:"sender summary mailbox attachment date"}}

#search-form{flex-wrap:wrap}#search-form input{flex:1 1 100px;min-width:80px}#refresh-mail{white-space:nowrap}
