:root{--su-slate: #6B7F8C;--su-yellow: #F5C536;--bg-color: #F8FAFC;--text-main: #1E293B;--text-muted: #64748B;--font-main: "Tajawal";--su-yellow-dim: #D4AA2B;--su-slate-dark: #53646F;--su-slate-light: #8B9FA8;--gold: var(--su-yellow);--gold-light: #F8D76E;--gold-faint: rgba(245, 197, 54, .12);--bg-root: #F4F7F9;--bg-card: #FFFFFF;--bg-raised: #F8F9FA;--bg-input: #FFFFFF;--bg-hover: #F0F3F5;--bg-item: #f8fafc;--bg-warning: #fffbeb;--text-warning: #b45309;--border-warning: #fef3c7;--text-primary: #1E293B;--text-muted: var(--su-slate);--text-dim: #94A3B8;--success: #10B981;--danger: #EF4444;--warning: #F59E0B;--info: #3B82F6;--border: #E2E8F0;--border-item: #e2e8f0;--border-gold: var(--su-yellow);--radius: 16px;--radius-sm: 10px;--radius-lg: 24px;--shadow: 0 10px 25px rgba(107, 127, 140, .08);--transition: .2s ease-in-out;--font-ar: "Tajawal", sans-serif;--font-en: "Outfit", sans-serif}html[data-theme=dark]{--bg-root: #0B0F19;--bg-card: #151E2E;--bg-raised: #202D42;--bg-input: #1C2738;--bg-hover: #202D42;--bg-item: #1C2738;--bg-warning: rgba(245, 197, 54, .08);--text-warning: #F5C536;--border-warning: rgba(245, 197, 54, .2);--text-primary: #F8FAFC;--text-muted: #94A3B8;--text-dim: #64748B;--border: #222F43;--border-item: #222F43;--border-gold: var(--su-yellow);--su-slate-dark: #A5B4FC;--su-slate-light: #475569;--gold-faint: rgba(245, 197, 54, .08);--shadow: 0 10px 30px rgba(0, 0, 0, .4)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased}html[dir=rtl]{direction:rtl;font-family:var(--font-ar)}html[dir=ltr]{direction:ltr;font-family:var(--font-en)}body{font-family:inherit;background:var(--bg-root);color:var(--text-primary);direction:inherit;min-height:100vh;line-height:1.65}a{color:var(--su-slate-dark);text-decoration:none;transition:color var(--transition)}a:hover{color:var(--su-yellow-dim)}img{max-width:100%;display:block}input,select,textarea,button{font-family:inherit}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-root)}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--su-slate)}.container{max-width:1200px;margin:0 auto;padding:0 24px}.flex-center{display:flex;align-items:center;justify-content:center}.text-gold{color:var(--su-yellow)!important}.text-muted{color:var(--text-muted)!important}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.mb-4{margin-bottom:32px}.su-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:32px;box-shadow:0 2px 8px #00000005;transition:all var(--transition)}.su-card:hover{border-color:var(--su-slate-light);box-shadow:var(--shadow)}.su-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;border:none;border-radius:var(--radius-sm);font-weight:700;font-size:.95rem;cursor:pointer;transition:all var(--transition);white-space:nowrap}.su-btn:disabled{opacity:.5;cursor:not-allowed}.su-btn--gold{background:var(--su-yellow);color:#1e293b}.su-btn--gold:hover:not(:disabled){background:var(--su-yellow-dim);transform:translateY(-2px);box-shadow:0 4px 12px #f5c5364d}.su-btn--outline{background:transparent;color:var(--su-slate-dark);border:2px solid var(--border)}.su-btn--outline:hover:not(:disabled){border-color:var(--su-slate);background:var(--bg-raised)}.su-btn--ghost{background:transparent;color:var(--su-slate)}.su-btn--ghost:hover:not(:disabled){color:var(--su-slate-dark);background:var(--bg-hover)}.su-btn--block{width:100%;justify-content:center}.su-field{margin-bottom:20px}.su-label{display:block;font-size:.9rem;font-weight:600;color:var(--text-primary);margin-bottom:8px}.su-input{width:100%;padding:14px 16px;background:var(--bg-input);border:2px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.95rem;outline:none;transition:all var(--transition)}.su-input:focus{border-color:var(--su-yellow);box-shadow:0 0 0 4px #f5c53626}.su-input::placeholder{color:var(--text-dim)}.su-select{width:100%;padding:14px 16px;background:var(--bg-input);border:2px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.95rem;outline:none;cursor:pointer;transition:border-color var(--transition)}.su-select:focus{border-color:var(--su-yellow)}.su-input-row{display:flex}html[dir=rtl] .su-input-row>.su-select{border-radius:0 var(--radius-sm) var(--radius-sm) 0;border-left:none;border-right:2px solid var(--border);max-width:160px}html[dir=rtl] .su-input-row>.su-input{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}html[dir=ltr] .su-input-row>.su-select{border-radius:var(--radius-sm) 0 0 var(--radius-sm);border-right:none;border-left:2px solid var(--border);max-width:160px}html[dir=ltr] .su-input-row>.su-input{border-radius:0 var(--radius-sm) var(--radius-sm) 0}.su-alert{padding:14px 20px;border-radius:var(--radius-sm);font-size:.95rem;font-weight:500;margin-bottom:24px;display:flex;align-items:center;gap:12px}.su-alert--error{background:#fef2f2;color:#b91c1c;border:1px solid #FECACA}.su-alert--success{background:#f0fdf4;color:#15803d;border:1px solid #BBF7D0}.su-badge{display:inline-flex;align-items:center;padding:6px 14px;border-radius:20px;font-size:.8rem;font-weight:700}.su-badge--gold{background:var(--gold-faint);color:var(--su-yellow-dim);border:1px solid var(--su-yellow)}.su-badge--success{background:#dcfce7;color:#166534}.su-badge--danger{background:#fee2e2;color:#991b1b}.su-badge--warning{background:#fef3c7;color:#92400e}.su-badge--info{background:#dbeafe;color:#1e40af}.su-badge--muted{background:#f1f5f9;color:#475569}.su-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:32px}.su-stat{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;text-align:center;box-shadow:0 2px 6px #00000005}.su-stat__num{font-family:var(--font-en);font-size:2.5rem;font-weight:800;color:var(--su-slate-dark);line-height:1;margin-bottom:8px}.su-stat__label{font-size:.95rem;font-weight:600;color:var(--su-slate)}.su-spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--su-yellow);border-radius:50%;animation:spin .75s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.su-loading{display:flex;align-items:center;justify-content:center;padding:80px}.su-progress{height:10px;background:var(--border);border-radius:5px;overflow:hidden}.su-progress__bar{height:100%;background:var(--su-yellow);border-radius:5px;transition:width .5s ease}.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 16px;background:radial-gradient(circle at top left,#fff,#f4f7f9)}.auth-box{width:100%;max-width:440px}.auth-logo{text-align:center;margin-bottom:24px;display:flex;flex-direction:column;align-items:center;justify-content:center}.auth-logo__img{height:52px;width:auto;max-width:180px;object-fit:contain;display:block;margin:0 auto 10px;transition:transform .2s ease}.auth-logo__img:hover{transform:scale(1.03)}.auth-logo__sub{font-size:1.05rem;font-weight:600;color:var(--su-slate-dark);margin-top:4px}.app-shell{display:flex;min-height:100vh}.sidebar{width:280px;background:var(--bg-card);display:flex;flex-direction:column;position:fixed;top:0;bottom:0;z-index:100}html[dir=rtl] .sidebar{right:0;left:auto;border-left:1px solid var(--border);box-shadow:-2px 0 10px #00000005}html[dir=ltr] .sidebar{left:0;right:auto;border-right:1px solid var(--border);box-shadow:2px 0 10px #00000005}.sidebar__brand{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;min-height:70px}.sidebar__brand-img{height:42px;width:auto;max-width:140px;object-fit:contain;display:block;transition:opacity .2s ease}.sidebar__brand-img:hover{opacity:.9}.sidebar__nav{flex:1;padding:24px 16px;overflow-y:auto}.sidebar__link{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:var(--radius-sm);color:var(--su-slate);font-size:1rem;font-weight:600;transition:all var(--transition);margin-bottom:8px}.sidebar__link:hover{background:var(--bg-hover);color:var(--su-slate-dark)}.sidebar__link.active{background:var(--gold-faint);color:var(--su-yellow-dim)}.sidebar__link svg{font-size:1.3rem}.sidebar__foot{padding:20px 24px;border-top:1px solid var(--border);background:var(--bg-raised)}.main-area{flex:1;padding:40px 48px;min-height:100vh}html[dir=rtl] .main-area{margin-right:280px;margin-left:0}html[dir=ltr] .main-area{margin-left:280px;margin-right:0}.main-area__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:40px}.main-area__title{font-size:1.8rem;font-weight:800;color:var(--text-primary)}.su-filters{display:flex;gap:16px;margin-bottom:32px}.item-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px 32px;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;gap:20px;transition:all var(--transition)}.item-card:hover{border-color:var(--su-slate-light);box-shadow:0 4px 12px #6b7f8c0d}.item-card__title{font-size:1.15rem;font-weight:700;color:var(--text-primary);margin-bottom:8px}.item-card__meta{font-size:.9rem;color:var(--su-slate);display:flex;gap:20px;font-weight:500}.q-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:40px;margin-bottom:24px;box-shadow:0 2px 12px #00000005}.q-panel__prompt{font-size:1.25rem;font-weight:700;margin-bottom:32px;line-height:1.6;color:var(--su-slate-dark)}.q-choice{padding:16px 24px;background:var(--bg-root);border:2px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;gap:16px;font-size:1.05rem;font-weight:600;color:var(--su-slate-dark);margin-bottom:12px;transition:all var(--transition)}.q-choice:hover{border-color:var(--su-slate-light)}.q-choice.selected{border-color:var(--su-yellow);background:var(--gold-faint);color:var(--su-yellow-dim)}.q-choice__marker{width:24px;height:24px;border:2px solid #CBD5E1;border-radius:50%;display:flex;align-items:center;justify-content:center}.q-choice.selected .q-choice__marker{border-color:var(--su-yellow);background:var(--su-yellow)}.q-choice.selected .q-choice__marker:after{content:"";width:10px;height:10px;border-radius:50%;background:#fff}.timer-bar{display:flex;align-items:center;gap:16px;padding:16px 24px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:32px;box-shadow:0 2px 8px #00000008}.timer-bar__time{font-family:var(--font-en);font-size:1.4rem;font-weight:800;color:var(--su-slate-dark)}.result-hero{text-align:center;padding:60px 40px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:40px;box-shadow:var(--shadow)}.result-hero__score{font-family:var(--font-en);font-size:5rem;font-weight:800;color:var(--su-yellow);line-height:1}.result-hero__mark{display:inline-block;margin-top:16px;padding:8px 32px;border-radius:30px;font-family:var(--font-en);font-size:1.5rem;font-weight:800;background:var(--su-slate);color:#fff}.mobile-header{display:none;position:fixed;top:0;left:0;right:0;height:56px;background:var(--bg-card);border-bottom:1px solid var(--border);z-index:9999;padding:0 16px;align-items:center;justify-content:space-between;box-shadow:0 2px 10px #0000000f}@media(max-width:768px){.mobile-header{display:flex!important}.main-area{margin-right:0!important;margin-left:0!important;padding:72px 14px 24px!important;width:100%!important;box-sizing:border-box!important}html[dir=rtl] .sidebar{position:fixed;top:0;bottom:0;right:0;width:280px;z-index:999999;transform:translate(100%);transition:transform .3s ease-in-out}html[dir=ltr] .sidebar{position:fixed;top:0;bottom:0;left:0;width:280px;z-index:999999;transform:translate(-100%);transition:transform .3s ease-in-out}.sidebar.sidebar--open{transform:translate(0)!important;box-shadow:0 0 40px #00000080!important}.su-card{padding:16px!important;border-radius:12px!important}.item-card{flex-direction:column;align-items:flex-start}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:1rem}body,#root{overflow-x:hidden}}html[data-theme=dark] [style*="background: #ffffff"],html[data-theme=dark] [style*="background: #fff"],html[data-theme=dark] [style*="background: rgb(255, 255, 255)"],html[data-theme=dark] [style*="background-color: #ffffff"],html[data-theme=dark] [style*="background-color: #fff"]{background-color:var(--bg-card)!important;background:var(--bg-card)!important}html[data-theme=dark] [style*="background: #f8fafc"],html[data-theme=dark] [style*="background: #F8FAFC"]{background-color:var(--bg-item)!important;background:var(--bg-item)!important}html[data-theme=dark] [style*="background: #fffbeb"]{background-color:var(--bg-warning)!important;background:var(--bg-warning)!important}html[data-theme=dark] [style*="color: #b45309"]{color:var(--text-warning)!important}html[data-theme=dark] [style*="border: 1px solid #e2e8f0"],html[data-theme=dark] [style*="border: 1px solid #E2E8F0"]{border:1px solid var(--border)!important}html[data-theme=dark] [style*="border-bottom: 1px solid #e2e8f0"],html[data-theme=dark] [style*="border-bottom: 1px solid #E2E8F0"],html[data-theme=dark] [style*="border-bottom: 1px solid #f1f5f9"],html[data-theme=dark] [style*="border-bottom: 1px solid #F1F5F9"]{border-bottom:1px solid var(--border)!important}html[data-theme=dark] [style*="border-right: 1px dashed #cbd5e1"],html[data-theme=dark] [style*="border-right: 1px dashed #CBD5E1"]{border-right:1px dashed var(--border)!important}html[data-theme=dark] [style*="border: 1px solid #cbd5e1"],html[data-theme=dark] [style*="border: 1px solid #CBD5E1"]{border:1px solid var(--border)!important}html[data-theme=dark] [style*="border: 2px dashed #cbd5e1"]{border:2px dashed var(--border)!important}html[data-theme=dark] [style*="color: #64748b"],html[data-theme=dark] [style*="color: #64748B"],html[data-theme=dark] [style*="color: #475569"]{color:var(--text-muted)!important}html[data-theme=dark] [style*="background: #f0fdf4"]{background:#10b9811a!important}html[data-theme=dark] [style*="color: #15803d"],html[data-theme=dark] [style*="color: #166534"]{color:#34d399!important}html[data-theme=dark] [style*="background: #fef2f2"]{background:#ef444426!important}html[data-theme=dark] [style*="color: #ef4444"],html[data-theme=dark] [style*="color: #EF4444"]{color:#f87171!important}html[data-theme=dark] select.su-input,html[data-theme=dark] input.su-input,html[data-theme=dark] select.su-select{background-color:var(--bg-input)!important;color:var(--text-primary)!important;border-color:var(--border)!important}html[data-theme=dark] .su-table th{background-color:var(--bg-item)!important;color:var(--text-primary)!important;border-color:var(--border)!important}