:root{--bg:#f6f8fc;--surface:#fff;--soft:#eef3f8;--line:#d7e2ee;--text:#0b1424;--muted:#5f6f86;--nav:#081225;--green:#159553;--red:#c93434;--gold:#a87017;--blue:#2563eb;--purple:#6d45d9;--shadow:0 14px 38px #0f172a1a}*{box-sizing:border-box}body{background:var(--bg);height:100vh;color:var(--text);margin:0;font-family:Inter,Arial,sans-serif;overflow:hidden}button,input,textarea{font:inherit}button{cursor:pointer}.app{grid-template-rows:64px 1fr;height:100vh;display:grid}.top{grid-template-columns:260px 1fr auto;align-items:center;gap:16px;padding:8px 16px;display:grid}.brand{align-items:center;gap:14px;display:flex}.hamb{background:0 0;border:0;border-radius:999px;width:40px;height:40px;font-size:20px;font-weight:900}.hamb:hover{background:#edf3f8}.logo{background:var(--nav);color:#fff;border-radius:14px;place-items:center;width:40px;height:40px;font-weight:1000;display:grid}.brandName{letter-spacing:-.04em;font-size:22px;font-weight:800}.search{background:#edf3fb;border-radius:24px;align-items:center;gap:10px;max-width:760px;height:48px;padding:0 16px;display:flex}.search input{background:0 0;border:0;outline:0;width:100%;font-size:15px}.topRight{gap:6px;display:flex}.icon{background:0 0;border:0;border-radius:999px;width:40px;height:40px;font-weight:900}.icon:hover{background:#edf3f8}.profile{background:var(--nav);color:#fff;border:0;border-radius:999px;width:36px;height:36px;font-weight:900}.body{grid-template-columns:260px 1fr 56px;min-height:0;display:grid}.app.navClosed .body{grid-template-columns:76px 1fr 56px}.nav{grid-template-rows:auto 1fr auto;gap:10px;padding:10px 12px;display:grid;overflow:hidden}.compose{background:var(--nav);color:#fff;height:48px;box-shadow:var(--shadow);border:0;border-radius:16px;font-weight:900}.app.navClosed .compose{width:56px;font-size:0}.app.navClosed .compose:before{content:"+";font-size:26px}.navList{overflow:auto}.navItem{height:34px;color:var(--text);text-align:left;background:0 0;border:0;border-radius:0 18px 18px 0;grid-template-columns:32px 1fr auto;align-items:center;gap:10px;width:100%;padding:0 12px;font-size:14px;font-weight:600;display:grid}.navItem:hover,.navItem.active{background:#dcecff}.navIcon{color:var(--nav);text-align:center;font-size:18px;font-weight:1000}.navCount{color:var(--muted);font-size:12px}.app.navClosed .navText,.app.navClosed .navCount,.app.navClosed .folderAdd,.app.navClosed .navFooter{display:none}.folderAdd{height:32px;color:var(--muted);text-align:left;background:0 0;border:0;padding-left:12px;font-weight:800}.navFooter{border-top:1px solid var(--line);color:var(--muted);padding-top:8px;font-size:12px;line-height:1.35}.main{background:var(--surface);border-radius:18px 18px 0 0;grid-template-rows:48px 48px 1fr;min-width:0;margin-right:8px;display:grid;overflow:hidden}.toolbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:48px;padding:0 12px;display:flex}.tools{align-items:center;gap:2px;display:flex}.tool{min-width:34px;height:34px;color:var(--muted);background:0 0;border:0;border-radius:999px;padding:0 10px;font-weight:900}.tool:hover{color:var(--text);background:#f1f5fb}.selectedTools{align-items:center;gap:2px;display:none}.selectedTools.show{display:flex}.tabs{border-bottom:1px solid var(--line);grid-template-columns:repeat(3,1fr);height:48px;display:grid}.tab{color:var(--muted);text-align:left;background:0 0;border:0;border-bottom:3px solid #0000;padding:0 18px;font-weight:800}.tab.active{color:var(--nav);border-color:var(--nav)}.mailArea{grid-template-columns:1fr;min-height:0;display:grid}.app.messageOpen .mailArea{grid-template-columns:420px 1fr}.list{overflow:auto}.row{background:#fff;border-bottom:1px solid #edf1f5;grid-template-columns:34px 34px minmax(150px,220px) minmax(0,1fr) auto;align-items:center;gap:8px;height:46px;padding:0 12px;display:grid}.row:hover{box-shadow:inset 3px 0 0 var(--nav);background:#f8fbff}.row.active{background:#eef6ff}.row.unread{font-weight:850}.check,.star{width:28px;height:28px;color:var(--muted);background:0 0;border:0;border-radius:999px;font-weight:900}.check.selected{background:var(--green);color:#fff}.sender,.subject{white-space:nowrap;text-overflow:ellipsis;font-size:14px;overflow:hidden}.preview{color:var(--muted);font-weight:400}.chips{gap:5px;margin-left:8px;display:inline-flex}.chip{background:#edf4fb;border-radius:999px;padding:2px 7px;font-size:10.5px;font-weight:800}.closed{color:#2550a8;background:#e8f0ff}.low{color:#08743b;background:#dcfce7}.high{color:#9f1d1d;background:#fee2e2}.trust{color:#3730a3;background:#eef2ff}.time{color:var(--muted);white-space:nowrap;font-size:12px;font-weight:700}.reader{border-left:1px solid var(--line);background:#fff;display:none;overflow:auto}.app.messageOpen .reader{display:block}.email{max-width:980px;margin:0 auto;padding:22px 28px 60px}.emailTop{border-bottom:1px solid var(--line);justify-content:space-between;gap:16px;padding-bottom:14px;display:flex}.email h1{letter-spacing:-.04em;margin:0 0 10px;font-size:25px}.emailActions{flex-wrap:wrap;justify-content:flex-end;align-items:start;gap:4px;display:flex}.eBtn{height:32px;color:var(--muted);background:0 0;border:0;border-radius:999px;padding:0 10px;font-weight:900}.eBtn:hover{color:var(--text);background:#f1f5fb}.eBtn.danger{color:#9f1d1d;background:#fee2e2}.secCore{border:1px solid var(--line);background:#fbfdff;border-radius:14px;margin:14px 0;overflow:hidden}.secSummary{justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;display:flex}.secTitle{font-size:14px;font-weight:850}.secTitle span{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:10px;display:block}.secChips{flex-wrap:wrap;justify-content:flex-end;gap:5px;display:flex}.secMore{border:1px solid var(--line);background:#fff;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:800}.secDetails{border-top:1px solid var(--line);grid-template-columns:repeat(4,1fr);gap:8px;padding:10px;display:none}.secCore.open .secDetails{display:grid}.secCard{border:1px solid var(--line);background:#fff;border-radius:12px;padding:9px}.secCard span{color:var(--muted);font-size:10px;font-weight:800}.secCard b{margin-top:3px;font-size:12px;display:block}.senderLine{align-items:center;gap:10px;margin:14px 0;display:flex}.avatar{color:#fff;border-radius:999px;place-items:center;width:38px;height:38px;font-weight:900;display:grid}.navy{background:#213b61}.gold{background:var(--gold)}.blue{background:var(--blue)}.red{background:var(--red)}.green{background:var(--green)}.purple{background:var(--purple)}.senderLine p{color:var(--muted);margin:2px 0;font-size:12px}.emailBody{font-size:15px;line-height:1.7}.attach{border:1px solid var(--line);background:#f6f9fd;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;margin:14px 0;padding:10px 12px;display:flex}.attach span{color:var(--muted);font-size:12px}.rightRail{align-content:start;justify-items:center;gap:10px;padding-top:12px;display:grid}.rightRail button{width:40px;height:40px;color:var(--muted);background:0 0;border:0;border-radius:999px;font-weight:900}.rightRail button:hover{background:#edf3f8}.composeWin{border:1px solid var(--line);z-index:30;background:#fff;border-radius:14px 14px 0 0;grid-template-rows:42px auto auto 1fr 42px;width:min(720px,100% - 100px);height:560px;display:grid;position:absolute;bottom:0;right:78px;overflow:hidden;box-shadow:0 24px 80px #00000047}.composeHead{background:var(--nav);color:#fff;justify-content:space-between;align-items:center;height:42px;padding:0 12px;font-weight:850;display:flex}.composeHead button{color:#fff;background:0 0;border:0;width:28px;height:28px;font-weight:900}.recips{border-bottom:1px solid var(--line);grid-template-rows:40px 40px;display:grid}.recips input{border:0;border-bottom:1px solid #edf1f5;outline:none;padding:0 12px}.editTools{border-bottom:1px solid var(--line);align-items:center;gap:2px;height:40px;padding:0 8px;display:flex;overflow:auto}.editTools button{background:0 0;border:0;border-radius:8px;min-width:30px;height:30px;font-weight:900}.editTools button:hover{background:#f1f5fb}.composeBody{resize:none;border:0;outline:none;padding:14px;font-size:14px;line-height:1.55}.composeFoot{border-top:1px solid var(--line);justify-content:space-between;align-items:center;height:42px;padding:0 8px;display:flex}.send{background:var(--nav);color:#fff;border:0;border-radius:999px;height:30px;padding:0 16px;font-weight:900}.footTools{gap:2px;display:flex}.footTools button{min-width:30px;height:30px;color:var(--muted);background:0 0;border:0;border-radius:8px;font-weight:900}.footTools button:hover{color:var(--text);background:#f1f5fb}.drawer,.mobileScrim{display:none}.senior .row{height:58px}.senior .sender,.senior .subject{font-size:16px}.senior .preview{font-size:15px}.senior .emailBody{font-size:18px}.senior .navItem{height:42px;font-size:16px}@media (width<=820px){body{height:100dvh}.app{grid-template-rows:56px 1fr;height:100dvh}.top{border-bottom:1px solid var(--line);background:#fff;grid-template-columns:auto 1fr auto;height:56px;padding:6px 10px}.brandName{font-size:18px}.search,.topRight .icon:not(.keep),.rightRail,.nav{display:none}.body{display:block}.main{border-radius:0;grid-template-rows:44px 1fr;height:100%;margin:0}.toolbar{display:none}.tabs{height:44px}.mailArea,.app.messageOpen .mailArea{height:calc(100dvh - 100px);display:block}.app.messageOpen .list{display:none}.reader{border-left:0;height:100%;display:none}.app.messageOpen .reader{display:block}.row{grid-template-columns:34px 1fr auto;gap:8px;height:68px;padding:0 10px}.row .star,.row .time{display:none}.sender,.subject{font-size:14px}.chips{margin-top:4px;margin-left:0;display:flex}.email{padding:12px 14px 72px}.emailTop{display:block}.email h1{font-size:21px}.emailActions{flex-wrap:nowrap;justify-content:flex-start;padding-top:8px;overflow:auto}.emailActions button{white-space:nowrap}.secSummary{display:block}.secChips{justify-content:flex-start;margin-top:8px}.secDetails{grid-template-columns:1fr 1fr}.composeWin{border-radius:18px;width:auto;height:calc(100dvh - 90px);bottom:8px;left:8px;right:8px}.drawer{z-index:40;background:#fff;width:85%;padding:10px;transition:all .2s;display:block;position:absolute;top:0;bottom:0;left:0;transform:translate(-105%);box-shadow:0 24px 80px #00000059}.drawer.show{transform:translate(0)}.mobileScrim.show{z-index:35;background:#0812258c;display:block;position:absolute;inset:0}.drawer .navItem{border-radius:18px;height:42px}.drawer .compose{width:100%;margin-bottom:10px}}.stateBox{border:1px solid var(--line);color:var(--muted);background:#f8fbff;border-radius:14px;gap:8px;margin:18px;padding:18px;display:grid}.stateBox b{color:var(--text)}.stateBox button{background:var(--nav);color:#fff;border:0;border-radius:999px;width:fit-content;height:32px;padding:0 14px;font-weight:800}.errorState{background:#fff7f7;border-color:#f3cccc}