/* Original Mail Room visual language. Theme-specific additions are below.
   Never define --workspace-bg on :root: that caused the mixed dark/light page. */
:root{color-scheme:light;--bg:#f5f6f8;--panel:#fff;--panel-alt:#fafbfc;--text:#242936;--muted:#5f6b7e;--line:#e5e8ee;--accent:#ea580c;--accent-text:#b33b04;--primary:#cf4806;--soft:#fff1e8;--sidebar:246px;--shadow:0 20px 70px #131b2820;--placeholder:#687386;--danger:#b92e38;--danger-bg:#fff0ee;--success:#21764d;--success-bg:#e7f6ee}
:root[data-theme=dark],body.dark{color-scheme:dark;--bg:#11151c;--panel:#1b212c;--panel-alt:#202835;--text:#e6ebf4;--muted:#aab6c9;--line:#303b4c;--accent-text:#ff9b61;--primary:#cf4806;--soft:#38261e;--shadow:0 20px 70px #0005;--placeholder:#9eacc1;--danger:#ff9ca4;--danger-bg:#40242c;--success:#91d9b4;--success-bg:#1b352d}
*{box-sizing:border-box}body{margin:0;font:14px/1.5 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0 0 15px}h1{font-size:29px;letter-spacing:-1px;line-height:1.2}h2{font-size:20px;letter-spacing:-.5px}h3{font-size:14px}p{line-height:1.75}
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.55;cursor:wait}button:focus-visible,a:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
input,select,textarea{width:100%;min-width:0;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:9px;padding:12px;outline-offset:2px}input:focus,select:focus,textarea:focus{outline:2px solid #ea580c35;border-color:var(--accent)}input::placeholder,textarea::placeholder{color:var(--placeholder);opacity:1}select option{color:var(--text);background:var(--panel)}textarea{resize:vertical;line-height:1.65}label,.field{display:flex;flex-direction:column;gap:8px;font-size:12px;color:var(--muted);font-weight:550}input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent)}a{color:inherit;text-decoration:none}small,.small{font-size:11px}.hidden{display:none!important}.muted{color:var(--muted)}.accent{color:var(--accent-text)}.danger{color:var(--danger)!important}.thin{font-weight:400}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:650}.stack{display:flex;flex-direction:column;gap:20px}.row{display:flex;align-items:center;gap:12px}.wrap{flex-wrap:wrap}.spacer{flex:1}.full{width:100%}.check{display:flex;flex-direction:row;align-items:center;gap:9px;color:var(--text);font-size:12px;font-weight:400}
.primary,.secondary{padding:11px 18px;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:600;border-radius:9px;font-size:12px;min-height:38px}.primary{background:var(--primary);color:#fff;box-shadow:0 4px 12px #ea580c18}.primary:hover{background:#b83e05}.secondary{color:var(--text);background:var(--panel);border:1px solid var(--line)}.secondary:hover{background:var(--bg)}.text-button{padding:7px;background:transparent;color:var(--muted);font-size:11px}.text-button:hover{color:var(--accent-text)}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;background:transparent;color:var(--muted);font-size:19px;flex-shrink:0}.icon-button:hover{background:var(--bg);color:var(--text)}.icon{width:18px;height:18px;vertical-align:middle;flex-shrink:0}.button-group{display:flex;flex-wrap:wrap;gap:9px;align-items:center}.pill{display:inline-flex;align-items:center;gap:6px;font-size:9px;font-weight:600;border-radius:6px;padding:5px 9px;background:var(--soft);color:var(--accent-text)}.pill.green{background:var(--success-bg);color:var(--success)}.pill.gray{background:var(--bg);color:var(--muted)}
.notice,.error{padding:14px 17px;background:var(--soft);color:var(--text);font-size:12px;line-height:1.7;border-radius:10px}.notice{border-left:3px solid var(--accent)}.error{background:var(--danger-bg);color:var(--danger)}.card{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:15px;padding:25px}.divider{height:1px;background:var(--line);margin:8px 0}.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.wide{grid-column:1/-1}.brand{display:flex;align-items:center;gap:12px;font-weight:750;font-size:20px;letter-spacing:-.6px}.brand img{width:38px;height:38px}.brand small{display:block;font-size:8px;letter-spacing:2px;font-weight:500;opacity:.65;margin-top:4px}
.login{display:grid;grid-template-columns:60% 40%;min-height:100dvh}.cinema{background:#101319;color:white;position:relative;overflow:hidden;display:flex;flex-direction:column;padding:54px 64px}.cinema .brand{z-index:2}.hero{z-index:2;margin:auto 0;padding:95px 0 80px}.hero h1{font-size:clamp(42px,4.7vw,78px);font-weight:550;line-height:1.08;letter-spacing:-3.5px;margin:28px 0}.hero em{font-family:Georgia,serif;font-weight:400;color:#ffb184}.hero p{font-size:13px;color:#a0a6ae;line-height:1.9}.hero .eyebrow{display:flex;align-items:center;gap:8px;color:#c6c9ce;font-size:9px;letter-spacing:1.7px}.rec{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 15px #ea580c88}.slate{display:flex;gap:35px;margin-top:45px;padding-top:20px;border-top:1px solid #ffffff1c;width:fit-content;font:9px/1.8 ui-monospace,monospace;color:#929ba9;letter-spacing:1px}.slate strong{display:block;color:#c5c8cd;font-size:9px;font-weight:400}.cinema-bottom{display:flex;justify-content:space-between;gap:20px;font:8px ui-monospace,monospace;letter-spacing:1.3px;color:#9aa3b0;z-index:2}.cinema-bottom b{color:#ea580c;margin:0 10px}.film-perfs{position:absolute;left:0;right:0;height:10px;background:repeating-linear-gradient(90deg,transparent 0 17px,#ffffff10 17px 28px,transparent 28px 38px);z-index:1}.film-perfs.top{top:16px}.film-perfs.bottom{bottom:16px}.lens{position:absolute;width:680px;height:680px;border-radius:50%;right:-345px;top:12%;background:repeating-radial-gradient(circle at center,#131923 0 5px,#242d38 6px 8px,#0b1119 9px 12px);border:18px solid #0d1118;box-shadow:0 0 0 2px #ffffff12,0 0 70px #0008;transform:rotate(-20deg);opacity:.62}.lens:before{content:"";position:absolute;inset:70px;border-radius:50%;border:3px solid #554837;background:radial-gradient(ellipse at 40% 30%,#6a73766b,transparent 40%),radial-gradient(circle at 50% 50%,#000 0 18%,#263841 20%,#0a1828 31%,#171d28 45%,#060a10 65%);box-shadow:inset 0 0 80px black}.lens:after{content:"";position:absolute;inset:185px;border:1px solid #93c0d329;border-radius:50%;box-shadow:0 0 35px #59717d24,inset 0 0 30px #9c8a7855}.lens i{position:absolute;inset:115px;border-radius:50%;background:linear-gradient(130deg,transparent 40%,#f0b48522 47%,transparent 53%)}.light-beam{position:absolute;inset:0;background:linear-gradient(118deg,transparent 35%,#e88c3720 65%,transparent 78%);mix-blend-mode:screen;animation:beam 15s ease-in-out infinite alternate;opacity:.7}.viewfinder{position:absolute;inset:133px 35px 96px;border:1px solid #ffffff05;pointer-events:none}.viewfinder i{position:absolute;width:16px;height:16px;border-color:#ffffff38;border-style:solid}.viewfinder i:nth-child(1){top:0;left:0;border-width:1px 0 0 1px}.viewfinder i:nth-child(2){right:0;top:0;border-width:1px 1px 0 0}.viewfinder i:nth-child(3){bottom:0;left:0;border-width:0 0 1px 1px}.viewfinder i:nth-child(4){right:0;bottom:0;border-width:0 1px 1px 0}@keyframes beam{from{transform:translateX(-10%);opacity:.3}to{transform:translateX(10%);opacity:.8}}
/* The original cinema login is intentionally a fixed dark/light split. */
.login-main{--text:#242936;--muted:#5f6b7e;--panel:#fff;--line:#e5e8ee;--placeholder:#687386;--soft:#fff1e8;color-scheme:light;background:#fdfcfb;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:65px 45px;color:var(--text)}.login-card{width:100%;max-width:350px;margin:auto 0}.login-card h2{font-size:28px;line-height:1.25;letter-spacing:-1px;margin-top:17px}.login-card>.muted{font-size:12px;margin-bottom:32px}.login-card input,.login-card select{background:white;color:#242936}.login-card .primary{margin-top:7px;padding:15px 18px;justify-content:space-between;background:#20252c}.login-card .notice{margin-bottom:23px}.login-note{font-size:10px;color:#687386;margin:30px 0 0}.login-main footer{font-size:9px;color:#687386;padding-top:35px}.google-button{background:white;border:1px solid #e3e6eb;border-radius:9px;width:100%;padding:12px;margin-top:15px;font-size:12px}.google-mark{font-weight:750;color:#4285f4;margin-right:12px}#google-login{margin-top:15px}
.workspace{display:flex;height:100dvh;overflow:hidden}.sidebar{width:var(--sidebar);flex-shrink:0;background:var(--panel);border-right:1px solid var(--line);padding:28px 17px 18px;display:flex;flex-direction:column;overflow:auto;color:var(--text)}.sidebar .brand{font-size:18px;padding:0 7px;margin-bottom:33px}.sidebar .brand img{width:33px;height:33px}.sidebar .brand small{font-size:7px}.sidebar label{font-size:9px;letter-spacing:1px;margin:0 7px}.sidebar select{font-size:11px;letter-spacing:0;padding:9px;max-width:100%}.sidebar .primary{margin:14px 0 21px}nav{display:flex;flex-direction:column;gap:5px}.nav-button{background:transparent;width:100%;text-align:left;border-radius:9px;padding:11px 13px;display:flex;align-items:center;gap:12px;font-size:12px;color:var(--muted);min-height:41px}.nav-button:hover{background:var(--bg)}.nav-button.active{background:var(--soft);color:var(--accent-text);font-weight:600}.nav-symbol{font-size:16px;display:inline-block;width:20px;text-align:center}.nav-count,.nav-button .count{margin-left:auto;font-size:9px;background:var(--bg);padding:2px 7px;border-radius:4px}.nav-heading,.nav-section{font-size:9px;letter-spacing:1.4px;color:var(--muted);display:flex;align-items:center;justify-content:space-between;margin:23px 12px 8px}.nav-section .text-button{padding:0 4px}.nav-button>span:first-child{display:inline-flex;align-items:center;min-width:0;overflow-wrap:anywhere}.sidebar-bottom{margin-top:auto;padding:30px 10px 0;color:var(--muted)}.sidebar-bottom small{font-size:9px}.sidebar footer{font-size:8px;margin-top:14px}.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#2c9f69}.profile-card{background:transparent;display:flex;gap:11px;align-items:center;width:100%;text-align:left;padding:0 0 18px}.profile-card strong{display:block;color:var(--text);font-size:11px;overflow-wrap:anywhere}.profile-card small{display:block;color:var(--muted);font-size:9px;overflow-wrap:anywhere}
.workspace-main{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--bg);color:var(--text)}.topbar{height:81px;flex-shrink:0;background:var(--panel);border-bottom:1px solid var(--line);padding:20px 32px;display:flex;align-items:center;gap:20px;color:var(--text)}.topbar .eyebrow{color:var(--muted);white-space:nowrap;font-size:8px}.search{display:flex;align-items:center;gap:10px;background:var(--bg);border-radius:9px;height:41px;padding:0 13px;max-width:430px;flex:1;color:var(--muted);min-width:100px}.search input{background:transparent;color:var(--text);outline:none;border:0;padding:0;font-size:12px}.search #search-icon{display:flex;align-items:center}.search .icon-button{width:27px;height:30px}.search kbd{font:10px monospace;border:1px solid var(--line);border-radius:4px;padding:1px 6px}.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.avatar-button,.avatar{background:#fae4d7;color:#8c4525;border-radius:50%;width:35px;height:35px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:11px;font-weight:650;position:relative}.avatar{border:2px solid transparent;isolation:isolate}.avatar img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;border-radius:50%}.avatar-button{padding:0;background:transparent}.avatar.ring-solid,.avatar.ring-double,.avatar.ring-dashed{border-color:var(--ring);box-shadow:0 0 0 2px var(--panel),0 0 0 3px color-mix(in srgb,var(--ring) 35%,transparent)}.avatar.ring-double{border-width:4px;border-style:double}.avatar.ring-dashed{border-style:dashed}.avatar.ring-gradient:before{content:"";position:absolute;inset:-4px;border-radius:50%;background:conic-gradient(var(--ring),#b7a5ff,#81d9c7,var(--ring));z-index:-1}.avatar.tiny{width:22px;height:22px;font-size:8px;border-width:1px}
.content{overflow:auto;flex:1;padding:31px 34px 40px;background:var(--workspace-bg,var(--bg));color:var(--text)}.banner{border-radius:0;padding:9px 32px}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.heading h1{margin-bottom:7px;color:var(--text)}.heading p{margin:0;font-size:12px;color:var(--muted)}.heading .eyebrow{margin-bottom:10px;font-size:8px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.stat{padding:22px;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:13px}.stat .kicker{font-size:10px;color:var(--muted)}.stat strong{display:block;font-size:29px;letter-spacing:-1px;line-height:1.25;margin:9px 0}.stat small{font-size:10px;color:var(--muted)}.stat .status-dot{margin-right:5px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.card-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.card-header h2{font-size:16px;margin:0}.card-header p{font-size:10px;color:var(--muted);margin:5px 0 0}.chart{width:100%;height:auto;display:block;max-height:245px}.chart text{fill:var(--muted);font:10px sans-serif}.chart .gridline{stroke:var(--line);stroke-dasharray:3 4}.legend{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);margin-top:12px}.legend i{width:7px;height:7px;background:var(--accent);border-radius:3px}.progress{height:7px;background:var(--bg);border-radius:7px;overflow:hidden;margin:10px 0 5px}.progress>i{display:block;height:100%;background:var(--accent);border-radius:7px}.table-scroll{overflow:auto}.table-scroll>table{border-collapse:collapse;width:100%;white-space:nowrap;font-size:11px;color:var(--text)}.table-scroll>table th{padding:13px 10px;color:var(--muted);font-size:10px;font-weight:500;text-align:left;border-bottom:1px solid var(--line)}.table-scroll>table td{padding:17px 10px;border-bottom:1px solid var(--line)}.table-scroll>table td small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.user-name{font-weight:550}.table-actions{display:flex;gap:5px}.table-actions button{padding:6px 9px;font-size:10px}.server-row{display:flex;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}.server-row:last-child{border:0}.server-row h3{margin:0 0 4px}.server-row p{margin:0;color:var(--muted);font-size:11px;overflow-wrap:anywhere}.code{font:12px/1.7 ui-monospace,monospace}
.empty{padding:65px 25px;text-align:center;color:var(--muted)}.empty h2{color:var(--text)}.empty .symbol{font-size:34px;color:var(--accent);margin-bottom:18px}.loading{padding:50px;text-align:center;color:var(--muted)}.mail-list{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:14px;overflow:hidden}.mail-toolbar{padding:13px 18px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);min-height:55px;flex-wrap:wrap}.mail-toolbar small{margin-left:auto;color:var(--muted)}.mail-toolbar .secondary{font-size:10px;padding:7px 10px;min-height:30px}.mail-row{display:flex;align-items:center;gap:15px;padding:17px 20px;min-height:77px;border-bottom:1px solid var(--line);cursor:pointer;background:var(--panel-alt);color:var(--text)}.mail-row:last-child{border:0}.mail-row:hover{background:var(--bg)}.mail-row.unread{background:var(--panel)}.mail-row.selected{background:var(--soft)}.star{color:#9aa3b3;background:transparent;font-size:21px;padding:0}.star.on{color:#c18a1b}.sender-cell{width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;flex-shrink:0}.mail-preview{flex:1;min-width:0}.mail-subject{font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.mail-row.unread .mail-subject,.mail-row.unread .sender-cell{font-weight:650}.snippet{color:var(--muted);font-size:11px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-top:5px}.mail-date{font-size:10px;white-space:nowrap;color:var(--muted);text-align:right;min-width:58px}.count-badge{font-size:10px;font-weight:400;margin-left:5px;color:var(--muted)}.label-chip{display:inline-flex;align-items:center;gap:5px;font-size:9px;padding:3px 7px;border:1px solid var(--line);border-radius:5px;white-space:nowrap;background:color-mix(in srgb,var(--label,#ea580c) 14%,var(--panel));color:var(--text);margin:4px 5px 0 0}.label-dot{display:inline-block;width:7px;height:7px;border-radius:2px;flex-shrink:0}.mail-origin{font-size:9px;color:var(--accent-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px;margin-top:5px}.search-info{margin-bottom:20px}.thread-title{margin:23px 0;font-size:24px}
.message-card{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:13px;margin:0 0 14px;overflow:hidden}.message-header,.message-summary{display:flex;gap:12px;align-items:flex-start;padding:22px 25px}.message-summary{cursor:pointer;list-style:none}.message-summary::-webkit-details-marker{display:none}.message-summary:after{content:"⌄";margin-left:5px;color:var(--muted)}.message-card[open]>.message-summary{border-bottom:1px solid var(--line)}.message-header .sender,.message-sender{font-size:12px;font-weight:650}.message-sender{flex:1;min-width:0}.address{font-size:10px;color:var(--muted);font-weight:400;margin-left:8px}.meta{font-size:10px;color:var(--muted);margin-top:5px;overflow-wrap:anywhere}.message-date{margin-left:auto;color:var(--muted);font-size:10px;white-space:nowrap}.message-body{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.85;font-size:13px;padding:22px 25px 9px 72px}.quote-details,.quote{margin:8px 25px 15px 72px;font-size:10px;color:var(--muted)}.quote-details summary,.quote summary{cursor:pointer;padding:5px 0;width:fit-content;list-style:none}.quote-details summary:before,.quote summary:before{content:"•••";letter-spacing:2px;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:1px 9px;margin-right:9px}.quote-details pre,.quote pre{white-space:pre-wrap;overflow-wrap:anywhere;border-left:2px solid var(--line);padding-left:13px;font:12px/1.8 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.message-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:16px 25px 16px 72px}.message-actions .secondary{padding:7px 12px;font-size:10px;min-height:30px}.reaction{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:20px;padding:5px 9px;display:inline-flex;align-items:center;gap:7px;min-height:33px}.reaction.on{background:var(--soft);border-color:var(--accent)}.reaction .emoji{font-size:19px;line-height:1}.reaction strong{font-size:12px}.reaction .faces{display:flex}.reaction .avatar+.avatar{margin-left:-6px}.reaction-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:16px 25px 0 72px}.reaction-add{background:transparent;border:1px dashed var(--line);color:var(--muted);border-radius:20px;padding:7px 11px;font-size:11px}.copy-details{margin:12px 25px 12px 72px;color:var(--muted);font-size:10px}.copy-details summary{cursor:pointer}.html-wrap{padding:0 25px 0 72px}.html-message{width:100%;height:340px;border:1px solid var(--line);border-radius:8px;margin-top:15px;background:#fff;display:block}.html-message.expanded{height:720px}.message-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding:11px 25px 11px 72px;border-top:1px solid var(--line);background:var(--panel-alt);color:var(--muted);font-size:10px}.attachment{display:inline-flex;gap:9px;align-items:center;padding:9px 12px;background:var(--panel-alt);color:var(--text);border:1px solid var(--line);border-radius:7px;font-size:11px;margin:5px;max-width:100%;overflow-wrap:anywhere}.emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}.emoji-choice{padding:11px 7px;background:var(--panel-alt);color:var(--text);border:1px solid var(--line);border-radius:9px;font-size:24px;line-height:1.2}.emoji-choice:hover,.emoji-choice.on{background:var(--soft);border-color:var(--accent)}.people-row{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.compose-panel{position:fixed;right:30px;bottom:0;width:610px;height:min(750px,92dvh);z-index:50;display:flex;flex-direction:column;box-shadow:0 -10px 65px #0003;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:13px 13px 0 0;overflow:hidden}.compose-header{display:flex;align-items:center;gap:12px;padding:11px 18px;background:#20252d;color:white;font-size:12px}.compose-header [data-compose="draft-status"]{margin-left:auto;color:#bec6d3;font-size:10px}.compose-header .icon-button{color:#e6ebf4}.compose-panel form{display:flex;flex-direction:column;flex:1;min-height:0}.recipient{display:flex;align-items:center;gap:12px;padding:0 18px;border-bottom:1px solid var(--line);min-height:43px}.recipient label{font-size:11px;min-width:48px}.recipient input,.recipient select{background:var(--panel);color:var(--text);border:0;outline:none;border-radius:0;padding:10px 0;font-size:12px;flex:1}.compose-panel [data-compose="compose-subject"]{padding:13px 18px;border:0;border-bottom:1px solid var(--line);border-radius:0;font-size:12px}.compose-panel textarea{flex:1;min-height:100px;border:0;resize:none;border-radius:0;padding:20px;outline:none;font-size:13px}.rich-editor{flex:1;min-height:100px;overflow:auto;border:0;outline:none;padding:20px;background:var(--panel);color:var(--text);line-height:1.85;font-size:13px;overflow-wrap:anywhere}.rich-editor:empty:before{content:"Start a good conversation…";color:var(--placeholder);pointer-events:none}.editor-toolbar{display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:7px 12px;border-bottom:1px solid var(--line);background:var(--panel);color:var(--text)}.editor-toolbar button{padding:5px 7px;background:transparent;border-radius:5px;color:var(--muted);font-size:10px}.editor-toolbar button:hover{background:var(--soft);color:var(--accent-text)}.editor-toolbar label{display:flex;flex-direction:row;align-items:center;gap:4px;font-size:10px}.editor-toolbar input[type=color]{width:25px;height:25px;padding:1px}.signature-line{border-top:1px solid var(--line);padding:8px 18px;display:flex;align-items:center;justify-content:space-between}.signature-line label{font-size:10px}.compose-footer{display:flex;align-items:center;gap:10px;padding:16px 18px;border-top:1px solid var(--line)}.attachments{max-height:90px;overflow:auto;padding:0 14px;display:flex;flex-wrap:wrap}.attachments .attachment{padding:5px 8px;font-size:10px}
.modal-backdrop{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#0c12216b;backdrop-filter:blur(3px);padding:24px;z-index:80}.modal{background:var(--panel);color:var(--text);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:16px;width:min(570px,100%);max-height:92dvh;overflow:auto;padding:27px}.modal.wide{width:min(850px,100%)}.modal-title{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:22px}.modal-title h2{margin:0}.toast-root{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;max-width:min(580px,94vw);z-index:100}.toast{background:#252c38;color:white;border-radius:10px;padding:14px 20px;font-size:12px;box-shadow:var(--shadow)}.toast.error{background:#a73631}.settings-layout{display:grid;grid-template-columns:160px minmax(0,760px);gap:24px}.settings-nav{display:flex;flex-direction:column;gap:6px}.settings-nav button{padding:11px 13px;background:transparent;text-align:left;border-radius:8px;color:var(--muted);font-size:12px}.settings-nav button.active{background:var(--panel);color:var(--accent-text)}.settings-panel{min-width:0}.settings-panel input[type=color]{height:40px;padding:4px}.appearance-pending{color:var(--accent-text)!important}.contacts-grid,.contact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}.contacts-grid>.empty,.contact-grid>.empty{grid-column:1/-1}.outbox-banner{display:flex;gap:12px;flex-wrap:wrap;padding:11px 32px;border-bottom:1px solid var(--line);background:var(--panel);color:var(--text);font-size:12px}.outbox-item{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.outbox-item button{padding:6px 10px;font-size:11px}.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:20px}.tabs button{padding:9px 13px;background:transparent;color:var(--muted);border-radius:8px}.tabs button.active{background:var(--panel);color:var(--accent)}.mobile{display:none}body.compact .mail-row{padding-top:10px;padding-bottom:10px;min-height:55px}
@media(min-width:1650px){.content{padding:38px 50px}.hero{padding-left:20px}.cinema{padding-left:70px}.sender-cell{width:190px}}
@media(max-width:1150px){:root{--sidebar:216px}.content{padding:27px 22px}.topbar{padding:20px 22px}.topbar .eyebrow{display:none}.cinema{padding:48px 38px}.hero h1{font-size:55px}.login{grid-template-columns:54% 46%}.login-main{padding:50px 30px}.stats{gap:12px}.stat{padding:17px}.sender-cell{width:120px}.mail-row>.label-chip{display:none}}
@media(max-width:900px){.sidebar{position:fixed;inset:0 auto 0 0;z-index:45;box-shadow:var(--shadow);transform:translateX(-100%);transition:transform .2s}.sidebar.open{transform:translateX(0)}.mobile{display:inline-flex}.topbar{height:70px;padding:14px;gap:9px}.grid{grid-template-columns:1fr}.hero h1{font-size:45px;letter-spacing:-2px}.hero p{font-size:12px}.slate{gap:18px}.cinema-bottom{font-size:7px}.viewfinder{inset:130px 18px 100px}.message-date{font-size:9px}}
@media(max-width:650px){.login{display:block}.cinema{min-height:280px;padding:35px 27px}.cinema .brand{font-size:16px}.cinema .brand img{width:30px;height:30px}.hero{padding:30px 0 15px}.hero h1{font-size:37px;margin:15px 0}.hero h1 br:nth-child(2){display:none}.hero p,.slate,.cinema-bottom,.viewfinder{display:none}.hero .eyebrow{font-size:7px;letter-spacing:1px}.lens{width:420px;height:420px;right:-240px;top:10px}.lens:before{inset:50px}.lens:after{inset:130px}.login-main{padding:37px 25px}.login-card h2{font-size:25px}.login-card{max-width:440px}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat{padding:17px}.stat strong{font-size:25px}.content{padding:23px 13px}.heading{flex-wrap:wrap;gap:12px}.heading h1{font-size:25px}.topbar-actions{gap:1px}.topbar-actions #contacts-button{display:none}.search kbd{display:none}.search input{width:60px;font-size:11px}.search{padding:0 8px;gap:6px}.fields{grid-template-columns:1fr}.card{padding:21px}.settings-layout{display:flex;flex-direction:column}.settings-nav{flex-direction:row;flex-wrap:wrap}.settings-nav button{font-size:10px;padding:8px}.mail-row{gap:10px;flex-wrap:wrap;padding:14px;position:relative}.mail-row>.avatar{display:none}.sender-cell{width:calc(100% - 114px);font-size:11px}.mail-preview{flex:auto;width:calc(100% - 53px);margin-left:43px}.mail-date{position:absolute;right:14px;top:16px}.mail-subject{font-size:11px}.snippet{font-size:10px}.mail-toolbar{gap:5px;padding:10px}.mail-toolbar .secondary{padding:7px;font-size:10px}.mail-toolbar small{font-size:9px}.message-header,.message-summary{padding:18px 15px;flex-wrap:wrap}.message-summary>.mail-date{position:static;width:100%;text-align:left;margin-left:47px}.message-sender{min-width:calc(100% - 60px)}.message-date{width:100%;margin-left:47px}.message-body{padding:20px 15px 9px;font-size:12px}.message-actions,.quote-details,.quote,.reaction-bar,.copy-details{margin-left:15px;margin-right:15px}.html-wrap{padding:0 15px}.message-footer{padding:11px 15px}.address{display:block;margin:4px 0 0}.compose-panel{width:100%;right:0;height:94dvh}.compose-footer{gap:7px}.compose-footer .secondary{font-size:10px;padding:10px}.modal{padding:22px 18px}.modal-backdrop{padding:12px}.emoji-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.outbox-banner{padding:10px 13px}.admin-button,#admin-button{padding:8px;font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

@media(max-width:380px){.topbar-actions #settings-button{display:none}.topbar{gap:7px}.search{min-width:80px}}


/* Workspace upgrade: independent wallpapers, restrained glass surfaces,
   accessible motion, provider badges and richer native SVG iconography. */
body{
 --glass-blur:0px;
 --glass-solid:100%;
 --canvas-solid:100%;
 --sidebar-solid:100%;
 --mail-wallpaper:none;
 --sidebar-wallpaper:none;
}
.workspace-main{
 background-image:var(--mail-wallpaper);
 background-position:center;
 background-repeat:no-repeat;
 background-size:cover;
 background-attachment:local;
}
.content{
 background:color-mix(
  in srgb,var(--workspace-bg,var(--bg)) var(--canvas-solid),transparent
 );
}
.sidebar{
 background-color:var(--panel);
 background-image:
  linear-gradient(
   color-mix(in srgb,var(--panel) var(--sidebar-solid),transparent),
   color-mix(in srgb,var(--panel) var(--sidebar-solid),transparent)
  ),
  var(--sidebar-wallpaper);
 background-position:center;
 background-repeat:no-repeat;
 background-size:cover;
}
body[data-glass=true] .topbar,
body[data-glass=true] .card,
body[data-glass=true] .mail-list,
body[data-glass=true] .message-card,
body[data-glass=true] .modal,
body[data-glass=true] .compose-panel,
body[data-glass=true] .outbox-banner{
 background:color-mix(
  in srgb,var(--panel) var(--glass-solid),transparent
 );
 -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(135%);
 backdrop-filter:blur(var(--glass-blur)) saturate(135%);
 border-color:color-mix(in srgb,var(--line) 80%,#fff 20%);
 box-shadow:0 12px 36px #1018280b,inset 0 1px 0 #ffffff12;
}
body[data-glass=true] .mail-row{
 background:color-mix(
  in srgb,var(--panel-alt) var(--glass-solid),transparent
 );
}
body[data-glass=true] .mail-row.unread{
 background:color-mix(
  in srgb,var(--panel) var(--glass-solid),transparent
 );
}
body[data-glass=true] .mail-row.selected{
 background:var(--soft);
}
.topbar{
 box-shadow:0 3px 20px #11182704;
}
.primary{
 background-image:linear-gradient(130deg,#ffffff12,transparent);
 transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease;
}
.primary:hover{
 transform:translateY(-1px);
 box-shadow:0 7px 18px #ea580c25;
}
.primary:active{transform:translateY(0)}
.secondary,.icon-button,.nav-button,.mail-row,.label-chip{
 transition:
  background-color .16s ease,
  border-color .16s ease,
  box-shadow .16s ease,
  transform .16s ease;
}
.secondary:hover{
 border-color:color-mix(in srgb,var(--accent) 30%,var(--line));
}
.nav-button.active{
 box-shadow:inset 3px 0 0 var(--accent);
}
.nav-button .icon{width:17px;height:17px}
.nav-button>span{
 min-width:0;
 overflow-wrap:anywhere;
}
.folder-container{
 display:flex;
 align-items:center;
 gap:10px;
 padding:10px 13px;
 color:var(--muted);
 font-size:10px;
 opacity:.8;
}
.mail-origins{
 display:flex;
 flex-wrap:wrap;
 align-items:center;
 gap:5px;
 margin-top:6px;
}
.origin-badge{
 display:inline-flex;
 align-items:center;
 gap:5px;
 padding:3px 8px;
 border-radius:999px;
 max-width:100%;
 font-size:9px;
 font-weight:600;
 overflow-wrap:anywhere;
 background:color-mix(
  in srgb,hsl(var(--origin-hue) 65% 52%) 13%,var(--panel)
 );
 border:1px solid color-mix(
  in srgb,hsl(var(--origin-hue) 65% 52%) 38%,var(--line)
 );
 color:var(--text);
}
.origin-badge .icon{width:12px;height:12px}
.label-chip .icon{width:11px;height:11px}
.loading{
 display:flex;
 justify-content:center;
 align-items:center;
 gap:12px;
 min-height:160px;
}
.loading-spinner{
 width:22px;
 height:22px;
 border-radius:50%;
 border:2px solid var(--line);
 border-top-color:var(--accent);
 animation:workspace-spin .85s linear infinite;
 flex-shrink:0;
}
.empty-art{
 width:74px;
 height:74px;
 margin:0 auto 22px;
 display:grid;
 place-items:center;
 border-radius:24px;
 background:
  radial-gradient(circle at 20% 15%,#ffffff55,transparent 65%),
  var(--soft);
 color:var(--accent-text);
 border:1px solid color-mix(in srgb,var(--accent) 17%,var(--line));
 box-shadow:0 12px 35px #ea580c0b;
}
.empty-art .icon{width:34px;height:34px}
.mail-list,.message-card,.card{
 animation:workspace-enter .24s ease both;
}
.modal{
 animation:workspace-enter .18s ease both;
}
.compose-panel{
 animation:compose-enter .22s ease both;
}
.wallpaper-preview{
 min-height:110px;
 border-radius:12px;
 border:1px solid var(--line);
 background-color:var(--bg);
 background-position:center;
 background-size:cover;
}
.wallpaper-control{
 padding:16px;
 border:1px solid var(--line);
 border-radius:14px;
 background:color-mix(in srgb,var(--panel-alt) 88%,transparent);
}
.wallpaper-control input[type=file]{font-size:10px}
.glass-output{
 color:var(--accent-text);
 font-weight:650;
 font-size:13px;
}
input[type=range]{
 accent-color:var(--accent);
 padding:0;
 border:0;
 background:transparent;
}
.onboarding-shell{
 min-height:calc(100dvh - 160px);
 display:grid;
 place-items:center;
 padding:30px 0;
}
.onboarding-card{
 width:min(620px,100%);
 padding:36px;
}
.onboarding-card>.eyebrow{text-align:center;margin-bottom:14px}
.onboarding-card>h1,.onboarding-card>p{text-align:center}
.wizard-progress{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:12px;
 margin:28px 0;
}
.wizard-step{
 display:flex;
 align-items:flex-start;
 gap:8px;
 font-size:10px;
 color:var(--muted);
}
.wizard-step b{
 display:grid;
 place-items:center;
 border:1px solid var(--line);
 border-radius:50%;
 width:25px;
 height:25px;
 flex-shrink:0;
}
.wizard-step.active{color:var(--accent-text)}
.wizard-step.active b{
 background:var(--soft);
 border-color:var(--accent);
}
.onboarding-review{
 border:1px solid var(--line);
 background:var(--panel-alt);
 border-radius:12px;
 padding:22px;
}
.onboarding-review .row{margin-top:10px}
@keyframes workspace-spin{to{transform:rotate(360deg)}}
@keyframes workspace-enter{
 from{opacity:0;transform:translateY(5px)}
 to{opacity:1;transform:translateY(0)}
}
@keyframes compose-enter{
 from{opacity:0;transform:translateY(18px)}
 to{opacity:1;transform:translateY(0)}
}
body.reduce-motion *,
body.reduce-motion *:before,
body.reduce-motion *:after{
 animation:none!important;
 transition:none!important;
 scroll-behavior:auto!important;
}
@media(prefers-reduced-motion:reduce){
 *,*:before,*:after{
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important;
 }
}
@media(max-width:650px){
 .onboarding-card{padding:23px}
 .wizard-progress{gap:7px}
 .wizard-step{flex-direction:column;font-size:9px}
 .origin-badge{font-size:8px}
}

/* Live inbox: stable rows, with entrance motion only for newly inserted rows. */
.mail-row{position:relative;border-left:4px solid transparent}
.mail-row.unread,body[data-glass=true] .mail-row.unread{
 background:color-mix(in srgb,var(--panel) 87%,#3978f6 13%);
 border-left-color:#2563eb;
}
.mail-row.unread .sender-cell,.mail-row.unread .mail-subject{font-weight:750;color:var(--text)}
.mail-row.unread .mail-date{font-weight:700;color:var(--text)}
.unread-badge{display:inline-flex;vertical-align:middle;padding:2px 7px;margin-right:8px;background:#245edb;color:#fff;font-size:9px;line-height:1.5;font-weight:750;border-radius:5px;letter-spacing:.03em}
.mail-row.selected,body[data-glass=true] .mail-row.selected{background:var(--soft)}
.mail-rows{overflow:hidden}.row-avatar{display:inline-flex;flex-shrink:0}
@keyframes incoming-mail{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}
.mail-row-enter{animation:incoming-mail .28s ease-out both}
.label-chip{background:var(--label)!important;color:var(--label-ink,#111827)!important;border:1px solid color-mix(in srgb,var(--label) 70%,#000 30%)!important;font-weight:700;box-shadow:0 1px 2px #00000015;opacity:1}
.label-chip .icon{color:inherit;opacity:1}.label-dot{width:12px!important;height:12px!important;box-shadow:0 0 0 2px color-mix(in srgb,currentColor 14%,transparent)}
/* A single reading-area scrollbar. HTML emails grow to their measured height. */
.conversation-view{width:100%;max-width:none;min-width:0}
.message-card{width:100%;min-width:0;max-width:none}
.html-wrap{min-width:0;overflow:hidden}
.html-message,.html-message.expanded{display:block;width:100%;height:100px;min-height:0;max-height:none;border:0;background:#fff;overflow:hidden}
.message-body{max-width:none;overflow-wrap:anywhere}
.inline-reply-host:empty{display:none}
.compose-panel.inline-compose{position:relative;inset:auto;width:100%;height:auto;max-height:none;min-height:380px;margin:24px 0;border-radius:14px;z-index:1;box-shadow:0 4px 20px #0000000a}
.inline-compose form{flex:none;min-height:0;overflow:visible}
.inline-compose .rich-editor{flex:none;min-height:220px;max-height:none;overflow:visible}
.inline-compose textarea{flex:none;min-height:260px;resize:vertical;max-height:none}
.inline-compose .compose-footer{flex-wrap:wrap}
.compose-panel .recipient input{min-width:0}
.workspace-links{position:relative}
.workspace-links-menu{position:absolute;right:0;top:calc(100% + 10px);z-index:65;min-width:250px;max-width:min(360px,90vw);max-height:70vh;overflow:auto;padding:8px;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
.workspace-links-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:10px 12px}
.workspace-link{display:flex;align-items:center;gap:12px;padding:12px;border-radius:8px;text-decoration:none;color:var(--text);font-size:13px}
.workspace-link:hover,.workspace-link:focus-visible{background:var(--soft);outline:2px solid var(--accent);outline-offset:-2px}
.workspace-link .icon{width:21px;height:21px;flex-shrink:0}
.workspace-link-admin{display:flex;align-items:center;gap:14px;padding:15px 0;border-bottom:1px solid var(--line)}
.workspace-link-admin>div{flex:1;min-width:0}.workspace-link-admin small{display:block;overflow-wrap:anywhere}
@media(max-width:650px){.row-avatar{display:none}.compose-panel.inline-compose{width:100%;height:auto;max-height:none}.workspace-link-admin{flex-wrap:wrap}.compose-footer{flex-wrap:wrap}.html-wrap{padding:0 10px}}
body[data-reduced-motion=true] .mail-row-enter{animation:none}
@media(prefers-reduced-motion:reduce){.mail-row-enter{animation:none}}

/* A wallpaper replaces the canvas paint. Surface opacity and optical blur are
   independent; do not stack opaque row fills on an already frosted mail list. */
body[data-wallpaper=true] .content{background:transparent!important}
body[data-wallpaper=true] .workspace-main{background-color:transparent}
.topbar,body[data-glass=true] .topbar{
 background:var(--workspace-bg,var(--panel))!important;
 -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
}
body[data-glass=true] .mail-row{background:transparent}
body[data-glass=true] .mail-row.unread{background:color-mix(in srgb,#3978f6 15%,transparent);border-left-color:#3b82f6}
body[data-glass=true] .mail-row:hover{background:color-mix(in srgb,var(--accent) 9%,transparent)}
body[data-glass=true] .mail-row.selected{background:color-mix(in srgb,var(--accent) 20%,transparent)}
body[data-glass=true] .card,body[data-glass=true] .mail-list,body[data-glass=true] .message-card,
body[data-glass=true] .modal,body[data-glass=true] .compose-panel,body[data-glass=true] .outbox-banner{
 background:color-mix(in srgb,var(--panel) var(--glass-solid),transparent);
 -webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));
}
.nav-button .label-dot{margin-inline-end:9px;vertical-align:middle}
.sidebar-label-name{vertical-align:middle}
.thread-title{overflow-wrap:anywhere;line-height:1.35}
.mail-row{gap:12px}
.mail-row .row-tail{display:flex;align-items:center;gap:12px;margin-left:auto;flex-shrink:0;position:static}
.row-tail .mail-date{display:flex;flex-direction:column;gap:4px;min-width:105px;width:auto;position:static!important;inset:auto;margin:0;text-align:right;font-variant-numeric:tabular-nums;line-height:1.3}
.date-clock{font-size:12px;letter-spacing:.025em}
.row-actions{display:flex;gap:3px;opacity:0;pointer-events:none;transition:opacity .15s ease;flex-shrink:0}
.row-actions .icon-button{display:grid;place-items:center;width:28px;height:30px;min-height:0;padding:5px;border-radius:7px;color:var(--muted)}
.mail-row:hover .row-actions,.mail-row:focus-within .row-actions{opacity:1;pointer-events:auto}
.row-actions .icon-button:hover,.row-actions .icon-button:focus-visible{background:var(--soft);color:var(--accent-text)}
.row-actions .icon{width:18px;height:18px}
.contact-value-row{display:grid;grid-template-columns:minmax(90px,1fr) minmax(160px,3fr) auto;gap:10px;align-items:end}
.contact-value-row .field{margin:0}
.contact-value-row>.text-button{align-self:center}
@media(max-width:1100px){.mail-row .sender-cell{width:110px}.mail-row{gap:9px;padding-inline:12px}.row-tail{gap:7px!important}.row-tail .mail-date{min-width:96px}.row-actions .icon-button{width:26px}}
@media(max-width:850px){.mail-row{flex-wrap:wrap}.mail-row .row-tail{flex-basis:100%;justify-content:flex-end}.mail-row .mail-preview{min-width:160px}.row-actions{opacity:1;pointer-events:auto}.row-tail .mail-date{min-width:115px}.contact-value-row{grid-template-columns:90px minmax(100px,1fr) auto}}
@media(hover:none){.row-actions{opacity:1;pointer-events:auto}}
@media(prefers-reduced-transparency:reduce){body[data-glass=true] .card,body[data-glass=true] .mail-list,body[data-glass=true] .message-card,body[data-glass=true] .modal,body[data-glass=true] .compose-panel{background:var(--panel);backdrop-filter:none}}

/* Independent sidebar atmosphere. Wallpaper lives behind both panes; each pane
   owns its opacity/blur. A separate sidebar image is blurred behind its text. */
.workspace{background-image:var(--mail-wallpaper);background-size:cover;background-position:center}
.workspace-main{background-image:none}
.sidebar{position:relative;isolation:isolate;background:transparent;backdrop-filter:blur(var(--sidebar-blur,0px));-webkit-backdrop-filter:blur(var(--sidebar-blur,0px))}
.sidebar::before,.sidebar::after{content:"";position:absolute;inset:0;pointer-events:none}
.sidebar::before{z-index:-2;background-image:var(--sidebar-wallpaper);background-size:cover;background-position:center;filter:blur(var(--sidebar-blur,0px))}
.sidebar::after{z-index:-1;background:color-mix(in srgb,var(--panel) var(--sidebar-solid,100%),transparent)}
.app-footer{flex-shrink:0;text-align:center;padding:9px 14px;font-size:10px;letter-spacing:.02em;color:var(--muted);border-top:1px solid var(--line);background:color-mix(in srgb,var(--panel) var(--glass-solid),transparent)}
.unread-count,.nav-button .count.unread-count{color:var(--accent-text);font-weight:800;font-size:11px;white-space:nowrap}
.account-badges{display:flex;flex-direction:column;gap:5px;align-items:flex-start;max-width:155px}
.account-domain-badge{font-weight:700;max-width:155px;white-space:nowrap;font-size:9px;padding:5px 8px;overflow:hidden;text-overflow:ellipsis}
.account-domain-badge .icon{width:13px;height:13px}
.message-time-account{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.message-time-account .mail-date{position:static;margin:0;width:auto}
.compose-panel.compose-maximized{position:fixed!important;inset:4vh 4vw!important;transform:none!important;width:92vw!important;height:92dvh!important;max-height:none!important;max-width:none!important;margin:0!important;z-index:70;display:flex;flex-direction:column;border-radius:14px;box-shadow:0 0 0 100vmax #0007}
.compose-maximized [data-compose="compose-form"]{display:flex;flex-direction:column;flex:1;min-height:0;overflow:auto}
.compose-maximized .rich-editor,.compose-maximized [data-compose="compose-source"]{flex:1;min-height:120px;max-height:none;overflow:auto}
.compose-maximized .compose-footer{flex-shrink:0}
.folder-management-row{display:flex;gap:12px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.folder-management-row small{display:block;margin-top:4px;overflow-wrap:anywhere}
.folder-list{gap:0;margin-top:20px}
.filter-card{border-bottom:1px solid var(--line);padding:20px 0}
.filter-card .check{font-weight:700}
.filter-condition{display:grid;grid-template-columns:1fr 1fr 2fr auto;gap:10px;align-items:end}
.sieve-preview{white-space:pre-wrap;overflow-wrap:anywhere;max-height:350px;overflow:auto;background:var(--panel-alt);border:1px solid var(--line);padding:16px;border-radius:10px}
.log-table td{vertical-align:top;white-space:normal;overflow-wrap:anywhere;max-width:480px}
.log-table .code{font-size:10px}
.log-level{font-weight:800}.log-warn{color:var(--accent-text)}.log-error{color:var(--danger)}
#chat-button{position:relative}
#chat-button[data-unread]:not([data-unread=""])::after{content:attr(data-unread);position:absolute;top:-3px;right:-6px;min-width:16px;border-radius:20px;background:var(--primary);color:white;font-size:9px;padding:2px}
.chat-panel{position:fixed;right:22px;bottom:40px;width:min(400px,calc(100vw - 28px));height:min(660px,calc(100dvh - 110px));z-index:50;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:16px;box-shadow:0 20px 70px #0005;display:flex;flex-direction:column;gap:10px;padding:16px}
.chat-header{display:flex;align-items:center;gap:10px}.chat-domain{font-size:11px;margin:0}
.chat-messages{flex:1;min-height:80px;overflow:auto;display:flex;flex-direction:column;gap:10px;scrollbar-gutter:stable;padding:8px 3px}
.chat-bubble{align-self:flex-start;max-width:88%;background:var(--panel-alt);border:1px solid var(--line);padding:9px 12px;border-radius:12px 12px 12px 2px}
.chat-bubble.own{align-self:flex-end;background:var(--soft);border-radius:12px 12px 2px 12px}
.chat-bubble p{white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 5px;font-size:13px}.chat-bubble time{font-size:9px;color:var(--muted)}
.chat-composer{gap:8px;flex-shrink:0}.chat-composer textarea{resize:none;padding:10px;max-height:120px}
@media(max-width:1200px){.mail-row .row-tail{gap:7px}.row-actions{gap:1px}.account-domain-badge{max-width:130px;font-size:8px}}
@media(max-width:850px){.message-time-account{width:100%;justify-content:flex-start}.filter-condition{grid-template-columns:1fr 1fr}.filter-condition>.field:nth-child(3){grid-column:1/-1}.compose-panel.compose-maximized{inset:0!important;width:100vw!important;height:100dvh!important;border-radius:0}.account-badges{flex-direction:row;flex-wrap:wrap;max-width:160px}.folder-management-row .spacer{min-width:160px}}
@media(prefers-reduced-transparency:reduce){.sidebar{backdrop-filter:none!important}.sidebar::after{background:var(--panel)}.sidebar::before{display:none}}

/* Keep the mobile navigation drawer out of the mail layout flow. */
@media(max-width:900px){.sidebar{position:fixed}}

/* v1.0: restrained counters and a coordinated messenger / compose dock. */
:root{--chat-reserve:0px}
.folder-counts{display:inline-flex;align-items:baseline;gap:5px;margin-inline-start:7px;white-space:nowrap;font-variant-numeric:tabular-nums;flex-shrink:0;font-size:11px}
.folder-counts .folder-total{color:var(--muted);font-weight:500}
.folder-counts .unread-count,.nav-button .count.unread-count,.unread-count{background:none!important;border:0!important;padding:0!important;box-shadow:none!important;border-radius:0!important;color:var(--accent-text);font-weight:800}
.nav-button>.folder-counts{margin-left:auto;overflow:visible}
.folder-counts.unknown{color:var(--muted)}.account-badges:empty{display:none}
.badge-preview{display:flex;flex-wrap:wrap;gap:8px}.badge-preview .pill{white-space:normal;overflow-wrap:anywhere}
.compose-panel:not(.inline-compose){right:calc(var(--chat-reserve) + 20px);bottom:84px;width:min(610px,calc(100vw - var(--chat-reserve) - 40px));height:min(760px,calc(100dvh - 108px));border-radius:16px;z-index:60}
.compose-panel.compose-maximized{position:fixed!important;inset:16px calc(var(--chat-reserve) + 20px) 84px 20px!important;width:auto!important;height:auto!important;min-height:0!important;z-index:60;box-shadow:0 15px 70px #0004;border-radius:16px}
.compose-panel.is-minimized{display:none!important}
.compose-header{gap:5px}.compose-header>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compose-header .icon-button{flex-shrink:0}
body.chat-open .inline-reply-host{margin-right:var(--chat-reserve)}
body.chat-open .inline-compose{min-width:0}.compose-header .icon{width:16px;height:16px}
.window-dock{position:fixed;right:90px;bottom:18px;z-index:80;display:flex;justify-content:flex-end;gap:9px;max-width:calc(100vw - 110px);pointer-events:none}
.dock-task{pointer-events:auto;display:flex;align-items:center;gap:10px;width:230px;max-width:42vw;min-height:48px;padding:11px 14px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:13px;box-shadow:0 5px 25px #0002;font-size:12px;text-align:left}
.dock-task .icon{color:var(--accent-text);flex-shrink:0;width:19px;height:19px}.dock-task span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.dock-task small{font-size:16px}
.dock-task.active{border-bottom:3px solid var(--accent)}.dock-task:hover{background:var(--soft)}
#chat-button.chat-launcher{position:fixed;right:20px;bottom:16px;z-index:81;width:56px;height:56px;border-radius:50%;background:linear-gradient(145deg,#fa8f4e,#d94e20);color:#fff;display:grid;place-items:center;box-shadow:0 8px 25px #c854354d;border:1px solid #ffffff38;transition:transform .15s ease,box-shadow .15s ease}
#chat-button.chat-launcher:hover{transform:translateY(-2px);box-shadow:0 12px 32px #c8543566}.chat-launcher .icon{width:27px;height:27px}
#chat-button.chat-launcher[data-unread]:not([data-unread=""])::after{top:-3px;right:-3px;min-width:20px;min-height:20px;padding:3px 5px;border:2px solid var(--panel);border-radius:20px;background:#c92943;color:#fff;font-size:10px;font-weight:800}
.chat-panel{position:fixed;right:20px;bottom:84px;width:360px;height:min(666px,calc(100dvh - 108px));z-index:65;gap:0;padding:0;border-radius:18px;overflow:hidden;box-shadow:0 16px 55px #0004;background:var(--panel);border:1px solid var(--line)}
.chat-header{min-height:68px;padding:12px 13px;gap:7px;border-bottom:1px solid var(--line);box-shadow:0 3px 16px #00000006;flex-shrink:0;background:var(--panel)}
.chat-header .icon-button{width:31px;min-height:31px;height:31px;padding:6px;color:var(--accent-text);flex-shrink:0}.chat-header .icon{width:18px;height:18px}
.chat-header-person{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.chat-header-person strong{display:block;font-size:13px;line-height:1.4;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:180px}.chat-header-person small{display:block;font-size:10px;color:var(--muted)}
.chat-face{position:relative;display:inline-flex;flex-shrink:0;align-self:center;vertical-align:middle}
.chat-face .avatar{width:38px;height:38px;font-size:15px;flex-shrink:0}.chat-face .avatar img{object-fit:cover}
.presence-dot{position:absolute;right:-1px;bottom:0;width:11px;height:11px;border:2px solid var(--panel);border-radius:50%;background:#98a1b0;box-shadow:0 0 0 1px #00000006}
.chat-face.online .presence-dot,.presence-dot.online{background:#1ba668}
.chat-people-pane{display:flex;flex:1;min-height:0;flex-direction:column}.chat-search{display:flex;align-items:center;gap:10px;margin:16px 14px 10px;padding:0 12px;border-radius:24px;background:var(--panel-alt);border:1px solid var(--line)}
.chat-search .icon{width:17px;height:17px;color:var(--muted)}.chat-search input{flex:1;min-width:0;border:0;background:none;padding:10px 0;font-size:12px;outline:none}
.chat-domain{padding:2px 20px 12px;font-size:10px;letter-spacing:.035em}.chat-roster{padding:2px 8px 14px;overflow:auto;flex:1;min-height:0}
.chat-peer{display:flex;align-items:center;gap:12px;width:100%;background:none;color:var(--text);text-align:left;border:0;border-radius:12px;padding:12px;min-height:76px;position:relative}
.chat-peer:hover,.chat-peer:focus-visible{background:var(--soft)}.chat-peer .chat-face .avatar{width:46px;height:46px;font-size:17px}.chat-peer-info{flex:1;min-width:0}.chat-peer strong{display:block;font-size:13px;margin-bottom:5px}.chat-peer small{display:block;font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:205px}
.chat-peer .chat-unread{background:var(--accent);color:#fff;border-radius:20px;min-width:21px;height:21px;display:grid;place-items:center;font-size:10px;font-weight:800;padding:0 5px}
.chat-conversation{display:flex;flex:1;flex-direction:column;min-height:0}.chat-messages{min-height:80px;flex:1;padding:16px 12px;gap:12px;overflow:auto;overscroll-behavior:contain;background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 3%,transparent),transparent 60%)}
.chat-message-row{display:flex;gap:7px;align-items:flex-end;max-width:100%;flex-shrink:0}.chat-message-row.own{justify-content:flex-end}.chat-message-row .chat-face{align-self:flex-end;margin-bottom:4px}.chat-message-row .avatar{width:25px;height:25px;font-size:10px}.chat-message-row .presence-dot{width:8px;height:8px;border-width:1.5px}
.chat-bubble{max-width:calc(100% - 35px);border-radius:17px 17px 17px 5px;padding:11px 13px;background:var(--panel-alt);border:1px solid var(--line);min-width:48px;align-self:auto}
.chat-bubble.own{background:linear-gradient(140deg,#f37d3d,#ce532c);color:#fff;border-color:transparent;border-radius:17px 17px 5px 17px;align-self:auto}
.chat-bubble p{font-size:12px;line-height:1.6;white-space:pre-wrap;margin:0 0 5px}.chat-bubble time{display:block;text-align:right;font-size:9px;margin-top:5px;color:var(--muted)}.chat-bubble.own time{color:#ffffffc9}
.chat-attachment{display:block;max-width:100%;margin-top:7px}.chat-attachment img{display:block;width:100%;max-height:245px;object-fit:contain;border-radius:10px;background:#0000000b}.chat-attachment video{display:block;max-width:100%;max-height:230px;border-radius:10px}.chat-attachment audio{max-width:100%;width:244px;height:36px}.chat-attachment>a{color:inherit;overflow-wrap:anywhere}.chat-attachment small{display:block;font-size:9px;opacity:.8}
.chat-file-link{display:flex;align-items:center;gap:9px;text-decoration:none;padding:7px;background:#00000009;border-radius:9px}.chat-file-link .icon{width:22px;height:22px;flex-shrink:0}.chat-file-link>span{min-width:0;overflow-wrap:anywhere;font-size:11px}.chat-file-link small{margin-top:3px}
.chat-composer{display:flex;flex-direction:column;gap:6px;padding:10px 12px 12px;flex-shrink:0;border-top:1px solid var(--line);background:var(--panel)}
.chat-compose-line{display:flex;gap:8px;align-items:flex-end}.chat-composer textarea{min-height:43px;max-height:105px;resize:none;flex:1;font-size:12px;padding:11px 13px;border-radius:17px;background:var(--panel-alt);line-height:1.5;width:100%;min-width:0}
.chat-composer .icon-button{padding:7px;width:31px;height:31px;min-height:31px;border-radius:50%;color:var(--accent-text)}.chat-composer .icon{width:18px;height:18px}.chat-tools{display:flex;gap:5px;align-items:center}.chat-tools .primary{margin-left:auto;border-radius:20px;min-height:32px;padding:7px 14px;font-size:11px}.chat-status{font-size:10px;color:var(--muted);min-height:12px;line-height:1.4;overflow-wrap:anywhere;margin:0}
.chat-pending{display:flex;flex-direction:column;gap:5px;max-height:130px;overflow:auto}.chat-pending-file{display:flex;align-items:center;gap:7px;padding:5px 8px;border-radius:9px;background:var(--soft);font-size:10px}.chat-pending-file>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.chat-pending-file .icon{width:15px;height:15px;flex-shrink:0}.chat-pending-file>small{white-space:nowrap;font-size:9px}
.chat-empty{padding:32px 12px;text-align:center;color:var(--muted);font-size:12px}.chat-load-more{align-self:center;border:0;background:transparent;color:var(--accent-text);font-size:10px;margin:8px}

/* Control room: measured activity, not illustrative or reconstructed history. */
.dashboard-hero{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;padding:10px 0 4px}.dashboard-hero h2{font-size:25px;letter-spacing:-.6px;margin:8px 0}.dashboard-hero p{margin:4px 0;font-size:13px}.dashboard-hero .field{margin:0}.dashboard-hero .button-group{align-items:flex-end}.dashboard-hero .eyebrow{color:var(--accent-text)}
.dashboard-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.dashboard-metric{position:relative;display:flex;flex-direction:column;gap:9px;min-height:160px;padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--panel);overflow:hidden}
.dashboard-metric:after{content:"";position:absolute;width:100px;height:100px;right:-25px;top:-30px;border-radius:50%;background:color-mix(in srgb,var(--accent) 5%,transparent);pointer-events:none}.metric-icon{display:inline-flex;justify-content:center;align-items:center;width:33px;height:33px;color:var(--accent-text);background:var(--soft);border-radius:10px}.metric-icon .icon{width:19px;height:19px}
.dashboard-metric>small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}.dashboard-metric>strong{font-size:32px;font-weight:750;font-variant-numeric:tabular-nums;line-height:1.05;letter-spacing:-1px}.dashboard-metric>span.small{font-size:10px;line-height:1.5}.compact-metrics .dashboard-metric{min-height:120px}.compact-metrics .dashboard-metric>strong{font-size:23px}
.peak-note{display:flex;align-items:center;gap:10px;padding:13px 17px;background:var(--soft);border-radius:11px;font-size:12px;color:var(--accent-text);margin:0}.peak-note .icon{width:19px;height:19px;flex-shrink:0}
.chart-card{padding:21px 24px 15px;min-width:0}.chart-card h3{font-size:14px;margin:0}.chart-card>.row{flex-wrap:wrap;gap:12px;margin-bottom:12px}.traffic-chart{display:block;width:100%;height:auto;max-height:330px;overflow:visible}.chart-grid{stroke:var(--line);stroke-width:1;stroke-dasharray:4 6}.chart-axis{fill:var(--muted);font:10px sans-serif}
.chart-line.series-0{stroke:#e16a33}.chart-line.series-1{stroke:#4382df}.chart-dot.series-0{fill:#e16a33}.chart-dot.series-1{fill:#4382df}.chart-dot:focus{outline:none;stroke:var(--text);stroke-width:2}
.series-swatch{display:inline-block;width:18px;height:3px;border-radius:3px;vertical-align:middle;margin-right:7px}.series-swatch.series-0{background:#e16a33}.series-swatch.series-1{background:#4382df}.chart-legend{display:flex;flex-wrap:wrap;gap:15px;font-size:10px;color:var(--muted)}.chart-data summary{font-size:10px;color:var(--muted);cursor:pointer}.chart-data table{font-size:11px}.chart-data .table-scroll{max-height:320px;overflow:auto}.metrics-note{font-size:11px;line-height:1.7}
.presence-roster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}.presence-person{display:flex;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:11px;min-width:0}.presence-person>span:nth-child(2){min-width:0;flex:1}.presence-person strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.presence-person small{display:block;font-size:10px;overflow-wrap:anywhere}.presence-person>.small{font-size:9px}
.section-icon{display:inline-flex;padding:12px;align-self:flex-start;border-radius:14px;background:var(--soft);color:var(--accent-text)}.section-icon .icon{width:28px;height:28px}
.preference-group{padding:16px 0;border-bottom:1px solid var(--line)}.preference-group summary{cursor:pointer;font-weight:700;font-size:13px}.preference-group[open]>summary{margin-bottom:18px}.preference-group>label{margin:16px 0}.preference-group .check{align-self:center}.admin-pref-groups textarea{max-height:240px;overflow:auto}.admin-pref-groups{max-height:65dvh;overflow:auto;padding-inline-end:9px}
.log-filterbar{display:grid;grid-template-columns:150px 140px 140px minmax(180px,1fr) 100px auto;gap:12px;align-items:end;padding:19px}.log-filterbar .field{margin:0}.log-filterbar input,.log-filterbar select{min-width:0;width:100%;font-size:12px}.log-filterbar label{font-size:10px}.log-filterbar button{white-space:nowrap;min-height:39px;font-size:11px}
.log-page-summary{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);flex-wrap:wrap}.severity{font-size:9px;display:inline-block;padding:4px 8px;border-radius:7px;white-space:nowrap;font-weight:750;text-transform:uppercase;letter-spacing:.03em;background:var(--panel-alt);color:var(--muted)}.severity.info{background:#1e85db14;color:#2776b4}.severity.warn{background:#d58c161c;color:#9a650a}.severity.error{background:#da3c531c;color:#cb3449}.severity.debug{background:#8261c71a;color:#8764bd}
body[data-theme=dark] .severity.info{color:#7ab8fa}body[data-theme=dark] .severity.warn{color:#efb461}body[data-theme=dark] .severity.error{color:#ff8394}
.log-table-wrap{border:1px solid var(--line);border-radius:12px;overflow:auto;background:var(--panel)}.log-table{border-collapse:collapse;width:100%;min-width:750px}.log-table th{position:sticky;top:0;background:var(--panel-alt);text-transform:uppercase;letter-spacing:.055em;font-size:9px}.log-table td{font-size:11px;padding:14px 12px;line-height:1.5;border-bottom:1px solid var(--line)}.log-table tr:hover>td{background:color-mix(in srgb,var(--accent) 3%,transparent)}.log-table strong{font-size:11px;font-weight:650}.log-table small{display:block;font-size:10px;max-width:350px;overflow-wrap:anywhere;margin-top:4px}.log-time{min-width:130px;font-variant-numeric:tabular-nums}.log-table td:first-child{white-space:nowrap}.log-table details summary{font-size:10px;cursor:pointer;color:var(--accent-text)}.log-table details pre{white-space:pre-wrap;max-width:350px;min-width:180px;max-height:240px;overflow:auto}.http-status{font-size:12px;color:#16815c;font-weight:700}.http-status.failed{color:#c6444c}.log-policy summary{font-size:13px;font-weight:700;cursor:pointer}.log-policy[open]>summary{margin-bottom:20px}
@media(max-width:1350px){.log-filterbar{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-metric{padding:18px}.dashboard-metric>strong{font-size:27px}}
@media(max-width:1049px){body.chat-open .inline-reply-host{margin-right:0}.chat-panel{height:min(666px,calc(100dvh - 110px))}.compose-panel:not(.inline-compose){max-width:calc(100vw - 30px);right:15px}.compose-panel.compose-maximized{inset:12px 15px 84px 15px!important}.presence-roster{grid-template-columns:1fr}.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){#chat-button.chat-launcher{right:14px;bottom:13px;width:50px;height:50px}.chat-panel{inset:12px 12px 76px 12px;width:auto;height:auto;max-height:none;border-radius:16px}.window-dock{right:76px;left:12px;bottom:14px;max-width:none;gap:6px}.dock-task{min-width:0;width:auto;max-width:calc(50vw - 45px);padding:10px;gap:7px;min-height:44px;flex:1;font-size:10px}.dock-task .icon{width:16px;height:16px}.compose-panel:not(.inline-compose){inset:12px 12px 76px 12px;width:auto;max-width:none;height:auto;max-height:none}.compose-panel.compose-maximized{inset:6px 6px 76px 6px!important;border-radius:12px!important}.compose-header{padding:8px 10px}.compose-header [data-compose="draft-status"]{font-size:9px}.compose-footer{padding:10px;gap:6px}.dashboard-hero h2{font-size:22px}.dashboard-metrics{gap:10px}.dashboard-metric{padding:15px;min-height:150px}.dashboard-metric>strong{font-size:26px}.chart-card{padding:17px 12px}.chart-card .row{gap:8px}.chart-card h3{font-size:12px}.chart-legend{font-size:9px;gap:8px}.traffic-chart{min-height:165px}.log-filterbar{grid-template-columns:1fr 1fr;padding:15px;gap:10px}.log-filterbar .field:nth-child(4){grid-column:1/-1}.log-filterbar .field:nth-child(5){grid-row:3}.log-policy{padding:17px}.app-footer{font-size:9px;padding-bottom:12px}}
.hidden,#chat-button.hidden,.chat-panel.hidden,.window-dock.hidden{display:none!important}
/* Messenger-specific elements are intentionally separate from mail avatars. */
.chat-person{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;color:var(--text);text-align:left;border-radius:12px;padding:12px;min-height:76px}.chat-person:hover,.chat-person:focus-visible{background:var(--soft)}
.chat-person .avatar{width:45px;height:45px;font-size:17px}.chat-person-copy{min-width:0;flex:1}.chat-person-copy strong{display:block;font-size:13px;margin-bottom:5px}.chat-person-copy small{display:block;font-size:11px;line-height:1.5;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:215px}.chat-unread{background:var(--accent);color:#fff;border-radius:16px;min-width:21px;text-align:center;padding:4px;font-size:10px;font-weight:800}
.chat-peer-header{display:flex;align-items:center;gap:8px;padding:10px 13px;border-bottom:1px solid var(--line);flex-shrink:0}.chat-peer-header .icon-button{padding:7px;width:29px;height:29px;min-height:29px;color:var(--accent-text)}.chat-peer-header .icon{width:17px;height:17px}.chat-peer-copy{min-width:0;flex:1}.chat-peer-copy strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-peer-copy small{display:block;font-size:10px;margin-top:4px;color:var(--muted)}
.chat-tools .chat-send{border-radius:50%;width:33px;height:33px;min-height:33px;display:grid;place-items:center;background:var(--accent);color:#fff;padding:7px}.chat-send .icon{width:18px;height:18px}.chat-tools .recording{background:#ffe1e6;color:#d03154}.chat-earlier{padding:6px;font-size:10px;color:var(--accent-text);align-self:center}

/* v1.0 workspace update: useful density without hiding context. */
.folder-management-tools{margin-bottom:18px}.folder-filter{margin-top:18px;margin-bottom:14px;width:100%}
.settings-nav .tab,.settings-nav button{display:flex;align-items:center;gap:10px;text-align:left}.settings-nav .icon{width:17px;height:17px;flex-shrink:0}
.nav-button .count{cursor:pointer;background:none!important;color:var(--accent-text);font-weight:800;padding:0 2px}
.custom-mailbox-color{background:var(--mailbox-color)!important;color:var(--mailbox-ink)!important;border-color:color-mix(in srgb,var(--mailbox-color) 75%,var(--text))!important}
.mail-list-controls{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.mail-list-controls .field{margin:0}.mail-list-controls label{font-size:10px}.mail-list-controls select{padding:8px 10px;min-height:35px;font-size:11px;width:auto;max-width:180px}
.mail-subject-line{display:flex;align-items:center;gap:5px;min-width:0;max-width:100%;overflow:hidden}.mail-subject-line .subject-text{min-width:35px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-subject-line .mail-inline-tags,.mail-subject-line .mail-inline-accounts{display:inline-flex;align-items:center;gap:3px;flex:0 1 auto;min-width:0;max-width:45%;overflow:hidden}
.mail-subject-line .label-chip,.mail-subject-line .account-domain{margin:0;max-width:160px;overflow:hidden;text-overflow:ellipsis}.mail-subject-line .count-badge{flex-shrink:0}.mail-inline-tags:empty,.mail-inline-accounts:empty,.mail-tags-below:empty{display:none}
.mail-tags-below{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-top:4px}.mail-tags-below .label-chip{margin-top:0}.mail-tags-below .mail-inline-accounts{display:inline-flex;flex-wrap:wrap;gap:4px}.arrival-tag{display:none;flex-shrink:0;color:var(--accent-text)}.arrival-tag .icon{height:14px;width:14px}
.mail-row.arrival-glow{animation:label-arrival-glow 2.4s ease-out 1}.mail-row.arrival-fade{animation:label-arrival-fade 2.4s ease-out 1}.mail-row.arrival-icon .arrival-tag{display:inline-flex;animation:label-arrival-icon .8s ease-in-out 3}
@keyframes label-arrival-glow{0%,35%{box-shadow:inset 4px 0 var(--arrival-color),inset 0 0 0 2px color-mix(in srgb,var(--arrival-color) 55%,transparent)}100%{box-shadow:inset 4px 0 transparent,inset 0 0 0 2px transparent}}
@keyframes label-arrival-fade{0%{background:color-mix(in srgb,var(--arrival-color) 28%,var(--panel));opacity:.65}40%{opacity:1}100%{background:transparent}}
@keyframes label-arrival-icon{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.87)}}
.mailbox-color-setting{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--line)}.mailbox-color-setting input[type=color]{width:52px;min-width:52px;height:34px;padding:3px}.mailbox-color-setting .check{flex:1;min-width:160px;font-size:12px}.mailbox-color-setting label{margin:0}
.dashboard-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}.dashboard-charts>.chart-card{height:auto;margin:0;min-width:0;padding:18px}.dashboard-charts .traffic-chart{max-height:230px;min-height:150px}.dashboard-charts .chart-card>.row{gap:8px}.dashboard-charts .chart-card h3{flex-basis:100%;font-size:13px}.dashboard-charts .chart-legend{font-size:10px}.dashboard-metrics:not(.compact-metrics){grid-template-columns:repeat(5,minmax(0,1fr))}
.search{position:relative;overflow:visible}.search-suggestions{position:absolute;top:calc(100% + 9px);left:0;right:0;min-width:280px;max-height:min(70dvh,600px);overflow-y:auto;padding:7px;background:var(--panel);color:var(--text);border:1px solid var(--line);box-shadow:0 16px 45px #0003;border-radius:14px;z-index:110;text-align:left}
.search-suggestion{display:flex;align-items:center;gap:11px;width:100%;padding:11px 12px;border-radius:9px;border:0;background:none;color:var(--text);text-align:left;min-height:42px;font-size:12px}.search-suggestion:hover,.search-suggestion[aria-selected=true]{background:var(--soft)}.search-suggestion>.icon{width:18px;height:18px;flex-shrink:0;color:var(--accent-text)}.search-suggestion>span{display:block;overflow:hidden;min-width:0}.search-suggestion strong,.search-suggestion small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.search-suggestion small{color:var(--muted);font-size:10px;margin-top:3px}.search-suggestion-heading{font-size:10px;color:var(--muted);padding:7px 11px}.search-all{border-top:1px solid var(--line);margin-top:5px;color:var(--accent-text);font-weight:700}
/* Unread heads sit in the reserved dock lane, never over the compose editor. */
.chat-heads{position:fixed;right:20px;bottom:84px;z-index:64;display:flex;flex-direction:column-reverse;gap:12px;max-height:230px}.chat-heads:empty{display:none}.chat-open .chat-heads{display:none}
.chat-unread-head{display:flex;position:relative;padding:4px;border-radius:50%;border:1px solid var(--line);background:var(--panel);box-shadow:0 5px 20px #0002;transition:transform .18s ease}.chat-unread-head:hover{transform:translateY(-2px)}.chat-unread-head .avatar{width:39px;height:39px}.chat-head-count{position:absolute;right:-4px;top:-4px;min-width:18px;height:18px;line-height:16px;border:1px solid var(--panel);border-radius:15px;background:#be2848;color:#fff;text-align:center;font-size:10px;font-weight:800;padding:0 4px}.chat-unread-head .presence-dot{display:none}
.group-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0}.group-avatar .icon{width:21px;height:21px}.chat-face>img.avatar{object-fit:cover}.chat-roster-tools{display:flex;align-items:center;justify-content:space-between;padding-right:15px}.chat-roster-tools .icon-button{width:32px;height:32px}.chat-roster-tools .chat-domain{margin-block:6px}.chat-peer-header .chat-peer-copy{flex:1;min-width:0}.chat-sender-name{display:block;font-size:10px;color:var(--accent-text);margin-bottom:5px}.chat-bubble.own{background:color-mix(in srgb,var(--chat-color,var(--accent)) 13%,var(--panel));color:var(--text);border-color:color-mix(in srgb,var(--chat-color,var(--accent)) 25%,var(--line))}.chat-bubble.own time{color:var(--muted)}
.group-picture-controls{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.group-picture-preview img,.group-picture-preview .avatar{width:64px;height:64px;border-radius:18px;object-fit:cover}.group-picture-controls input{max-width:300px}.group-member-list{max-height:300px;overflow:auto;padding:4px 12px 4px 0}.group-member-list .check{display:flex;align-items:center;gap:10px;margin:10px 0}.group-member-list .avatar{width:30px;height:30px;font-size:11px}.admin-group-row{display:flex;align-items:center;gap:13px;border-bottom:1px solid var(--line);padding:12px 0}.admin-group-row strong,.admin-group-row small{display:block}
@media(max-width:1199px){.dashboard-charts{grid-template-columns:1fr}.dashboard-metrics:not(.compact-metrics){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1049px){.chat-open .chat-heads{display:none}.mail-subject-line{flex-wrap:wrap}.mail-subject-line .subject-text{max-width:100%}.mail-subject-line .mail-inline-tags,.mail-subject-line .mail-inline-accounts{max-width:100%}}
@media(max-width:650px){.mail-list-controls{width:100%;gap:8px}.mail-list-controls .field{flex:1;min-width:0}.mail-list-controls select{max-width:100%;width:100%}.dashboard-metrics:not(.compact-metrics){grid-template-columns:repeat(2,minmax(0,1fr))}.chat-heads{right:14px;bottom:77px;gap:8px}.chat-unread-head .avatar{width:34px;height:34px}.search-suggestions{position:fixed;left:10px;right:10px;top:70px;min-width:0;max-height:65dvh}.settings-nav .tab{gap:6px}.group-member-list .check{font-size:11px}.mail-subject-line .mail-inline-tags{flex-wrap:wrap}.mailbox-color-setting .check{min-width:120px}}
body.reduce-motion .mail-row[class*=arrival-],body.reduce-motion .arrival-tag{animation:none!important}
@media(prefers-reduced-motion:reduce){.mail-row[class*=arrival-],.arrival-tag{animation:none!important}}

@media(max-width:1049px){body.compose-visible .chat-heads{display:none}}
.folder-icon-preview{display:flex;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:12px}.folder-icon-preview .icon{width:23px;height:23px;color:var(--accent-text)}

/* v1.0 polish: predictable sidebar scrolling, actionable notices, compact pulse. */
.unread-coverage{display:grid;gap:10px;margin:0 0 18px}.unread-coverage:empty{display:none}
.reaction-notice{display:flex;align-items:center;gap:14px;position:relative}.reaction-notice>div:first-child{flex:1;min-width:0}.reaction-notice .button-group{flex-shrink:0}.reaction-notice .icon-button{flex-shrink:0}
.sidebar{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;max-height:100dvh}.sidebar>*,.sidebar-bottom{flex-shrink:0}.sidebar nav{min-height:0;flex:0 0 auto}
.sidebar-folders{margin:12px 0 16px}.sidebar-folders>.nav-section{display:flex;gap:8px;align-items:center;justify-content:space-between}
.sidebar-folder-group{margin:3px 0 10px}.sidebar-folder-group>summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;padding:10px 12px;border-radius:8px;color:var(--muted);font-size:11px;font-weight:600;user-select:none}.sidebar-folder-group>summary::-webkit-details-marker{display:none}.sidebar-folder-group>summary:hover{background:var(--soft)}.sidebar-folder-group>summary>span{min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-folder-group>summary .icon{width:15px;height:15px;flex-shrink:0}.folder-chevron{transition:transform .15s ease}.sidebar-folder-group:not([open]) .folder-chevron{transform:rotate(-90deg)}
.sidebar-folder-list{max-height:clamp(180px,40dvh,400px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding-right:4px}.sidebar-folder-list .nav-button{width:100%}.sidebar-folder-list .folder-container{margin:2px 0}
.global-signature-preview{padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--panel-alt)}.global-signature-preview h3{margin:0 0 8px}.global-signature-preview .html-message{min-height:180px;width:100%;margin-top:10px}.global-signature-preview .notice{margin-bottom:12px}
.overview-metrics.dashboard-metrics{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.overview-metrics .dashboard-metric{min-width:0}.overview-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,290px);gap:18px;align-items:start}.overview-body .dashboard-charts{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.overview-body .traffic-chart{max-height:195px;min-height:125px}.overview-people{margin:0;padding:18px!important;min-width:0}.overview-people h3{font-size:13px;margin:0}.overview-people .presence-roster{display:flex;flex-direction:column;gap:0;max-height:520px;overflow:auto;scrollbar-width:thin}.overview-people .presence-person{display:flex;flex-wrap:wrap;gap:8px;padding:14px 0;min-width:0;border-bottom:1px solid var(--line)}.overview-people .presence-person:last-child{border:0}.overview-people .presence-person>span:nth-child(2){flex:1;min-width:0}.overview-people .presence-person>span:last-child{margin-left:44px;font-size:10px;flex-basis:100%}.overview-people .presence-person strong,.overview-people .presence-person small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.overview-people .presence-person strong{font-size:12px}.overview-people .presence-person small{font-size:10px;margin-top:4px}
.security-policy-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:18px;align-items:start}.security-policy-grid>.card{margin:0;min-width:0}.security-policy-grid .fields{grid-template-columns:repeat(2,minmax(0,1fr))}.security-bans h2{margin:0}.security-details>summary{cursor:pointer;font-weight:600;padding:14px 0}.security-bans .table-scroll{max-height:480px}.security-bans td{overflow-wrap:anywhere}.security-bans .code{white-space:nowrap}
@media(max-width:1400px){.overview-metrics.dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.overview-body{grid-template-columns:minmax(0,1fr) 240px}.overview-body .dashboard-charts{grid-template-columns:1fr}}
@media(max-width:1000px){.overview-body{grid-template-columns:1fr}.overview-people .presence-roster{max-height:300px}.overview-body .dashboard-charts{grid-template-columns:repeat(2,minmax(0,1fr))}.security-policy-grid{grid-template-columns:1fr}.reaction-notice{flex-wrap:wrap}}
@media(max-width:650px){.overview-metrics.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.overview-body .dashboard-charts{grid-template-columns:1fr}.security-policy-grid .fields{grid-template-columns:1fr}.reaction-notice>.button-group{width:100%}.sidebar-folder-list{max-height:45dvh}.sidebar{max-height:100dvh}}
.sidebar-folder-group>summary>.folder-chevron{flex:0 0 auto;overflow:visible}
.dashboard .dashboard-hero h2{font-size:20px;margin:5px 0}.dashboard .dashboard-hero p{margin:6px 0}.overview-metrics .dashboard-metric{padding:15px;min-height:132px}.overview-metrics .dashboard-metric>strong{font-size:28px}.overview-metrics .dashboard-metric>.metric-icon{width:28px;height:28px;margin-bottom:7px}

/* v1.0 workspace extensions: restrained effects, accessible actions and previews. */
.sidebar-label-row{display:flex;align-items:center;gap:4px;min-width:0}.sidebar-label-row>.nav-button{flex:1;min-width:0;margin-right:0}.sidebar-label-delete{width:29px;height:29px;flex:0 0 29px;padding:6px;color:var(--muted);opacity:.3}.sidebar-label-row:hover .sidebar-label-delete,.sidebar-label-row:focus-within .sidebar-label-delete{opacity:1}.sidebar-label-delete:hover{color:var(--danger,#be2848);background:var(--soft)}
.group-danger-zone{border-top:1px solid var(--line);padding-top:20px;margin-top:6px}.group-danger-zone .danger{color:#bd3456}.chat-security-note{display:block;margin:0;padding:0 13px 9px;font-size:9px;line-height:1.45;text-align:center;color:var(--muted)}
.people-panel-heading{display:flex;align-items:center;gap:9px;margin-bottom:14px}.people-panel-heading>.icon{width:18px;height:18px;color:var(--accent-text)}.people-panel-heading h3{flex:1;min-width:0}.people-total{font-size:11px;color:var(--muted);padding:3px 7px;border:1px solid var(--line);border-radius:7px}.overview-people>input{font-size:11px;width:100%;min-width:0;padding:9px 10px;margin:0 0 6px}.overview-people .presence-person{display:flex;flex-direction:column;flex-wrap:nowrap;gap:10px;padding:15px 0}.presence-identity{display:flex;align-items:center;gap:11px;min-width:0;width:100%}.presence-identity .chat-face{position:relative;flex-shrink:0}.presence-identity .avatar{width:36px;height:36px;font-size:12px}.presence-copy{flex:1;min-width:0}.presence-status{display:block;margin-top:6px;font-size:9px;color:var(--muted)}.presence-actions{display:flex;align-items:center;gap:5px;width:100%;min-width:0}.presence-actions .icon-button{width:30px;height:30px;padding:7px}.person-signoff{font-size:10px;padding:6px 8px;min-height:30px;display:inline-flex;gap:5px;align-items:center}.person-signoff .icon{width:13px;height:13px}.overview-people .presence-person:last-child{padding-bottom:0}
.workspace-announcement{flex:0 0 auto;padding:12px 30px 0}.announcement-content{--announcement-color:var(--accent);position:relative;display:flex;align-items:center;gap:14px;padding:14px 18px;border:1px solid color-mix(in srgb,var(--announcement-color) 34%,var(--line));border-left:4px solid var(--announcement-color);border-radius:12px;background:color-mix(in srgb,var(--announcement-color) 9%,var(--panel));color:var(--text);overflow:hidden}.announcement-content.tone-warning{--announcement-color:#d79b08}.announcement-content.tone-danger{--announcement-color:#e54964}.announcement-symbol{position:relative;display:flex;flex-shrink:0;color:var(--announcement-color)}.announcement-symbol .icon{width:23px;height:23px}.announcement-copy{flex:1;min-width:0;position:relative;max-height:150px;overflow:auto;scrollbar-width:thin}.announcement-copy strong{display:block;font-size:12px;line-height:1.5}.announcement-copy p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.65;margin:2px 0 0}.announcement-content>.icon-button{position:relative;flex-shrink:0;width:30px;height:30px}.announcement-preview-label{font-size:9px;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:3px 6px}.announcement-admin .announcement-preview{margin:10px 0}.announcement-content.effect-glow{animation:notice-glow 4s ease-in-out infinite}.announcement-content.effect-shimmer:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,color-mix(in srgb,var(--announcement-color) 13%,transparent) 49%,transparent 65%);transform:translateX(-100%);animation:notice-sweep 7s ease-in-out infinite;pointer-events:none}.announcement-content.effect-icon .announcement-symbol{animation:notice-icon 4s ease-in-out infinite}
@keyframes notice-glow{0%,100%{box-shadow:inset 0 0 0 1px transparent}50%{box-shadow:inset 0 0 20px color-mix(in srgb,var(--announcement-color) 16%,transparent)}}
@keyframes notice-sweep{0%,18%{transform:translateX(-100%)}75%,100%{transform:translateX(100%)}}
@keyframes notice-icon{0%,65%,100%{transform:scale(1)}35%{transform:scale(1.15)}}
/* Effects highlight, never strobe. A static accent remains under reduced motion. */
.mail-preview{position:relative;isolation:isolate}.arrival-watermark-symbol{display:none;pointer-events:none;position:absolute;right:7%;top:50%;transform:translateY(-50%) rotate(-12deg);opacity:.13;z-index:-1;color:var(--arrival-color,var(--accent))}.arrival-watermark-symbol>.icon{width:64px;height:64px;stroke-width:1.5}.arrival-tag{display:none;vertical-align:middle;margin-right:5px;color:var(--arrival-color,var(--accent))}.arrival-tag>.icon{width:13px;height:13px}.mail-row.arrival-glow{animation:arrival-soft-glow 3.6s ease-in-out both}.mail-row.arrival-fade{animation:arrival-tint 3.6s ease-in-out both}.mail-row.arrival-icon .arrival-tag{animation:arrival-soft-icon 3.6s ease-in-out both}.mail-row.arrival-tint{background:color-mix(in srgb,var(--arrival-color,var(--accent)) 14%,var(--panel));animation:arrival-tint 3.6s ease-in-out both}.mail-row.arrival-watermark .arrival-watermark-symbol{display:flex}.mail-row.arrival-watermark .arrival-watermark-symbol>.icon{animation:arrival-soft-icon 3.6s ease-in-out both}.mail-row.arrival-ribbon{box-shadow:inset 5px 0 0 var(--arrival-color,var(--accent));animation:arrival-ribbon 3.6s ease-in-out both}.mail-row.arrival-halo .avatar{outline:2px solid var(--arrival-color,var(--accent));outline-offset:3px;animation:arrival-soft-glow 3.6s ease-in-out both}.mail-row.arrival-sweep{position:relative;isolation:isolate}.mail-row.arrival-sweep:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 15%,color-mix(in srgb,var(--arrival-color,var(--accent)) 12%,transparent) 40%,transparent 65%);opacity:0;animation:arrival-light-sweep 3.6s ease-in-out both}.mail-row.arrival-repeat,.mail-row.arrival-repeat:after,.mail-row.arrival-repeat .arrival-tag,.mail-row.arrival-repeat .arrival-watermark-symbol>.icon,.mail-row.arrival-repeat .avatar{animation-iteration-count:infinite}.arrival-preview{margin:12px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;min-height:105px}.arrival-preview .mail-preview{padding:8px 0}.arrival-preview .mail-subject{font-size:12px}
@keyframes arrival-soft-glow{0%,100%{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--arrival-color,var(--accent)) 15%,transparent)}50%{box-shadow:inset 0 0 25px color-mix(in srgb,var(--arrival-color,var(--accent)) 22%,transparent)}}
@keyframes arrival-tint{0%,100%{background:color-mix(in srgb,var(--arrival-color,var(--accent)) 5%,var(--panel))}50%{background:color-mix(in srgb,var(--arrival-color,var(--accent)) 17%,var(--panel))}}
@keyframes arrival-soft-icon{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@keyframes arrival-ribbon{0%,100%{box-shadow:inset 4px 0 0 color-mix(in srgb,var(--arrival-color,var(--accent)) 65%,var(--panel))}50%{box-shadow:inset 7px 0 0 var(--arrival-color,var(--accent))}}
@keyframes arrival-light-sweep{0%,100%{opacity:0;background-position:0}35%,65%{opacity:1;background-position:100%}}
.message-attachments{display:flex;flex-wrap:wrap;gap:12px;padding:8px 28px 20px}.attachment-card{display:flex;flex-direction:column;width:210px;max-width:100%;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel-alt);color:var(--text)}.attachment-preview-button{display:flex;flex-direction:column;width:100%;padding:0;overflow:hidden;background:none;border:0;color:inherit;text-align:left;border-radius:0}.attachment-thumbnail{display:flex;align-items:center;justify-content:center;height:96px;width:100%;position:relative;background:color-mix(in srgb,var(--accent) 6%,var(--panel));color:var(--accent-text);overflow:hidden}.attachment-thumbnail>.icon{width:31px;height:31px}.attachment-thumbnail>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.attachment-card-copy{display:block;padding:11px 13px;width:100%;min-width:0}.attachment-card-copy>strong{display:block;font-size:11px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-card-copy>small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.attachment-preview-hint{display:flex;align-items:center;gap:5px;color:var(--accent-text);font-size:10px;margin-top:8px}.attachment-preview-hint>.icon{width:13px;height:13px}.attachment-download{display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 12px;border-top:1px solid var(--line);color:var(--text);font-size:10px;font-weight:600;text-decoration:none}.attachment-download:hover,.attachment-preview-button:hover{background:var(--soft)}.attachment-download>.icon{width:14px;height:14px}.chat-attachment{width:225px;max-width:100%;margin:7px 0;background:var(--panel)}.chat-attachment .attachment-thumbnail{height:90px}.chat-attachment .attachment-card-copy{padding:8px 10px}.chat-attachment .attachment-download{padding:7px}
.attachment-viewer-open{overflow:hidden}.attachment-viewer-backdrop{position:fixed;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;padding:24px;background:#0a101bcc;backdrop-filter:blur(7px)}.attachment-viewer{display:flex;flex-direction:column;width:min(1300px,100%);height:min(900px,94dvh);min-height:0;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 20px 90px #0007}.attachment-viewer-header{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);flex-shrink:0}.attachment-viewer-header>div:first-child{flex:1;min-width:0}.attachment-viewer-header strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.attachment-viewer-header small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.attachment-viewer-header .icon-button{width:32px;height:32px;flex-shrink:0}.attachment-viewer-header>a{display:flex;align-items:center;gap:6px;text-decoration:none;font-size:11px}.attachment-viewer-header>a>.icon{width:16px;height:16px}.attachment-viewer-toolbar{display:flex;align-items:center;gap:8px;min-height:0;flex-wrap:wrap;padding:9px 20px;border-bottom:1px solid var(--line);flex-shrink:0}.attachment-viewer-toolbar:empty{padding:0;border:0}.attachment-viewer-toolbar button{font-size:11px;padding:7px 10px;min-height:30px}.attachment-viewer-stage{display:flex;flex-direction:column;align-items:stretch;min-height:0;flex:1;overflow:auto;background:var(--panel-alt);padding:16px;gap:10px}.attachment-viewer-stage>.notice{flex:0 0 auto;font-size:11px;margin:0}.attachment-image-viewport{flex:1;min-height:0;overflow:auto;display:grid;place-items:center;padding:22px}.attachment-image-viewport>img{max-width:100%;max-height:100%;object-fit:contain;transform-origin:center;transition:transform .15s ease}.attachment-document-text{white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.85 ui-monospace,monospace;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:25px;margin:0;overflow:auto;flex:1}.attachment-pdf{display:block;width:100%;height:100%;min-height:280px;flex:1;border:1px solid var(--line);border-radius:6px;background:#fff}.attachment-viewer-stage video{max-width:100%;max-height:100%;flex:1;min-height:0}.attachment-viewer-stage audio{display:block;width:min(650px,100%);margin:40px auto}.attachment-preview-fallback{padding:40px 24px;text-align:center}.attachment-preview-fallback>.icon{width:45px;height:45px;color:var(--muted)}
@media(hover:none){.sidebar-label-delete{opacity:1}}
@media(max-width:650px){.workspace-announcement{padding:9px 12px 0}.announcement-content{padding:11px 12px;gap:10px}.announcement-copy p{font-size:11px}.announcement-copy{max-height:120px}.message-attachments{padding:8px 15px 15px;gap:8px}.message-attachments .attachment-card{width:calc(50% - 4px)}.attachment-viewer-backdrop{padding:0}.attachment-viewer{height:100dvh;width:100%;border-radius:0}.attachment-viewer-header{padding:12px 10px;gap:7px;flex-wrap:wrap}.attachment-viewer-header>div:first-child{flex-basis:calc(100% - 50px)}.attachment-viewer-header strong{font-size:12px}.attachment-viewer-toolbar{padding:8px 10px}.attachment-viewer-stage{padding:10px}.attachment-document-text{padding:15px;font-size:11px}.attachment-image-viewport{padding:6px}.presence-actions .person-signoff{margin-left:auto}}
body.reduce-motion .announcement-content,body.reduce-motion .announcement-content:before,body.reduce-motion .announcement-symbol,body.reduce-motion .mail-row[class*=arrival-],body.reduce-motion .mail-row[class*=arrival-]:after,body.reduce-motion .mail-row[class*=arrival-] .avatar,body.reduce-motion .mail-row[class*=arrival-] .arrival-tag,body.reduce-motion .mail-row[class*=arrival-] .arrival-watermark-symbol>.icon{animation:none!important}
@media(prefers-reduced-motion:reduce){.announcement-content,.announcement-content:before,.announcement-symbol,.mail-row[class*=arrival-],.mail-row[class*=arrival-]:after,.mail-row[class*=arrival-] .avatar,.mail-row[class*=arrival-] .arrival-tag,.mail-row[class*=arrival-] .arrival-watermark-symbol>.icon{animation:none!important}}
.viewer-heading{flex:1;min-width:0}.viewer-heading strong,.viewer-heading small{display:block}.viewer-tools{display:flex;gap:7px;align-items:center}.attachment-viewer-toolbar>.icon-button{width:32px;height:32px;padding:7px}.attachment-viewer-stage .document-text-preview{display:flex;flex-direction:column;gap:12px;min-height:0;flex:1}.document-text-preview>.notice{margin:0;font-size:11px;flex:0 0 auto}.viewer-media-stage{display:flex;flex:1;min-height:0;align-items:center;justify-content:center}.viewer-media{max-width:100%;max-height:100%}.pdf-preview-note{flex:0 0 auto}.attachment-image-viewport{display:flex;align-items:center;justify-content:center}
.pdf-page-viewport{display:block;text-align:center;min-height:0;overflow:auto;padding:10px}.pdf-page-viewport>img.pdf-page-image{width:min(100%,900px);height:auto;max-height:none;box-shadow:0 4px 20px #0002;background:#fff}.pdf-preview-note{margin:0}
.chat-security-note{display:flex;align-items:flex-start;justify-content:center;gap:5px}.chat-security-note>.icon{width:12px;height:12px;flex:0 0 12px;margin-top:1px}.chat-attachment-media>audio{width:225px;max-width:100%;height:35px;margin:6px 0 0}.chat-attachment-media .attachment-thumbnail{display:none}
.attachment-viewer-toolbar{flex-direction:row;justify-content:flex-start}.pdf-page-viewport{display:flex;align-items:flex-start;justify-content:center}.pdf-page-viewport>img.pdf-page-image{width:auto;height:auto;max-width:100%;max-height:100%;flex-shrink:0}.pdf-page-viewport.fit-width{display:block}.pdf-page-viewport.fit-width>img.pdf-page-image{width:min(100%,900px);max-height:none}

/* Keep people actions visible beside charts without a second oversized header. */
.dashboard{gap:18px}.overview-metrics .dashboard-metric{display:grid;grid-template-columns:34px minmax(0,1fr);column-gap:10px;row-gap:6px;min-height:120px;padding:16px;align-content:start}.overview-metrics .dashboard-metric>.metric-icon{grid-row:1/span 2}.overview-metrics .dashboard-metric>small{grid-column:2;line-height:1.5}.overview-metrics .dashboard-metric>strong{grid-column:2;font-size:28px}.overview-metrics .dashboard-metric>span.small{grid-column:1/-1}
/* Keep administrator contact actions reachable while a conversation is open. */
body.chat-open .dashboard{margin-right:var(--chat-reserve)}
@media(min-width:1050px){body.chat-open .overview-metrics.dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1050px) and (max-width:1399px){body.chat-open .overview-body{grid-template-columns:1fr}body.chat-open .overview-people{grid-row:1}body.chat-open .overview-body .dashboard-charts{grid-template-columns:1fr}body.chat-open .overview-metrics.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media(max-width:650px){.attachment-viewer-header{display:grid;grid-template-columns:minmax(0,1fr) 32px}.attachment-viewer-header>.viewer-heading{grid-column:1;grid-row:1}.attachment-viewer-header>.icon-button{grid-column:2;grid-row:1}.attachment-viewer-header>.viewer-download{grid-column:1;grid-row:2;width:fit-content}}

/* Independent composers and outgoing conversation receipts. */
.sender-cell{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden}
.sender-cell .sender-names{min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sender-cell .thread-count{flex:0 0 auto;white-space:nowrap;overflow:visible;font-variant-numeric:tabular-nums;margin:0}
.composer-instance .recipient input,.composer-instance .recipient select{min-width:0}
.composer-instance [data-compose="compose-form"]{display:flex;flex-direction:column;flex:1;min-height:0;overflow:auto}
.composer-instance [data-compose="compose-source"]{width:100%;min-height:160px}
.composer-instance .compose-header{cursor:default}
.composer-instance .compose-header>strong{min-width:0;flex:1}
.composer-instance .compose-header [data-compose="draft-status"]{margin-left:0;max-width:35%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}
.composer-instance .compose-footer{flex-wrap:wrap;flex-shrink:0}
.composer-instance.composer-active{border-color:var(--accent)}
.rich-editor blockquote[data-reply-history]{border-left:3px solid var(--line);margin:16px 0 0 10px;padding-left:14px;color:var(--text)}
.rich-editor [data-reply-context]{color:var(--muted);font-size:12px;margin-top:20px}
.history-collapsed .rich-editor [data-reply-context],.history-collapsed .rich-editor [data-reply-history]{display:none}
.reply-history-toggle{align-self:flex-start;margin:4px 16px 10px;font-size:11px}
.window-dock{overflow-x:auto;flex-wrap:nowrap;max-width:calc(100vw - 110px);padding:4px;scrollbar-width:thin}
.window-dock .dock-task{flex:0 0 auto;min-width:110px;max-width:210px}
.thread-outgoing{display:flex;flex-direction:column;gap:16px;margin-top:16px}
.thread-outgoing:empty{display:none}
.outgoing-reply{overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.outgoing-body{padding:16px 24px;overflow-wrap:anywhere;max-height:440px;overflow:auto;line-height:1.7}
.outgoing-body blockquote{border-left:2px solid var(--line);margin-left:8px;padding-left:12px;color:var(--muted)}
.outgoing-status{display:flex;align-items:center;gap:16px;min-height:48px;padding:10px 20px;background:var(--soft);font-size:12px}
.outgoing-status .delivery-label{flex:1;overflow-wrap:anywhere}
.outgoing-status .undo-send{font-weight:700;flex-shrink:0}
.send-progress{display:block;width:100%;height:3px;border:0;accent-color:var(--accent);transition:all .4s linear}
.outgoing-reply[data-state="failed"],.outgoing-reply[data-state="uncertain"]{border-color:var(--danger)}
@media(max-width:650px){.sender-cell{min-width:80px}.sender-cell .sender-names{flex-basis:0}.thread-count{font-size:11px}.window-dock .dock-task{min-width:115px;max-width:170px}.outgoing-body{padding:14px}.composer-instance .editor-toolbar{gap:2px}}
@media(prefers-reduced-motion:reduce){.send-progress,.outgoing-reply{transition:none!important;animation:none!important}}
body[data-reduced-motion="true"] .send-progress{transition:none}

.outgoing-reply .message-summary:after{display:none}
.send-progress::-webkit-progress-bar{background:var(--line)}
.send-progress::-webkit-progress-value{background:var(--accent);transition:width .4s linear}
.send-progress::-moz-progress-bar{background:var(--accent)}
@media(prefers-reduced-motion:reduce){.send-progress::-webkit-progress-value{transition:none}}
body[data-reduced-motion="true"] .send-progress::-webkit-progress-value{transition:none}

/* Conversation/recipient hotfix: the sidebar frame never scrolls. Both tint
   and wallpaper cover its viewport while only the inner navigation moves. */
.sidebar{overflow:hidden;padding:0;min-height:0}
.sidebar::before{inset:calc(-1 * var(--sidebar-blur,0px))}
.sidebar-scroll{display:flex;flex-direction:column;flex:1;min-height:0;height:100%;overflow-y:auto;overflow-x:hidden;padding:28px 17px 18px;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-color:color-mix(in srgb,var(--muted) 38%,var(--panel)) transparent}
.sidebar-scroll>.brand,.sidebar-scroll>#mailbox-tools,.sidebar-scroll>#nav,.sidebar-scroll>.sidebar-bottom{flex-shrink:0}

/* Wrapped recipient chips and an accessible per-field suggestion list. */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.tokenized-recipient{align-items:flex-start;gap:8px;position:relative;flex-shrink:0}
.tokenized-recipient>label{padding-top:14px}
.tokenized-recipient>#toggle-copy,.tokenized-recipient>[data-compose="toggle-copy"]{margin-top:6px;flex-shrink:0}
.recipient-token-box{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:5px;flex:1;min-width:0;padding:6px 0}
.recipient-chips{display:contents}
.recipient-token-box input{flex:1 1 130px!important;width:130px;min-width:60px!important;max-width:100%;height:30px;min-height:0;padding:4px!important;background:transparent!important}
.recipient-token-box:focus-within{outline:0}
.recipient-chip{display:inline-flex;align-items:center;min-width:0;max-width:100%;height:28px;gap:2px;border:1px solid var(--line);background:var(--panel-alt);border-radius:18px;line-height:1.25;color:var(--text)}
.recipient-chip:focus-within{outline:2px solid var(--accent);outline-offset:1px}
.recipient-chip-label{padding:4px 3px 4px 10px;min-width:0;max-width:260px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px;background:none;color:inherit}
.recipient-chip-remove{padding:2px 7px 3px 3px;min-width:24px;height:26px;font-size:17px;background:none;color:var(--muted);border-radius:50%}
.recipient-chip-remove:hover{background:var(--soft);color:var(--accent-text)}
.recipient-chip.invalid{background:var(--danger-bg);border-color:var(--danger);color:var(--danger)}
.recipient-suggestions{position:absolute;top:100%;left:0;right:0;min-width:min(280px,100%);max-height:240px;overflow-y:auto;z-index:12;padding:5px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);box-shadow:0 6px 24px #0003;scrollbar-gutter:stable;overscroll-behavior:contain}
.recipient-option{display:flex;flex-direction:column;gap:4px;width:100%;padding:10px;border-radius:7px;text-align:left;background:none;color:var(--text);overflow-wrap:anywhere}
.recipient-option strong{font-size:12px}.recipient-option small{font-size:11px;color:var(--muted)}
.recipient-option.active,.recipient-option:hover{background:var(--soft)}
@media(max-width:650px){.tokenized-recipient{padding-inline:12px;gap:5px}.tokenized-recipient>label{min-width:26px}.recipient-chip-label{max-width:190px}.recipient-token-box input{flex-basis:90px!important}}

/* Unread is a state, not just a number. Use text + contrast, not color alone. */
.chat-person.has-unread{background:color-mix(in srgb,var(--panel) 90%,var(--accent) 10%);box-shadow:inset 3px 0 var(--accent)}
.chat-person.has-unread .chat-person-copy strong{font-weight:800}
.chat-person.has-unread .chat-person-copy small{color:var(--text);font-weight:650}
.chat-person-time{display:block;font-size:10px;color:var(--muted);margin-top:4px;font-variant-numeric:tabular-nums}
.chat-message-row.unread .chat-bubble{border-inline-start:3px solid var(--accent);background:color-mix(in srgb,var(--panel) 89%,var(--accent) 11%)}
.chat-message-meta{display:flex;flex-wrap:wrap;align-items:center;gap:5px 9px;margin-top:6px}
.chat-message-meta time{font-size:10px;line-height:1.5;font-variant-numeric:tabular-nums}
.chat-unread-label{display:inline-flex;font-size:10px;font-weight:800;color:var(--accent-text)}
.chat-date-divider,.chat-new-divider{display:flex;align-items:center;justify-content:center;gap:10px;flex-shrink:0;font-size:11px;padding:8px 3px;color:var(--muted)}
.chat-date-divider::before,.chat-date-divider::after,.chat-new-divider::before,.chat-new-divider::after{content:"";height:1px;flex:1;background:var(--line)}
.chat-new-divider{font-weight:750;color:var(--accent-text)}.chat-new-divider::before,.chat-new-divider::after{background:var(--accent)}
.chat-unread-jump,.chat-newer{flex-shrink:0;align-self:center;font-size:11px;padding:7px 12px;border-radius:16px;background:var(--soft);margin:3px 0}
.chat-messages{overflow-anchor:none;overscroll-behavior:contain}

/* v15: email-paper surfaces do not inherit application theme or UI styles.
   Inline sender declarations still win over this low-specificity reset. */
.rich-editor,.outgoing-body{color-scheme:only light;background:#fff;color:#272b33;font:14px/1.6 Arial,sans-serif;isolation:isolate}
.rich-editor :where(*),.outgoing-body :where(*){box-sizing:content-box}
.rich-editor :where(h1,h2,h3,h4,h5,h6,p),.outgoing-body :where(h1,h2,h3,h4,h5,h6,p){margin:revert;line-height:revert;letter-spacing:normal;font-size:revert}
.rich-editor :where(a),.outgoing-body :where(a){color:revert;text-decoration:revert}
.rich-editor :where(small),.outgoing-body :where(small){font-size:smaller}
.rich-editor img,.outgoing-body img{max-width:100%;height:auto}
.rich-editor img:not([src]),.outgoing-body img:not([src]){font:12px/1.5 Arial;color:#596476;border:1px dashed #aab3c2;padding:6px;min-width:40px;min-height:24px}
.rich-editor blockquote[data-reply-history]{border-left:3px solid #d4dae3;color:#272b33}
.rich-editor [data-reply-context]{color:#687386}
.html-message{color-scheme:only light;filter:none;opacity:1;mix-blend-mode:normal}
.mail-image-notice{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;font-size:12px;background:var(--panel-alt);border-bottom:1px solid var(--line)}
.mail-image-notice .text-button{color:var(--accent-text);font-weight:650}

/* v15: real receipt states and restrained, one-shot arrival motion. */
.chat-message-meta{align-items:center;flex-wrap:wrap;gap:6px}
.chat-receipt{display:inline-flex;align-items:center;gap:4px;font-size:10px;color:var(--muted);transition:color .2s ease}
.chat-receipt .icon{width:13px;height:13px}
.chat-receipt[data-state=seen]{color:var(--accent-text);font-weight:650}
.chat-message-enter{animation:chat-message-in .24s cubic-bezier(.2,.7,.2,1) both}
@keyframes chat-message-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
.composer-instance:not(.is-minimized){animation:composer-in .2s ease-out}
@keyframes composer-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
.message-card.is-new-reply{border-color:var(--accent);box-shadow:inset 3px 0 var(--accent)}
.message-card.is-new-reply>.message-summary{background:color-mix(in srgb,var(--accent) 8%,var(--panel));transition:background-color .3s ease}
.message-new-label{display:inline-flex;align-items:center;border-radius:5px;padding:3px 7px;font-size:10px;font-weight:750;color:var(--accent-text);background:var(--soft)}
.conversation-live-notice{display:flex;align-items:center;gap:10px;flex-wrap:wrap;position:sticky;top:0;z-index:4;padding:10px 14px;margin-bottom:14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);box-shadow:0 4px 16px #0001;font-size:12px}
.conversation-live-notice>span{flex:1;min-width:130px}.conversation-live-notice .text-button{color:var(--accent-text);font-weight:650}
.conversation-live-notice .icon-button{width:26px;height:26px}
body[data-reduced-motion=true] .composer-instance,body[data-reduced-motion=true] .chat-message-enter{animation:none!important}
body[data-reduced-motion=true] .chat-receipt,body[data-reduced-motion=true] .message-summary{transition:none!important}
@media(prefers-reduced-motion:reduce){.composer-instance,.chat-message-enter{animation:none!important}.chat-receipt,.message-summary{transition:none!important}}

/* v1.1 setup, contact books and presence use isolated layout classes. */
.setup-shell{max-width:1050px;margin:0 auto;padding:6px 0 30px}.setup-card{padding:30px 34px}.setup-heading h1{margin:12px 0;font-size:28px}.setup-heading>p{font-size:12px}.setup-progress{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));list-style:none;margin:24px 0 30px;padding:0;gap:8px}.setup-progress li{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;position:relative;color:var(--muted);min-width:0}.setup-progress li>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:var(--panel-alt);font-size:12px;z-index:1}.setup-progress li:not(:last-child):after{content:'';position:absolute;top:15px;left:65%;width:80%;height:1px;background:var(--line)}.setup-progress li.current{color:var(--accent-text);font-weight:700}.setup-progress li.current>span{background:var(--primary);border-color:var(--primary);color:white;box-shadow:0 0 0 4px var(--soft)}.setup-progress li.complete>span{background:var(--soft);border-color:var(--accent);color:var(--accent-text)}.setup-progress small{font-size:10px;line-height:1.4}
.setup-content-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(230px,.85fr);gap:30px;align-items:start}.setup-fields{min-width:0;gap:18px}.setup-fields>h2{margin:0;font-size:19px}.setup-fields>p{margin:0}.setup-preview-host{position:sticky;top:10px;min-width:0}.setup-preview{border:1px solid var(--line);border-radius:15px;padding:23px;background:var(--panel-alt);overflow:hidden;color:var(--text);min-width:0}.preview-caption{display:block;font-size:9px;letter-spacing:1.6px;font-weight:700;color:var(--muted);margin-bottom:23px}.setup-profile-preview{text-align:center;overflow-wrap:anywhere}.setup-profile-preview h3{margin:16px 0 8px;font-size:19px}.setup-profile-preview p{margin:5px 0}.setup-portrait{display:grid;place-items:center;position:relative;width:86px;height:86px;margin:0 auto;border-radius:50%;overflow:hidden;font-size:27px;font-weight:700;background:var(--soft);color:var(--accent-text);border:3px solid var(--panel);box-shadow:0 0 0 1px var(--line)}.setup-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.setup-actions{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding-top:22px;margin-top:10px;flex-wrap:wrap}.setup-exit{margin-top:20px}.setup-theme-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.setup-theme-choice{display:grid;grid-template-columns:20px 1fr;align-items:center;gap:10px;border:2px solid var(--line);border-radius:13px;padding:18px;cursor:pointer;color:var(--text)}.setup-theme-choice:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 3px var(--soft)}.setup-theme-choice input[type=radio]{width:17px;height:17px;margin:0;accent-color:var(--accent)}.setup-theme-choice strong{grid-column:1/-1;font-size:13px}.theme-swatch{display:grid;place-items:center;height:47px;border-radius:9px}.theme-light .theme-swatch{background:#f4f5f8;color:#b33b04;border:1px solid #dfe3e8}.theme-dark .theme-swatch{background:#151b25;color:#ff9b61;border:1px solid #303b4c}.theme-swatch .icon{width:24px;height:24px}
.setup-inbox-preview.theme-light{--panel-alt:#fff;--text:#242936;--muted:#5f6b7e;--line:#e5e8ee;--soft:#fff1e8;color-scheme:light}.setup-inbox-preview.theme-dark{--panel-alt:#1b212c;--text:#e6ebf4;--muted:#aab6c9;--line:#303b4c;--soft:#38261e;color-scheme:dark}.preview-mail-top{display:flex;align-items:center;gap:9px;margin-bottom:15px}.preview-mail-top>span{font-size:10px;margin-left:auto;color:var(--muted)}.preview-mail-row{display:flex;align-items:center;gap:8px;padding:18px 0;border-top:1px solid var(--line);min-width:0}.preview-mail-row>div{flex:1;min-width:0}.preview-mail-row strong,.preview-mail-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.preview-mail-row strong{font-weight:400}.preview-mail-row.unread strong{font-weight:750}.preview-mail-row small{font-size:10px;color:var(--muted);margin-top:3px}.preview-mail-row time{font-size:9px;flex-shrink:0;color:var(--muted)}.preview-avatar{flex-shrink:0;display:grid;place-items:center;background:var(--soft);width:28px;height:28px;border-radius:50%;font-size:10px}.density-compact .preview-mail-row{padding:10px 0}.preview-notification{display:flex;gap:12px;border:1px solid var(--line);padding:16px;border-radius:12px;background:var(--panel)}.preview-notification .icon{color:var(--accent-text)}.preview-notification strong{font-size:12px}.preview-notification p{font-size:11px;line-height:1.6;margin:8px 0 0}.notification-preview>p{margin:15px 0 0}.preview-book{display:flex;align-items:center;gap:12px;padding:16px 0;border-top:1px solid var(--line)}.preview-book strong,.preview-book small{display:block;font-size:12px;overflow-wrap:anywhere}.preview-book small{color:var(--muted);font-size:11px;margin-top:5px}.preview-book>.icon{color:var(--accent-text)}.preview-book.is-muted{opacity:.8}.setup-review-list{display:grid;grid-template-columns:minmax(110px,1fr) minmax(0,1fr);margin:0;gap:0;font-size:12px}.setup-review-list dt,.setup-review-list dd{margin:0;padding:10px 0;border-bottom:1px solid var(--line)}.setup-review-list dt{color:var(--muted)}.setup-review-list dd{font-weight:600;overflow-wrap:anywhere}
.contacts-workspace{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr);gap:20px;align-items:start}.contact-books{padding:18px;position:sticky;top:0;min-width:0;max-height:calc(100dvh - 210px);overflow:auto}.contact-books>h3{margin:0 0 15px}.contact-book-option{display:flex;align-items:center;gap:9px;text-align:left;background:transparent;width:100%;padding:12px 9px;border:1px solid transparent;border-radius:10px;min-width:0;color:var(--text)}.contact-book-option:hover{background:var(--panel-alt)}.contact-book-option.active{border-color:var(--line);background:var(--soft);color:var(--accent-text)}.contact-book-copy{flex:1;min-width:0}.contact-book-copy strong,.contact-book-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.contact-book-copy small{font-size:10px;color:var(--muted);margin-top:5px}.contact-book-option>.count{flex-shrink:0;font-size:11px;min-width:20px;text-align:right}.contact-book-separator{font-size:9px;letter-spacing:1px;color:var(--muted);margin:20px 7px 8px}.contact-books>p{margin:20px 5px 0}.contact-book-content{min-width:0}.contact-book-heading{padding:20px;margin-bottom:20px}.contact-book-heading h2{margin-bottom:8px}.contact-book-heading input{max-width:500px}.contact-book-heading [role=status]{margin:12px 0 0}.contact-card{padding:19px;gap:12px;min-width:0}.contact-card h3,.contact-card p{overflow-wrap:anywhere;margin:0}.shared-contact-label{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted)}.shared-contact-label>.icon{width:12px;height:12px}.contact-pagination{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:20px}.contact-pagination button:disabled{cursor:default}
/* The roster is one flexible column, independent of older presence/chat rules. */
.overview-body{grid-template-columns:minmax(0,1fr) minmax(270px,330px)}.signed-people-panel{padding:20px;min-width:0;margin:0;overflow:hidden}.signed-people-panel h3{margin:0;font-size:14px}.signed-people-filters{display:grid;gap:12px;min-width:0}.signed-people-filters input,.signed-people-filters select{font-size:12px;padding:10px}.signed-people-panel>[role=status]{margin:12px 0;font-size:11px}.signed-people-roster{display:flex;flex-direction:column;max-height:570px;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;scrollbar-width:thin;padding-right:3px}.signed-person{display:flex;flex-direction:column;gap:11px;padding:17px 0;min-width:0;border-top:1px solid var(--line)}.signed-person:first-child{border-top:0;padding-top:5px}.signed-person-identity{display:flex;align-items:center;gap:10px;min-width:0}.signed-person-face{position:relative;flex-shrink:0;display:inline-flex}.signed-person-face .avatar{width:38px;height:38px;font-size:12px}.signed-person-dot{position:absolute;right:0;bottom:0;width:11px;height:11px;background:#98a1b0;border:2px solid var(--panel);border-radius:50%}.signed-person.is-online .signed-person-dot{background:#1ba668}.signed-person-copy{min-width:0;flex:1}.signed-person-copy strong,.signed-person-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.signed-person-copy small{color:var(--muted);font-size:10px;margin-top:4px}.signed-person-status{display:block;font-size:10px;color:var(--muted);margin-top:5px}.signed-person.is-online .signed-person-status{color:var(--success)}.signed-person-times{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--muted)}.signed-person-times time{font-weight:600;color:var(--text);white-space:nowrap}.signed-person-actions{display:flex;align-items:center;gap:4px;min-width:0}.signed-person-actions>.icon-button{width:29px;height:29px;padding:6px}.signed-person-actions .person-signoff{white-space:nowrap;gap:5px;padding:6px 8px}.signed-people-pager{display:flex;gap:8px;justify-content:space-between;margin-top:15px}.signed-people-pager button{font-size:11px;padding:8px 12px}.presence-explanation{border-top:1px solid var(--line);padding-top:15px;margin:17px 0 0!important;font-size:10px;line-height:1.7}
.user-list-filters{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,230px);align-items:end;gap:15px;margin:18px 0}.users-directory{min-width:0}.user-activity-table{min-width:880px;table-layout:auto}.user-activity-table th,.user-activity-table td{padding:15px 10px;vertical-align:middle}.user-activity-table th{font-size:10px}.user-activity-table td{font-size:11px}.user-identity{display:flex;align-items:center;gap:10px;min-width:155px}.user-identity>div{min-width:0;max-width:200px}.user-identity strong,.user-identity small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-session-date{display:block;white-space:nowrap;font-size:11px;margin:4px 0}.user-row-actions{display:flex;gap:7px;flex-wrap:wrap;min-width:145px}.user-row-actions button{font-size:10px;padding:6px 9px;min-height:30px}.users-directory>[role=status]{margin:8px 0;font-size:11px}.users-directory>p:last-child{margin:17px 0 0}.activity-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.activity-summary>div{background:var(--panel-alt);border:1px solid var(--line);border-radius:11px;padding:14px}.activity-summary small,.activity-summary time{display:block}.activity-summary small{color:var(--muted);margin-bottom:7px}.activity-summary time{font-weight:650;font-size:13px}.activity-timeline{list-style:none;padding:0;margin:0}.activity-event{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--line)}.activity-event>div:nth-child(2){flex:1;min-width:0}.activity-event strong,.activity-event small{display:block;font-size:12px}.activity-event small{font-size:10px;margin-top:5px;color:var(--muted)}.activity-event-icon{display:grid;place-items:center;width:32px;height:32px;background:var(--panel-alt);border:1px solid var(--line);border-radius:50%;flex-shrink:0}.activity-event.kind-sign_in .activity-event-icon{background:var(--success-bg);color:var(--success)}.activity-event-time{text-align:right;font-size:11px;flex-shrink:0}.user-activity-dialog{gap:18px}
@media(max-width:1150px){.setup-card{padding:25px}.setup-content-grid{gap:22px;grid-template-columns:minmax(0,1fr) minmax(210px,.8fr)}.contacts-workspace{grid-template-columns:200px minmax(0,1fr)}}
@media(max-width:1000px){.overview-body{grid-template-columns:1fr}.signed-people-roster{max-height:460px}.setup-progress small{font-size:9px}}
@media(max-width:650px){.setup-card{padding:20px 16px}.setup-shell{padding:0 0 20px}.setup-heading h1{font-size:24px}.setup-content-grid{grid-template-columns:1fr;gap:20px}.setup-preview-host{position:static}.setup-progress{gap:4px;margin:20px 0 25px}.setup-progress small{display:none}.setup-progress li>span{width:27px;height:27px;font-size:11px}.setup-progress li:not(:last-child):after{top:13px}.setup-preview{padding:18px}.setup-theme-choice{padding:13px}.setup-actions{gap:7px}.setup-actions button{padding:10px 12px}.contacts-workspace{grid-template-columns:1fr}.contact-books{position:static;max-height:240px}.contact-book-content .contact-grid{grid-template-columns:1fr}.contact-book-heading{padding:17px}.signed-people-panel{padding:18px}.user-list-filters{grid-template-columns:1fr}.users-directory{padding:17px}.activity-summary{gap:8px}.activity-summary>div{padding:11px}.activity-event{flex-wrap:wrap;gap:9px}.activity-event-time{flex-basis:100%;padding-left:41px;text-align:left}.activity-event-time time,.activity-event-time small{display:inline-block;margin:0 9px 0 0}.app-footer{text-align:center;line-height:1.6}}
/* Put people before long traffic charts when the overview becomes one column. */
@media(max-width:1100px){.overview-body>.signed-people-panel{order:-1}}

/* v1.2: decorative banner effects must never intercept dismissal. */
.announcement-content>.icon-button{z-index:2;pointer-events:auto;cursor:pointer}
.announcement-content>.icon-button:focus-visible{outline:2px solid currentColor;outline-offset:2px}
/* v1.2 cache policy editor */
.cache-settings .cache-primary-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cache-diagnostics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:14px;border:1px solid var(--line);border-radius:12px}
.cache-diagnostics small{display:block;color:var(--muted);margin-bottom:5px}
.cache-diagnostics strong{display:block;font-size:14px;overflow-wrap:anywhere}
.cache-advanced summary{cursor:pointer;font-weight:600;padding:10px 0}
.cache-advanced .fields{padding-top:12px}
@media(max-width:800px){.cache-settings .cache-primary-fields,.cache-diagnostics{grid-template-columns:1fr}}

/* v1.3: bounded loading states and email-safe rich signature composition. */
.mail-fetching{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;min-height:230px;padding:28px;text-align:center}.mail-fetching p{max-width:440px}.mail-fetching-spinner{width:34px;height:34px;border:3px solid var(--border,#ddd);border-top-color:var(--accent,#a74720);border-radius:50%;animation:mail-fetch-spin 1s linear infinite}@keyframes mail-fetch-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.mail-fetching-spinner{animation:none;border-style:dotted}}.draft-opening{position:sticky;bottom:0;padding:12px;background:var(--surface,#fff);border:1px solid var(--border,#ddd);border-radius:12px;z-index:3}.composer-instance.files-dragover{outline:3px dashed var(--accent,#a74720);outline-offset:-6px}.compose-drop-hint{margin:0;padding:5px 18px;font-size:11px;color:var(--muted,#68707c)}
.rich-signature{min-width:0;max-width:100%;grid-column:1/-1;border:1px solid var(--line,#d9dce2);border-radius:14px;overflow:hidden;background:var(--panel,#fff);color:var(--text,#272b33)}.signature-heading,.signature-preview-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:14px 16px}.signature-heading h3,.signature-preview-heading h4{margin:0;font-size:15px}.signature-tools{display:flex;flex-wrap:wrap;align-items:center;gap:5px;padding:10px 12px;border-top:1px solid var(--line,#d9dce2);border-bottom:1px solid var(--line,#d9dce2);background:var(--panel,#f6f7f9)}.signature-tools .signature-tool{font-size:11px;min-height:30px;padding:5px 8px;border-radius:6px;border:1px solid var(--line,#d9dce2);background:var(--panel,#fff);color:inherit}.signature-tools .signature-tool:hover{border-color:var(--accent,#a74720)}.signature-tools select{max-width:145px;font-size:12px;padding:5px;border-radius:6px;min-height:32px}.signature-color{display:inline-flex!important;flex-direction:row!important;align-items:center;gap:5px;font-size:11px}.signature-color input[type=color]{width:30px;height:28px;padding:1px;border:0}.signature-visual{min-height:190px;max-height:520px;overflow:auto;padding:18px;font:14px/1.6 Arial,sans-serif;color:#272b33;background:#fff;outline:none;overflow-wrap:anywhere;color-scheme:only light}.signature-visual:focus{box-shadow:inset 0 0 0 2px var(--accent,#a74720)}.signature-visual[contenteditable=false]{opacity:.65}.signature-visual img{max-width:100%;height:auto;cursor:pointer}.signature-visual table{max-width:100%}.signature-visual.is-dragover{outline:3px dashed var(--accent,#a74720);outline-offset:-4px}.signature-source{display:block;width:100%;min-height:200px;resize:vertical;border:0;border-radius:0;padding:14px;font-size:12px}.signature-source.hidden{display:none}.signature-live-preview{margin:0 16px 8px;border:1px solid var(--line,#d9dce2);border-radius:8px;overflow:hidden;background:#fff;min-height:70px}.signature-live-preview iframe{width:100%;border:0;display:block;min-height:80px}.rich-signature>p,.rich-signature>label{margin:10px 16px}.signature-count{font-variant-numeric:tabular-nums}.signature-image-settings{display:flex;flex-wrap:wrap;align-items:end;gap:10px;padding:12px 16px;background:var(--panel,#f6f7f9)}.signature-image-settings.hidden{display:none}.signature-image-settings label{display:flex;flex-direction:column;gap:5px;font-size:12px}.signature-image-settings input[type=number]{width:115px}.signature-image-settings input[type=text]{max-width:240px}@media(max-width:650px){.signature-tools{gap:4px;padding:8px}.signature-tools .signature-tool{font-size:10px;padding:5px 6px}.signature-visual{padding:12px;min-height:170px}.signature-tools select{max-width:125px}.rich-signature .signature-heading{padding:12px}.signature-image-settings input[type=text]{width:100%}}

.rich-signature{grid-column:1/-1}

/* v1.3.1: application controls follow the theme; outgoing HTML keeps its own
   colors. Canvas-local tokens also protect against inherited admin/form CSS. */
.rich-signature .signature-tools,.rich-signature .signature-image-settings{color:var(--text);background:var(--panel-alt)}
.rich-signature .signature-tools .signature-tool,.rich-signature .signature-tools select,.rich-signature .signature-image-settings input,.rich-signature .signature-image-settings select{color:var(--text);background:var(--panel);border:1px solid var(--line)}
.rich-signature .signature-tool:focus-visible,.rich-signature select:focus-visible{outline:2px solid var(--accent-text);outline-offset:2px}
.rich-signature .signature-tool:hover{color:var(--accent-text);background:var(--soft)}
.rich-signature .signature-source{background:var(--panel);color:var(--text);caret-color:var(--text)}
.signature-visual,.rich-editor{--text:#272b33;--muted:#596476;--panel:#fff;--panel-alt:#fff;--bg:#fff;--line:#d6d8dd;--accent-text:#a43b09;color-scheme:only light;background:#fff;color:#272b33;caret-color:#272b33;text-align:start;isolation:isolate}
.signature-visual :where(h1,h2,h3,h4,h5,h6,p,blockquote,pre,ul,ol,li){font-size:revert;font-weight:revert;color:revert;background-color:revert;margin:revert;padding:revert;line-height:revert;letter-spacing:normal;text-align:revert}
.signature-visual :where(a){color:revert;text-decoration:revert}
.signature-visual :where(table){max-width:100%}
.signature-visual :where(td,th){min-width:16px}
.signature-visual :where(img){max-width:100%;height:auto}
.signature-live-preview{color-scheme:only light;color:#272b33;background:#fff}
.thread-setup-preview{padding:14px}
.thread-setup-preview .preview-caption{margin-bottom:12px}
.conversation-preview-scroll{height:370px;max-height:60vh;overflow:auto;overscroll-behavior:contain;border:1px solid var(--line);border-radius:10px;scrollbar-width:thin;position:relative;background:var(--bg)}
.conversation-preview-scroll>.conversation-view{padding:8px;min-height:520px;--conversation-toolbar-height:50px}
.conversation-preview-scroll .conversation-toolbar{display:flex;flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding:8px;gap:6px;border-radius:8px}
.conversation-preview-scroll .conversation-toolbar>button{white-space:nowrap;flex-shrink:0;font-size:11px;padding:7px 9px}
.preview-thread-subject{font-size:15px;margin:12px 2px}
.preview-thread-message{margin:12px 0}
.preview-thread-message>.message-summary{display:flex;flex-wrap:wrap;gap:8px;padding:13px}
.preview-thread-message>.message-summary strong{font-size:12px}
.preview-thread-message>.message-summary span{font-size:11px}
.preview-thread-body{padding:10px 13px;font-size:12px;line-height:1.7;min-height:165px}
.setup-preview-host:has(.thread-setup-preview){display:flex;flex-direction:column;gap:16px}
@media(max-width:650px){.rich-signature .signature-tools select{max-width:100%;flex:1 1 125px}.signature-image-settings{align-items:stretch}.conversation-preview-scroll{height:330px}.signature-image-settings>label{max-width:100%}}

/* The interactive preview must not flash on every preference change. */
.thread-setup-preview .message-card{animation:none;opacity:1}
.thread-setup-preview>p{margin:10px 0;line-height:1.6}

/* v1.4: compact, accessible compose editor and clear unread mail status. */
.compose-panel:not(.inline-compose):not(.compose-maximized){height:min(930px,calc(100dvh - 101px));min-height:min(475px,calc(100dvh - 101px))}
.compose-panel .recipient{min-height:33px;padding:0 12px;gap:8px}
.compose-panel .recipient input,.compose-panel .recipient select{padding:5px 0}
.compose-panel .recipient-token-box{padding:2px 0;gap:3px}
.compose-panel .recipient-chip{height:23px}
.compose-panel .recipient-chip-remove{height:23px}
.compose-panel .recipient-chip-label{padding-top:2px;padding-bottom:2px}
.compose-panel [data-compose="compose-subject"]{padding:9px 12px}
.compose-panel .editor-toolbar{padding:3px 9px;gap:4px}
.compose-panel .editor-toolbar button{padding:4px 6px}
.compose-panel .rich-editor{padding:13px 15px;line-height:1.45;min-height:130px}
.rich-editor > p,.rich-editor > div:not([data-reply-context]){margin:0;line-height:1.45}
.rich-editor :where(p){margin-top:0;margin-bottom:.15em;line-height:1.45}
.compose-panel .signature-line{padding:5px 12px}
.compose-panel .compose-drop-hint{display:none}
.compose-panel .compose-footer{padding:9px 12px;gap:7px}
.compose-panel .attachments:not(:has(.attachment)){display:none}
.composer-focus{padding:5px 8px;background:transparent;color:#e6ebf4;font-size:10px;border-radius:6px;white-space:nowrap}
.composer-focus:hover{background:#ffffff25}
.compose-focus-mode #copy-fields,.compose-focus-mode .recipient,.compose-focus-mode .signature-line,.compose-focus-mode .attachments{display:none!important}
.compose-focus-mode .rich-editor{min-height:220px}
.label-picker-options{max-height:310px;overflow:auto;display:grid;gap:4px}
.label-picker-option{display:flex;align-items:center;gap:11px;padding:9px 10px;border:1px solid var(--line);border-radius:9px;cursor:pointer}
.label-picker-option:hover,.label-picker-option:focus-within{background:var(--soft)}
.label-picker-option input{accent-color:var(--accent);width:17px;height:17px;flex-shrink:0}
.label-picker input[type=search]{width:100%;padding:10px;border:1px solid var(--line);border-radius:9px}
.color-apply{border:1px solid var(--line)!important;font-weight:600!important}
.color-presets{display:flex;gap:4px;align-items:center}
.editor-toolbar .color-preset{border:1px solid #78808c!important;background:var(--swatch)!important;width:17px;height:17px;min-width:17px;min-height:17px;border-radius:50%;padding:0}
.editor-toolbar .color-preset:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.filter-labels{border:1px solid var(--line);border-radius:10px;display:flex;flex-wrap:wrap;gap:9px;padding:12px}
.filter-labels legend{font-size:12px;font-weight:650;padding:0 5px}
.filter-labels .check{margin:0 12px 4px 0}
.message-card.is-unread-message{border-left:4px solid var(--accent)}
.message-card.is-unread-message>.message-summary .message-sender{font-weight:800}
.message-unread-label{font-size:10px;font-weight:700;background:var(--soft);color:var(--accent-text);padding:4px 7px;border-radius:9px;white-space:nowrap}
.message-time-account{gap:7px;align-items:center}
@media(max-width:650px){.compose-panel:not(.inline-compose):not(.compose-maximized){min-height:0;height:auto}.compose-panel .composer-focus{font-size:10px;padding:4px}.color-presets{flex-wrap:wrap}}

/* v1.4.2: visible-but-gentle unread presence and Facebook-style chat reactions. */
.chat-face.has-unread::after{
 content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--accent);
 pointer-events:none;z-index:0;animation:chat-unread-halo 2.6s ease-in-out infinite;
}
.chat-face.has-unread>.avatar,.chat-face.has-unread>img.avatar{position:relative;z-index:1}
.chat-unread-head{animation:chat-unread-float 3s ease-in-out infinite}
.chat-unread-head:hover{animation-play-state:paused}
@keyframes chat-unread-halo{
 0%,100%{opacity:.45;box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 18%,transparent)}
 50%{opacity:.95;box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 3%,transparent)}
}
@keyframes chat-unread-float{0%,100%{translate:0 0}50%{translate:0 -3px}}
.chat-message-stack{display:flex;flex-direction:column;align-items:flex-start;max-width:calc(100% - 34px);min-width:0;gap:4px}
.chat-message-row.own .chat-message-stack{align-items:flex-end}
.chat-message-stack>.chat-bubble{max-width:100%;align-self:auto;min-width:48px}
.chat-message-row:not(.own) .chat-bubble{cursor:default}
.chat-message-reaction-bar{display:flex;align-items:center;gap:5px;min-height:26px;max-width:100%;flex-wrap:wrap}
.chat-message-row.own .chat-message-reaction-bar{justify-content:flex-end}
.chat-reaction-chips{display:flex;flex-wrap:wrap;gap:4px}
.chat-reaction-chip{
 display:inline-flex;align-items:center;gap:4px;justify-content:center;min-height:24px;
 padding:2px 7px;border-radius:15px;border:1px solid var(--line);background:var(--panel);
 color:var(--text);font-size:11px;font-weight:650;cursor:pointer;
}
.chat-reaction-chip:hover,.chat-reaction-chip:focus-visible{border-color:var(--accent);background:var(--soft)}
.chat-reaction-chip.mine{border-color:color-mix(in srgb,var(--accent) 60%,var(--line));background:var(--soft);color:var(--accent-text)}
.chat-reaction-emoji{font-size:14px;line-height:1}
.chat-reaction-count{font-variant-numeric:tabular-nums}
.chat-reaction-trigger.icon-button{height:25px;width:25px;min-height:25px;padding:4px;opacity:.44;border-radius:50%;background:transparent}
.chat-reaction-trigger .icon{height:14px;width:14px}
.chat-message-row:hover .chat-reaction-trigger,.chat-reaction-trigger:focus-visible{opacity:1;background:var(--soft)}
@media(hover:none){.chat-reaction-trigger.icon-button{opacity:.85;min-height:30px;width:30px}}
.chat-reaction-popover{
 position:fixed;z-index:185;width:max-content;max-width:min(316px,calc(100vw - 16px));
 padding:6px;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--text);
 box-shadow:0 14px 35px #0004;overflow:hidden;
}
.chat-reaction-quick{display:flex;align-items:center;gap:4px}
.chat-reaction-quick>.icon-button{min-width:36px;height:36px;border-radius:50%;padding:7px}
.chat-reaction-option{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-width:38px;height:38px;padding:5px;border:0;border-radius:12px;background:transparent;color:var(--text);font-size:22px;cursor:pointer}
.chat-reaction-option:hover,.chat-reaction-option:focus-visible{background:var(--soft);transform:scale(1.05)}
.chat-reaction-popover.expanded{width:296px;max-height: min(380px,calc(100dvh - 30px));display:flex;flex-direction:column}
.chat-reaction-menu-title{display:flex;align-items:center;justify-content:space-between;padding:3px 3px 7px 9px;gap:8px;font-size:12px;font-weight:700}
.chat-reaction-menu-title .icon-button{min-height:25px;width:25px;padding:4px}
.chat-reaction-search{width:100%;min-width:0;flex-shrink:0;margin:0 0 6px;padding:8px 10px;font-size:12px}
.chat-reaction-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px;min-height:0;overflow-y:auto;padding:4px}
.chat-reaction-grid .chat-reaction-option{width:100%;min-width:0;height:38px;font-size:23px}
body[data-reduced-motion=true] .chat-face.has-unread::after,body[data-reduced-motion=true] .chat-unread-head{animation:none!important}
body[data-reduced-motion=true] .chat-reaction-option{transition:none!important}
@media(prefers-reduced-motion:reduce){
 .chat-face.has-unread::after,.chat-unread-head{animation:none!important}
 .chat-reaction-option{transition:none!important;transform:none!important}
}

/* 1.4.3: approved PostOfficeMail / PostOfficeFilms lockup. Show only one
   rendering, matched to the actual application theme (not OS preference). */
.brand-lockup{display:flex;align-items:center;min-width:0;max-width:100%;text-decoration:none}
.brand-lockup .brand-logo-light,.brand-lockup .brand-logo-dark{display:block;width:100%;height:auto;max-height:none;object-fit:contain;flex-shrink:1}
.brand-lockup .brand-logo-dark{display:none}
:root[data-theme="dark"] .workspace .brand-lockup .brand-logo-light,body.dark .workspace .brand-lockup .brand-logo-light{display:none}
:root[data-theme="dark"] .workspace .brand-lockup .brand-logo-dark,body.dark .workspace .brand-lockup .brand-logo-dark{display:block}
.login .cinema .brand-lockup .brand-logo-light{display:none}
.login .cinema .brand-lockup .brand-logo-dark{display:block}
.login .cinema .brand-lockup{width:clamp(220px,24vw,320px);max-width:100%;align-self:flex-start}
.sidebar .brand-lockup{width:100%;padding:0 2px;margin-bottom:24px}
.sidebar .brand-lockup img{width:100%;height:auto}
@media(max-width:650px){.login .cinema .brand-lockup{width:min(265px,85%)}}



/* v1.4.4: writing-first composer. The inline reply grows *inside the thread*
   (the conversation's existing scroller remains the only page scrollbar).
   Maximized windows keep controls visible while the message body scrolls. */
.composer-instance .editor-toolbar{
 flex:0 0 auto;
 flex-wrap:nowrap;
 min-width:0;
 overflow-x:auto;
 overflow-y:hidden;
 overscroll-behavior-x:contain;
 scrollbar-width:thin;
}
.composer-instance .editor-toolbar>*{flex-shrink:0}
.composer-instance .editor-toolbar .color-presets{flex-wrap:nowrap}

/* An inline Reply/Reply all is allowed to flow with the email conversation.
   No scroll trap: typing long text expands the editor and scrolls the thread. */
.composer-instance.inline-compose:not(.compose-maximized){
 height:auto;
 min-height:0;
 max-height:none;
}
.composer-instance.inline-compose:not(.compose-maximized) [data-compose="compose-form"]{
 flex:0 0 auto;
 min-height:0;
 overflow:visible;
}
.composer-instance.inline-compose:not(.compose-maximized) [data-compose="compose-rich"]{
 flex:0 0 auto;
 height:auto;
 min-height:clamp(360px,64dvh,850px);
 max-height:none;
 overflow:visible;
}
.composer-instance.inline-compose:not(.compose-maximized) [data-compose="compose-source"]{
 flex:0 0 auto;
 height:auto;
 min-height:clamp(360px,64dvh,850px);
 max-height:none;
 overflow:auto;
 resize:vertical;
}

/* The maximize icon enters a near-fullscreen writing view. The existing
   "Show recipients" control can reveal the metadata without losing it. */
.composer-instance.compose-maximized{
 position:fixed!important;
 inset:8px 12px!important;
 width:auto!important;
 height:auto!important;
 min-height:0!important;
 max-height:none!important;
 max-width:none!important;
 margin:0!important;
 z-index:90!important;
 display:flex;
 flex-direction:column;
 border-radius:12px;
 box-shadow:0 0 0 100vmax #0007;
}
.composer-instance.compose-maximized [data-compose="compose-form"]{
 display:flex;
 flex:1 1 auto;
 flex-direction:column;
 min-height:0;
 overflow:hidden;
}
.composer-instance.compose-maximized [data-compose="compose-rich"],
.composer-instance.compose-maximized [data-compose="compose-source"]{
 flex:1 1 0;
 min-height:0!important;
 max-height:none!important;
 overflow:auto;
 overscroll-behavior-y:contain;
 scrollbar-gutter:stable;
}
.composer-instance.compose-maximized .compose-header,
.composer-instance.compose-maximized .recipient,
.composer-instance.compose-maximized [data-compose="copy-fields"],
.composer-instance.compose-maximized [data-compose="compose-subject"],
.composer-instance.compose-maximized .editor-toolbar,
.composer-instance.compose-maximized .signature-line,
.composer-instance.compose-maximized .attachments,
.composer-instance.compose-maximized .reply-history-toggle,
.composer-instance.compose-maximized .compose-footer{
 flex-shrink:0;
}
.composer-instance.compose-maximized .compose-footer{
 position:relative;
 z-index:1;
 background:var(--panel);
}
/* While focused, only the message, subject, formatting and send tools remain.
   Bcc/Cc and attachments remain stored in the DOM and in the draft. */
.composer-instance.compose-focus-mode .recipient,
.composer-instance.compose-focus-mode [data-compose="copy-fields"],
.composer-instance.compose-focus-mode .signature-line,
.composer-instance.compose-focus-mode .attachments,
.composer-instance.compose-focus-mode .reply-history-toggle{
 display:none!important;
}
.composer-instance.compose-focus-mode .composer-focus{
 background:#ffffff22;
 color:#fff;
}
@media(max-width:650px){
 .composer-instance.inline-compose:not(.compose-maximized) [data-compose="compose-rich"],
 .composer-instance.inline-compose:not(.compose-maximized) [data-compose="compose-source"]{
  min-height:clamp(300px,57dvh,650px);
 }
 .composer-instance.compose-maximized{
  inset:4px!important;
  border-radius:10px!important;
 }
 .composer-instance.compose-maximized .compose-footer{
  gap:5px;
  padding:6px 8px;
 }
 .composer-instance .editor-toolbar{padding:4px 6px}
}
@media(max-height:480px){
 .composer-instance.compose-maximized .compose-header{padding:5px 10px}
 .composer-instance.compose-maximized .compose-footer{padding:4px 8px}
}

/* 1.4.3 patch: independently painted sidebar. The old negative-z pseudo
   elements were behind the stacking context, so opacity and blur appeared
   ineffective. Navigation stays above both visual layers. */
.sidebar{background:transparent!important;isolation:isolate;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.sidebar::before{z-index:0;inset:-20px;pointer-events:none;background-image:var(--sidebar-wallpaper);background-position:center;background-size:cover;filter:blur(var(--sidebar-blur,0px))}
.sidebar::after{z-index:1;pointer-events:none;background:color-mix(in srgb,var(--panel) var(--sidebar-solid,100%),transparent);backdrop-filter:blur(var(--sidebar-blur,0px));-webkit-backdrop-filter:blur(var(--sidebar-blur,0px))}
.sidebar-scroll{position:relative;z-index:2}
/* Settings navigation and controls must remain legible over uploaded images,
   regardless of transparency chosen for mail rows or the independent sidebar. */
.settings-layout{align-items:start}
.settings-nav{position:relative;background:color-mix(in srgb,var(--panel) 96%,transparent);border:1px solid var(--line);border-radius:14px;padding:9px;box-shadow:0 8px 24px #00000012;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.settings-nav button.active{background:var(--soft);color:var(--accent-text);font-weight:700}
.settings-panel.card{background:var(--panel)!important;box-shadow:0 14px 40px #00000016;backdrop-filter:none;-webkit-backdrop-filter:none}
body[data-wallpaper=true] .settings-nav{background:color-mix(in srgb,var(--panel) 97%,transparent)}
body[data-wallpaper=true] .settings-panel.card{background:var(--panel)!important}
.spam-sender-add{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:13px 0}
.spam-sender-add>.field{flex:1 1 220px}
.spam-sender-add button{flex:0 0 auto}
.junk-filter-panel{padding:16px;background:var(--panel-alt);border:1px solid var(--line);border-radius:12px}
.spam-sender-list{display:flex;flex-direction:column;gap:6px}
.spam-sender-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 12px;background:var(--panel);border:1px solid var(--line);border-radius:9px}
.spam-sender-row span{min-width:0;overflow-wrap:anywhere;font-weight:550}
.junk-report-button{color:var(--danger);font-weight:650;border-color:color-mix(in srgb,var(--danger) 35%,var(--line));background:color-mix(in srgb,var(--danger) 6%,var(--panel))}
.junk-report-button:hover,.junk-report-button:focus-visible{background:color-mix(in srgb,var(--danger) 14%,var(--panel));border-color:var(--danger)}
.junk-report-button .icon{width:16px;height:16px;flex:none}
.row-actions .junk-report-icon{color:var(--danger)}
.row-actions .junk-report-icon:hover,.row-actions .junk-report-icon:focus-visible{color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,var(--panel))}
@media(max-width:650px){.settings-nav{width:100%}.spam-sender-add{align-items:stretch}.spam-sender-add button{width:100%}}
@media(prefers-reduced-transparency:reduce){.settings-nav{backdrop-filter:none!important;background:var(--panel)!important}.sidebar::after{backdrop-filter:none!important;background:var(--panel)!important}}

/* 1.4.3-spam2: positive recovery from Junk, without extra confirmation. */
.not-spam-button{color:var(--success);font-weight:650;border-color:color-mix(in srgb,var(--success) 37%,var(--line));background:color-mix(in srgb,var(--success) 7%,var(--panel))}
.not-spam-button:hover,.not-spam-button:focus-visible{background:color-mix(in srgb,var(--success) 15%,var(--panel));border-color:var(--success)}
.not-spam-button .icon{width:16px;height:16px;flex:none}
.row-actions .not-spam-icon{color:var(--success)}
.row-actions .not-spam-icon:hover,.row-actions .not-spam-icon:focus-visible{color:var(--success);background:color-mix(in srgb,var(--success) 12%,var(--panel))}

/* 1.4.3-junkfast1: sender list is above the add form; no flex-height expansion. */
.junk-filter-panel{display:flex;flex-direction:column;gap:0;min-width:0}
.spam-sender-results{order:0;margin:6px 0 14px;min-width:0}
.spam-sender-search{display:flex;align-items:center;gap:9px;max-width:450px;border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:0 12px}
.spam-sender-search>.icon{color:var(--muted);width:17px;height:17px;flex-shrink:0}
.spam-sender-search input{border:0;outline-offset:-2px;background:transparent;min-width:0;flex:1;padding:11px 3px;font-size:12px}
.spam-sender-search:focus-within{outline:2px solid color-mix(in srgb,var(--accent) 35%,transparent)}
.spam-sender-count{margin:9px 0 12px}
.spam-sender-list{gap:7px}
.spam-sender-row{min-width:0;gap:12px}
.spam-sender-row>.text-button{flex-shrink:0}
.spam-sender-pagination{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.spam-sender-pagination>span{text-align:center}
.spam-sender-create{border-top:1px solid var(--line);padding-top:16px;margin-top:5px}
.spam-sender-add{margin:0;align-items:flex-end;display:flex;flex-wrap:wrap;gap:12px}
.spam-sender-add>.field{flex:1 1 240px;min-width:0}
.spam-sender-add .field>label{flex:none!important;min-height:0;height:auto}
.spam-sender-add button{flex:none}
@media(max-width:650px){.spam-sender-pagination{flex-wrap:wrap}.spam-sender-add button{width:100%}}