:root{--bg:#f3f6fb;--panel:#fff;--line:#e5eaf2;--text:#132036;--muted:#708097;--nav:#0b1525;--nav2:#111f33;--accent:#4f6df5;--accent2:#eef1ff;--ok:#15946d;--shadow:0 16px 50px rgba(24,38,70,.12)}*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}button,input{font:inherit}.app-shell{display:flex;height:100vh;overflow:hidden}.sidebar{width:260px;background:linear-gradient(180deg,var(--nav),#0c1829);color:#dbe5f3;padding:22px 16px 16px;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;padding:0 8px 22px}.brand-mark{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-weight:800;background:linear-gradient(135deg,#627cf6,#8a67ef);color:white}.brand strong,.brand span{display:block}.brand strong{color:white}.brand span{font-size:12px;color:#8595ae;margin-top:2px}.compose{border:0;background:#fff;color:#12213a;font-weight:700;border-radius:12px;padding:12px 16px;text-align:left;margin:2px 2px 22px;cursor:pointer}.nav-title{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#6f809a;padding:10px 10px 7px;font-weight:800}.nav{display:flex;flex-direction:column;gap:3px}.nav a{color:#b9c6d8;text-decoration:none;display:grid;grid-template-columns:24px 1fr auto;align-items:center;padding:9px 10px;border-radius:9px;font-size:13px}.nav a:hover,.nav a.active{background:var(--nav2);color:white}.nav a em{font-style:normal;background:#24344d;border-radius:12px;min-width:22px;padding:2px 7px;text-align:center;font-size:11px}.nav.muted a{color:#94a4ba}.sidebar-footer{margin-top:auto;border-top:1px solid #1c2a3d;padding:16px 9px 3px;display:flex;align-items:center;gap:8px;font-size:12px;color:#8da0b8}.status-dot{width:8px;height:8px;border-radius:50%;background:#2ac993;box-shadow:0 0 0 4px rgba(42,201,147,.11)}.workspace{flex:1;min-width:0;display:flex;flex-direction:column}.topbar{height:72px;background:rgba(255,255,255,.95);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px;gap:20px}.mobile-brand{display:none;font-weight:800}.search{max-width:560px;flex:1;background:#f2f5f9;border:1px solid #e6ebf2;border-radius:11px;display:flex;align-items:center;gap:10px;padding:0 13px}.search input{width:100%;height:39px;background:transparent;border:0;outline:none;color:var(--text)}.top-actions{margin-left:auto;display:flex;align-items:center;gap:9px}.lang,.icon-btn{height:38px;min-width:38px;border:1px solid var(--line);background:white;border-radius:10px;color:#3b4a62;text-decoration:none;display:grid;place-items:center}.profile{border:0;background:transparent;display:flex;gap:10px;align-items:center;text-align:left;cursor:pointer}.profile>span{width:38px;height:38px;border-radius:11px;background:#17243a;color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800}.profile strong,.profile small{display:block}.profile small{color:var(--muted);margin-top:2px}.mail-grid{display:grid;grid-template-columns:minmax(330px,420px) 1fr;min-height:0;flex:1}.message-list-panel{background:#fbfcfe;border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}.panel-head{height:86px;padding:18px 20px 13px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.panel-head h1{margin:0;font-size:21px}.panel-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.panel-tools button,.reader-toolbar button{border:1px solid var(--line);background:white;border-radius:9px;width:34px;height:34px;margin-left:5px;cursor:pointer}.account-switcher{margin:12px 14px;padding:10px 11px;border:1px solid var(--line);background:#fff;border-radius:12px;display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center}.avatar,.sender-avatar{border-radius:10px;background:#edf0ff;color:#4255c7;display:grid;place-items:center;font-weight:800}.avatar.sm{width:34px;height:34px}.account-switcher strong,.account-switcher span{display:block;font-size:12px}.account-switcher span{font-size:10px;color:var(--muted);margin-top:2px}.account-switcher button{border:0;background:transparent;color:var(--muted)}.mail-list{overflow:auto;padding:0 8px 16px}.mail-item{width:100%;display:grid;grid-template-columns:42px 1fr;gap:11px;text-align:left;border:0;background:transparent;border-bottom:1px solid #edf0f4;padding:14px 10px;cursor:pointer;border-radius:10px}.mail-item:hover{background:#f3f6fb}.mail-item.selected{background:#edf1ff}.sender-avatar{width:40px;height:40px}.sender-avatar.lg{width:46px;height:46px;border-radius:13px}.mail-copy{min-width:0}.mail-copy>*{display:block}.mail-row{display:flex;align-items:center;gap:8px}.mail-row strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mail-row time{margin-left:auto;font-size:10px;color:var(--muted)}.mail-copy>b{font-size:12px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mail-copy>span:last-child{font-size:11px;color:var(--muted);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mail-item.unread .mail-row strong,.mail-item.unread .mail-copy>b{font-weight:800}.reader{background:#fff;min-width:0;display:flex;flex-direction:column}.reader-toolbar{height:57px;border-bottom:1px solid var(--line);padding:11px 19px;display:flex;justify-content:space-between}.reader-content{padding:26px 34px 60px;overflow:auto;max-width:1050px;width:100%;margin:0 auto}.message-meta{display:grid;grid-template-columns:46px 1fr auto;gap:14px;align-items:start}.message-meta h2{margin:0 0 9px;font-size:23px}.message-meta p{margin:3px 0;font-size:12px;color:var(--muted)}.message-meta time{font-size:11px;color:var(--muted)}.security-card{margin:24px 0;border:1px solid #d8eee7;background:#f4fbf8;border-radius:13px;padding:13px 15px;display:flex;align-items:center;justify-content:space-between}.security-card>div{display:flex;gap:11px;align-items:center}.shield{width:34px;height:34px;border-radius:10px;background:#ddf6ec;color:var(--ok);display:grid;place-items:center;font-weight:900}.security-card strong{font-size:12px}.security-card p{margin:3px 0 0;font-size:11px;color:#5b7b70}.security-card button{border:0;background:transparent;color:#287b65;font-weight:700;font-size:11px;cursor:pointer}.message-body{font-size:14px;line-height:1.75;color:#334156;max-width:760px}.reply-actions{display:flex;gap:8px;margin-top:28px}.reply-actions button{border:1px solid var(--line);background:white;padding:9px 13px;border-radius:9px;font-weight:700;color:#40516a;cursor:pointer}.modal-backdrop{position:fixed;inset:0;background:rgba(8,18,33,.42);z-index:20;display:grid;place-items:end center;padding:30px}.modal-backdrop[hidden]{display:none}.compose-modal{width:min(720px,calc(100vw - 40px));background:#fff;border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.compose-modal header{padding:16px 18px;background:#101d31;color:#fff;display:flex;justify-content:space-between;align-items:center}.compose-modal header strong,.compose-modal header span{display:block}.compose-modal header span{font-size:11px;color:#8fa0b9;margin-top:3px}.compose-modal header button{background:transparent;color:#fff;border:0;font-size:24px}.compose-fields input{display:block;width:100%;border:0;border-bottom:1px solid var(--line);padding:13px 17px;outline:none}.editor{min-height:260px;padding:18px;outline:none}.editor:empty:before{content:attr(data-placeholder);color:#9aa6b8}.compose-modal footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:12px 14px}.compose-modal footer button{border:0;background:#f1f4f8;border-radius:9px;padding:9px 12px}.compose-modal footer .send{background:var(--accent);color:#fff;font-weight:800;padding:9px 20px}@media(max-width:900px){.sidebar{width:82px;padding:18px 10px}.brand>div:last-child,.compose,.nav-title,.nav a b,.nav a:not(.active){font-size:0}.brand{justify-content:center;padding-left:0;padding-right:0}.nav a{grid-template-columns:1fr;padding:11px;text-align:center}.nav a span{font-size:16px}.nav a em,.sidebar-footer span{display:none}.sidebar-footer{justify-content:center}.mail-grid{grid-template-columns:320px 1fr}.topbar{padding:0 14px}.profile div{display:none}}@media(max-width:700px){.sidebar{display:none}.mobile-brand{display:block}.search{display:none}.mail-grid{grid-template-columns:1fr}.reader{display:none}.profile div{display:none}.topbar{height:62px}.panel-head{height:78px}}