*{box-sizing:border-box}
:root{font-family:Inter,Arial,sans-serif;background:#0b0f14;color:#eef2f7}
body{margin:0;background:#0b0f14;color:#eef2f7;min-height:100vh}
.center-page{display:grid;place-items:center;padding:24px}
.login-card{width:min(420px,100%);background:#121820;border:1px solid #202a35;border-radius:18px;padding:32px;box-shadow:0 20px 60px #0008}
.logo{font-weight:800;letter-spacing:2px;margin-bottom:24px}
h1,h2,p{margin-top:0}
.muted{color:#8f9baa}
label{display:block;font-size:14px;margin:18px 0 7px;color:#b8c1cc}
input{width:100%;padding:13px 14px;border-radius:10px;border:1px solid #2a3642;background:#0d131a;color:white;outline:none}
input:focus{border-color:#667789}
button{font:inherit}
.primary{width:100%;border:0;border-radius:10px;padding:13px 16px;margin-top:20px;background:#e8edf2;color:#10151a;font-weight:700;cursor:pointer}
.alert{background:#3a1919;border:1px solid #733232;color:#ffb8b8;padding:11px 12px;border-radius:9px;font-size:14px}
.demo-login{margin-top:18px;text-align:center;color:#76818e;font-size:12px}
.topbar{height:68px;border-bottom:1px solid #202a35;background:#10161d;display:flex;align-items:center;justify-content:space-between;padding:0 5vw}
.brand{font-weight:800;letter-spacing:2px}
.user-area{display:flex;align-items:center;gap:18px;color:#aeb8c3}
.user-area a{color:#eef2f7;text-decoration:none}
.container{width:min(1000px,90%);margin:40px auto}
.welcome p{color:#8995a2}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:28px 0}
.stat{background:#121820;border:1px solid #202a35;border-radius:14px;padding:22px}
.stat span{display:block;color:#8f9baa;font-size:13px}.stat strong{display:block;font-size:30px;margin-top:8px}
.cards{display:grid;gap:14px}
.service-card{display:grid;grid-template-columns:48px 1fr auto;align-items:center;text-align:left;gap:14px;background:#121820;color:#eef2f7;border:1px solid #202a35;border-radius:15px;padding:20px;cursor:pointer;transition:.18s}
.service-card:hover{transform:translateY(-1px);border-color:#3a4755}
.service-card b{display:block}.service-card small{display:block;color:#7f8b98;margin-top:5px}
.icon{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;background:#1b2530;font-size:22px}
.arrow{font-size:28px;color:#667381}
.modal{position:fixed;inset:0;background:#000b;display:grid;place-items:center;padding:20px;z-index:10}
.modal.hidden,.hidden{display:none}
.modal-card{width:min(480px,100%);background:#121820;border:1px solid #26313d;border-radius:18px;padding:30px;text-align:center;box-shadow:0 25px 80px #0009}
.spinner{width:38px;height:38px;border:4px solid #2b3540;border-top-color:#eef2f7;border-radius:50%;margin:0 auto 20px;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.progress{height:9px;background:#252f3a;border-radius:99px;overflow:hidden;margin:24px 0 10px}
.progress div{height:100%;width:1%;background:#dfe5ea;transition:width .04s linear}
.percent{font-size:13px;color:#9ca7b2}
.error-icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#492020;color:#ffb6b6;font-size:30px;font-weight:800;margin:0 auto 18px}
#errorView p{color:#9ca7b2;line-height:1.6}
@media(max-width:600px){.stats{grid-template-columns:1fr}.container{margin-top:28px}.topbar{padding:0 20px}}