:root{--navy:#0d2b3c;--navy2:#163d52;--bg:#f4f6f8;--paper:#fff;--line:#e1e7eb;--muted:#70808a;--red:#a31f2b;--green:#197052;--shadow:0 12px 35px rgba(16,38,52,.07)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:#172630}button,input,textarea{font:inherit}button{cursor:pointer}.app{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100vh}.rail{position:fixed;left:0;top:0;bottom:0;width:236px;background:var(--navy);color:#d7e3e9;padding:18px 13px;z-index:30;display:flex;flex-direction:column}.brand-block{display:flex;align-items:center;gap:10px}.rail .brand-block{padding:4px 6px 20px;border-bottom:1px solid #ffffff14}.logo{width:38px;height:38px;border-radius:10px;background:#fff;color:var(--red);display:grid;place-items:center;font-weight:900}.brand-block strong,.brand-block small{display:block}.brand-block strong{font-size:13px}.brand-block small{font-size:8px;color:#91a8b5;margin-top:3px}.compose{margin:17px 4px;background:var(--red);color:#fff;border:0;border-radius:9px;padding:11px 12px;font-size:10px;font-weight:850;text-align:left}.rail nav{display:grid;gap:2px}.rail nav a{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:6px;padding:9px 9px;color:#bdcdd6;text-decoration:none;border-radius:8px;font-size:10px}.rail nav a.active{background:#fff;color:var(--navy);font-weight:800}.nav-icon{font-size:7px;font-weight:900;opacity:.75}.rail nav em{font-style:normal;background:#ffffff18;border-radius:999px;padding:3px 6px;font-size:7px}.rail nav a.active em{background:#e8eef1}.rail-foot{margin-top:auto;padding:12px 8px;border-top:1px solid #ffffff14}.rail-foot a{color:#a9bcc7;text-decoration:none;font-size:9px}.mail-main{grid-column:2;min-width:0}.top{height:64px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px;padding:9px 20px;position:sticky;top:0;z-index:20}.search{display:flex;align-items:center;background:#f0f3f5;border-radius:9px;padding:0 8px;width:min(560px,100%);margin-right:auto}.search span{color:#7c8b94}.search input{border:0;background:transparent;outline:0;padding:9px;width:100%;font-size:10px}.search button{border:0;background:transparent;color:#52636e;font-size:9px;font-weight:800}.account{display:flex;align-items:center;gap:9px}.account div{text-align:right}.account strong,.account small{display:block}.account strong{font-size:10px}.account small{font-size:8px;color:var(--muted)}.avatar{width:34px;height:34px;border-radius:9px;background:#e9eef1;display:grid;place-items:center;font-weight:900}.mobile-menu{display:none}.mail-grid{display:grid;grid-template-columns:minmax(340px,.42fr) minmax(0,.58fr);height:calc(100vh - 64px)}.list-pane{background:#fff;border-right:1px solid var(--line);min-width:0;overflow:auto}.pane-title{padding:19px 18px 12px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:3}.pane-title span{font-size:7px;letter-spacing:.14em;font-weight:900;color:#93a0a7}.pane-title h1{font-size:22px;margin:4px 0 0}.pane-title small{font-size:8px;color:var(--muted)}.message-list{padding:6px}.message-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;padding:12px;border-radius:9px;text-decoration:none;color:#283842;position:relative}.message-row:hover{background:#f5f7f8}.message-row.selected{background:#edf3f6}.message-row.unread{background:#f3f7f9}.message-row.unread strong,.message-row.unread .sender{font-weight:900}.sender{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.message-row strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;grid-column:1}.message-row time{font-size:7px;color:#8b989f;grid-column:2;grid-row:1}.message-row i{position:absolute;right:10px;bottom:11px;color:#c48b1d;font-style:normal}.reader-pane{overflow:auto;min-width:0;background:#fff}.reader-empty{height:100%;display:grid;place-content:center;text-align:center;color:#86949d}.reader-empty>span{font-size:44px;opacity:.35}.reader-empty strong{font-size:13px;margin-top:8px}.reader-empty p{font-size:9px}.reader-head{padding:22px 26px;border-bottom:1px solid var(--line)}.reader-actions{display:flex;gap:6px;flex-wrap:wrap}.reader-actions form{display:inline}.reader-actions button{border:1px solid var(--line);background:#fff;border-radius:7px;padding:6px 8px;font-size:8px;font-weight:800}.reader-actions .danger{color:#9c3030}.reader-head h2{font-size:23px;margin:18px 0 10px}.message-meta{display:grid;gap:3px}.message-meta b{font-size:9px}.message-meta span,.message-meta time{font-size:8px;color:var(--muted)}.message-body{padding:26px;line-height:1.65;font-size:11px;overflow-wrap:anywhere}.notice,.alert{margin:10px 14px 0;padding:10px 12px;border-radius:8px;font-size:9px}.notice{background:#eaf6ef;color:#17644a}.alert{background:#fff0f0;color:#9b3030}.empty-state{display:grid;place-items:center;padding:50px 20px;text-align:center}.empty-state strong{font-size:11px}.empty-state span{font-size:8px;color:var(--muted);margin-top:4px}dialog{border:0;border-radius:14px;padding:0;width:min(720px,calc(100% - 22px));box-shadow:0 30px 100px #071b2855}dialog::backdrop{background:#07192399;backdrop-filter:blur(4px)}.compose-form header{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.compose-form header span,.compose-form header strong{display:block}.compose-form header span{font-size:7px;color:#8b989f;font-weight:900;letter-spacing:.13em}.compose-form header strong{font-size:14px;margin-top:3px}.compose-form header button{border:0;background:#edf1f3;border-radius:7px;width:30px;height:30px}.compose-fields{padding:16px}.compose-fields label{display:grid;gap:5px;font-size:8px;color:#697983;font-weight:800;margin-bottom:10px}.compose-fields input,.compose-fields textarea{width:100%;border:1px solid #d8e0e5;border-radius:8px;padding:9px;outline:0}.cc-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}.compose-form footer{display:flex;gap:7px;padding:12px 16px;border-top:1px solid var(--line)}.compose-form footer button,.primary{border:0;border-radius:8px;padding:9px 13px;font-size:9px;font-weight:850}.primary{background:var(--red);color:#fff}.soft{background:#edf1f3;color:#304754}.attachment input{background:#f8fafb}.login-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#0d2b3c,#17445b);padding:20px}.login-card{width:min(430px,100%);background:#fff;border-radius:20px;padding:28px;box-shadow:0 35px 120px #06172366}.login-card .brand-block small{color:var(--muted)}.login-copy{margin:28px 0 18px}.login-copy>span{font-size:7px;letter-spacing:.15em;font-weight:900;color:#8d9aa2}.login-copy h1{font-size:30px;line-height:1.05;margin:7px 0}.login-copy p{font-size:9px;color:var(--muted);line-height:1.6}.login-card label{display:grid;gap:5px;font-size:8px;font-weight:800;margin:11px 0}.login-card input{border:1px solid #d8e0e5;border-radius:8px;padding:10px}.login-card .primary{width:100%;margin-top:4px}@media(max-width:980px){.mail-grid{grid-template-columns:minmax(300px,.48fr) minmax(0,.52fr)}}@media(max-width:760px){.app{display:block}.rail{transform:translateX(-105%);transition:.2s;width:min(82vw,260px)}.rail.open{transform:translateX(0)}.mail-main{grid-column:auto}.mobile-menu{display:block;border:0;background:#edf1f3;border-radius:8px;width:34px;height:34px}.top{padding:8px 10px}.account div{display:none}.mail-grid{display:block;height:auto}.list-pane{border-right:0;min-height:calc(100vh - 64px)}.reader-pane{display:none}.mail-grid.reading .list-pane{display:none}.mail-grid.reading .reader-pane{display:block;min-height:calc(100vh - 64px)}.cc-row{grid-template-columns:1fr}.reader-head,.message-body{padding:18px 14px}.search{min-width:0}}
.rail-settings{width:100%;border:0;background:#ffffff10;color:#c8d7df;border-radius:8px;padding:9px;text-align:left;font-size:9px;font-weight:800;margin-bottom:7px}.compose-editor{min-height:190px;background:#fff}.message-field .ql-toolbar,.settings-form .ql-toolbar{border-color:#d8e0e5;border-radius:8px 8px 0 0}.message-field .ql-container,.settings-form .ql-container{border-color:#d8e0e5;border-radius:0 0 8px 8px}.settings-form small{font-size:8px;color:var(--muted);line-height:1.5}