/* Shared typography and surfaces for both Mail themes. */
:root{--bg:#101117;--surface:#191b24;--raised:#252835;--text:#f1f2f7;--muted:#b3b7ca;--line:#383c4d;--accent:#c4b5ff;--accent-bg:#342d4a;--unread:#232332}
:root[data-theme=light]{--bg:#f1f3f9;--surface:#fff;--raised:#e8ecf5;--text:#202435;--muted:#586078;--line:#d7dce8;--accent:#6540ac;--accent-bg:#eee7fc;--unread:#f1edfb}
html,body{font-size:15px;line-height:1.6}.mail-app{min-height:0;grid-template-columns:260px minmax(0,1fr);grid-template-rows:84px minmax(0,1fr)}
.mail-header{gap:24px}.mail-brand{font-size:16px;min-width:208px}.mail-brand b{font-size:14px}.mail-header,.mail-search,.mail-heading>div{min-width:0}.mail-search{height:48px;width:min(820px,100%)}.mail-search input{font-size:15px}.sync{font:12px/1.5 var(--font)}.header-tools{gap:12px}.icon{width:44px;height:44px}.primary,.secondary{font-size:14px}.eyebrow{font:12px/1.6 var(--mono);letter-spacing:.06em}.mono{font:12px/1.5 var(--mono)}
.mail-sidebar{gap:18px;padding:24px 14px;scrollbar-width:thin}.compose-button,.mail-sidebar nav,.folder-heading{flex-shrink:0}.compose-button{height:52px;font-size:15px;margin:0 4px 8px}.folder{height:46px;font-size:15px;gap:14px;padding-inline:16px}.folder svg{width:20px;height:20px}.folder small{font:12px var(--mono)}.folder-heading{font:12px var(--font);margin-bottom:-10px;letter-spacing:.05em}.sidebar-bottom{padding:12px 4px 0;gap:12px}.sidebar-bottom select{font-size:14px;min-height:46px}.sidebar-bottom a,.private-label{font-size:13px;min-height:44px}.sidebar-bottom .eyebrow{font:11px var(--font)}
.mail-main{padding:28px 28px 0;min-width:0}.mail-heading{margin-bottom:20px}.mail-heading h1{font-size:28px}.mail-heading .eyebrow{margin-bottom:8px}.mail-heading>p{font:13px var(--font);flex:none}.mail-delivery{margin:0 0 18px;border-radius:6px;font-size:14px}.mail-toolbar{flex-wrap:wrap;flex-shrink:0;min-height:54px}.bulk-actions{flex-wrap:wrap}.bulk-actions select{font-size:13px;min-height:44px}.select-all{width:40px;height:44px}.mail-toolbar .mono{font:12px var(--mono)}.filter-panel{font-size:14px;flex-wrap:wrap}.filter-panel label{min-height:44px}
.list-panel{scrollbar-width:thin;overscroll-behavior:contain;padding-bottom:16px}.message-row,.mail-main[data-reading=true] .message-row{grid-template-columns:38px 38px minmax(0,1fr);gap:4px;padding:0 12px 0 4px;min-height:68px;background:var(--surface);border-bottom-color:color-mix(in srgb,var(--line) 65%,transparent)}.message-row[data-unread=true]{background:var(--unread)}.message-row[data-selected=true]{background:var(--accent-bg);box-shadow:inset 3px 0 var(--accent)}.row-open{display:grid;grid-template-columns:minmax(130px,190px) minmax(0,1fr) 22px 82px;gap:16px;align-items:center;min-width:0;width:100%;min-height:68px;padding:12px 0;cursor:pointer}.row-open::after{display:none}.row-open:focus-visible{outline-offset:-2px;border-radius:4px}.row-check,.star{width:38px;height:44px;grid-row:auto}.sender{min-width:0;font-size:15px}.message-copy{min-width:0;gap:12px}.subject{font-size:15px;max-width:65%;flex-shrink:1}.preview{font-size:14px}.date{font:12px var(--mono);color:var(--muted)}.message-row[data-unread=true] .date{color:var(--text)}.attachment-indicator{position:static}.attachment-indicator svg{width:17px;height:17px}body[data-density=compact] .row-open{min-height:54px;padding-block:6px}body[data-density=compact] .message-row{min-height:54px}.mail-footer{font:12px var(--font);padding:16px 0}.empty-state p{font-size:14px}
/* A message replaces the list. The main region is the only vertical scroller. */
.mail-main[data-reading=true]{overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain;background:var(--surface)}.mail-main[data-reading=true]>.mail-heading,.mail-main[data-reading=true]>.mail-toolbar,.mail-main[data-reading=true]>.filter-panel,.mail-main[data-reading=true]>.mail-footer{display:none}.mail-main[data-reading=true] .list-panel{display:none}.mail-main[data-reading=true] .mail-content{display:block;flex:0 0 auto;overflow:visible;min-height:auto;position:static}.mail-main[data-reading=true] .reader{display:block;overflow:visible;padding:0 12px 48px;max-width:1120px;width:100%;margin-inline:auto;background:transparent}.reader-tools{position:sticky;top:-28px;z-index:3;background:var(--surface);padding:8px 0 14px;margin-bottom:22px;border-bottom:1px solid var(--line);gap:6px}.reader-tools select{font-size:14px;min-height:44px;max-width:220px}.reader h2{font-size:clamp(23px,2vw,30px);line-height:1.4;max-width:1000px;margin-bottom:24px}.thread-message{border:0;border-radius:0;background:none;margin:0;padding:0 0 32px}.thread-message+.thread-message{border-top:1px solid var(--line);padding-top:28px}.message-header{border:0;background:none;padding:0 0 18px;gap:14px;flex-wrap:wrap}.message-avatar{width:40px;height:40px;font-size:14px}.message-meta{min-width:0}.message-meta strong{font-size:15px}.message-meta small,.message-header time{font-size:13px;line-height:1.7}.message-header time{max-width:none;flex:none}.thread-body,.message-body-text{font:16px/1.8 var(--font);overflow-wrap:anywhere;max-width:88ch;padding:4px 0 12px;color:var(--text)}.thread-body *{max-width:100%;box-sizing:border-box}.thread-body p,.thread-body ul,.thread-body ol,.thread-body blockquote{margin:0 0 1em}.thread-body a{color:var(--accent);text-decoration:underline}.thread-body pre{white-space:pre-wrap}.thread-body table{display:block;overflow-x:auto;border-collapse:collapse;margin-block:18px}.thread-body td,.thread-body th{padding:8px 12px;border:1px solid var(--line)}.thread-body blockquote{padding-left:18px;border-left:3px solid var(--line);color:var(--muted)}.thread-body img{height:auto}.thread-body h1,.thread-body h2,.thread-body h3{font-size:1.35em;line-height:1.4;margin:1em 0 .5em}.remote-warning{padding:0 0 16px;font-size:13px;background:none;border:0;flex-wrap:wrap;gap:6px}.remote-warning button{font-size:13px;min-height:44px}.reader-reply{display:flex;flex-wrap:wrap;gap:10px;padding:0}.reader-reply .secondary{font-size:14px}.attachment{font-size:14px;overflow-wrap:anywhere}.message-attachments{padding:12px 0}.mail-error{font-size:14px;flex-shrink:0}
#composer{width:min(760px,calc(100vw - 32px));border-radius:8px}#composer h2{font-size:22px}.compose-fields label,.compose-fields summary{font-size:14px}.compose-fields input,.compose-fields select{font-size:16px}#editor{font-size:16px;line-height:1.8}.format-toolbar button{width:44px;height:44px}#draft-status{font-size:12px;line-height:1.5;max-width:none}#composer footer .secondary{font-size:14px}.setting-row,.settings-note{font-size:14px}.mail-toast{font-size:14px;bottom:calc(20px + env(safe-area-inset-bottom))}.admin-table,.admin-actions button,.admin-actions a,.admin-table small{font-size:14px}
@media(min-width:701px) and (max-width:1100px){.mail-app{grid-template-columns:220px minmax(0,1fr)}.mail-brand{min-width:168px;font-size:14px}.mail-main{padding-inline:20px}.row-open{grid-template-columns:minmax(90px,120px) minmax(0,1fr) 18px 70px;gap:8px}.subject{max-width:100%}.mail-sidebar{padding-inline:10px}.folder{padding-inline:10px;font-size:14px}}
@media(max-width:700px){.mail-app{grid-template-columns:minmax(0,1fr);grid-template-rows:calc(68px + env(safe-area-inset-top)) minmax(0,1fr)}.mail-header{padding-top:env(safe-area-inset-top);padding-inline:max(8px,env(safe-area-inset-left)) max(8px,env(safe-area-inset-right));gap:4px}.mail-brand{min-width:0}.mail-search{height:44px}.header-tools .icon{width:44px}.mail-sidebar{width:290px}.mail-main{padding:18px max(10px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left))}.mail-heading{gap:8px;margin-bottom:14px}.mail-heading h1{font-size:25px}.mail-heading .eyebrow{font-size:11px}.mail-heading>p{font-size:12px}.mail-toolbar{gap:0}.mail-toolbar .icon{width:44px;height:44px}.select-all{width:38px}.bulk-actions select{width:116px;font-size:12px}.mail-toolbar .mono{font-size:11px;margin-inline:4px}.message-row,.mail-main[data-reading=true] .message-row{grid-template-columns:34px 34px minmax(0,1fr);gap:0;padding:0 4px 0 0}.row-check,.star{width:34px;height:44px}.row-open{grid-template-columns:minmax(0,1fr) 66px;gap:4px;min-height:96px;padding:12px 4px}.row-open .sender{grid-column:1;grid-row:1;font-size:14px}.row-open .date{grid-column:2;grid-row:1;font-size:11px}.row-open .message-copy{grid-column:1/3;grid-row:2;display:block;padding:0}.row-open .subject{display:block;max-width:100%;font-size:14px}.row-open .preview{display:block;font-size:13px}.row-open .attachment-indicator{grid-column:2;grid-row:1;justify-self:start}.row-open:has(.attachment-indicator svg) .date{padding-left:17px;font-size:10px}.list-panel{padding-bottom:76px}.mail-main[data-reading=true] .reader{padding:0 4px 28px}.reader-tools{top:-18px;gap:2px;padding-bottom:10px;margin-bottom:22px}.reader-tools .icon{width:44px;height:44px}.reader-tools select{font-size:13px}.reader h2{padding:0;font-size:24px}.message-header{padding:0 0 16px}.message-header time{font-size:12px;margin-left:54px}.thread-body,.message-body-text{font-size:16px;line-height:1.8;padding:0}.message-meta strong{font-size:15px}.message-meta small{font-size:13px}.reader-reply .secondary{flex:1;padding-inline:10px}.mail-content:has(.reader:not([hidden])){z-index:21}.mail-main[data-reading=true]~.mobile-compose{display:none}#composer{width:100vw;height:100dvh;max-height:100dvh;max-width:none;border-radius:0;overflow:auto}#compose-form{height:100%;overflow:auto;min-height:0}#composer header{flex-shrink:0}#composer footer{position:sticky;bottom:0;background:var(--surface);padding-bottom:max(12px,env(safe-area-inset-bottom));z-index:2;flex-wrap:wrap}#composer footer .secondary{font-size:13px}#draft-status{font-size:12px;max-width:none;flex-basis:100%}#editor{flex:1 0 150px;min-height:150px}.format-toolbar{flex-wrap:wrap}.mail-footer{font-size:11px}.mail-delivery{font-size:13px;margin:0 0 14px}.remote-warning{padding:0 0 14px}.remote-warning button{padding:8px}}
.message-header .message-meta{flex:1 1 220px;overflow-wrap:anywhere}.message-meta p{font-size:13px;line-height:1.7}.thread-truncated{font-size:13px}
.message-copy .preview{flex:1 1 0;min-width:0}
.mail-app:has(.mail-main[data-reading=true]) #mobile-compose{display:none}
@media(prefers-reduced-motion:reduce){.mail-sidebar{transition:none}.skeleton::after{animation:none}}
.workspace-profile{width:48px;height:48px;min-width:48px;aspect-ratio:1;display:grid;place-items:center;overflow:hidden;border:1px solid var(--line);border-radius:50%;background:var(--accent-bg);color:var(--accent);font-size:16px;flex:none;padding:0}.workspace-profile img,.message-avatar img{width:100%;height:100%;object-fit:cover}.message-avatar{overflow:hidden}.workspace-profile:disabled{opacity:1;cursor:default}.sidebar-bottom>.workspace-profile{margin-bottom:-4px}.sidebar-bottom>.text-button{text-align:left;padding:4px 0;min-height:40px;font-size:13px}.mailbox-dialog{width:min(500px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:24px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);overflow:auto}.mailbox-dialog::backdrop{background:#0009}.mailbox-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.mailbox-dialog header h2{font-size:22px}.mailbox-dialog footer{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.workspace-choice{display:flex;align-items:center;gap:16px;min-height:72px;width:100%;padding:12px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);text-align:left;font-size:14px}.workspace-choice[aria-current=true],.workspace-choice:hover{background:var(--accent-bg)}.workspace-choice>span:last-child{overflow-wrap:anywhere;min-width:0}#avatar-address{overflow-wrap:anywhere;margin-bottom:16px}#avatar-canvas{display:block;width:100%;height:auto;max-width:340px;margin:20px auto;background:var(--raised);border-radius:8px}.mailbox-dialog .setting-row{gap:16px;flex-wrap:wrap}.mailbox-dialog input[type=range]{width:100%;min-height:44px;padding:0}.mailbox-dialog .settings-note{margin-top:16px}.mailbox-dialog .mail-error{margin:12px 0}