.portal-shell{max-width:1440px;min-height:100vh;margin:auto;padding:2rem}.page-header,.email-log-detail-heading,.email-row-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.page-header{margin-bottom:1.5rem}.page-header>p{color:#68758a}.workspace{display:grid;grid-template-columns:minmax(330px,.9fr) minmax(450px,1.5fr);min-height:650px;border:1px solid #e1e6ef;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 12px 30px #1c254208}.email-list-panel{border-right:1px solid #e1e6ef}.filters{padding:1rem;display:grid;gap:.65rem;border-bottom:1px solid #e1e6ef}select,.filters input{width:100%;padding:.55rem .65rem;border:1px solid #cbd4e1;border-radius:6px;background:#fff;color:#243047}.date-range{display:grid;grid-template-columns:1fr auto 1fr;gap:.4rem;align-items:center;color:#718096;font-size:.8rem}.email-row{width:100%;padding:1rem;text-align:left;border:0;border-bottom:1px solid #edf0f5;background:#fff;cursor:pointer}.email-row:hover,.email-row.active{background:#f1f4ff}.email-row.active{box-shadow:inset 3px 0 #5267d9}.email-row-top{font-size:.9rem}.email-row time{color:#718096;font-size:.76rem;white-space:nowrap}.subject{display:block;margin:.35rem 0 .6rem;color:#536176;font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.detail-panel{padding:2rem}.email-log-detail-heading>div>p:not(.eyebrow){color:#667085;margin-bottom:0}.metadata{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:1rem 0;border-bottom:1px solid #e6eaf0}.metadata div:last-child{grid-column:1 / -1}.metadata dt{color:#718096;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}.metadata dd{margin:.25rem 0 0;font-size:.9rem;overflow-wrap:anywhere}.status-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .5rem;border-radius:99px;font-size:.75rem;font-weight:700;text-transform:capitalize;white-space:nowrap}.status-icon{font-size:.65rem}.status-sent{color:#53606e;background:#eef1f4}.status-delivered{color:#137333;background:#e3f6e9}.status-bounced,.status-failed{color:#b42318;background:#fee9e7}.status-spam_reported{color:#a15c00;background:#fff2cf}.timeline{position:relative;list-style:none;margin:0;padding:0 0 0 1.4rem;border-left:2px solid #e1e6ef}.timeline li{position:relative;padding:0 0 1.25rem 1rem}.timeline li:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-7px;top:.25rem;width:12px;height:12px;border:2px solid #6674d8;background:#fff;border-radius:50%}.timeline strong{display:block;text-transform:capitalize;font-size:.9rem}.timeline time,.timeline p{display:block;margin:.2rem 0 0;color:#718096;font-size:.82rem}pre{overflow:auto;margin:0;padding:1rem;border-radius:8px;background:#172033;color:#e6edf7;font:.8rem/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}.empty-detail{color:#718096;text-align:center;padding:2rem}@media(max-width:800px){.portal-shell{padding:1rem}.workspace{grid-template-columns:1fr}.email-list-panel{border-right:0;border-bottom:1px solid #e1e6ef}.detail-panel{padding:1.25rem}.metadata{grid-template-columns:1fr}}:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#172033;background:#f6f8fb}body{margin:0}button,input,textarea{font:inherit}.shell{max-width:1120px;margin:auto;padding:0 24px 48px}header{display:flex;align-items:center;justify-content:space-between;padding:22px 0;border-bottom:1px solid #dbe2ea}.brand{color:#173b72;font-size:1.25rem;font-weight:800;text-decoration:none}nav{display:flex;gap:8px}nav button{border:0;background:none;padding:8px 12px;color:#536174}nav button.active{color:#173b72;font-weight:700}.page-heading h1{margin:32px 0 22px}h2{margin:0;font-size:1.1rem}.usage-card,.templates-layout aside,.template-form,.table-wrap{background:#fff;border:1px solid #dbe2ea;border-radius:10px}.usage-card{padding:24px;max-width:560px}.eyebrow{color:#536174;margin:0 0 4px}.usage-card strong{font-size:1.7rem}.usage-card p{margin:6px 0;color:#536174}.meter{height:10px;margin-top:18px;overflow:hidden;background:#e6ebf1;border-radius:99px}.meter div{height:100%;background:#2869c7}section+section{margin-top:34px}.section-title,.list-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-title span{color:#536174;font-size:.9rem}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:14px 16px;border-bottom:1px solid #e6ebf1}th{color:#536174;font-size:.8rem;text-transform:uppercase}.status{color:#12633b;background:#dcf7e9;padding:3px 8px;border-radius:99px;font-size:.85rem}.templates-layout{display:grid;grid-template-columns:minmax(230px,.8fr) minmax(0,1.5fr);gap:20px}.templates-layout aside,.template-form{padding:20px}.primary{border:1px solid #173b72;border-radius:6px;background:#173b72;color:#fff;padding:8px 12px}.template-list{list-style:none;padding:0;margin:0}.template-list button{width:100%;padding:12px 8px;border:0;border-bottom:1px solid #e6ebf1;text-align:left;background:none}.template-list button.selected{background:#edf4ff}.template-list span{display:block;margin-top:3px;overflow:hidden;color:#536174;font-size:.9rem;text-overflow:ellipsis;white-space:nowrap}.template-form{display:grid;gap:16px}label{display:grid;gap:6px;font-weight:600}input,textarea{width:100%;border:1px solid #aebaca;border-radius:6px;padding:9px;font-weight:400}textarea{font-family:ui-monospace,monospace;resize:vertical}.upload{font-size:.9rem}.form-actions{display:flex;gap:10px}.danger{border:1px solid #bb273d;border-radius:6px;background:#fff;color:#a51d31;padding:8px 12px}.error{margin:0;color:#a51d31}@media(max-width:720px){.shell{padding:0 16px 32px}.templates-layout{grid-template-columns:1fr}.table-wrap{overflow-x:auto}table{min-width:600px}}:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#102a43;background:#f4f7fb;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh}.topbar{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:#102a43;color:#fff}.brand{display:inline-flex;align-items:center;gap:.65rem;color:inherit;text-decoration:none;font-weight:700;letter-spacing:-.02em}.brand small{color:#a7c7e7;font-weight:600}.brand-mark{width:29px;height:29px;display:grid;place-items:center;border-radius:8px;background:#20b486}.environment-label{color:#b8cee4;font-size:.82rem}.page-content{width:min(1120px,90vw);margin:0 auto;padding:3.5rem 0 5rem}.page-heading,.detail-heading{display:flex;justify-content:space-between;gap:2rem;align-items:flex-start;margin-bottom:2rem}h1,h2,p{margin-top:0}h1{margin-bottom:.45rem;font-size:clamp(2rem,4vw,2.75rem);letter-spacing:-.05em}h2{font-size:1.04rem;margin-bottom:.25rem}p{color:#627d98}.eyebrow{color:#20a779;font-size:.77rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.5rem}.button-secondary{border:1px solid #bcccdc;border-radius:8px;padding:.6rem .9rem;color:#243b53;background:#fff;font-weight:650}.button-secondary:disabled{opacity:.55;cursor:wait}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;color:#627d98;font-size:.9rem}input{width:min(280px,70vw);border:1px solid #bcccdc;border-radius:7px;padding:.6rem .75rem;background:#fff}input:focus,button:focus-visible,a:focus-visible{outline:3px solid #64d9ba;outline-offset:2px}.client-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:1rem}.client-card,.detail-summary,.resource-panel,.loading-panel,.empty-state{border:1px solid #d9e2ec;border-radius:12px;background:#fff;box-shadow:0 6px 18px #102a430a}.client-card{display:flex;flex-direction:column;gap:1.3rem;padding:1.25rem;color:inherit;text-decoration:none;transition:transform .16s ease,box-shadow .16s ease}.client-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px #102a431a}.client-card-header{display:flex;justify-content:space-between;gap:.75rem}.client-card p{font-size:.86rem;margin-bottom:0;overflow-wrap:anywhere}.card-link{margin-top:auto;color:#147d63;font-weight:750;font-size:.88rem}.status-badge{display:inline-block;border-radius:999px;padding:.2rem .56rem;font-size:.72rem;font-weight:800;line-height:1.2;text-transform:capitalize;white-space:nowrap}.status-active,.status-verified{color:#087458;background:#d9f7ec}.status-inactive,.status-revoked,.status-archived{color:#8a3d12;background:#fff0d8}.status-pending{color:#516f90;background:#e8eff6}.quota{display:grid;gap:.45rem}.quota-label{display:flex;justify-content:space-between;gap:.5rem;color:#627d98;font-size:.77rem}.quota-track{height:7px;border-radius:99px;overflow:hidden;background:#e6edf4}.quota-fill{display:block;height:100%;border-radius:inherit;background:#20b486}.detail-summary{display:grid;grid-template-columns:minmax(240px,1fr) 1fr;gap:2rem;padding:1.4rem;margin-bottom:2rem}dl{display:grid;gap:1rem;margin:0}dt{color:#829ab1;font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}dd{margin:.25rem 0 0;font-size:.92rem;overflow-wrap:anywhere}.mono{font-family:ui-monospace,SFMono-Regular,monospace;font-size:.78rem}.tabs{display:flex;gap:.25rem;border-bottom:1px solid #bcccdc}.tabs button{border:0;border-bottom:3px solid transparent;padding:.75rem 1rem;color:#627d98;background:transparent;font-weight:700}.tabs button.active{color:#147d63;border-bottom-color:#20b486}.resource-panel{margin-top:1rem;padding:.35rem 1.25rem;overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:.95rem .2rem;border-bottom:1px solid #e6edf4;text-align:left;font-size:.9rem}th{color:#627d98;font-size:.73rem;letter-spacing:.08em;text-transform:uppercase}tr:last-child td{border-bottom:0}.back-link{display:inline-block;color:#147d63;margin-bottom:1.35rem;text-decoration:none;font-weight:700}.alert{border-left:4px solid #d64545;padding:.8rem 1rem;color:#8a1c1c;background:#fff0f0}.loading-panel,.empty-state{padding:2rem;color:#627d98;text-align:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:640px){.page-content{width:min(92vw,1120px);padding-top:2rem}.page-heading,.detail-heading,.toolbar{align-items:stretch;flex-direction:column;gap:.9rem}.button-secondary{align-self:flex-start}.detail-summary{grid-template-columns:1fr;gap:1.25rem}.tabs{overflow-x:auto}.tabs button{white-space:nowrap}}
