:root{--navy:#183c5d;--blue:#2f6f9f;--blue2:#397eae;--accent:#3f86b8;--pale:#eaf2f8;--line:#cbd8e2;--text:#183047;--muted:#6d7f8e;--white:#fff;--hover:#e4eff7;--selected:#b8dcf5;--shadow:0 12px 35px rgba(20,54,82,.14)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%}body{font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--text);background:#eaf1f6;font-size:14px;overflow:hidden}button,input,select,textarea{font:inherit}button,a,[data-folder],[data-filter],#refresh{transition:.16s ease}button{cursor:pointer}
a{color:#286a9d;text-decoration:none}a:hover{color:#164d78}
header{height:64px;background:linear-gradient(180deg,#356f9e 0%,#24587f 100%);color:#fff;display:flex;align-items:center;gap:22px;padding:0 22px;box-shadow:0 2px 7px rgba(0,0,0,.14);position:relative;z-index:3}header strong{font-size:25px;letter-spacing:-.5px;white-space:nowrap}header span{opacity:.9;font-size:13px;white-space:nowrap}header input{margin-left:auto;width:min(380px,30vw);height:38px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.97);border-radius:5px;padding:0 14px;color:#17324a;outline:none;box-shadow:inset 0 1px 2px rgba(0,0,0,.05)}header input:focus{box-shadow:0 0 0 3px rgba(255,255,255,.18)}header>b{font-size:13px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-link{color:#fff;font-size:19px;width:34px;height:34px;display:grid;place-items:center;border-radius:5px}.header-link:hover{background:rgba(255,255,255,.12);color:#fff}
.toolbar{height:54px;background:#fff;border-bottom:1px solid var(--line);padding:8px 18px 8px 288px;display:flex;align-items:center;gap:6px;box-shadow:0 1px 3px rgba(28,58,82,.04)}.toolbar button,.toolbar a,.actions button,.attachments button{height:36px;background:#fff;border:1px solid #c8d5df;border-radius:4px;padding:0 13px;color:#173650;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-weight:600;font-size:13px}.toolbar button:hover,.toolbar a:hover,.actions button:hover,.attachments button:hover{background:#f0f6fa;border-color:#a9bfce}.primary{background:linear-gradient(#4488ba,#3172a3)!important;border-color:#2d6894!important;color:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.08)}.primary:hover{filter:brightness(.96)}
main{display:flex;height:calc(100vh - 146px);min-height:0}aside{width:270px;flex:0 0 270px;background:#f4f8fb;border-right:1px solid var(--line);padding:12px 12px 18px;overflow:auto}.add{display:flex;align-items:center;justify-content:center;width:100%;height:39px;background:linear-gradient(#4488ba,#3172a3);color:#fff!important;border-radius:4px;font-weight:700;box-shadow:0 1px 2px rgba(0,0,0,.08)}.add:hover{filter:brightness(.96)}.account{margin-top:17px}.account h3{font-size:13px;margin:0 0 7px;padding:7px 8px;color:#264b68;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.folder-list{display:flex;flex-direction:column;gap:2px}.folder-list span,.folder-list b{display:block;padding:8px 12px;border-radius:4px;cursor:pointer;font-weight:500;color:#28475f}.folder-list span:hover,.folder-list b:hover{background:#e3edf5}.folder-list b,.folder-list .active{background:#cfe3f2;color:#173e5d;font-weight:700;box-shadow:inset 3px 0 #397eae}
.workspace{flex:1;min-width:0;display:grid;grid-template-rows:43px minmax(210px,42%) minmax(220px,1fr);background:#fff}.filters{background:#fff;border-bottom:1px solid #d4dfe8;display:flex;align-items:center;gap:8px;padding:5px 14px}.filters span,.filters b{padding:7px 17px;border-radius:4px;cursor:pointer;font-size:13px}.filters b{background:#e1ebf3;color:#173f60}.filters span:hover{background:#edf4f8}#refresh{margin-left:auto;color:#376b91}.messages{background:#fff;overflow:auto;border-bottom:1px solid #c8d5df}table{border-collapse:collapse;width:100%;table-layout:fixed}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid #e0e7ec;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:36px}th{height:34px;background:#f4f7f9;color:#526a7c;font-size:12px;font-weight:700;position:sticky;top:0;z-index:1;border-bottom:1px solid #cfdbe4}th:first-child,td:first-child{width:42px;text-align:center}th:nth-child(2),td:nth-child(2){width:24%}th:nth-child(4),td:nth-child(4){width:150px}.messages tbody tr{cursor:pointer}.messages tbody tr:hover{background:#eef6fb}.messages tbody tr.selected{background:var(--selected)!important}.unread td{font-weight:700;color:#112f48}td.subject{font-weight:600}
article{background:#fff;padding:22px 26px;overflow:auto;min-height:0}article h1{font-size:25px;line-height:1.25;margin:0 0 18px;color:#173b58}.sender{display:flex;align-items:center;gap:12px;padding-bottom:15px;border-bottom:1px solid #e1e8ed}.avatar{width:48px;height:48px;flex:0 0 48px;border-radius:50%;background:linear-gradient(145deg,#7aa6cf,#4e80b0);color:#fff;display:grid;place-items:center;font-size:18px;font-weight:700;box-shadow:0 2px 5px rgba(28,69,101,.15)}.sender small{display:block;margin-top:4px;color:#718393}.actions{margin-left:auto;display:flex;gap:6px}.mail-body{max-width:1100px;padding:22px 0;line-height:1.62;color:#243a4d}.attachments{margin-top:20px;padding-top:16px;border-top:1px solid #e0e7ec}.attachments button{min-width:190px;text-align:left;margin:0 7px 7px 0}.empty,.empty-state{text-align:center;color:#748695;padding:36px}.empty-state{display:grid;place-items:center;align-content:center;height:100%}.empty-state h1{margin:0 0 8px;color:#416c8d;font-size:30px}.empty-state p{margin:0}
footer{height:28px;background:#edf3f7;border-top:1px solid #cbd7e0;padding:0 14px 0 286px;font-size:12px;color:#607487;display:flex;align-items:center;justify-content:space-between}#connection{color:#3b7752}
.modal{position:fixed;inset:0;background:rgba(18,43,64,.58);display:none;place-items:center;z-index:20;padding:20px}.modal.show{display:grid}.modal form{width:min(900px,94vw);height:min(720px,92vh);background:#fff;border-radius:8px;box-shadow:0 24px 80px rgba(0,0,0,.34);display:flex;flex-direction:column;padding:0;overflow:hidden}.modal-head{height:52px;display:flex;justify-content:space-between;align-items:center;font-size:17px;padding:0 18px;background:#f4f8fb;border-bottom:1px solid #d4dfe7}.modal-head button{font-size:26px;border:0;background:none;color:#63788a}.modal label{display:flex;align-items:center;gap:10px;border-bottom:1px solid #e0e7ec;padding:7px 16px;color:#5c7182;font-weight:600}.modal label input{flex:1;border:0;padding:7px;outline:0;color:#1d3549}.modal #editor{flex:1;margin:14px;border:1px solid #d3dfe7;border-radius:5px;padding:15px;overflow:auto;outline:0;line-height:1.55}.modal #editor:focus{border-color:#6c9fc3;box-shadow:0 0 0 3px #e8f2f8}.modal label.file{border-top:1px solid #e0e7ec;border-bottom:0}.compose-actions{display:flex;gap:8px;padding:12px 14px;background:#f6f9fb;border-top:1px solid #dce5eb}.compose-actions button{height:36px;padding:0 18px;border:1px solid #c8d5df;border-radius:4px;background:#fff;color:#24445e;font-weight:700}
.auth,.settings-page{min-height:100vh;height:auto;overflow:auto;background:linear-gradient(135deg,#e7f0f6 0%,#f7fafc 55%,#dce9f2 100%);display:grid;place-items:center;padding:42px}.auth-card,.settings-card{width:min(500px,95vw);background:#fff;border:1px solid #c9d7e2;border-radius:9px;box-shadow:var(--shadow);padding:34px}.settings-card{width:min(1050px,96vw);place-self:start center;margin:25px auto}.auth-card h1,.settings-card h1{color:#286794;font-size:30px;margin:0 0 7px}.auth-card>p{color:#708392;margin:0 0 25px}.auth-card label,.grid-form label{display:flex;flex-direction:column;gap:7px;margin:13px 0;font-weight:700;color:#39566d}.auth-card input,.grid-form input,.grid-form select,.grid-form textarea{width:100%;padding:11px 12px;border:1px solid #bdcedb;border-radius:5px;background:#fff;color:#173047;outline:none}.auth-card input:focus,.grid-form input:focus,.grid-form select:focus,.grid-form textarea:focus{border-color:#6194b8;box-shadow:0 0 0 3px #e6f1f7}.auth-card>button,.grid-form>button{padding:12px 18px;border:0;border-radius:5px;background:linear-gradient(#4488ba,#3172a3);color:#fff;font-weight:800}.auth-card>button{width:100%;margin-top:8px}.error,.success{padding:11px 13px;border-radius:5px;margin:12px 0;border:1px solid}.error{background:#fff0f0;color:#9b2b2b;border-color:#efc7c7}.success{background:#edf8ef;color:#276a37;border-color:#cbe6d1}.grid-form{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.grid-form .wide{grid-column:1/-1}.account-row{display:flex;align-items:center;gap:18px;padding:15px 12px;border-bottom:1px solid #dbe4eb;background:#f9fbfc}.account-row:first-of-type{border-radius:6px 6px 0 0}.account-row span{flex:1;color:#607386}.account-row form{margin:0}.account-row button{border:1px solid #d4baba;background:#fff;color:#9a3d3d;border-radius:4px;padding:7px 10px}.settings-card h2{margin-top:30px;color:#244b69}.settings-card>a{display:inline-block;margin-bottom:20px;font-weight:700}
@media(max-width:1100px){header span{display:none}.toolbar{padding-left:12px;overflow-x:auto}.toolbar button,.toolbar a{white-space:nowrap}aside{width:225px;flex-basis:225px}footer{padding-left:240px}.workspace{grid-template-rows:43px 40% 1fr}header input{width:280px}.actions{flex-wrap:wrap}}@media(max-width:760px){body{overflow:auto}header{height:auto;min-height:62px;flex-wrap:wrap;padding:10px 14px;gap:9px}header input{order:5;width:100%;margin-left:0}.toolbar{height:auto;padding:7px;flex-wrap:wrap}main{height:auto;min-height:calc(100vh - 150px);display:block}aside{width:100%;height:auto;border-right:0;border-bottom:1px solid var(--line)}.workspace{display:block}.filters{height:43px}.messages{height:320px}article{min-height:420px}.grid-form{grid-template-columns:1fr}footer{padding:0 12px}.settings-page,.auth{padding:18px}.account-row{align-items:flex-start;flex-wrap:wrap}.account-row span{flex-basis:100%}}

/* NovaMail visual refinement 1.1 */
:root{--nm-bg:#f4f7fa;--nm-panel:#ffffff;--nm-sidebar:#f7f9fb;--nm-blue:#2f6f9f;--nm-blue-dark:#204e73;--nm-blue-soft:#e7f1f8;--nm-ink:#19354b;--nm-muted:#7a8b98;--nm-border:#dce5eb;--nm-radius:9px;--nm-shadow:0 8px 30px rgba(25,55,78,.08)}
body{background:var(--nm-bg);font-size:13.5px;letter-spacing:.005em}
header{height:72px;padding:0 18px;background:linear-gradient(135deg,#1f4e74 0%,#2f6f9f 52%,#397dac 100%);gap:14px;box-shadow:0 4px 18px rgba(18,52,78,.18)}
.brand{display:flex;align-items:center;gap:11px;min-width:248px}.brand-mark{width:39px;height:39px;border-radius:11px;background:#fff;color:#2b6794;display:grid;place-items:center;font-size:21px;font-style:normal;font-weight:900;box-shadow:0 4px 12px rgba(0,0,0,.16)}.brand>div{display:flex;flex-direction:column}.brand strong{font-size:21px;line-height:1.05;letter-spacing:-.4px}.brand span{font-size:10.5px;margin-top:4px;opacity:.72;letter-spacing:.03em}
.search-wrap{margin-left:auto;width:min(480px,36vw);height:40px;background:rgba(255,255,255,.98);border:1px solid rgba(255,255,255,.45);border-radius:9px;display:flex;align-items:center;padding:0 10px;box-shadow:0 4px 16px rgba(10,38,59,.12)}.search-wrap>span{font-size:20px;color:#698295;transform:rotate(-15deg)}.search-wrap input{width:100%!important;height:100%!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:0 9px!important}.search-wrap kbd{white-space:nowrap;border:1px solid #d6e0e7;background:#f2f5f7;color:#82909b;border-radius:5px;padding:3px 6px;font:10px/1.2 inherit}.user-chip{display:flex;align-items:center;gap:8px;max-width:190px;margin-left:5px}.user-chip i{width:31px;height:31px;border-radius:50%;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);display:grid;place-items:center;font-style:normal;font-weight:800}.user-chip b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.header-link{border:1px solid transparent}.header-link:hover{border-color:rgba(255,255,255,.12)}
.toolbar{height:58px;padding:9px 16px 9px 286px;background:rgba(255,255,255,.97);gap:5px;box-shadow:0 2px 10px rgba(24,58,84,.05);position:relative;z-index:2}.toolbar button,.toolbar a{height:38px;border-color:transparent;background:transparent;border-radius:7px;padding:0 11px;color:#405d72;font-weight:650}.toolbar button:hover,.toolbar a:hover{background:#eef4f8;border-color:#e0e9ef}.toolbar .compose-btn{padding:0 18px!important;border-radius:8px!important;box-shadow:0 5px 14px rgba(47,111,159,.22)}.compose-btn>span{font-size:19px}.tool-sep{height:25px;width:1px;background:#e0e7ec;margin:0 4px}.toolbar-spacer{flex:1}
main{height:calc(100vh - 158px);background:#fff}aside{width:270px;flex-basis:270px;background:var(--nm-sidebar);padding:14px 12px 20px;border-right:1px solid #e1e8ed}.add{height:42px;border-radius:8px;background:#fff!important;color:#326e9a!important;border:1px dashed #b8ccda;box-shadow:none}.add:hover{background:#edf5fa!important;border-style:solid}.account{margin-top:18px}.account h3{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#7a8d9b;padding:7px 11px;margin-bottom:3px}.folder-list{gap:3px}.folder-list span,.folder-list b{padding:9px 12px;border-radius:7px;font-size:13px}.folder-list b,.folder-list .active{background:#e1edf6;color:#225b84;box-shadow:none;position:relative}.folder-list b:before,.folder-list .active:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;background:#347cac}
.workspace{grid-template-rows:50px minmax(210px,43%) minmax(220px,1fr)}.filters{height:50px;padding:6px 16px;gap:4px;background:#fbfcfd}.mailbox-title{display:flex;align-items:baseline;gap:7px;margin-right:15px;padding-right:15px;border-right:1px solid #e2e9ee}.mailbox-title strong{font-size:15px;color:#203e54}.mailbox-title small{font-size:10px;color:#91a0aa}.filters span,.filters b{padding:7px 12px;border-radius:7px}.filters b{background:#e5f0f7;color:#28658f}.messages{background:#fff}.messages table{font-size:13px}th{background:#f8fafb;height:37px;color:#81909b;text-transform:uppercase;font-size:10px;letter-spacing:.055em;padding-top:9px;padding-bottom:9px}td{height:40px;border-bottom-color:#edf1f4}.messages tbody tr{transition:background .12s}.messages tbody tr:hover{background:#f3f8fb}.messages tbody tr.selected{background:#dcecf7!important;box-shadow:inset 3px 0 #397eae}.unread td{color:#173a54}.unread td:nth-child(2):before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#3e86b8;margin-right:7px;vertical-align:2px}
article{padding:25px 32px;background:#fff}article h1{font-size:24px;letter-spacing:-.3px}.sender{padding-bottom:17px}.avatar{width:44px;height:44px;flex-basis:44px;background:linear-gradient(145deg,#4e91c1,#286795);box-shadow:0 4px 12px rgba(35,91,132,.18)}.actions button{border-radius:7px;border-color:#dbe5eb;background:#fff}.mail-body{font-size:14px;line-height:1.7;color:#30495b}.attachments button{border-radius:8px;background:#f8fafc;border-color:#dce5eb;min-width:205px}
footer{height:28px;background:#f7f9fb;border-color:#e0e7ec;padding-left:286px;color:#80909c}#connection{display:flex;align-items:center;gap:5px}#connection:before{content:"";width:6px;height:6px;border-radius:50%;background:#55a26b;box-shadow:0 0 0 3px #e2f1e6}
.modal{backdrop-filter:blur(3px);background:rgba(17,42,61,.48)}.modal form{border-radius:12px;box-shadow:0 30px 90px rgba(8,31,48,.34)}.modal-head{height:56px;background:#f8fafc}.modal #editor{border-radius:8px}.compose-actions{padding:13px 16px}.compose-actions button{border-radius:7px}
.auth-card,.settings-card{border:1px solid rgba(190,207,219,.8);border-radius:13px;box-shadow:0 20px 60px rgba(25,58,82,.12)}.auth-card h1,.settings-card h1{letter-spacing:-.6px}.auth-card input,.grid-form input,.grid-form select,.grid-form textarea{border-radius:7px;background:#fbfcfd}.account-row{border-radius:7px;margin:6px 0;border:1px solid #e0e8ee;background:#fbfcfd}.settings-card h2{border-bottom:1px solid #e3eaef;padding-bottom:10px}
@media(max-width:1100px){.brand{min-width:auto}.brand span{display:none}.toolbar{padding-left:12px}.user-chip b{display:none}.search-wrap{width:min(400px,38vw)}aside{width:225px;flex-basis:225px}footer{padding-left:240px}}

/* NovaMail visual refinement 1.2 — desktop mail client */
:root{--nm-blue:#286b9b;--nm-blue-deep:#183f60;--nm-blue-light:#eaf4fb;--nm-border:#dbe4ea;--nm-soft:#f7f9fb;--nm-shadow:0 10px 35px rgba(23,58,82,.10)}
body{font-family:"Segoe UI Variable","Segoe UI",Inter,Arial,sans-serif;background:#eef3f6}
header{background:linear-gradient(110deg,#173f60 0%,#255f8a 48%,#347da9 100%);border-bottom:1px solid rgba(0,0,0,.12)}
.brand-mark{border-radius:10px;background:linear-gradient(145deg,#fff,#e8f2f8);box-shadow:0 5px 16px rgba(0,0,0,.18)}
.search-wrap{border-radius:8px;background:#fff;box-shadow:0 3px 14px rgba(8,35,55,.16)}.search-icon{font-size:18px!important;color:#718999!important}.search-wrap:focus-within{box-shadow:0 0 0 3px rgba(181,220,246,.30),0 4px 18px rgba(8,35,55,.18)}
.user-chip{padding:5px 9px 5px 5px;border-radius:22px}.user-chip:hover{background:rgba(255,255,255,.08)}
.toolbar{border-bottom:1px solid #d9e3e9}.toolbar button,.toolbar a{font-size:12.5px}.toolbar .compose-btn{background:linear-gradient(180deg,#3c86b8,#2b6d9d)!important}.toolbar .compose-btn:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(47,111,159,.26)}
aside{box-shadow:inset -1px 0 #fff}.account h3{cursor:pointer}.account h3:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#57a46c;margin-right:7px;box-shadow:0 0 0 3px #e6f2e9}.folder-list span,.folder-list b{display:flex;align-items:center;min-height:36px}.folder-list span:hover{transform:translateX(1px)}
.workspace{box-shadow:-8px 0 30px rgba(29,61,83,.025)}.filters{border-bottom-color:#e0e7ec}.filters [data-filter]{font-weight:600}.filters [data-filter]:hover{color:#235f8b}.list-head{height:32px;background:#f8fafb;border-bottom:1px solid #e1e8ed;display:flex;align-items:center;justify-content:space-between;padding:0 10px 0 14px;color:#8a99a4;font-size:10px;text-transform:uppercase;letter-spacing:.055em}.list-head button{width:28px;height:24px;border:0;background:transparent;border-radius:5px;color:#6e8291;cursor:pointer}.list-head button:hover{background:#eaf1f5;color:#2d688f}
.workspace{grid-template-rows:50px 32px minmax(190px,40%) minmax(220px,1fr)}
.messages tbody tr{position:relative}.messages tbody tr td:first-child{color:#a0adb6;font-size:16px}.messages tbody tr td:first-child:hover{color:#d79b2c}.messages tbody tr.selected td:first-child{color:#b57d18}.messages tbody tr.selected{background:linear-gradient(90deg,#d7ebf8,#e8f4fb)!important}.messages tbody tr.selected:after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#347cac}.messages tbody tr.unread td:nth-child(3){font-weight:700}.messages tbody tr:not(.unread) td{color:#587080}.messages tbody tr:not(.unread) td.subject{font-weight:500}
.reader{background:linear-gradient(180deg,#fff 0,#fff 92%,#fbfcfd 100%)}article h1{font-size:23px;max-width:1050px}.sender>div:nth-child(2){min-width:0}.sender>div:nth-child(2) b{font-size:13.5px}.sender small{line-height:1.45}.mail-body{max-width:980px}.mail-body img{max-width:100%;height:auto}.mail-body blockquote{border-left:3px solid #cbdbe6;margin-left:0;padding-left:16px;color:#667b8a}.attachments{display:flex;flex-wrap:wrap;gap:8px}.attachments button{margin:0;min-height:54px;justify-content:flex-start;padding:8px 13px;box-shadow:0 1px 2px rgba(20,50,72,.04)}
.empty-state:before{content:"✉";width:74px;height:74px;border-radius:22px;background:#edf5fa;color:#5d8dab;display:grid;place-items:center;font-size:34px;margin-bottom:16px;box-shadow:inset 0 0 0 1px #dceaf3}.empty-state h1{font-size:25px}
.context-menu{position:fixed;display:none;z-index:80;width:190px;padding:6px;background:#fff;border:1px solid #d6e1e8;border-radius:9px;box-shadow:0 16px 45px rgba(14,42,61,.22)}.context-menu.show{display:block}.context-menu button{width:100%;height:33px;border:0;background:transparent;text-align:left;border-radius:6px;padding:0 10px;color:#29495f;cursor:pointer}.context-menu button:hover{background:#eef5f9}.context-menu hr{border:0;border-top:1px solid #e6ecef;margin:5px 2px}.context-menu .danger{color:#a54040}.toast{position:fixed;right:22px;bottom:42px;z-index:100;background:#173f60;color:#fff;padding:10px 15px;border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.2);opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}
.modal form{border:1px solid rgba(255,255,255,.6)}.modal-head b:before{content:"✎";margin-right:8px;color:#397ba7}.modal label{min-height:43px}.modal label:focus-within{background:#fbfdfe}.modal #editor{font-size:14px;background:#fff}.modal label.file{background:#fafcfd}.compose-actions .primary{min-width:96px}
@media(max-width:1100px){.workspace{grid-template-rows:50px 32px minmax(190px,40%) 1fr}.list-head{display:flex}}