*{box-sizing:border-box} :root{--navy:#101d3a;--blue:#315efb;--cyan:#2bc5d7;--ink:#17233d;--muted:#7c879c;--line:#e8edf5;--bg:#f5f7fb}body{margin:0;font-family:'Plus Jakarta Sans',Arial,sans-serif;color:var(--ink);background:var(--bg);font-size:14px}a{text-decoration:none;color:inherit}.app-shell{min-height:100vh}.sidebar{width:254px;background:linear-gradient(180deg,#101d3a,#172a50);color:#fff;position:fixed;inset:0 auto 0 0;padding:25px 17px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:12px;padding:4px 10px 34px}.brand-mark,.login-logo i,.installer-brand i{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,#4774ff,#24c3d7);font-size:19px}.brand b{display:block;font-size:18px;letter-spacing:1px}.brand small{display:block;color:#91a2c5;font-size:10px;margin-top:3px;letter-spacing:1px}.nav-caption{font-size:10px;color:#7789ad;font-weight:800;letter-spacing:1.5px;padding:0 12px 12px}.sidebar nav{display:grid;gap:5px}.nav-link{display:flex;align-items:center;gap:13px;padding:12px 13px;border-radius:10px;color:#aebbd3;font-weight:600;font-size:12px;transition:.2s}.nav-link i{width:18px;text-align:center;font-size:14px}.nav-link:hover,.nav-link.active{background:linear-gradient(90deg,rgba(67,111,255,.3),rgba(40,193,216,.12));color:#fff}.nav-link.active{box-shadow:inset 3px 0 #42c5e0}.sidebar-bottom{margin-top:auto}.secure-pill{display:flex;align-items:center;gap:9px;padding:12px 10px;color:#91a2c5;font-size:10px;border-top:1px solid #2a3a5b;margin-bottom:10px}.secure-pill i{color:#41d5bb}.logout{color:#ffb4b4}.main-area{margin-left:254px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:5}.crumb{font-size:12px;color:#9aa4b6}.crumb i{font-size:9px;margin:0 10px}.crumb b{color:#263653}.top-user{display:flex;align-items:center;gap:10px}.top-user b,.top-user small{display:block}.top-user b{font-size:12px}.top-user small{font-size:10px;color:var(--muted);margin-top:3px;text-transform:capitalize}.avatar{width:36px;height:36px;border-radius:12px;background:#eaf0ff;color:#315efb;display:grid;place-items:center;font-weight:800}.content{padding:32px 34px;flex:1;max-width:1600px;width:100%;margin:0 auto}.footer{padding:18px 34px;border-top:1px solid var(--line);font-size:10px;color:#9aa4b6}.footer span{float:right}.menu-toggle{display:none;border:0;background:none;font-size:18px}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:800;color:#5273e8;margin-bottom:9px}.page-heading h1,.login-box h2,.installer-panel h1{font-size:25px;letter-spacing:-.8px;margin:0 0 7px;color:#172642}.page-heading p,.muted{margin:0;color:#8994a8;font-size:12px}.date-chip{padding:10px 14px;background:#fff;border:1px solid var(--line);border-radius:10px;color:#63718a;font-size:11px}.date-chip i{margin-right:8px;color:#4168ed}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:19px;display:flex;gap:14px;align-items:center;box-shadow:0 5px 18px rgba(29,53,94,.025)}.stat-icon{width:43px;height:43px;border-radius:13px;display:grid;place-items:center;font-size:17px}.stat-icon.blue{background:#edf1ff;color:#4268f5}.stat-icon.violet{background:#f3efff;color:#8a62e8}.stat-icon.cyan{background:#e8fbfc;color:#1aaebe}.stat-icon.orange{background:#fff4e9;color:#f29a38}.stat-card span,.stat-card small{display:block;color:#8792a5;font-size:10px}.stat-card strong{display:block;font-size:23px;letter-spacing:-1px;margin:3px 0}.dashboard-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:21px;box-shadow:0 5px 18px rgba(29,53,94,.025);min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.panel-head h3,.panel h3{margin:0 0 5px;font-size:14px}.panel-head p{margin:0;color:#98a2b3;font-size:10px}.panel-icon{width:36px;height:36px;border-radius:11px;background:#eff3ff;color:#4c6cf0;display:grid;place-items:center}.activity-list{display:grid}.activity-row{display:flex;gap:12px;padding:12px 0;border-top:1px solid #f0f2f7}.activity-dot{width:8px;height:8px;border-radius:50%;background:#4f78ff;margin:5px 0 0 3px;box-shadow:0 0 0 4px #eef2ff}.activity-row b,.activity-row small{display:block}.activity-row b{font-size:11px}.activity-row small{font-size:10px;color:#9aa4b6;margin-top:4px}.welcome-panel{background:linear-gradient(140deg,#1c3470,#315efb 75%,#24bfd0);color:#fff;position:relative;overflow:hidden;min-height:260px}.welcome-panel h3{font-size:23px;line-height:1.35;margin:17px 0 10px;position:relative;z-index:1}.welcome-panel p{color:#d4defe;font-size:11px;line-height:1.8;max-width:250px;position:relative;z-index:1}.welcome-badge{font-size:9px;letter-spacing:1px;color:#d9e4ff}.welcome-badge i{margin-right:6px}.welcome-graphic{position:absolute;right:14px;bottom:-30px;width:145px;height:145px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:58px;color:rgba(255,255,255,.8)}.welcome-graphic span{position:absolute;width:190px;height:190px;border:1px solid rgba(255,255,255,.2);border-radius:50%}.welcome-graphic span:last-child{width:230px;height:230px}.empty-state{text-align:center;padding:35px 10px;color:#98a3b5}.empty-state b{display:block;color:#65738a;font-size:12px;margin-top:10px}.empty-state p{font-size:10px}.empty-icon{font-size:26px;color:#b9c5db}.split-grid{display:grid;grid-template-columns:minmax(260px,.85fr) minmax(0,1.5fr);gap:18px;align-items:start}.form-panel{max-width:700px}form label{display:block;font-size:10px;font-weight:700;color:#59677f;margin:13px 0 7px}input,select,textarea{width:100%;border:1px solid #e1e7f0;border-radius:9px;padding:11px 12px;font:inherit;font-size:11px;color:#293852;background:#fff;outline:none}input:focus,select:focus,textarea:focus{border-color:#6e8bff;box-shadow:0 0 0 3px #edf1ff}textarea{resize:vertical}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:9px;padding:12px 16px;margin-top:17px;background:linear-gradient(100deg,#4169f5,#28b9d0);color:#fff;font:inherit;font-weight:700;font-size:11px;cursor:pointer;box-shadow:0 6px 14px rgba(65,105,245,.18)}.btn-primary:hover{filter:brightness(1.04);transform:translateY(-1px)}.full{width:100%}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;color:#8994a8;font-size:9px;text-transform:uppercase;letter-spacing:.7px;background:#f8faff;padding:12px 11px}td{padding:13px 11px;border-bottom:1px solid #f0f2f6;font-size:10px;color:#53617a}td b{color:#293852}.table-sub{display:block;font-size:9px;color:#9ba5b5;margin-top:4px}.empty-cell{text-align:center;color:#a2adbd;padding:30px}.status{padding:5px 8px;border-radius:20px;font-size:9px;font-weight:700}.status.active{background:#e9faf4;color:#16a477}.status.warning{background:#fff5e7;color:#c98622}.alert{padding:12px 14px;border-radius:9px;margin-bottom:17px;font-size:11px}.alert i{margin-right:8px}.alert.success{background:#eafaf4;color:#16875f}.alert.danger{background:#fff0f0;color:#c34e56}.form-hint{font-size:10px;color:#99a4b5;line-height:1.7;margin-top:14px}.announcement-list{display:grid;gap:12px}.announcement{display:flex;gap:14px}.announcement-icon{width:38px;height:38px;flex:none;display:grid;place-items:center;background:#edf2ff;color:#4168f5;border-radius:12px}.announcement h3{margin:0 0 8px}.announcement p{font-size:11px;color:#66748b;line-height:1.7}.announcement small{font-size:9px;color:#9aa4b6}.login-page{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;background:#fff}.login-art{background:radial-gradient(circle at 70% 20%,#345fba 0,#1d3470 36%,#101d3a 78%);color:#fff;position:relative;overflow:hidden;padding:45px 8vw;display:flex;align-items:center}.art-content{position:relative;z-index:1;max-width:490px}.login-logo{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:800;letter-spacing:1.5px}.hero-illustration{height:240px;position:relative;margin:34px 0 10px}.hero-card{position:absolute;left:60px;top:22px;width:190px;height:155px;background:linear-gradient(140deg,#fff,#dfe9ff);border-radius:18px;box-shadow:0 25px 55px #07132e66;padding:24px;color:#315efb;transform:rotate(-8deg)}.hero-card i{font-size:34px;margin-bottom:18px}.hero-card span{display:block;height:6px;background:#c5d3ef;border-radius:10px;margin:8px 0;width:80%}.hero-card span:last-child{width:55%}.hero-person{position:absolute;left:210px;top:78px;width:118px;height:118px;border-radius:38px;background:linear-gradient(135deg,#35c5d7,#4777ff);display:grid;place-items:center;font-size:65px;color:#fff;box-shadow:0 18px 35px #06142c66}.hero-spark{position:absolute;left:340px;top:20px;color:#ffd77a;font-size:24px}.art-orbit{position:absolute;border:1px solid #ffffff15;border-radius:50%;width:500px;height:500px;right:-200px;top:-170px}.orbit-two{width:700px;height:700px;right:-280px;top:-250px}.login-art h1{font-size:38px;line-height:1.2;letter-spacing:-1.7px;margin:0 0 15px}.login-art h1 em{font-style:normal;color:#58d4e1}.login-art p{color:#b8c7e6;font-size:13px;line-height:1.8;max-width:390px}.art-foot{margin-top:35px;color:#91a8d4;font-size:10px}.art-foot i{margin-right:8px;color:#4ad2bd}.login-panel{display:grid;place-items:center;padding:40px}.login-box{width:100%;max-width:370px}.login-box h2{font-size:27px;margin-bottom:9px}.login-box form{margin-top:30px}.login-box label{margin-top:18px}.input-icon{position:relative}.input-icon i{position:absolute;left:13px;top:13px;color:#9ba8bc}.input-icon input{padding-left:39px}.login-note{margin-top:25px;padding:13px;background:#f5f8ff;border-radius:9px;color:#7787a2;font-size:10px;line-height:1.6}.login-note i{color:#4c73f5;margin-right:6px}.login-copy{margin-top:40px;color:#b0b8c5;font-size:9px;text-align:center}.mobile-brand{display:none}.installer-body{background:#f3f6fc;min-height:100vh;padding:35px 15px}.installer-wrap{max-width:610px;margin:0 auto}.installer-brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:800;color:#172642;margin:0 0 20px 4px}.installer-panel{padding:30px}.installer-panel h1{font-size:27px;margin-bottom:8px}.installer-panel form{margin-top:20px}.installer-panel h3{font-size:13px;margin:0 0 8px}.install-section{margin-top:24px!important;padding-top:20px;border-top:1px solid var(--line)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.installer-foot{text-align:center;color:#a1adbf;font-size:10px;margin-top:20px}.install-success{text-align:center;padding:30px 0}.install-success>i{font-size:50px;color:#18b989}.install-success h1{margin-top:20px}.install-success p{color:#8592a7;font-size:12px}.install-success a{margin-top:15px}
@media(max-width:1100px){.stat-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.split-grid{grid-template-columns:1fr}.login-art{padding:35px 5vw}.login-art h1{font-size:32px}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:translateX(0);box-shadow:15px 0 35px #0b173744}.main-area{margin-left:0}.menu-toggle{display:block}.topbar{height:64px;padding:0 17px}.content{padding:23px 16px}.footer{padding:16px}.footer span{display:none}.crumb{font-size:10px}.top-user>span:last-child{display:none}.page-heading h1{font-size:21px}.date-chip{display:none}.login-page{grid-template-columns:1fr}.login-art{display:none}.login-panel{min-height:100vh;padding:25px}.mobile-brand{display:flex;align-items:center;gap:9px;font-weight:800;color:#1a2a49;font-size:17px;margin-bottom:55px}.mobile-brand i{background:#315efb;color:#fff;padding:10px;border-radius:10px}.login-box h2{font-size:25px}.stat-grid{gap:10px}.stat-card{padding:13px;gap:10px}.stat-icon{width:37px;height:37px}.stat-card strong{font-size:19px}.panel{padding:16px}.two-col{grid-template-columns:1fr}}
