/* Mailbox shell: folders, compact message list, reading pane. */
:root{--ink:#25313e;--muted:#7b8491;--line:#e5e8ed;--bg:#f5f6f8;--green:#2969b1;--soft:#edf3fa}
body{font-family:"Segoe UI","맑은 고딕",system-ui,sans-serif}
.app-header{height:64px;padding:0 24px;gap:36px;background:#fafbfc}
.brand-mark{width:30px;height:32px;border-radius:8px;background:#263d55;font-size:19px}
.brand strong{font-size:17px;letter-spacing:-.6px}.brand-caption{display:none}
.board{height:calc(100dvh - 64px);grid-template-columns:186px 324px minmax(0,1fr)}
.mail-sidebar{display:flex;flex-direction:column;min-width:0;padding:22px 12px;background:#f2f4f7;border-right:1px solid var(--line)}
.compose-button{width:100%;font-weight:600;padding:10px 16px!important;font-size:13px!important;box-shadow:0 2px 3px #17365410}
button.primary:hover{background:#225b98}
.mail-account{font-size:11px;color:#77818e;margin:25px 10px 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.folder-button{border:0;background:transparent;width:100%;display:flex;gap:11px;align-items:center;text-align:left;font-size:12px;padding:10px;margin:3px 0;border-radius:6px;color:#586373}
.folder-button svg{width:18px;height:18px;flex:none}.folder-button span{flex:1}.folder-button b{font-size:11px;font-weight:500}
.folder-button.selected{background:#dee8f4;color:#23568b;font-weight:600}.folder-button:hover{background:#e6ecf3}
.sidebar-foot{margin-top:auto;padding:20px 10px 0;font-size:10px;color:#929ba8}
.list-pane{background:white}.inbox-heading{padding:22px 20px 16px}.inbox-heading h2{font-size:18px;letter-spacing:-.7px;margin:0}.inbox-heading button{border:0;background:transparent;color:#788290;padding:3px 6px}
.list-search{padding:0 16px 13px}.list-search input{background:#f2f4f7;border:1px solid transparent;font-size:12px;padding:9px 12px;border-radius:6px}
.list-label{font-size:10px;padding:10px 20px;border-bottom:1px solid var(--line)}#folder-note{margin-left:auto;font-size:9px}
.mail-row{position:relative;border-bottom:1px solid #edf0f3;background:white}.mail-row:hover{background:#f7f9fc}.mail-row.active{background:#eaf1fa;box-shadow:inset 3px 0 #3278c5}
.mail-row-open{display:flex;gap:8px;width:100%;border:0;border-radius:0;padding:16px 18px 18px 10px;text-align:left;background:transparent;min-height:111px}
.mail-row-open:hover{background:transparent}.mail-row-content{min-width:0;flex:1}.read-dot{flex:none;width:6px;height:6px;border-radius:50%;margin-top:7px;background:transparent}.unread .read-dot{background:#3278c5}
.mail-row-top{display:flex;align-items:baseline;gap:10px;margin-bottom:5px}.mail-row-top strong{font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.unread .mail-row-top strong{font-weight:700;color:#1e2938}
.mail-row-top time{font-size:10px;color:#828d9b;white-space:nowrap}.mail-row-subject{display:flex;gap:5px;align-items:center;min-width:0;font-size:12px;color:#394555;margin-bottom:4px}.mail-row-subject span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1}.unread .mail-row-subject{font-weight:600}.mail-row-subject svg{width:13px;height:13px;color:#8290a0;flex:none}
.mail-row-content p{font-size:11px;font-weight:400;color:#84909e;margin:0 20px 0 0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.65;overflow-wrap:anywhere}
.star-button{position:absolute;right:11px;bottom:11px;padding:0 3px;border:0;background:transparent;font-size:17px;color:#b1b9c4;line-height:1.2}.star-button.starred{color:#bf8b2d}.star-button:hover{color:#95691a;background:transparent}
.detail-pane{padding:0 30px 40px;background:#fff}.mail-toolbar{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:13px 0;margin-bottom:25px;position:sticky;top:0;background:#fffffff5;z-index:2;backdrop-filter:blur(8px)}
.mail-toolbar button{font-size:11px;border:0;background:transparent;color:#657487;padding:6px 9px}.mail-toolbar button:hover{background:var(--soft)}.mail-toolbar span{font-size:10px;color:var(--muted);margin-left:auto}
.detail-head{padding-top:8px}.detail-head h2{font-size:20px;letter-spacing:-.5px;line-height:1.5}.detail-meta{font-size:11px}.detail-meta>.badge:first-child{display:none}.detail-head .actions select{font-size:10px;background:#fafbfc;border:1px solid var(--line);color:#788290;padding:5px}
.original-message .mail-body{max-height:400px;font-size:13px;line-height:1.9}.original-message>summary{font-size:11px}.mail-original{margin-bottom:22px}.composer.unified-composer{background:#f6f8fb;border-color:#e1e7ef;padding:16px;border-radius:8px}.composer-title label{font-size:13px;color:#44566d}.unified-composer textarea{border-color:#dde4ec}.composer-footer small{font-size:10px}.reply-heading h3{font-size:16px}
.reply-grid{grid-template-columns:minmax(0,1fr) 218px;gap:20px}.reply-documents{padding-left:18px}.sent-message{max-width:980px;margin:auto;padding-top:8px}.sent-message h2{line-height:1.6;overflow-wrap:anywhere}.sent-address{font-size:12px;line-height:2;color:#536273;border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:25px}.sent-address span{display:inline-block;width:78px;color:#939ca7}.sent-message .mail-body{max-height:none}
@media(max-width:1380px){.board{grid-template-columns:164px 300px minmax(0,1fr)}.detail-pane{padding:0 24px 35px}.reply-grid{grid-template-columns:minmax(0,1fr)}.reply-documents{border-left:0;border-top:1px solid var(--line);padding:15px 0;grid-row:auto}.document-card{display:block}.document-card button{width:auto}.mail-sidebar{padding:22px 8px}.folder-button{font-size:11px;gap:8px}}
@media(max-width:1000px){.board{grid-template-columns:148px 265px minmax(0,1fr)}.app-header{gap:16px;padding:0 18px}.detail-pane{padding:0 18px 30px}.mail-row-open{padding-right:13px}.mail-toolbar{gap:2px;flex-wrap:wrap}.mail-toolbar button{font-size:10px;padding:5px}.detail-head{display:block}.detail-head .actions{margin-bottom:12px}.detail-head h2{font-size:17px}.original-message .mail-body{max-height:300px}}
@media(max-width:760px){.app-header{height:60px;padding:0 12px}.brand strong{font-size:15px}.main-nav>.nav{font-size:11px}.board{height:auto;min-height:calc(100dvh - 60px);grid-template-columns:minmax(0,1fr)}.mail-sidebar{padding:10px 14px;border-right:0;border-bottom:1px solid var(--line);display:block}.compose-button{width:auto;float:right;font-size:11px!important;padding:7px 14px!important}.mail-account{margin:7px 0 12px;max-width:65%}#mail-folders{display:flex;overflow:auto;gap:5px;clear:both}.folder-button{flex:none;width:auto;gap:5px;margin:0;padding:7px 9px;font-size:11px}.folder-button svg{width:15px;height:15px}.folder-button b{font-size:10px}.sidebar-foot{display:none}.inbox-heading{padding:15px 18px 10px}.inbox-heading h2{font-size:16px}.list-search{padding-bottom:5px}.list-label{padding:7px 18px}#work-list{max-height:310px}.mail-row-open{padding:12px 18px 12px 12px;min-height:95px}.mail-row-content p{-webkit-line-clamp:1}.mail-toolbar{position:static;margin-bottom:15px}.detail-pane{padding:0 18px 25px}.reply-documents{grid-row:auto}.sent-message h2{font-size:18px}}

/* The last request, its outcome, and the next action stay together. */
.request-status{border:1px solid #dce6df;background:#f4f8f5;border-radius:9px;padding:17px 18px;margin:0 0 12px;font-size:12px}
.request-status.working{background:#f3f7fc;border-color:#dae5f3}.request-status.attention{background:#fffbf3;border-color:#eddfbd}
.request-status-head{display:flex;align-items:center;gap:9px}.request-status-head strong{font-size:14px;color:#274838}.request-status.working strong{color:#305d8c}.request-status.attention strong{color:#80622e}
.request-status-head time{margin-left:auto;white-space:nowrap;font-size:10px;color:var(--muted)}.status-symbol{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#e0eee4;flex:none}.working .status-symbol{background:#e0ebf8;animation:request-pulse 1.8s ease-in-out infinite}.attention .status-symbol{background:#f6e9c9}
.last-request{display:flex;gap:10px;padding:10px 0 0;margin-top:8px;border-top:1px solid #dce6df}.last-request>span{flex:none;font-size:10px;color:var(--muted);padding-top:2px}.last-request p{margin:0;color:#566370;white-space:pre-wrap;overflow-wrap:anywhere;max-height:90px;overflow:auto}
.request-summary{white-space:pre-wrap;overflow-wrap:anywhere;margin:12px 0 8px;line-height:1.8;max-height:220px;overflow:auto}.change-tags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.change-tags span{font-size:10px;background:white;border:1px solid #dce6df;border-radius:5px;padding:2px 7px;color:#42664f}
.request-next{color:#68776f;font-size:11px;margin:9px 0 0}.request-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}.request-actions:empty{display:none}.request-actions button{font-size:11px;padding:6px 10px}
.reply-comparison{display:grid;grid-template-columns:1fr 1fr;gap:18px}.reply-comparison section{min-width:0;padding:12px;background:#f7f9fc;border-radius:7px}.reply-comparison p,.reply-comparison b{overflow-wrap:anywhere;font-size:12px}.reply-comparison .document-text{white-space:pre-wrap;font-size:12px;margin:14px 0;max-height:45vh;overflow:auto;overflow-wrap:anywhere}#document-dialog:has(.reply-comparison){width:960px}
@keyframes request-pulse{50%{opacity:.4}}@media(prefers-reduced-motion:reduce){.working .status-symbol{animation:none}}@media(max-width:760px){.request-status{padding:14px}.request-status-head{flex-wrap:wrap}.request-status-head time{margin-left:32px}.reply-comparison{grid-template-columns:1fr}}

.request-pending{margin:10px 0;padding-left:20px;color:#805f24;font-size:12px;line-height:1.9;overflow-wrap:anywhere}
.contact-field{position:relative}.contact-suggestions{position:absolute;z-index:8;top:100%;left:0;right:0;max-height:250px;overflow:auto;background:#fff;border:1px solid #d8e0e9;border-radius:7px;box-shadow:0 10px 24px #27384c22}.contact-suggestions[hidden]{display:none!important}.contact-suggestions button{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 9px;width:100%;border:0;border-bottom:1px solid #edf0f3;border-radius:0;background:white;text-align:left;padding:9px 12px;font-size:12px}.contact-suggestions button:hover,.contact-suggestions button:focus{background:#edf3fa}.contact-suggestions button strong{color:#263d55}.contact-suggestions button span{color:#6b7886;font-weight:400}.contact-suggestions button small{display:block;flex-basis:100%;color:#54718d;font-size:11px}

/* Reading and composing occupy the same pane; neither stacks beneath the other. */
#compose-panel[hidden],#reader-actions[hidden],#direct-reply[hidden],.compose-source[hidden]{display:none!important}
.detail-pane:not(.is-composing) .work-tools{display:none}
.detail-pane:not(.is-composing) .original-message .mail-body{max-height:none;overflow:visible}
.reader-actions{display:flex;align-items:center;gap:8px;padding:16px 0;flex-wrap:wrap}
.reader-actions button{font-size:12px;padding:8px 16px}.reader-actions .muted{font-size:11px}
.reader-addresses{font-size:12px;line-height:1.8;color:#43566b;margin-bottom:20px;overflow-wrap:anywhere}
.reader-addresses span{display:inline-block;min-width:68px;color:#8190a0;font-size:11px}
.detail-pane:has(.reader-addresses) .detail-meta{display:none}
.detail-pane.is-composing{padding:0!important;overflow:hidden;scrollbar-gutter:auto;min-height:0}
.is-composing>.mail-toolbar,.is-composing>.detail-head,.is-composing>.reader-addresses,.is-composing>.mail-original,.is-composing>.mobile-mail-back{display:none!important}
#compose-panel{height:100%;min-height:0;display:flex;flex-direction:column;background:white;margin:0;border:0;border-radius:0}
.compose-topbar{display:flex;align-items:center;gap:12px;flex:none;padding:12px 20px;border-bottom:1px solid var(--line);min-height:54px;background:#fafbfc}
.compose-topbar strong{font-size:14px;white-space:nowrap}.compose-topbar>div{display:flex;align-items:center;gap:4px;margin-left:auto}
.compose-topbar button{font-size:11px;padding:6px 8px;border:0;background:transparent;color:#536b85;white-space:nowrap}
.compose-topbar #draft-status{font-size:10px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compose-middle{display:flex;flex:1;min-height:0;position:relative}
.compose-scroll{flex:1;min-width:0;overflow-y:auto;overscroll-behavior:contain;padding:0 24px 20px;scrollbar-gutter:stable}
#compose-panel #reply-area{max-width:none;margin:0;padding:0}
#compose-panel .reply-heading{display:none}
#compose-panel .reply-grid{display:block}
#compose-panel .draft-form{padding:0}
#compose-panel .draft-form>label:not(.message-editor){display:flex;align-items:center;gap:14px;font-size:11px;color:var(--muted);margin:0;border-bottom:1px solid #edf0f3;min-height:44px}
#compose-panel .draft-form>label>input{flex:1;min-width:0;border:0;box-shadow:none;background:transparent;margin:0;padding:10px 0;border-radius:0;font-size:13px;color:var(--ink)}
#compose-panel .draft-form>details{font-size:11px;margin:0;border-bottom:1px solid #edf0f3;padding:8px 0;color:var(--muted)}
#compose-panel .draft-form>details label{display:flex;align-items:center;gap:10px;margin:8px 0 0}#compose-panel .draft-form>details input{flex:1;margin:0;padding:8px}
#compose-panel .message-editor{display:block;margin:0;padding:16px 0 0}
#compose-panel #draft-body{display:block;width:100%;resize:none;overflow:hidden;border:0;border-radius:0;outline-offset:2px;box-shadow:none;background:white;min-height:220px;padding:0;line-height:1.85;font-size:14px;margin:0}
#compose-panel .compose-attachments{padding-top:12px;margin-top:12px}
#compose-panel .attachment-empty{margin:8px 0;font-size:11px}
#compose-panel .attachment-picker{margin-top:6px}
#compose-panel .attachment-item{padding-top:7px;padding-bottom:7px}
.compose-bottom{flex:none;border-top:1px solid var(--line);background:#fafbfc;padding:12px 20px 0}
#compose-panel #prepare-area{max-width:none;margin:0}
#compose-panel .unified-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;margin:0;padding:0;background:transparent;border:0;border-radius:0}
#compose-panel .composer-title{grid-column:1/-1;margin:0}
#compose-panel .composer-title label{font-size:11px;margin:0;color:#536b85}
#compose-panel #request-text{min-height:44px;height:44px;max-height:110px;resize:vertical;margin:0;background:white;font-size:12px;padding:10px 12px;grid-column:1;grid-row:2;border:1px solid #dbe2eb}
#compose-panel #request-submit{grid-column:2;grid-row:2;align-self:stretch;font-size:12px;padding:8px 14px;margin:0}
#compose-panel .composer-footer{grid-column:1/-1;grid-row:3;margin:0}.composer-footer small{font-size:10px;color:#8a95a3}
#compose-panel #live-status:empty{display:none}
#compose-panel .draft-footer{display:flex;align-items:center;flex-wrap:nowrap;gap:8px;position:static;margin:0;padding:12px 0;background:transparent;border:0;box-shadow:none}
#compose-panel .draft-footer button{font-size:12px;padding:8px 12px}
#compose-panel #send{order:-2;min-width:80px}#compose-panel #composer-attach{order:-1}#compose-panel #compose-discard{margin-left:auto}
#compose-panel .draft-footer>[type=submit]{display:none}
.compose-extras{border-top:1px solid var(--line);padding:12px 0;font-size:11px;color:var(--muted);margin-top:18px}
.compose-extras>summary,.ai-options>summary{cursor:pointer;padding:4px 0}
.compose-extras .reply-documents{padding:0;border:0}.compose-extras .work-tools{margin-top:10px}
.compose-extras .request-status{margin-top:12px;padding:12px}.compose-extras .request-summary{overflow:visible}
.ai-options{margin-top:12px}.ai-options .actions{display:flex;gap:6px;margin-top:10px}.ai-options button{font-size:11px}
.compose-source{flex:0 0 45%;min-width:0;border-left:1px solid var(--line);background:#f7f9fc;display:flex;flex-direction:column}
.source-heading{padding:10px 16px;display:flex;align-items:center;justify-content:space-between;font-size:12px;border-bottom:1px solid var(--line)}
.source-heading button{border:0;background:transparent;font-size:20px;padding:0 5px}
.source-content{overflow:auto;overscroll-behavior:contain;padding:18px;min-height:0}
.compose-source .mail-original{margin:0;border:0}.compose-source .mail-body{max-height:none;overflow:visible;font-size:12px;line-height:1.9}
.board.compose-expanded{grid-template-columns:165px minmax(0,1fr)}.board.compose-expanded .list-pane{display:none}
.mobile-mail-back,.mobile-mail-nav{display:none}
@media(max-width:1200px){.source-open .compose-source{position:absolute;inset:0;z-index:5;border:0;flex:none}.compose-topbar #draft-status{display:none}}
@media(max-width:760px){
.app-header{height:60px}.board,.board.compose-expanded{display:block;height:calc(100dvh - 60px);min-height:0;overflow:hidden}
.board .mail-sidebar{display:none}.board .detail-pane{display:none}.board .list-pane{height:100%}
.board.mail-open .list-pane{display:none}.board.mail-open .detail-pane{display:block;height:100%;padding:12px}
.board:not(.mail-open) #work-list{max-height:none}
.mobile-mail-nav{display:flex;gap:10px;padding:0 16px 12px}.mobile-mail-nav select{flex:1;width:auto;margin:0}.mobile-mail-nav button{white-space:nowrap}
.mobile-mail-back{display:inline-block;border:0;background:transparent;padding:8px 0;color:#3a6d9f;margin-bottom:12px}
.compose-topbar{padding:10px 12px;gap:5px}.compose-topbar strong{font-size:13px}.compose-topbar button{padding:6px 5px;font-size:10px}#compose-expand{display:none}
.compose-scroll{padding:0 16px 16px}.compose-bottom{padding:10px 12px 0}#compose-panel .draft-footer{padding:10px 0}
#compose-panel #draft-body{font-size:16px}#compose-panel .draft-form>label>input,#compose-panel #request-text{font-size:16px}
#worker-status{font-size:10px!important}.original-message>summary span{display:inline;font-size:10px}
}

#compose-notice[hidden]{display:none}#compose-notice{display:block;width:100%;text-align:left;font-size:11px;color:#39684c;border:0;background:#edf5ef;padding:7px 10px;margin:0 0 8px;border-radius:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#compose-notice.attention{background:#fff3dd;color:#875f21}

/* Allocate the worker status row instead of letting it push the footer off screen. */
#app:has(#workspace:not(.hidden)){height:100dvh;display:flex;flex-direction:column;overflow:hidden}
#app:has(#workspace:not(.hidden))>.app-header{flex:none}
#app:has(#workspace:not(.hidden))>main{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
#app #worker-status{flex:none;padding:4px 16px!important;font-size:10px!important;line-height:16px;margin:0}
#workspace{flex:1;min-height:0}#workspace .board{height:100%;min-height:0}

/* Optional material lives in focused dialogs instead of nested disclosures. */
#compose-panel #request-text{resize:none;max-height:none;overflow-y:hidden;line-height:22px}
#compose-panel #request-submit{align-self:end;height:44px}
#compose-panel .composer-title{align-items:center;justify-content:space-between}
#compose-panel #compose-activity{font-size:11px;margin:0;padding:0;border:0;background:transparent;color:#738194}
#compose-panel #attach-local{display:none}
#compose-panel .attachment-heading h4{margin-right:auto}
#compose-panel .library-open{font-size:11px;padding:5px 8px}
.compose-dialog{width:680px;max-width:calc(100vw - 32px);max-height:85dvh;padding:0;overflow:hidden}
.compose-dialog[open]{display:flex;flex-direction:column}
.compose-dialog .dialog-head{flex:none;padding:16px 20px;border-bottom:1px solid var(--line)}
.compose-dialog .dialog-head h2{font-size:16px}
.compose-dialog-content{padding:16px 20px;overflow:auto;min-height:0}
.compose-dialog .compose-extras{margin:0;padding:0;border:0}
.compose-dialog .compose-extras>summary,.compose-dialog .attachment-picker>summary{display:none}
.compose-dialog .attachment-picker{padding:0;background:white;margin:0}
.compose-dialog .ai-options>summary,.compose-dialog .advanced>summary,.compose-dialog .work-tools>summary{list-style:none;pointer-events:none;font-weight:600;color:var(--ink);margin-top:14px}
.compose-dialog summary::-webkit-details-marker{display:none}
.compose-dialog .primary{width:auto;margin-top:0}
.compose-dialog .work-tools{display:block!important}
.compose-dialog .attachment-picker .company-library{margin-top:16px}

.compose-dialog-content h3{font-size:12px;margin:20px 0 10px}.compose-dialog-content #library-local{margin-bottom:18px;font-size:12px}.compose-dialog-content>.muted{font-size:12px}

/* Mail reading: one action bar, distinct message header, body and attachments. */
.detail-pane:not(.is-composing){padding:0!important;background:#f3f5f8;overflow-y:auto}
.reader-surface{min-height:100%;padding-bottom:24px;container-type:inline-size}
.is-composing>.reader-surface{display:none}
.reader-toolbar{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #dce2e9;min-height:66px;white-space:nowrap}
.reader-reply-group{display:flex;align-items:center;gap:6px;flex:none;min-width:0}
.reader-toolbar .reader-actions{padding:0;gap:6px;flex-wrap:nowrap;flex:none}
.reader-manage-group{display:flex;align-items:center;gap:6px;border-left:1px solid #dce2e9;padding-left:16px;flex:none;min-width:0}
.reader-toolbar button,.reader-toolbar .reader-actions button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:12px;line-height:20px;padding:8px 10px;min-height:38px;border:1px solid #d5dee9;background:#fff;color:#43556b;font-weight:500;white-space:nowrap;flex:none;border-radius:8px;box-shadow:0 1px 2px #18344c08;transition:background .15s,border-color .15s}
.reader-toolbar button svg{width:16px;height:16px;flex:none}
.reader-toolbar button:hover:not(:disabled){background:#f0f5fb;border-color:#aebfd3;color:#223c5a}
.reader-toolbar button:focus-visible{outline:2px solid #4b85c5;outline-offset:2px}
.reader-toolbar button:disabled{opacity:.45;box-shadow:none;cursor:default}
.reader-toolbar .task-open-button{background:#edf4ff;border-color:#cadbf1;color:#2c6097;font-weight:600}
.reader-toolbar .task-open-button:hover:not(:disabled){background:#e0edff;border-color:#9cb9df;color:#214d7d}
.reader-toolbar #mail-star-toggle.is-marked{background:#fff9e9;border-color:#eadbb4;color:#936d17}
.reader-toolbar #mail-star-toggle.is-marked svg{fill:#f9e8a4}
.reader-toolbar #mail-trash:hover:not(:disabled){background:#fff0ef;color:#b14238;border-color:#f3d8d3}
.reader-card{margin:22px;border:1px solid #e0e5ec;border-radius:10px;background:white;box-shadow:0 2px 6px #223b5610;overflow:hidden}
.reader-header{padding:24px 28px 22px;border-bottom:1px solid #e4e9ef;background:#fff}
.reader-caption{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:11px;color:#788595;margin-bottom:12px}
.reader-caption>span{font-weight:600;color:#64748b}.reader-caption time{white-space:nowrap}
.reader-header .detail-head{max-width:none;padding:0;margin:0;display:block}
.reader-header h2,.reader-header .detail-head h2{font-size:21px;font-weight:650;line-height:1.5;letter-spacing:-.4px;color:#202c3c;margin:0 0 20px}
.reader-header .detail-meta{display:none}
.reader-header .detail-head>.actions{float:right;margin:0 0 8px 16px}
.reader-header .detail-head>.actions:empty{display:none}
.reader-header .reader-addresses{margin:0;font-size:12px;line-height:1.85;color:#46556a;clear:both}
.reader-header .reader-addresses>div{display:flex;align-items:baseline;gap:12px;padding:2px 0;overflow-wrap:anywhere}
.reader-header .reader-addresses>div:first-child{font-weight:600;color:#273c53;font-size:13px}
.reader-header .reader-addresses span{flex:0 0 60px;min-width:60px;color:#8a96a5;font-size:11px;font-weight:400}
.reader-card>.mail-original{margin:0;padding:0;border:0;max-width:none}
.reader-card .reader-body{padding:28px;max-height:none!important;overflow:visible!important;font-size:14px;line-height:1.9;color:#303d4c}
.reader-card .reader-attachments{margin:0;padding:20px 28px;background:#f9fbfd;border-top:1px solid #e6ebf1}
.reader-attachments h4{font-size:12px;color:#536477;margin:0 0 12px}
.reader-attachments .attachment-item{background:white}
.reader-header .sent-address{margin:0;padding:0;border:0;font-size:12px}
.reader-card>.attachment-chips{display:block}
.reader-card>.attachment-chips>.attachment-item{display:inline-flex;margin:0 8px 8px 0}
/* List and editor use the same clear separators and restrained emphasis. */
.list-pane{border-right:1px solid #dce2e9}
.list-label{background:#fafbfd;color:#8591a1}
.mail-row.active{background:#eaf1fa;box-shadow:inset 3px 0 #547fae}
.mail-row-subject{color:#344359}.mail-row-top strong{color:#273c53}
.compose-topbar{background:#f5f7fa;border-bottom:1px solid #dce2e9}
.compose-bottom{background:#f3f6fa;border-top:1px solid #d6e0eb;box-shadow:0 -2px 6px #2d425608}
#compose-panel .compose-attachments{background:#f9fbfd;border:1px solid #e4eaf1;border-radius:8px;padding:12px 14px;margin-top:20px}
#compose-panel .attachment-heading h4{color:#526579}
#compose-panel .attachment-empty{margin-bottom:0}
@media(max-width:1100px){.reader-toolbar{padding:10px 12px;gap:8px;justify-content:flex-start}.reader-toolbar button,.reader-toolbar .reader-actions button{font-size:11px;padding:6px 8px}.reader-manage-group{padding-left:8px}.reader-card{margin:16px}.reader-header{padding:20px}.reader-card .reader-body{padding:24px 20px}.reader-card .reader-attachments{padding:16px 20px}}
@media(max-width:760px){.reader-toolbar{position:sticky;top:0;min-height:50px}.reader-card{margin:12px 10px;border-radius:8px}.reader-header{padding:18px 16px}.reader-header h2,.reader-header .detail-head h2{font-size:18px}.reader-card .reader-body{padding:22px 16px;font-size:14px}.reader-card .reader-attachments{padding:16px}.reader-header .reader-addresses>div{gap:6px}.reader-caption{font-size:10px}.detail-pane:not(.is-composing)>.mobile-mail-back{display:block;margin:0;padding:10px 14px;background:#f3f5f8}.reader-surface{min-height:0}}

.reader-caption .actions{margin-left:auto}.reader-caption .actions select{font-size:11px;padding:3px 7px;color:#69798b;background:#f8fafc;border:1px solid #e2e8f0;margin:0;width:auto}.reader-caption time{margin-left:auto}.reader-caption .actions+time{margin-left:0}
.send-notice{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;border-bottom:1px solid #dce6ee;background:#eef5fb;color:#315b7b;flex:none}
.send-notice strong{font-size:14px}.send-notice p{font-size:12px;margin:5px 0 0;line-height:1.5}.send-notice button{flex:none;background:white;font-size:12px}
.send-notice.failed,.send-notice.uncertain{background:#fff6e9;border-color:#ead9ba;color:#88581a}
.reply-sent-status{display:flex;align-items:center;gap:7px;margin-top:14px;font-size:11px;color:#728195}
.reply-sent-status svg{width:15px;height:15px;flex:none}
.reply-sent-status button{padding:0;margin-left:5px;border:0;background:transparent;color:#416e9e;font-size:11px;line-height:20px;box-shadow:none}
.reply-sent-status button:hover{color:#204d7f;text-decoration:underline}
.reply-sent-status button:focus-visible{outline:2px solid #4b85c5;outline-offset:3px;border-radius:3px}
@media(max-width:760px){.send-notice{padding:12px;align-items:flex-start;flex-direction:column;gap:8px}}

/* A narrow reading pane gets two complete action groups, never one stray button. */
@container(max-width:820px){
  .reader-toolbar{flex-direction:column;align-items:stretch;gap:10px;padding:12px}
  .reader-reply-group,.reader-manage-group{width:100%;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px}
  .reader-manage-group{border-left:0;border-top:1px solid #e0e7ef;padding-left:0;padding-top:10px}
}
@container(max-width:430px){
  .reader-toolbar{padding:10px;gap:8px}
  .reader-toolbar button,.reader-toolbar .reader-actions button{padding:7px;gap:5px;font-size:11px;min-height:44px}
  .reader-reply-group,.reader-manage-group,.reader-toolbar .reader-actions{gap:5px}
}