:root{font-family:Inter,Arial,sans-serif;color:#102a3a;background:#f4f7f9}*{box-sizing:border-box}body{margin:0;display:grid;grid-template-columns:230px 1fr;min-height:100vh}aside{background:#071c2b;color:white;padding:28px 20px}.brand{font-size:22px;font-weight:800;margin-bottom:35px}.brand span{color:#37a8e0;margin-left:6px}nav{display:grid;grid-gap:8px;gap:8px}nav a{color:#bfd0da;text-decoration:none;padding:11px 13px;border-radius:8px}nav a:hover{background:#12364c;color:white}main{padding:34px;overflow:auto}header p{color:#638091;margin:0 0 5px}h1{font-size:28px;margin:0 0 28px}h2{font-size:16px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));grid-gap:16px;gap:16px}.column,.inbox,.metrics article,.panel{background:white;border:1px solid #dce6eb;border-radius:12px;box-shadow:0 3px 14px #18394d0a}.metrics article{padding:20px;display:grid;grid-gap:7px;gap:7px}.metrics strong{font-size:30px}.metrics small,.metrics span{color:#638091}.panel{padding:24px;margin-top:20px}.kanban{display:grid;grid-template-columns:repeat(4,280px);grid-gap:16px;gap:16px}.column{padding:14px;min-height:450px}.column h2{display:flex;justify-content:space-between}.column h2 span{background:#e8f3f8;border-radius:20px;padding:2px 8px}.empty{color:#78909c;border:1px dashed #ccdce4;border-radius:8px;padding:20px;margin-top:18px}.inbox{display:grid;grid-template-columns:280px minmax(420px,1fr) 260px;min-height:620px;overflow:hidden}.contact,.threads{padding:20px}.threads{border-right:1px solid #dce6eb}.contact{border-left:1px solid #dce6eb}.chat{display:grid;place-items:center;text-align:center;color:#638091}button{background:#1769aa;color:#fff;border:0;padding:11px 16px;border-radius:8px;font-weight:700}@media(max-width:900px){body{grid-template-columns:1fr}aside{display:none}.metrics{grid-template-columns:1fr 1fr}.inbox{grid-template-columns:1fr}.contact,.threads{display:none}}