:root{--rgb-bg-primary: 31, 40, 55;--rgb-bg-secondary: 54, 64, 81;--rgb-border: 115, 121, 133;--rgb-text-primary: 232, 232, 232;--rgb-text-muted: 160, 160, 160;--rgb-accent-blue: 102, 179, 255;--rgb-accent-blue-hover: 153, 204, 255;--rgb-accent-orange: 255, 163, 102;--color-bg-primary: rgb(var(--rgb-bg-primary));--color-bg-secondary: rgb(var(--rgb-bg-secondary));--color-border: rgb(var(--rgb-border));--color-text-primary: rgb(var(--rgb-text-primary));--color-text-muted: rgb(var(--rgb-text-muted));--color-accent-blue: rgb(var(--rgb-accent-blue));--color-accent-blue-hover: rgb(var(--rgb-accent-blue-hover));--color-accent-orange: rgb(var(--rgb-accent-orange));--color-bg-secondary-70: rgba(var(--rgb-bg-secondary), .7);--color-bg-secondary-60: rgba(var(--rgb-bg-secondary), .6);--color-bg-secondary-80: rgba(var(--rgb-bg-secondary), .8);--color-bg-secondary-20: rgba(var(--rgb-bg-secondary), .2);--color-border-30: rgba(var(--rgb-border), .3);--color-border-50: rgba(var(--rgb-border), .5);--color-border-80: rgba(var(--rgb-border), .8);--color-text-primary-70: rgba(var(--rgb-text-primary), .7);--space-xs: .5rem;--space-sm: .75rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--font-arabic: "UthmanTNB", sans-serif;--font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body: var(--font-arabic), var(--font-system);--text-2xs: .625rem;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-2xl: 2rem;--weight-light: 300;--weight-normal: 400;--leading-tight: 1.5;--leading-normal: 1.6;--effect-glass-bg: rgba(var(--rgb-bg-secondary), .6);--effect-glass-blur: blur(10px) saturate(180%);--transition-fast: .2s ease;--transition-base: .3s ease;--border-width-thin: .5px;--border-width-base: 1px;--border-style: solid;--radius-sm: 4px;--radius-md: 8px;--z-background: 1;--z-content: 10;--z-header: 20;--z-modal: 100;--nav-height: 60px;--content-max-width: 1200px}.glass{background:var(--effect-glass-bg);backdrop-filter:var(--effect-glass-blur);-webkit-backdrop-filter:var(--effect-glass-blur)}.text-muted{color:var(--color-text-muted)}.text-sm{font-size:var(--text-sm)}.border-subtle{border:var(--border-width-thin) var(--border-style) var(--color-border-30)}.border-default{border:var(--border-width-thin) var(--border-style) var(--color-border-50)}.transition-fast{transition:all var(--transition-fast)}.container{max-width:var(--content-max-width);margin:0 auto;padding:var(--space-xl)}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}@font-face{font-family:UthmanTNB;src:url(./fonts/UthmanTNB-BrMYN_Gf.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);background:var(--color-bg-primary);color:var(--color-text-primary);min-height:100vh}#app{min-height:100vh}.skip-link{position:absolute;top:-100px;left:0;background:var(--color-accent-blue);color:#fff;padding:var(--space-sm) var(--space-md);text-decoration:none;font-weight:var(--weight-normal);z-index:1000;transition:top var(--transition-fast)}.skip-link:focus{top:0;outline:2px solid white;outline-offset:2px}*:focus-visible{outline:2px solid var(--color-accent-blue);outline-offset:2px;border-radius:2px}*:focus:not(:focus-visible){outline:none}