@font-face{font-family:Almarai;src:url("../fonts/almarai/Almarai-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Almarai;src:url("../fonts/almarai/Almarai-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
:root{--nav:#102a43;--nav2:#0b7285;--accent:#0b7285;--bg:#f4f7fb;--text:#243b53}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Almarai,Tahoma,Arial,sans-serif}
.topbar{background:linear-gradient(135deg,var(--nav),var(--nav2));min-height:72px;display:flex;align-items:center;box-shadow:0 5px 20px #102a4320}
.brand{color:#fff;text-decoration:none;display:flex;align-items:center;gap:12px}.brand:hover{color:#fff}
.brand-mark{width:44px;height:44px;border-radius:13px;background:#ffffff18;display:grid;place-items:center;font-size:22px}
.brand small{display:block;opacity:.8;font-size:11px;margin-top:4px}.user-chip{color:#fff;font-size:13px}
.hero{background:linear-gradient(135deg,var(--nav),var(--nav2));color:#fff;border-radius:26px;padding:48px;box-shadow:0 15px 40px #102a4330}
.hero h1{font-size:clamp(26px,4vw,44px);font-weight:700;line-height:1.4}.hero p{opacity:.9;max-width:760px}
.card{border:0;border-radius:18px;box-shadow:0 7px 28px #102a4312}.stat{padding:22px;height:100%}.stat-label{color:#627d98;font-size:13px}.stat-number{font-size:30px;font-weight:700;margin-top:8px}
.page-shell{display:flex;min-height:calc(100vh - 72px)}.sidebar{width:245px;background:#fff;border-left:1px solid #e9eef3;padding:18px;flex:none}.side-title{font-weight:700;padding:10px 12px;color:#486581}.side-link{display:block;color:#334e68;text-decoration:none;padding:12px;border-radius:11px;margin:4px 0}.side-link:hover{background:#e7f6f8;color:var(--accent)}
.page-content{flex:1;padding:28px;min-width:0}.table{vertical-align:middle}.form-control,.form-select{border-radius:11px;padding:.72rem}.btn{border-radius:10px}.badge{font-weight:700}
.footer{padding:30px 0;margin-top:35px;border-top:1px solid #e4e7eb;background:#fff}
.feature{padding:25px;height:100%}.feature-icon{font-size:30px;margin-bottom:10px}
.timeline{border-right:3px solid var(--accent);padding-right:20px}.timeline-item{margin-bottom:20px}
@media(max-width:800px){.sidebar{width:100%;border-left:0;border-bottom:1px solid #e9eef3}.page-shell{display:block}.page-content{padding:16px}.hero{padding:28px}.user-chip{display:none}}