:root{font-family:Inter,"Segoe UI","Noto Sans SC",Arial,sans-serif;color:#203454;background:#f8f4ee;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0}
button{font:inherit}
button:focus-visible{outline:3px solid #ff8a32;outline-offset:3px}
[hidden]{display:none!important}
.app-shell{display:flex;min-height:100vh}
.sidebar{width:252px;flex-shrink:0;background:linear-gradient(170deg,#143c8b 0%,#0f4ed0 64%,#1940a1 100%);color:white;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding:29px 16px 20px}
.brand{display:flex;align-items:center;gap:12px;padding:3px 11px 42px}
.brand-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:15px;background:#fff0d9;color:#ff7300;font-size:30px;box-shadow:0 5px 15px #001d4a30}
.brand strong{display:block;font-size:22px;letter-spacing:-.8px}
.brand strong span{color:#ffb365}
.brand small{display:block;font-size:9px;letter-spacing:1.8px;color:#d8e7ff;margin-top:4px}
.side-label{font-size:10px;letter-spacing:2px;color:#acc5f7;padding:0 14px 13px}
.nav{display:grid;gap:7px}
.nav-link{display:flex;align-items:center;gap:13px;text-align:left;width:100%;border:0;color:#dce9ff;background:transparent;border-radius:13px;padding:12px 14px;cursor:pointer;min-height:57px}
.nav-link:hover{background:#ffffff18}
.nav-link.active{background:#fff;color:#1249bf;box-shadow:0 6px 18px #082f862b}
.nav-link span:nth-child(2){font-size:14px;font-weight:750}
.nav-link small{display:block;font-size:11px;font-weight:400;margin-top:4px;opacity:.78}
.nav-icon{font-size:23px;width:27px;text-align:center}
.lock{margin-left:auto;font-size:13px}
.sidebar-bottom{display:flex;align-items:center;gap:10px;margin-top:auto;border-top:1px solid #ffffff30;padding:22px 10px 2px;font-size:12px}
.sidebar-bottom small{display:block;font-size:11px;color:#c8d9ff;margin-top:4px}
.avatar{background:#fff3dd;color:#ec6a09;width:38px;height:38px;border-radius:13px;display:grid;place-items:center;font-weight:900;font-size:20px}
.main-wrap{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{height:76px;background:#fffdfa;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(20px,4vw,58px);border-bottom:1px solid #ece8e2}
.breadcrumb{font-size:13px;color:#75829a}
.breadcrumb span{padding:0 9px;color:#bdc5d0}
.breadcrumb b{color:#203454}
.top-right,.top-left{display:flex;align-items:center;gap:16px}
.environment{font-size:11px;color:#be6b10;background:#fff0d9;padding:9px 13px;border-radius:30px;font-weight:700}
.date{font-size:12px;color:#8190a5}
.menu-toggle{display:none;background:white;border:1px solid #e0e7f3;border-radius:9px;padding:8px 12px;color:#0f4ed0}
.content{width:100%;max-width:1510px;margin:0 auto;padding:35px clamp(20px,4vw,58px) 50px;flex:1}
.welcome{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;min-height:228px;border-radius:23px;padding:34px 42px;background:linear-gradient(107deg,#e6f0ff 0%,#f3f7ff 64%,#fff0d9 100%);border:1px solid #e4edff}
.eyebrow{font-size:10px;letter-spacing:2px;color:#0f4ed0;font-weight:800}
.welcome h1{font-size:clamp(25px,2.7vw,36px);letter-spacing:-1.3px;margin:13px 0;color:#16356d;line-height:1.2}
.sparkle{color:#ff7300}
.welcome p{font-size:14px;line-height:1.7;color:#61718d;max-width:600px;margin:0 0 19px}
.preview-note{display:inline-block;background:white;color:#b45f14;border:1px solid #f7dbb7;padding:8px 12px;border-radius:30px;font-size:11px;font-weight:700}
.welcome-art{width:165px;height:165px;position:relative;flex-shrink:0}
.orb{width:145px;height:145px;border-radius:42px;transform:rotate(-11deg);display:grid;place-items:center;background:linear-gradient(135deg,#ffac43,#ff7300);box-shadow:0 22px 40px #f5a04455;color:#fff;font-size:80px}
.art-1,.art-2{position:absolute;color:#0f4ed0;font-size:30px}
.art-1{top:3px;right:4px}
.art-2{bottom:0;right:5px;color:#ff7300}
.section-heading{display:flex;justify-content:space-between;align-items:center;margin:32px 0 16px;gap:10px}
.section-heading h2{font-size:18px;margin:0;color:#1e3658}
.section-heading h2 span{font-size:13px;color:#8a98ab;font-weight:500;margin-left:8px}
.muted{font-size:11px;color:#9ba8b8}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.stat{border-radius:18px;min-height:177px;padding:21px 22px;border:1px solid #ffffffa0;display:flex;flex-direction:column;align-items:flex-start}
.stat.blue{background:#e5efff}
.stat.orange{background:#fff0e1}
.stat.mint{background:#dff7ef}
.stat.lilac{background:#f0e8ff}
.stat-symbol{font-size:24px;color:#0f4ed0}
.orange .stat-symbol{color:#f47718}
.mint .stat-symbol{color:#1da786}
.lilac .stat-symbol{color:#9463d4}
.stat-number{font-size:34px;font-weight:800;color:#19375f;margin:12px 0 4px}
.stat b{font-size:13px}
.stat small{font-size:11px;color:#78869a;margin-top:5px}
.quick-title{margin-top:40px}
.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.quick{display:flex;align-items:center;gap:12px;min-height:100px;text-align:left;padding:18px;border:1px solid #e8e9ec;background:white;border-radius:17px;cursor:pointer;box-shadow:0 6px 19px #294e6b08;transition:transform .2s,box-shadow .2s}
.quick:hover{transform:translateY(-3px);box-shadow:0 10px 24px #294e6b13}
.quick-icon,.module-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;font-size:23px;flex-shrink:0}
.q-blue{background:#e5efff;color:#0f4ed0}
.q-orange{background:#fff0e1;color:#ff7300}
.q-lilac{background:#f0e8ff;color:#8d5ed1}
.q-mint{background:#dff7ef;color:#139d82}
.quick b{display:block;font-size:13px;color:#203454}
.quick small{display:block;color:#8592a4;margin-top:5px;font-size:11px}
.quick-arrow{margin-left:auto;color:#a2b0c0}
.bottom-note{display:flex;align-items:center;gap:15px;margin-top:35px;background:#fffdfa;border:1px solid #ece9e5;padding:22px 25px;border-radius:17px}
.bottom-note>span{font-size:30px;color:#ff7300}
.bottom-note b{font-size:13px}
.bottom-note p{font-size:12px;line-height:1.7;color:#8691a2;margin:5px 0 0}
.module{background:#fffdfa;border:1px solid #ece8e2;border-radius:22px;padding:40px;min-height:330px}
.module-icon{margin-bottom:23px}
.module h1{font-size:30px;margin:12px 0}
.module h1 span{font-size:18px;color:#8d99a9;font-weight:500}
.module p{color:#718099;line-height:1.7;font-size:14px}
.coming{display:inline-block;background:#fff0df;color:#b76413;border-radius:12px;padding:12px 16px;font-size:12px;margin-top:20px;font-weight:700}
footer{padding:18px clamp(20px,4vw,58px);border-top:1px solid #ebe8e3;font-size:11px;color:#98a3b1;display:flex;justify-content:space-between;gap:10px}
.overlay{display:none}
@media(max-width:1150px){.stats,.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.sidebar{width:225px}
.welcome-art{transform:scale(.8);margin-right:-15px}
}
@media(max-width:760px){.sidebar{position:fixed;z-index:30;transform:translateX(-105%);transition:transform .2s;box-shadow:15px 0 40px #142c4c2b}
.sidebar.open{transform:translateX(0)}
.overlay:not([hidden]){display:block;position:fixed;inset:0;background:#122c4c70;z-index:20}
.menu-toggle{display:inline-block}
.topbar{height:65px}
.content{padding-top:21px}
.welcome{padding:26px 22px;min-height:0}
.welcome-art{display:none}
.welcome h1{font-size:26px}
.stats,.quick-grid{gap:11px}
.stat{padding:17px 15px;min-height:160px}
.stat b{font-size:12px}
.stat-number{font-size:30px}
.quick{min-height:90px;padding:13px;gap:9px}
.quick-icon{width:38px;height:38px}
.quick-arrow{display:none}
.date{display:none}
.muted{display:none}
.module{padding:28px 22px}
.section-heading h2{font-size:17px}
}
@media(max-width:390px){.stats,.quick-grid{grid-template-columns:1fr}
.stat{min-height:135px}
.quick{min-height:75px}
}