:root{--color-page: #f8f9fc;--color-surface: #ffffff;--color-surface-elevated: #ffffff;--color-surface-muted: #f4f5f9;--color-surface-hover: #eef0f7;--color-sidebar: #170b37;--color-sidebar-elevated: #201245;--color-sidebar-active: #3a2f55;--color-sidebar-border: rgba(255, 255, 255, .08);--color-sidebar-text: #cfc9e2;--color-sidebar-text-strong: #ffffff;--color-sidebar-text-muted: #8f86ad;--color-text-primary: #2a1c56;--color-text-secondary: #6b6683;--color-text-muted: #9a95ad;--color-text-inverse: #ffffff;--color-primary: #2a1c56;--color-primary-hover: #3a2870;--color-accent: #6d4aff;--color-accent-soft: #efeaff;--color-info: #3b6fd4;--color-info-soft: #e8f0fe;--color-success: #1f8a5b;--color-success-soft: #e5f6ed;--color-warning: #b46a06;--color-warning-soft: #fdf1de;--color-danger: #c23b3b;--color-danger-soft: #fdeaea;--color-neutral: #6b6683;--color-neutral-soft: #f0f0f5;--color-border: #d7d6df;--color-border-subtle: #e8e8ef;--color-focus: #6d4aff;--radius-xs: 6px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-pill: 999px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 40px;--space-9: 48px;--shadow-card: 0 1px 2px rgba(28, 20, 61, .04), 0 1px 3px rgba(28, 20, 61, .03);--shadow-raised: 0 4px 16px rgba(28, 20, 61, .08);--shadow-overlay: 0 18px 48px rgba(23, 11, 55, .24);--font-family-base: "Tajawal", "Segoe UI", system-ui, -apple-system, sans-serif;--font-size-xs: 11px;--font-size-sm: 12px;--font-size-base: 13px;--font-size-md: 14px;--font-size-lg: 16px;--font-size-xl: 18px;--font-size-2xl: 22px;--font-size-3xl: 28px;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-bold: 700;--font-weight-black: 800;--sidebar-width: 276px;--topbar-height: 68px;--color-brand-gold: #d4b56a;--content-max-width: 1600px;--transition-fast: .14s ease;--transition-base: .22s ease}*,*:before,*:after{box-sizing:border-box}html,body{height:100%}body{margin:0;background-color:var(--color-page);color:var(--color-text-primary);font-family:var(--font-family-base);font-size:var(--font-size-md);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3,h4,h5,h6{margin:0;font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1.35}p{margin:0}ul,ol{margin:0;padding:0;list-style:none}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}input,select,textarea{font:inherit;color:inherit}select option{background-color:var(--color-surface, #ffffff);color:var(--color-text-primary, #2a1c56)}.tabular,input[type=number]{font-variant-numeric:tabular-nums}:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px;border-radius:var(--radius-xs)}::selection{background:var(--color-accent-soft);color:var(--color-text-primary)}*{scrollbar-width:thin;scrollbar-color:#cdccd8 transparent}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-thumb{background:#cdccd8;border-radius:var(--radius-pill)}*::-webkit-scrollbar-track{background:transparent}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-card{background:var(--color-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.app-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:38px;padding-inline:var(--space-4);border:1px solid transparent;border-radius:var(--radius-sm);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);white-space:nowrap;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.app-btn:disabled{opacity:.55;cursor:not-allowed}.app-btn--primary{background:var(--color-primary);color:var(--color-text-inverse)}.app-btn--primary:hover:not(:disabled){background:var(--color-primary-hover)}.app-btn--accent{background:var(--color-accent);color:#fff;border-color:transparent}.app-btn--accent:hover:not(:disabled){background:#5a38e6}.app-btn--outline{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text-primary)}.app-btn--outline:hover:not(:disabled){background:var(--color-surface-hover)}.app-btn--ghost{background:transparent;color:var(--color-text-secondary)}.app-btn--ghost:hover:not(:disabled){background:var(--color-surface-hover);color:var(--color-text-primary)}.app-btn--danger{background:var(--color-danger-soft);color:var(--color-danger);border-color:transparent}.app-btn--danger:hover:not(:disabled){background:var(--color-danger);color:#fff}.app-btn--sm{min-height:30px;padding-inline:var(--space-3);font-size:var(--font-size-sm);gap:var(--space-1)}.app-btn--lg{min-height:46px;padding-inline:var(--space-6);font-size:var(--font-size-lg)}.app-field{display:flex;flex-direction:column;gap:var(--space-2)}.app-label{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.app-input,.app-select,.app-textarea{width:100%;min-height:40px;padding:var(--space-2) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);transition:border-color var(--transition-fast)}.app-input::placeholder,.app-select::placeholder,.app-textarea::placeholder{color:var(--color-text-muted)}.app-input:hover:not(:disabled),.app-select:hover:not(:disabled),.app-textarea:hover:not(:disabled){border-color:#c3c2ce}.app-input:disabled,.app-select:disabled,.app-textarea:disabled{background:var(--color-surface-muted);cursor:not-allowed}.app-textarea{min-height:92px;resize:vertical}.app-error-text{font-size:var(--font-size-sm);color:var(--color-danger)}.app-page{display:flex;flex-direction:column;gap:var(--space-6)}.app-page__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3)}.app-page__title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.app-page__subtitle{margin-block-start:var(--space-1);font-size:var(--font-size-base);color:var(--color-text-secondary)}