
/* UX Pilot fictional Outlook triage lab, scoped styles only. */
.mail-safety{display:flex;gap:13px;align-items:start;background:#eef3eb;border:1px solid #d6e3d7;border-radius:14px;padding:13px 16px;margin:0 0 19px;color:#365947}
.mail-safe-dot{width:9px;height:9px;flex:0 0 9px;background:#578d71;border-radius:50%;margin-top:7px}
.mail-safety strong{font-size:10px;letter-spacing:.11em;display:block}
.mail-safety span:last-child{display:block;margin-top:4px;line-height:1.55;font-size:11px;color:#5c7564}
.mail-titlebar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.mail-eyebrow{margin:0 0 6px;font-size:10px;letter-spacing:.13em;font-weight:850;color:#728674}
.mail-titlebar h1,.mail-thread-head h1{font-size:clamp(24px,3.2vw,38px);line-height:1.16;letter-spacing:-.052em;margin:0 0 6px;font-weight:800;color:#1e2a28}
.mail-titlebar p:last-child{font-size:12px;color:#78847b;margin:0}
.mail-big-count{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#e8efe8;border-radius:17px;min-width:85px;padding:12px 16px;font-size:25px;font-weight:800;line-height:1}
.mail-big-count small{font-size:10px;color:#678473;margin-top:7px;font-weight:700}
.mail-filterline{display:flex;gap:6px;overflow:auto;padding:5px 0 13px;scrollbar-width:thin}
.mail-chip{flex:none;white-space:nowrap;border-radius:12px;padding:10px 13px;font-size:11px;background:#f4f4ef;color:#68746e;font-weight:750;border:1px solid #e4e9e1;min-height:44px}
.mail-chip span{margin-left:5px;color:#98a49a}
.mail-chip.is-active{background:#244937;color:#fff;border-color:#244937}
.mail-chip.is-active span{color:#bdd5c4}
.mail-search-label{display:flex;align-items:center;background:#fff;border:1px solid #e1e8df;border-radius:13px;padding:0 13px;margin-bottom:12px;gap:10px}
.mail-search-label>span{font-size:24px;color:#799184}
.mail-search-label input{width:100%;padding:14px 0;border:0;background:transparent;outline:0;min-width:0;font-size:13px;color:#243b2e}
.mail-list{border:1px solid #e5e9e2;background:#fff;border-radius:16px;overflow:hidden}
.mail-list-count{color:#829188;font-size:11px;margin-bottom:9px}
.mail-row{display:flex;gap:12px;align-items:center;padding:16px;text-align:left;background:#fff;width:100%;border:0;border-bottom:1px solid #eaf0e8;min-height:105px}
.mail-row:last-child{border-bottom:0}
.mail-row:hover,.mail-row:focus-visible{background:#f4f8f3}
.mail-avatar{display:grid;place-items:center;background:#e4eee4;color:#51765d;width:40px;height:40px;flex:0 0 40px;border-radius:12px;font-size:15px;font-weight:800}
.mail-row-content{min-width:0;flex:1;display:grid;gap:5px}
.mail-row-title{font-size:13px;font-weight:800;color:#263c30;line-height:1.3}
.mail-row-sub{font-size:11px;color:#768779;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mail-row-snippet{font-size:11px;color:#9ba79d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mail-row-end{align-self:flex-start;display:flex;align-items:flex-end;flex-direction:column;gap:9px;flex-shrink:0}
.mail-row-end small{font-size:10px;color:#9cab9e}
.mail-tag{font-size:10px;font-weight:750;border-radius:30px;padding:6px 9px;background:#eef0ed;color:#78887b;white-space:nowrap}
.mail-match{background:#e8f1e8;color:#547763}
.mail-warn{background:#fbf1df;color:#9b7636}
.mail-filed{background:#e7f3e9;color:#31805a}
.mail-empty{padding:36px 20px;background:#fff;text-align:center;color:#8c998d;font-size:13px}
.mail-back{background:transparent;padding:10px 0;margin:2px 0 14px;color:#587b64;font-size:12px;font-weight:750;min-height:44px}
.mail-thread-head{margin-bottom:21px}
.mail-thread-head h1{font-size:clamp(22px,2.9vw,35px);margin:0 0 13px}
.mail-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:#7e8d80;font-size:11px}
.mail-columns{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(265px,.87fr);gap:16px;align-items:start}
.mail-conversation,.mail-decision{background:#fff;border:1px solid #e5e9e2;border-radius:17px;padding:21px;min-width:0}
.mail-section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px;font-size:14px;font-weight:850;letter-spacing:-.03em;color:#304c39}
.mail-section-heading span{font-size:10px;color:#8ea191}
.mail-message{padding:18px 0;border-bottom:1px solid #eaf0e8}
.mail-message:first-of-type{padding-top:1px}
.mail-message:last-of-type{border-bottom:0}
.mail-message-head{display:flex;justify-content:space-between;align-items:start;gap:10px}
.mail-message-head strong{font-size:12px;word-break:break-word}
.mail-message-head span{font-size:11px;color:#8ea091;white-space:nowrap}
.mail-message-to{font-size:10px;color:#9ba79d;margin:6px 0 14px;word-break:break-word}
.mail-message-body{font-size:12px;line-height:1.85;color:#516154;white-space:pre-wrap;margin:0}
.mail-attachments{display:grid;gap:10px;margin-top:22px;border-top:1px solid #eaf0e8;padding-top:20px}
.mail-attachments strong{font-size:12px}
.mail-attachment{display:flex;align-items:center;gap:10px;padding:13px;background:#f4f6f2;border:1px solid #e9eee8;border-radius:11px;font-size:11px;min-width:0;word-break:break-word}
.mail-attachment span:first-child{font-size:22px;color:#7c9881}
.mail-attachment small{margin-left:auto;white-space:nowrap;color:#8f9e91}
.mail-rule{border:1px solid #dfe9df;border-radius:12px;background:#f6f9f4;padding:14px;margin:0 0 18px}
.mail-rule span{font-weight:750;color:#52765d;font-size:11px}
.mail-rule p{font-size:11px;margin:5px 0 0;line-height:1.55;color:#718775}
.mail-warning{border-radius:11px;padding:12px;margin:0 0 13px;background:#fff5e7;color:#8d713c;font-size:11px;line-height:1.6}
#mail-approve-form{display:grid;gap:8px}
#mail-approve-form label{font-size:11px;color:#5c7363;font-weight:750;margin-top:5px}
#mail-approve-form select,#mail-approve-form textarea,#mail-approve-form input{border:1px solid #dfe7dd;background:#fff;border-radius:10px;padding:12px;color:#314a39;width:100%;min-height:44px;font-size:12px;outline-offset:2px}
#mail-approve-form textarea{line-height:1.5;resize:vertical}
.mail-feedback{font-size:11px;line-height:1.5;color:#7d8f81;margin:10px 0 0}
.mail-primary{background:#254938;color:#fff;padding:13px;border-radius:11px;font-weight:800;font-size:12px;min-height:46px}
.mail-primary:disabled{opacity:.6}
.mail-secondary{display:flex;gap:10px;margin:12px 0}
.mail-secondary button{border:1px solid #dfe6dd;background:#f7f9f4;border-radius:10px;padding:12px;color:#58715e;font-size:11px;font-weight:700;flex:1;min-height:44px}
.mail-storage{font-size:10px;line-height:1.7;color:#9ca69e;margin:12px 0 0}
.mail-today,.mail-project-panel{margin:17px 0;background:#fff;border:1px solid #e3eae0;border-radius:16px;padding:17px}
.mail-today-top,.mail-project-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mail-today h2,.mail-project-panel h2{font-size:15px;color:#2f4438;margin:0;letter-spacing:-.035em}
.mail-today h2 span,.mail-project-panel h2 span{font-size:11px;color:#7d9b86;padding-left:4px}
.mail-open-all{font-size:11px;font-weight:800;color:#50775c;background:transparent;min-height:44px;white-space:nowrap}
.mail-today-note{font-size:10px;color:#99a69a;margin:7px 0 15px}
.mail-today-row,.mail-project-row{padding:12px 0;display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #ebefea}
.mail-today-row strong{font-size:11px;color:#667d6d}
.mail-today-row p{margin:4px 0 0;font-size:12px}
.mail-inline{padding:4px 0;border:0;background:transparent;text-align:left;display:inline;line-height:1.5;font-weight:730;font-size:12px;color:#356c52}
.mail-inline:hover{text-decoration:underline}
.mail-project-row>span{font-size:10px;color:#94a396;white-space:nowrap}
.mail-project-panel>p{font-size:10px;color:#94a396;margin:14px 0 0}
@media(max-width:1000px){.mail-columns{grid-template-columns:1fr}.mail-decision{order:-1}}
@media(max-width:640px){.mail-safety{padding:12px}.mail-titlebar{align-items:start}.mail-big-count{min-width:68px;font-size:21px}.mail-row{padding:13px 10px;gap:9px;min-height:93px}.mail-row-content{gap:4px}.mail-row-title{font-size:12px}.mail-row-snippet{font-size:10px}.mail-row-end .mail-tag{max-width:105px;white-space:normal;text-align:right;font-size:9px}.mail-avatar{width:33px;height:33px;flex-basis:33px}.mail-conversation,.mail-decision{padding:17px}.mail-attachment{flex-wrap:wrap}.mail-attachment small{margin-left:32px}.mail-today-row{align-items:start}.mail-today-row .mail-tag{max-width:100px;white-space:normal;text-align:center}}

@media(max-width:899px){#app[data-view="mail"] .mobile-capture-link{display:none!important}}
