:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif;color:#172f3c;background:#f4f7f8;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}.hidden{display:none!important}
.app{min-height:100vh;min-height:100dvh}.topbar{height:66px;display:flex;align-items:center;gap:18px;padding:0 26px;background:#17384b;color:white;box-shadow:0 2px 12px #122b3a20}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:750;letter-spacing:-.5px}.brand-mark{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:#e3f4ef;color:#158875;font-size:28px}.brand-mark.small{width:34px;height:34px;border-radius:10px;font-size:20px}.top-address{margin-left:auto;font-size:13px;color:#bdd3da}.icon-button{border:0;background:transparent;color:inherit;font-size:24px;line-height:1;padding:8px;border-radius:8px}.icon-button:hover{background:#ffffff22}.menu-button{display:none}
.layout{display:flex;min-height:calc(100vh - 66px);min-height:calc(100dvh - 66px)}.sidebar{width:230px;flex:none;background:#eaf1f1;border-right:1px solid #d8e4e5;padding:22px 13px;display:flex;flex-direction:column}.compose-button,.primary{background:#168b77;color:white;border:0;border-radius:11px;font-weight:650;padding:12px 17px;box-shadow:0 3px 10px #157e6a24}.compose-button{width:100%;text-align:left;font-size:15px;margin-bottom:28px}.compose-button:hover,.primary:hover{background:#0f7766}.folder-button{display:flex;align-items:center;justify-content:space-between;width:100%;background:transparent;border:0;border-radius:10px;color:#37525f;padding:10px 12px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.folder-button:hover{background:#dce9e8}.folder-button.active{background:white;color:#0b7563;font-weight:700;box-shadow:0 2px 6px #153b3b0c}.folder-icon{display:inline-block;width:25px}.sidebar-footer{margin-top:auto;color:#78909b;font-size:11px;padding:12px}
.main{display:grid;grid-template-columns:minmax(300px,390px) minmax(0,1fr);flex:1;min-width:0}.list-pane{background:white;border-right:1px solid #e4ebed;min-width:0;display:flex;flex-direction:column;height:calc(100vh - 66px);height:calc(100dvh - 66px)}.pane-header{display:flex;justify-content:space-between;align-items:end;padding:24px 22px 14px}.eyebrow{font-size:10px;color:#8aa0a8;font-weight:750;letter-spacing:1.5px}.pane-header h2{margin:3px 0 0;font-size:25px;letter-spacing:-.8px}.count{font-size:12px;color:#78909b}.search-row{padding:0 18px 15px}.search-row input{width:100%;border:1px solid #dfe8ea;border-radius:10px;padding:10px 12px;outline:none;background:#f8fafb;font-size:13px}.search-row input:focus,input:focus,textarea:focus,select:focus{border-color:#168b77;outline:2px solid #168b7722}.message-list{overflow:auto;flex:1}.mail-row{width:100%;display:block;text-align:left;border:0;border-top:1px solid #edf1f2;background:white;padding:14px 22px;color:#263d48}.mail-row:hover{background:#f5faf8}.mail-row.selected{background:#eaf7f3;border-left:3px solid #168b77;padding-left:19px}.mail-row.unread .row-from,.mail-row.unread .row-subject{font-weight:750}.row-top{display:flex;justify-content:space-between;gap:12px}.row-from{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-date{color:#80929b;font-size:11px;flex:none}.row-subject{font-size:13px;margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-preview{font-size:11px;color:#95a5ad;margin-top:4px}.pagination{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #edf1f2;padding:9px 15px;color:#92a1a8;font-size:11px}.pagination button{border:0;background:transparent;color:#527184;font-size:12px;padding:7px}
.message-pane{min-width:0;height:calc(100vh - 66px);height:calc(100dvh - 66px);overflow:auto;padding:35px min(6vw,65px);background:#fbfcfc}.empty-state{display:flex;min-height:60vh;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:#8499a2}.empty-icon{font-size:52px;color:#bbd5d3}.empty-state h3{font-size:20px;color:#415866;margin:10px 0 2px}.empty-state p{margin:0}.message-subject{font-size:29px;line-height:1.2;margin:0 0 25px;overflow-wrap:anywhere}.message-meta{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #e5ecee;padding-bottom:23px;font-size:13px}.message-meta strong{font-size:14px}.message-meta small{display:block;color:#80939d;margin-top:5px}.message-body{font-family:inherit;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.7;color:#263d48;margin:30px 0}.attachment{display:inline-block;padding:9px 12px;border:1px solid #dce7e8;border-radius:8px;color:#157e6a;text-decoration:none;font-size:12px;margin:5px 8px 0 0}.message-actions{display:flex;gap:10px}.secondary{background:white;border:1px solid #cfdfe0;border-radius:9px;padding:9px 14px;color:#287363}.status-line{padding:20px;color:#82949d;font-size:13px}
.login-screen{min-height:100vh;min-height:100dvh;display:grid;place-items:center;background:linear-gradient(140deg,#17384b,#1b6f72)}.login-card{width:min(400px,calc(100vw - 35px));background:white;border-radius:22px;padding:34px;box-shadow:0 22px 60px #09242a55}.login-card h1{font-size:28px;margin:18px 0 5px}.login-card p{color:#78909b;font-size:14px;line-height:1.45;margin:0 0 28px}.login-card label{display:block;font-size:12px;color:#586f7a;margin-bottom:8px;font-weight:650}.login-card input{display:block;width:100%;border:1px solid #d9e5e7;border-radius:10px;padding:13px;margin-bottom:15px}.login-card .primary{width:100%}.error{color:#c23e45;font-size:12px;min-height:16px}
.modal{position:fixed;inset:0;background:#102c38aa;display:flex;justify-content:center;align-items:center;padding:20px;z-index:5}.compose-card{width:min(720px,100%);max-height:min(90vh,900px);display:flex;flex-direction:column;background:white;border-radius:16px;box-shadow:0 25px 70px #08232d55;overflow:hidden}.compose-header{background:#17384b;color:white;padding:15px 18px;display:flex;align-items:center;justify-content:space-between}.compose-fields{padding:18px;overflow:auto;display:flex;flex-direction:column;gap:12px}.compose-fields label{display:flex;align-items:center;gap:12px;color:#6c8490;font-size:12px}.compose-fields label>*{flex:1}.compose-fields input,.compose-fields select,.compose-fields textarea{min-width:0;border:1px solid #dae5e7;border-radius:8px;padding:10px;color:#193542;background:white}.compose-fields textarea{resize:vertical;line-height:1.5}.attachment-label{cursor:pointer;color:#167c6a!important}.attachment-label input{display:none}.muted{color:#8ba0a8;font-size:12px}.compose-actions{display:flex;align-items:center;justify-content:flex-end;gap:15px;border-top:1px solid #edf1f2;padding:13px 18px}.compose-actions .error{margin-right:auto}.toast{position:fixed;bottom:25px;right:25px;background:#17384b;color:white;padding:11px 15px;border-radius:10px;box-shadow:0 5px 20px #16384344;z-index:9;font-size:13px}
@media(max-width:850px){.main{grid-template-columns:minmax(270px,42%) 1fr}.message-pane{padding:24px}.top-address{display:none}}
@media(max-width:650px){.topbar{height:58px;padding:0 13px;gap:8px}.brand{font-size:18px}.menu-button{display:block}.layout{min-height:calc(100dvh - 58px)}.sidebar{position:fixed;z-index:4;top:58px;bottom:0;left:0;transform:translateX(-100%);transition:transform .2s;box-shadow:8px 0 20px #122e3e21}.sidebar.open{transform:translateX(0)}.main{display:block;width:100%}.list-pane,.message-pane{height:calc(100dvh - 58px)}.message-pane{display:none;padding:20px}.main.show-message .list-pane{display:none}.main.show-message .message-pane{display:block}.mobile-back{display:inline-block!important}.message-subject{font-size:23px}.compose-card{max-height:95dvh}.compose-fields label{display:block}.compose-fields label>*{display:block;width:100%;margin-top:5px}}
.mobile-back{display:none}
