@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@500;600;700;800&display=swap');
:root{--ink:#17243a;--muted:#748198;--line:#e8edf4;--navy:#14243b;--canvas:#f5f7fb}
*{box-sizing:border-box}
body{font-family:'DM Sans',system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--canvas);min-height:100vh}
.app-shell{display:flex;flex-direction:column}
.app-navbar{height:76px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 3px 16px rgba(20,36,59,.035)}
.navbar-brand{text-decoration:none;color:var(--ink);margin:0}
.brand-symbol{width:42px;height:42px;display:grid;place-items:center;background:var(--navy);color:#fff;border-radius:12px;font-size:11px;font-weight:800;letter-spacing:.06em}
.brand-name{font-family:Manrope,sans-serif;font-size:19px;font-weight:800;letter-spacing:-.6px}
.brand-name span{font-weight:500;color:#8090a6}
.user-chip{display:flex;align-items:center;gap:9px;color:#536178;font-size:13px;font-weight:600}
.user-avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#eaf0f9;color:#28466f;font-weight:800}
.btn-logout{border:1px solid var(--line);color:#607087;border-radius:10px;padding:7px 12px;font-size:13px;font-weight:600;display:flex;gap:9px;align-items:center}
.btn-logout:hover{background:#f4f6fa;border-color:#d8e0eb;color:var(--ink)}
.app-main{width:100%;max-width:1600px;margin:0 auto;flex:1;padding-top:30px!important}
.welcome-panel{position:relative;overflow:hidden;min-height:204px;border-radius:20px;padding:34px 40px;background:linear-gradient(112deg,#14243b 0%,#1d3657 65%,#294d75 100%);color:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:0 12px 30px rgba(20,36,59,.12)}
.welcome-copy{position:relative;z-index:2;max-width:650px}
.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.7px;color:#8da7c8}
.welcome-panel h1{font-family:Manrope,sans-serif;font-size:clamp(25px,3vw,34px);font-weight:800;letter-spacing:-1px;margin:9px 0}
.welcome-panel p{color:#c4d1e1;margin:0;font-size:14px;max-width:560px;line-height:1.65}
.welcome-art{width:230px;height:170px;position:absolute;right:7%;top:15px;opacity:.85}
.art-ring{position:absolute;border:1px solid rgba(255,255,255,.13);border-radius:50%;width:180px;height:180px;right:0;top:0}
.ring-two{width:135px;height:135px;right:22px;top:22px;border-color:rgba(255,255,255,.2)}
.art-document{position:absolute;width:78px;height:102px;right:72px;top:32px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);border-radius:9px;transform:rotate(8deg);padding:20px 12px}
.art-document span{display:block;height:4px;background:rgba(255,255,255,.55);border-radius:5px;margin-bottom:8px}
.art-document span:nth-child(2){width:75%}.art-document span:nth-child(3){width:55%}
.art-document b{display:block;margin-top:10px;font:800 12px Manrope;color:#fff;letter-spacing:2px}
.section-heading{display:flex;align-items:end;justify-content:space-between;margin:27px 0 14px}
.section-heading h2{font:800 21px Manrope,sans-serif;letter-spacing:-.55px;margin:4px 0 0}
.section-heading p{font-size:13px;color:var(--muted);margin:5px 0 0}
.version-tag{font-size:10px;font-weight:800;letter-spacing:1px;color:#7b8ba1;background:#eaf0f7;border-radius:20px;padding:7px 11px}
.stat-card{height:100%;min-height:142px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:19px 20px;box-shadow:0 4px 14px rgba(25,43,69,.025);transition:transform .2s,box-shadow .2s}
.stat-card:hover,.module-card:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(25,43,69,.075)}
.stat-top{display:flex;justify-content:space-between;align-items:center;color:#65748a;font-size:12px;font-weight:600}
.stat-icon,.module-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;font-size:17px}
.blue{background:#eaf2ff;color:#4778c5}.violet{background:#f1edff;color:#8065c5}.teal{background:#e6f7f4;color:#309b8b}.amber{background:#fff4e3;color:#c58a32}
.stat-value{font:800 29px Manrope,sans-serif;letter-spacing:-1px;margin-top:7px;color:var(--ink)}
.stat-hint{font-size:11px;color:#9aa5b5;margin-top:1px}
.module-card{height:100%;min-height:220px;padding:20px;background:#fff;border:1px solid var(--line);border-radius:15px;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.module-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.module-icon{width:43px;height:43px;font-size:18px}
.module-number{font:700 12px Manrope;color:#b3bdca;letter-spacing:1px}
.module-card h3{font:800 15px Manrope,sans-serif;margin:0 0 8px;letter-spacing:-.2px}
.module-card p{font-size:12px;line-height:1.65;color:#7d899b;margin:0 0 18px;flex:1}
.module-card-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #f0f2f6;padding-top:13px}
.coming-soon{display:flex;align-items:center;gap:7px;font-size:10px;color:#8995a6;font-weight:600}
.coming-soon i{width:6px;height:6px;background:#d7a34e;border-radius:50%}
.module-arrow{font-size:17px;color:#a8b3c1}
.app-footer{max-width:1600px;width:100%;margin:30px auto 0;padding-top:15px!important;padding-bottom:18px!important;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#9aa5b5;font-size:11px}
.login-card{width:100%;max-width:440px}.brand-mark{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;background:#212529;color:#fff;font-weight:800;letter-spacing:.04em}
@media(max-width:700px){.app-navbar{height:66px}.user-name{display:none}.welcome-panel{padding:27px 24px;min-height:190px}.welcome-art{right:-85px;opacity:.45}.welcome-copy{max-width:85%}.section-heading{margin-top:23px}.app-footer{gap:12px;flex-wrap:wrap}.logout-label{display:none}}