:root{
  --bg:#f4f7fb;--card:#fff;--text:#172033;--muted:#6b7280;--line:#e5eaf1;
  --brand:#174ea6;--brand2:#0e3578;--accent:#f0b429;--danger:#b42318;--ok:#067647;
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}.shell{min-height:100vh}.sidebar{position:fixed;left:0;top:0;bottom:0;width:250px;background:linear-gradient(180deg,#0f2f67,#0b224a);color:white;padding:22px 18px;display:flex;flex-direction:column}
.brand{display:flex;gap:11px;align-items:center;margin-bottom:28px}.brand-mark{width:43px;height:43px;border-radius:12px;background:var(--accent);color:#102a54;font-weight:900;display:grid;place-items:center}.brand strong{display:block;font-size:18px}.brand span{display:block;font-size:12px;opacity:.75}
.sidebar nav{display:flex;flex-direction:column;gap:5px}.sidebar nav a{padding:11px 12px;border-radius:10px;opacity:.82}.sidebar nav a:hover,.sidebar nav a.active{background:rgba(255,255,255,.12);opacity:1}.sidebar-foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.14);padding-top:16px;display:flex;flex-direction:column;gap:3px}.sidebar-foot small{opacity:.7}.sidebar-foot a{margin-top:10px;color:#ffd36f}
.main{margin-left:250px}.main-full{min-height:100vh}.topbar{height:68px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px;position:sticky;top:0;z-index:5}.pill{font-size:11px;font-weight:700;padding:6px 10px;border-radius:99px;background:#eef4ff;color:var(--brand)}
.content{padding:30px;max-width:1500px;margin:auto}.hero{background:linear-gradient(120deg,#123d82,#1b5db8);color:white;border-radius:18px;padding:28px;display:flex;justify-content:space-between;align-items:center;gap:20px}.hero h1{margin:5px 0 8px;font-size:30px}.hero p{margin:0;opacity:.8}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.13em;color:#ffd36f}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;background:var(--brand);color:white;padding:11px 16px;border-radius:10px;font-weight:700;cursor:pointer}.hero .btn{background:white;color:#123d82}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:18px 0}.stat{background:white;border:1px solid var(--line);border-radius:15px;padding:20px}.stat span{display:block;color:var(--muted);font-size:13px}.stat strong{display:block;font-size:30px;margin-top:7px}
.panel{background:white;border:1px solid var(--line);border-radius:15px;padding:22px;margin-top:18px}.panel h2{margin-top:0}.roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.roadmap>div{padding:13px;background:#f7f9fc;border-radius:10px;color:#667085}.roadmap .done{color:var(--ok);background:#ecfdf3}
.page-head{display:flex;justify-content:space-between;align-items:center;gap:15px}.page-head h1{margin:0 0 4px}.page-head p{margin:0;color:var(--muted)}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:13px 10px;border-bottom:1px solid var(--line)}th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}td small{color:var(--muted)}
.status{padding:5px 9px;border-radius:99px;font-size:12px}.status.active{background:#ecfdf3;color:var(--ok)}.status.inactive,.status.suspended{background:#fff1f1;color:var(--danger)}
form{display:flex;flex-direction:column;gap:10px}label{font-size:13px;font-weight:700;margin-top:3px}input,select{width:100%;padding:11px 12px;border:1px solid #cfd8e5;border-radius:9px;background:white;font:inherit}input:focus,select:focus{outline:2px solid #cfe0ff;border-color:#6f9fe8}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-panel{max-width:850px}
.flash{padding:12px 14px;border-radius:10px;margin-bottom:14px}.flash.error{background:#fff1f1;color:#8a1c1c}.flash.success{background:#ecfdf3;color:#05603a}
.install-page{min-height:100vh;background:radial-gradient(circle at top,#e8f1ff,#f5f7fb 60%);padding:35px 16px}.install-card,.login-card{max-width:680px;margin:20px auto;background:white;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:0 20px 50px rgba(30,50,90,.08)}.install-logo{font-size:28px;font-weight:900;color:#143f86}.install-logo span{color:#d59a00;font-weight:700}.install-card h1,.login-card h1{margin-bottom:8px}.install-card p,.login-card p{color:var(--muted);line-height:1.55}.install-card h3{margin:16px 0 0}.muted{font-size:12px}.login-wrap{padding:40px 16px}.login-card{max-width:460px}
.empty-state{text-align:center;padding:60px 20px}.empty-icon{width:60px;height:60px;border-radius:18px;background:#eef4ff;color:var(--brand);font-size:28px;display:grid;place-items:center;margin:auto}.empty-state p{color:var(--muted)}
@media(max-width:900px){.sidebar{position:static;width:auto}.main{margin-left:0}.stats{grid-template-columns:1fr 1fr}.roadmap{grid-template-columns:1fr}.shell{display:block}.topbar{position:static}.content{padding:18px}.grid2{grid-template-columns:1fr}.hero{align-items:flex-start;flex-direction:column}}

textarea{width:100%;padding:11px 12px;border:1px solid #cfd8e5;border-radius:9px;background:white;font:inherit;resize:vertical}
.btn.small{padding:7px 10px;font-size:12px}.btn.ghost{background:#eef3f9;color:#244b7f}.actions{white-space:nowrap}.actions .btn{margin-left:5px}
.tenant-badge{padding:12px;background:rgba(255,255,255,.09);border-radius:12px;margin:-10px 0 16px}.tenant-badge small{display:block;font-size:9px;letter-spacing:.08em;opacity:.65}.tenant-badge strong{display:block;margin:3px 0 6px}.tenant-badge a{font-size:11px;color:#ffd36f}
.crumb{font-weight:400;color:#7b8797;margin-left:7px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:18px}.mini-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px;display:flex;flex-direction:column;gap:6px}.mini-card span,.mini-card small{color:var(--muted)}
.searchbar{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:18px}
.inbox{display:grid;grid-template-columns:300px minmax(420px,1fr) 280px;height:calc(100vh - 128px);background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.inbox-list{border-right:1px solid var(--line);overflow:auto}.inbox-head{padding:15px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#fff;z-index:2}.conversation{display:flex;flex-direction:column;gap:3px;padding:14px 15px;border-bottom:1px solid var(--line)}.conversation:hover,.conversation.selected{background:#eef4ff}.conversation span,.conversation small{color:var(--muted);font-size:12px}
.chat-pane{display:flex;flex-direction:column;min-width:0}.chat-title{padding:15px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.chat-title div{display:flex;flex-direction:column}.chat-title span{font-size:12px;color:var(--muted)}.messages{flex:1;overflow:auto;padding:20px;background:#f7f9fc}.bubble{max-width:72%;background:white;border:1px solid var(--line);padding:10px 12px;border-radius:12px;margin-bottom:10px}.bubble.user{margin-left:auto;background:#eaf2ff}.bubble small,.bubble time{display:block;font-size:10px;color:var(--muted)}.bubble time{text-align:right;margin-top:6px}.composer{border-top:1px solid var(--line);padding:12px;display:grid;grid-template-columns:1fr auto;gap:10px}.contact-pane{border-left:1px solid var(--line);padding:20px;overflow:auto;text-align:center}.contact-avatar{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;margin:10px auto;background:#eef4ff;color:var(--brand);font-size:24px;font-weight:800}.contact-pane h2{margin:8px 0}.contact-pane p{color:var(--muted);font-size:13px}.contact-pane hr{border:0;border-top:1px solid var(--line);margin:20px 0}.contact-pane dl{text-align:left}.contact-pane dt{font-size:11px;color:var(--muted);margin-top:10px}.contact-pane dd{margin:2px 0 0}.empty-center{margin:auto;text-align:center;color:var(--muted)}.pad{padding:15px}
@media(max-width:1100px){.inbox{grid-template-columns:260px 1fr}.contact-pane{display:none}.cards{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.inbox{display:block;height:auto}.inbox-list{max-height:300px;border-right:0}.chat-pane{min-height:600px}.stats,.cards{grid-template-columns:1fr}}

