:root{--ink:#102431;--muted:#71808a;--line:#dfe7e9;--paper:#fff;--bg:#f2f6f6;--teal:#137d78;--teal2:#0a655f;--green:#2aa77b;--amber:#d69120;--red:#d25757;--navy:#17313d}*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Noto Sans TC",sans-serif;color:var(--ink);background:var(--bg)}body{margin:0;min-height:100vh}.topbar{height:72px;background:var(--navy);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1200px)/2));box-shadow:0 2px 12px #091c2460}.brand{display:flex;gap:12px;align-items:center;color:#fff;text-decoration:none;font-weight:750;letter-spacing:.2px}.brand small{display:block;color:#91aab3;font-size:10px;font-weight:500;letter-spacing:1px;margin-top:2px}.brand-mark,.login-logo{display:grid;place-items:center;background:linear-gradient(145deg,#37b6a6,#137d78);color:white;border-radius:9px;font-family:Georgia,serif;font-weight:bold}.brand-mark{width:36px;height:36px;font-size:21px}.topbar nav{display:flex;height:100%;align-items:center;gap:6px}.topbar nav>a,.link-button{display:flex;align-items:center;height:100%;padding:0 14px;color:#b8c8ce;text-decoration:none;border:0;background:none;font:inherit;font-size:14px;cursor:pointer}.topbar nav>a:hover,.link-button:hover,.topbar nav>a.active{color:#fff}.topbar nav>a.active{box-shadow:inset 0 -3px var(--green)}.topbar nav form{height:100%}.container{max-width:1200px;margin:0 auto;padding:42px 24px 60px}.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.eyebrow{margin:0 0 7px;color:var(--teal);font-size:11px;font-weight:800;letter-spacing:1.7px}.page-head h1{font-size:28px;margin:0 0 7px;letter-spacing:-.6px}.muted{color:var(--muted);margin:0;font-size:14px}.overall{background:#fff;padding:11px 17px;border-radius:40px;font-size:13px;font-weight:750;box-shadow:0 3px 12px #10243112}.overall i,.dot{display:inline-block;border-radius:50%;margin-right:8px}.overall i{width:8px;height:8px;background:var(--green);box-shadow:0 0 0 4px #2aa77b1d}.overall.warn i{background:var(--amber);box-shadow:0 0 0 4px #d691201d}.alerts{display:grid;gap:8px;margin-bottom:18px}.alert{display:flex;align-items:center;gap:12px;background:#fff;border-left:4px solid var(--amber);padding:12px 15px;border-radius:7px;box-shadow:0 2px 10px #1024310c}.alert>span{display:grid;place-items:center;border-radius:50%;width:25px;height:25px;background:#fff4df;color:#9b6208;font-weight:bold}.alert strong{font-size:13px}.alert p{display:inline;margin-left:9px;color:var(--muted);font-size:12px}.alert.danger{border-color:var(--red)}.alert.danger>span{background:#ffebeb;color:var(--red)}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.metric,.panel{background:var(--paper);border:1px solid #e4ebed;border-radius:11px;box-shadow:0 3px 16px #1024310a}.metric{padding:20px}.metric-label{display:flex;align-items:center;color:#5f707a;font-size:12px;font-weight:650;margin-bottom:16px}.icon{display:inline-grid;place-items:center;width:31px;height:31px;margin-right:9px;border-radius:8px;background:#e5f4f2;color:var(--teal);font-size:9px;font-weight:850}.icon.mem{background:#e9f0fa;color:#4778ae}.icon.disk{background:#f2edfa;color:#755da8}.icon.up{background:#e8f7ed;color:#2b8b58}.metric>strong{display:block;font-size:28px;line-height:1.1}.metric>strong.small-value{font-size:20px;margin-top:7px}.metric>p{font-size:11px;color:var(--muted);margin:9px 0 0}.bar{height:5px;border-radius:5px;background:#ebf0f1;margin-top:11px;overflow:hidden}.bar i{display:block;height:100%;background:var(--teal);border-radius:5px}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}.panel{padding:22px}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}.panel-head h2{font-size:17px;margin:0}.panel-head a{font-size:12px;color:var(--teal);text-decoration:none;font-weight:700}.badge{font-size:10px;color:var(--green);background:#e9f8f2;border-radius:20px;padding:5px 9px}.mail-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.mail-flow div{padding:11px;background:#f5f8f8;border-radius:7px}.mail-flow span,.traffic span,.mailbox-summary span{display:block;color:var(--muted);font-size:10px}.mail-flow strong{display:block;font-size:22px;margin-top:5px;color:var(--teal)}.mail-flow .amber strong{color:var(--amber)}.mail-flow .red strong{color:var(--red)}.queue-line{display:flex;align-items:center;border-top:1px solid var(--line);margin-top:16px;padding-top:14px;font-size:12px}.queue-line strong{margin-left:auto}.queue-line small{color:var(--muted);margin-left:11px}.traffic{display:grid;grid-template-columns:1fr 1fr;gap:12px}.traffic>div{border-left:3px solid var(--teal);padding-left:12px}.traffic>div+div{border-color:#5d78ae}.traffic strong{display:block;font-size:19px;margin:4px 0}.traffic small{color:var(--muted);font-size:10px}.spark{height:43px;display:flex;align-items:flex-end;gap:3px;border-bottom:1px solid var(--line);margin-top:18px}.spark span{flex:1;min-width:2px;max-width:9px;background:#70bbb4;border-radius:2px 2px 0 0;opacity:.7}.status-list>div,.cert-list>div{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #edf1f2;padding:10px 2px;font-size:12px}.status-list>div:first-child,.cert-list>div:first-child{border-top:0}.status-list b{font-size:11px;color:var(--muted)}.dot{width:7px;height:7px}.dot.green{background:var(--green);box-shadow:0 0 0 3px #2aa77b19}.dot.red{background:var(--red)}.cert-list strong{display:block;font-size:12px}.cert-list small{display:block;color:var(--muted);margin-top:3px}.cert-days{display:flex;align-items:baseline;gap:3px;color:var(--green)}.cert-days b{font-size:19px}.cert-days span{font-size:10px}.cert-days.warning{color:var(--amber)}.mailbox-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border-radius:8px;overflow:hidden}.mailbox-summary>div{background:#f8fafa;padding:16px 20px}.mailbox-summary strong{display:block;font-size:20px;margin-top:6px}.table-panel{padding:0;overflow:hidden}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;background:#f6f9f9;color:#6d7c85;font-size:10px;letter-spacing:.5px;text-transform:uppercase;padding:13px 18px}td{padding:15px 18px;border-top:1px solid #e9eeee}.state{font-size:10px;padding:4px 8px;border-radius:20px}.state.active{background:#e7f6ef;color:#24855f}.state.off{background:#f1f1f1;color:#777}.usage{display:flex;align-items:center;gap:10px;min-width:190px}.usage>div{width:110px;height:6px;background:#e8eeee;border-radius:5px;overflow:hidden}.usage i{display:block;height:100%;background:var(--teal)}.usage i.warning{background:var(--amber)}.usage i.danger{background:var(--red)}.narrow{max-width:580px}.form-stack{display:grid;gap:16px}.form-stack label{display:grid;gap:7px;font-size:12px;font-weight:650}.form-stack input{width:100%;border:1px solid #cfdadc;border-radius:7px;padding:12px 13px;font:inherit;outline:none}.form-stack input:focus{border-color:var(--teal);box-shadow:0 0 0 3px #137d7815}.form-stack .check{display:flex;align-items:center;font-weight:500;color:var(--muted)}.check input{width:auto}.primary{border:0;background:var(--teal);color:#fff;border-radius:7px;padding:13px 18px;font-weight:750;cursor:pointer}.primary:hover{background:var(--teal2)}.error{background:#fff0f0;color:#a83d3d;padding:11px;border-radius:6px;font-size:12px}.error ul{margin:0;padding-left:18px}.hint{font-size:11px;color:var(--muted);margin:-7px 0 0}.flash{background:#e8f8f1;color:#247a5c;border-radius:7px;padding:12px 15px;margin-bottom:18px}.login-shell{min-height:calc(100vh - 48px);display:grid;place-items:center;padding:25px;background:radial-gradient(circle at 20% 20%,#d8edeb,transparent 32%),linear-gradient(145deg,#edf4f4,#f8fafa)}.login-card{width:min(100%,400px);background:#fff;border-radius:14px;padding:35px;box-shadow:0 18px 55px #19343f20;text-align:center}.login-logo{width:53px;height:53px;margin:0 auto 20px;font-size:28px}.login-card h1{margin:0 0 8px;font-size:24px}.login-card .form-stack{text-align:left;margin-top:26px}.empty{text-align:center;background:#fff;border:1px dashed #c8d4d6;border-radius:10px;padding:55px 20px;color:var(--muted)}code{background:#e7eded;padding:2px 5px;border-radius:4px}footer{text-align:center;color:#829198;font-size:10px;padding:17px} @media(max-width:900px){.metric-grid{grid-template-columns:1fr 1fr}.two-cols{grid-template-columns:1fr}.topbar{height:auto;padding:14px 20px;align-items:flex-start}.topbar nav{flex-wrap:wrap;justify-content:flex-end}.topbar nav>a,.link-button{height:auto;padding:8px}.topbar nav>a.active{box-shadow:none;color:#fff}}@media(max-width:560px){.container{padding:28px 14px}.metric-grid{grid-template-columns:1fr}.page-head{align-items:flex-start;gap:14px}.overall{white-space:nowrap}.brand small{display:none}.topbar{display:block}.topbar nav{justify-content:flex-start;margin-top:10px}.mail-flow{grid-template-columns:1fr 1fr}.mailbox-summary{grid-template-columns:1fr}.login-card{padding:27px 22px}}