*{box-sizing:border-box}body{margin:0;font-family:Tajawal,Arial,sans-serif;background:#f5f8f6;color:#193d37}a{color:inherit;text-decoration:none}.layout{display:flex;min-height:100vh}aside{width:265px;flex-shrink:0;background:linear-gradient(160deg,#073e35,#0c6556);color:white;padding:30px 20px;display:flex;flex-direction:column;gap:36px}.brand{font-size:20px;font-weight:800}.brand small{display:block;font-size:10px;letter-spacing:1px;margin-top:9px;opacity:.7}nav{display:grid;gap:12px}nav a{padding:15px;border-radius:12px;color:#d8ebe6}nav a.active,nav a:hover{background:#ffffff21;color:white}.logout{background:transparent;border:1px solid #ffffff66;color:white;margin-top:auto}aside form{margin-top:auto}button{cursor:pointer;padding:14px 18px;border:0;border-radius:11px;background:#087e6b;color:white;font-weight:700}main{width:100%;padding:34px;max-width:1600px;margin:auto}header{background:linear-gradient(110deg,#fff 35%,#e7f4ec);border:1px solid #e0eee7;padding:36px;border-radius:24px;display:flex;justify-content:space-between;align-items:center;gap:20px}h1{font-size:30px;margin:12px 0}p{line-height:1.8;color:#657f78}.eyebrow{color:#16826e;font-size:12px;font-weight:700;letter-spacing:1px}.pill{border:1px solid #cce6dc;border-radius:30px;padding:12px 18px;background:white;white-space:nowrap}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:22px 0}.metrics article,.panel,.device-grid article{background:white;border:1px solid #e1ebe7;border-radius:18px;padding:24px;box-shadow:0 8px 28px #123e3010}.metrics span,.metrics small{display:block;color:#68857d}.metrics strong{display:block;font-size:30px;margin:12px 0;color:#0c6958}.panel{margin-top:22px}.device-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.device-grid article{background:#fbfdfc;box-shadow:none}.device-grid h3{margin:8px 0}.device-grid p{margin:5px 0;font-size:13px}.device-grid small{color:#b18035}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#caa46b}.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#e8f5ee,#fff)}.login-card{width:min(100%,440px);background:white;padding:42px;border:1px solid #deebe5;border-radius:24px;box-shadow:0 20px 70px #16453619}.login-card label{display:block;margin:20px 0;font-weight:700}.login-card input{display:block;width:100%;padding:15px;border:1px solid #d2e3dc;border-radius:9px;margin-top:8px}.login-card button{width:100%}.error{color:#ae3838}@media(max-width:1050px){.metrics{grid-template-columns:repeat(2,1fr)}.device-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:750px){.layout{display:block}aside{width:100%;padding:18px;gap:15px}nav{display:flex;overflow:auto}nav a{white-space:nowrap}aside form{display:none}main{padding:15px}header{padding:22px;display:block}.metrics,.device-grid{grid-template-columns:1fr}h1{font-size:24px}}