@font-face { font-family: 'OLU Noto'; src: url('/assets/NotoSansArabic-variable.ttf') format('truetype'); font-style: normal; font-weight: 100 900; font-display: swap; }
:root { font-family: 'OLU Noto', 'Segoe UI', Tahoma, sans-serif; color: #16243b; background: #f5f8fd; }
header { background: #fff; color: #16243b; border-bottom: 1px solid #dce5f0; padding-block: 24px; }
header strong { color: #175bc4 !important; letter-spacing: -.04em !important; }
header p { color: #52647b; }
main { margin-block: 30px; }
.panel { background: #fff; border-color: #dce5f0; border-radius: 18px; padding: 24px; box-shadow: 0 12px 36px #193b6909; }
.notice { color: #60460d; background: #fff8e8; border-color: #c89a38; }
input, textarea, select { color: #16243b; border-color: #cbd9e8; border-radius: 10px; }
input:focus, select:focus, textarea:focus, button:focus-visible { outline-color: #175bc4; }
button { background: #175bc4; color: #fff; border-radius: 10px; min-height: 44px; }
button.secondary { color: #164f9e; background: #fff; border-color: #cbd9e8; }
.menu button[aria-current=page] { background: #104a9e; color: #fff; }
.stat { background: #f5f8fd; border-color: #dce5f0; border-radius: 12px; }
.stat strong { color: #175bc4; }
th { background: #edf4ff; }
a { color: #1556b1; }
@media(max-width:640px) { header { padding: 20px; } .panel { padding: 18px; } }