:root{--bg:#f6f8fa;--text:#1b2532;--muted:#687789;--line:#dfe5ec;--accent:#23597c;--surface:white;--light:#edf4f7;--green:#287a56}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}h1{font-size:27px;line-height:1.2;margin:3px 0 20px;letter-spacing:-.7px}h2{font-size:17px;margin:0 0 12px}p{margin:4px 0 16px}.muted,.note{color:var(--muted)}.note{font-size:12px}.layout{display:flex;min-height:100vh}.brand{font-size:18px;letter-spacing:-.3px;margin:0 0 28px}.brand small{display:block;margin:4px 0 0 30px;letter-spacing:0;color:#c4d4df;font-size:11px}aside{width:245px;background:#17344a;color:#fff;padding:28px 16px;display:flex;flex-direction:column;flex-shrink:0}aside .brand{margin-left:12px}nav{display:grid;gap:5px}nav a{display:block;text-decoration:none;color:#cbd7df;padding:11px 13px;border-radius:9px}nav a:hover,nav a.active{color:#fff;background:#2b536e}.logout{margin-top:auto;padding-top:40px}.logout button{width:100%}.content{width:calc(100% - 245px);max-width:1500px;margin:0 auto;padding:32px 42px 70px}header{display:flex;justify-content:space-between;align-items:center;gap:16px}header .eyebrow{font-size:11px;font-weight:750;color:#7792a1;letter-spacing:1.4px;margin:0}.pill{border-radius:100px;padding:5px 12px;background:#e9f2eb;color:#216346;font-size:11px;font-weight:700}.panel{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:22px;margin:0 0 18px;box-shadow:0 3px 14px #293e5110}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:22px 0}.metric{padding:18px;background:white;border:1px solid var(--line);border-radius:11px}.metric span{display:block;color:var(--muted);font-size:12px}.metric strong{font-size:27px;font-weight:750;display:block;margin:5px 0}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.provider{margin:0}.provider summary{display:flex;justify-content:space-between;align-items:center;gap:10px;cursor:pointer;list-style:none}.provider[open]{grid-column:span 2}.provider[open] summary{border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:17px}details summary{cursor:pointer}details summary::marker{color:var(--accent)}.tag{font-size:11px;border:1px solid #d7dee7;padding:3px 7px;background:#f5f6f8;border-radius:6px;white-space:nowrap}.tag.enabled{background:#eaf7ef;color:var(--green);border-color:#cae5d3}.fields{display:grid;gap:13px;max-width:840px}label{display:grid;gap:5px;font-size:12px;font-weight:650;color:#43566a}label input,label select,label textarea{width:100%;padding:10px 11px;font:inherit;font-size:13px;border:1px solid #d0dae4;border-radius:7px;background:#fff;outline-color:#4d87b2;color:#202b39}label textarea{resize:vertical}label.check{display:flex;align-items:center;gap:10px;font-size:13px}.check input{width:auto}button{background:#205c83;border:1px solid #205c83;color:#fff;border-radius:8px;padding:11px 15px;font-weight:700;cursor:pointer;width:max-content}button:hover{background:#174667}.secondary{background:transparent;color:#d5e7ed;border-color:#7292a4}.secondary:hover{background:#31556d}.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}table{width:100%;border-collapse:collapse;display:block;overflow-x:auto;white-space:nowrap}th,td{text-align:left;border-bottom:1px solid #edf0f4;padding:11px 14px 11px 0}th{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.3px}td{font-size:13px}td:last-child{max-width:240px;overflow:hidden;text-overflow:ellipsis}.alert{background:#fff7df;border:1px solid #efd99e;color:#725a1d;border-radius:9px;padding:12px 15px}.secret{background:#f0f8ed;border:1px solid #cce4c5;padding:15px;border-radius:8px;margin-top:18px}.secret code{display:block;margin-top:6px;overflow-wrap:anywhere}pre{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;color:#dceaf3;background:#18394f;border-radius:9px;padding:20px;margin:0 0 26px}.auth{display:grid;place-items:center;min-height:100vh;padding:24px}.auth .panel{width:min(100%,410px)}.auth input{margin-bottom:17px}.auth button{width:100%}@media(max-width:980px){.content{padding:24px;width:calc(100% - 210px)}aside{width:210px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.cards{grid-template-columns:1fr}.provider[open]{grid-column:auto}}@media(max-width:660px){.layout{display:block}aside{width:100%;padding:13px}.brand{margin:5px 0 12px}aside .brand{margin-left:0}aside .brand small{display:none}nav{display:flex;gap:5px;overflow-x:auto;white-space:nowrap}nav a{font-size:12px;padding:8px}.logout{display:none}.content{width:100%;padding:22px 14px}.metrics{gap:8px}.panel{padding:16px}.formgrid{grid-template-columns:1fr}.pill{display:none}}
/* Sporo Mail v0.2 */
.subpanel{padding:16px 0;margin-top:17px;border-top:1px solid var(--line)}h3{font-size:14px;margin:0 0 9px}
.inline-form{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin:11px 0 16px}.inline-form>label{min-width:145px;flex:1}.inline-form>form{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.inline-form>form>label{min-width:160px}
button.danger{background:#9e3536;border-color:#9e3536}button.danger:hover{background:#80282b}button.warn{background:#ab782c;border-color:#ab782c}button.warn:hover{background:#8d6122}button.subtle{background:#fff;color:#205c83;border-color:#c7d4de}button.subtle:hover{background:#f0f7fa}.smallbtn{padding:5px 8px;font-size:11px}
details.panel{margin-bottom:14px}details.panel>summary{cursor:pointer;list-style:revert}summary small{color:var(--muted);margin-left:10px}summary .tag{margin-left:10px}input[type=checkbox]{min-width:17px;min-height:17px}
.auth label{margin-bottom:10px}.secret{margin-bottom:18px}
@media(max-width:700px){.inline-form,.inline-form>form{align-items:stretch;flex-direction:column}.inline-form>label,.inline-form>form>label{width:100%}.inline-form button{width:100%}}

@media(max-width:660px){.logout{display:block;margin-top:12px;padding-top:8px}.logout button{width:auto}}

/* v0.3: institutional mailbox portal */
.mail-entry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:18px 0 24px}
.mail-entry{text-decoration:none;color:var(--text);display:flex;flex-direction:column;gap:9px;padding:22px;background:#fff;border:1px solid #d7e2eb;border-radius:13px;box-shadow:0 3px 12px #123c5710;min-height:190px}
.mail-entry:hover{border-color:#5d8dad;background:#f8fbfd}.mail-entry strong{font-size:19px}.mail-entry small{font-size:12px;line-height:1.55;color:var(--muted)}
.mail-entry-icon{display:grid;place-items:center;width:40px;height:40px;background:#e9f3f9;border-radius:10px;color:#205c83;font-size:23px}.entry-action{margin-top:auto;font-size:12px;color:#23597c;font-weight:700}
.mail-auth-panel{width:min(100%,800px)!important}.mail-auth-panel form{max-width:390px}.mail-login-separator{border-top:1px solid var(--line);padding-top:20px;margin-top:8px}.mail-actions{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.action-link{display:inline-flex;padding:11px 14px;border-radius:8px;background:#205c83;color:white;text-decoration:none;font-weight:700}.action-link.secondary-link{color:#205c83;background:#edf4f7}.action-link:hover{filter:brightness(.92)}
.mail-home-grid .mail-entry{min-height:225px}
@media(max-width:660px){.mail-entry-grid{grid-template-columns:1fr}.mail-entry{min-height:0}}