:root{--bg:#f5f7fb;--card:#fff;--ink:#243247;--muted:#7d8a9f;--primary:#627da8;--accent:#92a9c9;--line:#e6ebf2;--danger:#c75a67;--ok:#4f9b7a}*{box-sizing:border-box}body{margin:0;font-family:Tahoma,Arial,sans-serif;background:linear-gradient(135deg,#f8fafc,#eef3f9);color:var(--ink)}.app-shell{min-height:100vh;display:flex}.sidebar{width:270px;background:rgba(255,255,255,.94);border-left:1px solid var(--line);padding:20px;position:fixed;right:0;top:0;bottom:0;overflow:auto;z-index:20;box-shadow:-8px 0 30px rgba(51,72,102,.05);animation:slideIn .5s ease}.main{margin-right:270px;width:calc(100% - 270px)}.topbar{height:74px;background:rgba(255,255,255,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:12px 24px;position:sticky;top:0;z-index:10}.content{padding:24px}.logo-wrap{display:flex;align-items:center;gap:10px;font-size:20px;margin-bottom:20px}.logo-dot{width:18px;height:18px;border-radius:6px;background:linear-gradient(135deg,var(--primary),#a9bad2);box-shadow:0 0 0 7px #eef2f8;animation:pulse 2.4s infinite}.user-mini{background:#f7f9fc;border:1px solid var(--line);border-radius:16px;padding:12px 14px;margin-bottom:16px;display:flex;flex-direction:column}.user-mini small{color:var(--muted)}.nav-link{color:#516077;border-radius:12px;padding:10px 12px;transition:.25s}.nav-link:hover{background:#eef3f9;transform:translateX(-4px);color:#2d405e}.search-box{display:flex;gap:8px;width:min(700px,100%)}.cardx{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:0 10px 30px rgba(52,72,100,.06);animation:fadeUp .45s ease both}.stat{position:relative;overflow:hidden}.stat:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,rgba(98,125,168,.18),transparent);left:-20px;bottom:-35px}.stat strong{font-size:30px;display:block}.stat small{color:var(--muted)}.table-wrap{overflow:auto;border-radius:18px}.table{min-width:900px}.badge-soft{background:#eef3f9;color:#526989;padding:7px 10px;border-radius:999px}.btn-primary{background:var(--primary);border-color:var(--primary)}.btn-primary:hover{background:#536f9b;border-color:#536f9b;transform:translateY(-1px)}.btn{transition:.2s}.form-control,.form-select{border-radius:12px;border-color:#dfe6ef;padding:.7rem .85rem}.form-control:focus,.form-select:focus{box-shadow:0 0 0 .2rem rgba(98,125,168,.14);border-color:#9fb0c8}.progress{height:12px;border-radius:99px;background:#edf1f6}.progress-bar{background:linear-gradient(90deg,var(--primary),var(--accent));transition:width .2s}.file-card{border:1px dashed #cfd9e6;border-radius:14px;padding:12px;margin-bottom:10px}.login-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 10%,#e8eef7,transparent 30%),linear-gradient(135deg,#f8fafc,#edf2f8)}.login-card{width:min(420px,92vw);background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:26px;padding:30px;box-shadow:0 30px 70px rgba(44,61,86,.12);position:relative;overflow:hidden;animation:fadeUp .6s ease}.brand-orb{width:70px;height:70px;border-radius:24px;background:linear-gradient(135deg,#6e88af,#b1c2d9);position:absolute;left:-20px;top:-20px;animation:float 4s ease-in-out infinite}.online{width:9px;height:9px;background:#58b187;border-radius:50%;display:inline-block;box-shadow:0 0 0 4px rgba(88,177,135,.13)}.offline{width:9px;height:9px;background:#b8c0cc;border-radius:50%;display:inline-block}.animate-list>*{animation:fadeUp .45s ease both}.animate-list>*:nth-child(2){animation-delay:.05s}.animate-list>*:nth-child(3){animation-delay:.1s}.animate-list>*:nth-child(4){animation-delay:.15s}@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes slideIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(10px) rotate(8deg)}}@media(max-width:991px){.sidebar{transform:translateX(110%);transition:.3s;width:min(300px,86vw)}.sidebar.open{transform:none}.main{margin-right:0;width:100%}.content{padding:14px}.topbar{padding:10px 14px}.search-box{flex:1}.stat strong{font-size:25px}}@media(max-width:576px){.search-box .form-control{font-size:13px}.content{padding:10px}.cardx{border-radius:16px;padding:14px}}