.site-footer{margin-inline:calc(50% - 50vw);margin-block:var(--space-4xl) calc(-1 * var(--main-pad-bottom,0px));padding:var(--space-3xl) var(--space-lg) calc(var(--space-xl) + var(--main-pad-bottom,0px));border-block-start:1px solid var(--color-border);background:radial-gradient(ellipse at 50% 0%, #d4af3712 0%, transparent 60%), var(--color-background-alt)}.site-footer__inner{max-width:var(--content-max-width);gap:var(--space-2xl);grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start;margin-inline:auto;display:grid}.site-footer__brand{align-items:flex-start;gap:var(--space-md);flex-direction:column;display:flex}.site-footer__logo{align-items:center;gap:var(--space-sm);display:inline-flex}.site-footer__logo img{border-radius:12px;width:44px;height:auto}.site-footer__wordmark{font-family:var(--font-wordmark);background:linear-gradient(135deg, var(--color-gold-light), var(--color-primary) 60%, var(--color-gold-deep));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.75rem;font-weight:700;line-height:1}.site-footer__tagline{max-width:34ch;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.site-footer__stores{justify-content:flex-start}.site-footer__links{gap:var(--space-lg);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.site-footer__links ul{gap:var(--space-sm);flex-direction:column;display:flex}.site-footer__links a{color:var(--color-text-secondary);font-size:var(--font-size-sm);padding-block:4px;display:inline-block}.site-footer__links a:hover{color:var(--color-primary);text-shadow:none}.site-footer__bottom{max-width:var(--content-max-width);margin:var(--space-2xl) auto 0;border-block-start:1px solid var(--color-border-subtle);justify-content:space-between;align-items:center;gap:var(--space-md);flex-wrap:wrap;padding-block-start:var(--space-lg);display:flex}.site-footer__copyright{font-size:var(--font-size-xs);color:var(--color-text-muted)}@media (max-width:768px){.site-footer{margin-block-start:var(--space-3xl);padding-block-start:var(--space-2xl)}.site-footer__inner{gap:var(--space-xl);grid-template-columns:1fr}.site-footer__brand{text-align:center;align-items:center}.site-footer__tagline{margin-inline:auto}.site-footer__stores{justify-content:center}.site-footer__links{text-align:center}.site-footer__bottom{text-align:center;justify-content:center}}
@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUpLarge{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slideOutDown{0%{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes scaleInBounce{0%{opacity:0;transform:scale(.8)}60%{opacity:1;transform:scale(1.03)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulseSoft{0%,to{opacity:.7}50%{opacity:.3}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes progressBar{0%{width:0}to{width:100%}}@keyframes progressIndeterminate{0%{transform:translate(-100%)}to{transform:translate(400%)}}@keyframes glow{0%,to{box-shadow:0 0 5px #d4af374d}50%{box-shadow:0 0 20px #d4af3799}}@keyframes glowAccent{0%,to{box-shadow:0 0 5px #9d65c94d}50%{box-shadow:0 0 20px #9d65c999}}@keyframes textGlow{0%,to{text-shadow:0 0 4px #d4af374d}50%{text-shadow:0 0 16px #d4af3799}}@keyframes borderGlow{0%,to{border-color:#d4af3733}50%{border-color:#d4af3780}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes floatSlow{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes breatheDeep{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes ripple{0%{opacity:.6;transform:scale(.8)}to{opacity:0;transform:scale(2.4)}}@keyframes rippleSingle{0%{opacity:.4;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}@keyframes waveform1{0%,to{height:30%}25%{height:80%}50%{height:50%}75%{height:90%}}@keyframes waveform2{0%,to{height:50%}20%{height:90%}40%{height:30%}60%{height:70%}80%{height:40%}}@keyframes waveform3{0%,to{height:40%}30%{height:70%}60%{height:90%}90%{height:30%}}@keyframes quoteFadeIn{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes bellShake{0%,to{transform:rotate(0)}15%{transform:rotate(10deg)}30%{transform:rotate(-8deg)}45%{transform:rotate(6deg)}60%{transform:rotate(-4deg)}75%{transform:rotate(2deg)}}@keyframes checkDraw{0%{stroke-dashoffset:40px}to{stroke-dashoffset:0}}@keyframes countdownStroke{0%{stroke-dashoffset:0}to{stroke-dashoffset:283px}}@keyframes grainDrift{0%,to{transform:translate(0)}25%{transform:translate(-2%,2%)}50%{transform:translate(1%,-1%)}75%{transform:translate(2%,1%)}}.anim-fade-in{animation:fadeIn var(--transition-base) ease both}.anim-fade-in-up{animation:.5s both fadeInUp}.anim-fade-in-up-large{animation:.6s cubic-bezier(.4,0,.2,1) both fadeInUpLarge}.anim-fade-in-down{animation:.5s both fadeInDown}.anim-slide-in-right{animation:.5s both slideInRight}.anim-slide-in-left{animation:.5s both slideInLeft}.anim-scale-in{animation:.4s cubic-bezier(.4,0,.2,1) both scaleIn}.anim-scale-in-bounce{animation:.5s cubic-bezier(.4,0,.2,1) both scaleInBounce}.anim-quote{animation:.7s cubic-bezier(.4,0,.2,1) both quoteFadeIn}.anim-float{animation:3s ease-in-out infinite float}.anim-float-slow{animation:4s ease-in-out infinite floatSlow}.anim-breathe{animation:4s ease-in-out infinite breathe}.anim-breathe-deep{animation:6s ease-in-out infinite breatheDeep}.anim-glow{animation:2s ease-in-out infinite glow}.anim-glow-accent{animation:2s ease-in-out infinite glowAccent}.anim-text-glow{animation:2.5s ease-in-out infinite textGlow}.anim-pulse{animation:2s ease-in-out infinite pulse}.anim-pulse-soft{animation:2.5s ease-in-out infinite pulseSoft}.anim-spin{animation:1s linear infinite spin}.anim-bell{animation:.6s ease-in-out bellShake}.anim-shimmer{background:linear-gradient(90deg, var(--color-surface) 25%, var(--color-surface-hover) 37%, var(--color-surface) 63%);background-size:200% 100%;animation:1.6s ease-in-out infinite shimmer}.stagger-1{animation-delay:50ms}.stagger-2{animation-delay:.1s}.stagger-3{animation-delay:.15s}.stagger-4{animation-delay:.2s}.stagger-5{animation-delay:.25s}.stagger-6{animation-delay:.3s}.stagger-7{animation-delay:.35s}.stagger-8{animation-delay:.4s}.stagger-9{animation-delay:.45s}.stagger-10{animation-delay:.5s}.stagger-wide-1{animation-delay:.1s}.stagger-wide-2{animation-delay:.2s}.stagger-wide-3{animation-delay:.3s}.stagger-wide-4{animation-delay:.4s}.stagger-wide-5{animation-delay:.5s}.stagger-wide-6{animation-delay:.6s}.waveform-bars{align-items:flex-end;gap:2px;height:16px;display:flex}.waveform-bars span{background:var(--color-primary);border-radius:2px;width:3px;display:block}.waveform-bars span:first-child{animation:1s ease-in-out infinite waveform1}.waveform-bars span:nth-child(2){animation:1.1s ease-in-out infinite waveform2}.waveform-bars span:nth-child(3){animation:.9s ease-in-out infinite waveform3}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.anim-float,.anim-float-slow,.anim-breathe,.anim-breathe-deep,.anim-glow,.anim-glow-accent,.anim-text-glow,.anim-pulse,.anim-pulse-soft,.anim-spin,.waveform-bars span{animation:none!important}}
:root{--color-primary:#d4af37;--color-primary-hover:#e5c349;--color-primary-active:#bf9b2f;--color-primary-dim:#d4af3726;--color-primary-ultra-dim:#d4af370f;--color-gold-light:#f0d57e;--color-gold-deep:#c99f2c;--color-quote:#f3ead3;--color-text:var(--color-text-primary);--text-primary:var(--color-text-primary);--text-secondary:var(--color-text-secondary);--primary-color:var(--color-primary);--surface-color:var(--color-surface);--color-danger:var(--color-error);--color-background:#0d1117;--color-background-alt:#0a0e14;--color-surface:#161b22;--color-surface-hover:#1c2333;--color-surface-elevated:#21262d;--color-surface-pressed:#282e38;--color-text-primary:#e6edf3;--color-text-secondary:#8b949e;--color-text-muted:#7d8590;--color-text-inverse:#0d1117;--color-accent:#9d65c9;--color-accent-hover:#b07fdb;--color-accent-dim:#9d65c926;--color-error:#f85149;--color-error-dim:#f8514926;--color-success:#3fb950;--color-success-dim:#3fb95026;--color-warning:#d29922;--color-warning-dim:#d2992226;--color-info:#58a6ff;--color-info-dim:#58a6ff26;--color-border:#ffffff14;--color-border-hover:#ffffff26;--color-border-subtle:#ffffff0a;--color-overlay:#000000b3;--color-overlay-heavy:#000000d9;--color-glass:#161b22bf;--color-glass-heavy:#161b22e6;--color-glass-border:#ffffff0f;--gradient-primary:linear-gradient(135deg, #d4af37 0%, #f2d06b 100%);--gradient-primary-reverse:linear-gradient(135deg, #f2d06b 0%, #d4af37 100%);--gradient-accent:linear-gradient(135deg, #9d65c9 0%, #c084fc 100%);--gradient-surface:linear-gradient(180deg, #161b22 0%, #0d1117 100%);--gradient-hero:radial-gradient(ellipse at 50% 0%, #d4af371f 0%, transparent 70%);--gradient-hero-accent:radial-gradient(ellipse at 50% 0%, #9d65c914 0%, transparent 60%);--gradient-card-overlay:linear-gradient(180deg, transparent 0%, #000000b3 100%);--gradient-card-overlay-heavy:linear-gradient(180deg, transparent 30%, #000000d9 100%);--space-2xs:2px;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--space-4xl:96px;--space-5xl:128px;--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-2xl:32px;--radius-full:9999px;--shadow-xs:0 1px 4px #0003;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 4px 16px #0006;--shadow-lg:0 8px 32px #00000080;--shadow-xl:0 16px 48px #0009;--shadow-glow-primary:0 0 20px #d4af374d;--shadow-glow-primary-strong:0 0 30px #d4af3780;--shadow-glow-accent:0 0 20px #9d65c94d;--shadow-glow-accent-strong:0 0 30px #9d65c980;--font-arabic:var(--nf-plex-arabic), "IBM Plex Sans Arabic", var(--nf-lato), "Lato", system-ui, sans-serif;--font-arabic-display:var(--nf-reem-kufi), "Reem Kufi", var(--font-arabic);--font-wordmark:var(--nf-reem-kufi), "Reem Kufi", var(--nf-plex-arabic), sans-serif;--font-display:var(--nf-cinzel), "Cinzel", var(--nf-plex-arabic), serif;--font-body:var(--nf-lato), "Lato", var(--nf-plex-arabic), system-ui, sans-serif;--font-quote:var(--nf-cormorant), "Cormorant Garamond", var(--nf-amiri), Georgia, serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-md:1.125rem;--font-size-lg:1.25rem;--font-size-xl:1.5rem;--font-size-2xl:2rem;--font-size-3xl:2.5rem;--font-size-4xl:3rem;--line-height-tight:1.2;--line-height-normal:1.5;--line-height-relaxed:1.7;--letter-spacing-tight:-.02em;--letter-spacing-normal:0;--letter-spacing-wide:.05em;--letter-spacing-wider:.1em;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s cubic-bezier(.4, 0, .2, 1);--transition-bounce:.5s cubic-bezier(.34, 1.56, .64, 1);--z-base:1;--z-dropdown:100;--z-sticky:200;--z-overlay:300;--z-modal:400;--z-popover:500;--z-toast:600;--z-max:9999;--sidebar-width:260px;--sidebar-collapsed-width:72px;--navbar-height:64px;--mini-player-height:72px;--bottom-nav-height:64px;--content-max-width:1400px;--content-narrow-width:800px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-moz-text-size-adjust:100%;text-size-adjust:100%;height:100%;font-size:16px}body{background-color:var(--color-background);min-height:100%;color:var(--color-text-primary);font-family:var(--font-body);font-size:var(--font-size-base);line-height:var(--line-height-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;overflow-x:hidden}html[lang=ar]{--font-display:var(--font-arabic-display);--font-body:var(--font-arabic);--font-quote:var(--nf-amiri), "Amiri", var(--font-arabic)}[lang=ar] body,[dir=rtl] body{font-family:var(--font-arabic)}html[lang=ar] body *{letter-spacing:normal!important}::selection{color:var(--color-text-primary);background-color:#d4af374d}::selection{color:var(--color-text-primary);background-color:#d4af374d}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{border-radius:var(--radius-full);background-color:#d4af3740}::-webkit-scrollbar-thumb:hover{background-color:#d4af3773}*{scrollbar-width:thin;scrollbar-color:#d4af3740 transparent}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:600;line-height:var(--line-height-tight);color:var(--color-text-primary)}[lang=ar] h1,[lang=ar] h2,[lang=ar] h3,[lang=ar] h4,[lang=ar] h5,[lang=ar] h6,[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] h3,[dir=rtl] h4,[dir=rtl] h5,[dir=rtl] h6{font-family:var(--font-arabic-display);font-weight:600}[lang=ar] h3,[lang=ar] h4,[lang=ar] h5,[lang=ar] h6{font-family:var(--font-arabic)}p{line-height:var(--line-height-relaxed);color:var(--color-text-secondary)}a{color:var(--color-primary);transition:color var(--transition-fast), text-shadow var(--transition-fast);text-decoration:none}a:hover{color:var(--color-primary-hover);text-shadow:0 0 12px #d4af3766}a:active{color:var(--color-primary-active)}img,video{max-width:100%;height:auto;display:block}button{font-family:inherit;font-size:inherit;cursor:pointer;color:inherit;background:0 0;border:none}input,textarea,select{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none;outline:none}ul,ol{list-style:none}#main{scroll-margin-top:var(--navbar-height)}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}.skip-link{top:8px;z-index:var(--z-max);border-radius:var(--radius-full);background:var(--color-primary);color:var(--color-text-inverse);transition:transform var(--transition-fast);padding:10px 18px;font-weight:700;position:fixed;inset-inline-start:8px;transform:translateY(-200%)}.skip-link:focus,.skip-link:focus-visible{color:var(--color-text-inverse);transform:none}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-xs)}:focus:not(:focus-visible){outline:none}.container{width:100%;max-width:var(--content-max-width);padding-inline:var(--space-lg);margin-inline:auto}.container-narrow{width:100%;max-width:var(--content-narrow-width);padding-inline:var(--space-lg);margin-inline:auto}.glass-card{background:var(--color-glass);-webkit-backdrop-filter:blur(16px);border:1px solid var(--color-glass-border);border-radius:var(--radius-lg);padding:var(--space-lg);transition:border-color var(--transition-base)}.glass-card-hover{background:var(--color-glass);-webkit-backdrop-filter:blur(16px);border:1px solid var(--color-glass-border);border-radius:var(--radius-lg);padding:var(--space-lg);transition:border-color var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base);cursor:pointer}.glass-card-hover:hover{border-color:var(--color-border-hover);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.glass-card-hover:active{transform:translateY(-1px)}.gold-glow{text-shadow:0 0 12px #d4af3780}.accent-glow{text-shadow:0 0 12px #9d65c980}.gradient-text{background:var(--gradient-primary);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text}.gradient-text-accent{background:var(--gradient-accent);-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text}.shimmer{background:linear-gradient(90deg, var(--color-surface) 25%, var(--color-surface-hover) 37%, var(--color-surface) 63%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.6s ease-in-out infinite shimmer}.fade-in{animation:.4s both fadeIn}.slide-up{animation:.5s both fadeInUp}.scale-in{animation:.4s cubic-bezier(.4,0,.2,1) both scaleIn}.section-title{font-family:var(--font-display);font-size:var(--font-size-xl);color:var(--color-primary);letter-spacing:var(--letter-spacing-wide);margin-block-end:var(--space-lg);padding-block-end:var(--space-sm);font-weight:600;display:inline-block;position:relative}.section-title:after{content:"";background:var(--gradient-primary);border-radius:var(--radius-full);width:48px;height:2px;position:absolute;inset-block-end:0;inset-inline-start:0}[dir=rtl] .section-title,[lang=ar] .section-title{font-family:var(--font-arabic-display)}.btn-primary{justify-content:center;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);background:var(--gradient-primary);min-height:44px;color:var(--color-text-inverse);font-weight:700;font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;border-radius:var(--radius-full);cursor:pointer;transition:transform var(--transition-fast), box-shadow var(--transition-base), filter var(--transition-fast);white-space:nowrap;border:none;display:inline-flex}.btn-primary:hover{box-shadow:var(--shadow-glow-primary);filter:brightness(1.1);transform:translateY(-2px)}.btn-primary:active{filter:brightness(.95);transform:translateY(0)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;filter:none;transform:none}.btn-secondary{justify-content:center;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);min-height:44px;color:var(--color-primary);font-weight:700;font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;border:1.5px solid var(--color-primary);border-radius:var(--radius-full);cursor:pointer;transition:background-color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-base);white-space:nowrap;background:0 0;display:inline-flex}.btn-secondary:hover{background-color:var(--color-primary-dim);box-shadow:var(--shadow-glow-primary);transform:translateY(-2px)}.btn-secondary:active{background-color:#d4af3733;transform:translateY(0)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.btn-icon{border-radius:var(--radius-full);background:var(--color-surface);width:40px;height:40px;color:var(--color-text-secondary);border:1px solid var(--color-border);cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);justify-content:center;align-items:center;display:inline-flex}.btn-icon:hover{background-color:var(--color-surface-hover);color:var(--color-primary);border-color:var(--color-border-hover);transform:scale(1.05)}.btn-icon:active{background-color:var(--color-surface-pressed);transform:scale(.95)}.grid-categories{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(160px,1fr));display:grid}.grid-tracks{gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.grid-videos{gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.carousel{gap:var(--space-md);scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding-block:var(--space-xs);padding-inline:var(--space-xs);scrollbar-width:none;display:flex;overflow-x:auto}.carousel::-webkit-scrollbar{display:none}.carousel-item{scroll-snap-align:start;flex:none}.tab-bar{align-items:center;gap:var(--space-xs);border-block-end:1px solid var(--color-border);scrollbar-width:none;display:flex;overflow-x:auto}.tab-bar::-webkit-scrollbar{display:none}.tab-item{align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);color:var(--color-text-secondary);font-size:var(--font-size-sm);white-space:nowrap;cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;font-weight:500;display:inline-flex;position:relative}.tab-item:hover{color:var(--color-text-primary)}.tab-item.active{color:var(--color-primary)}.tab-item.active:after{content:"";background:var(--gradient-primary);border-radius:var(--radius-full);width:100%;height:2px;position:absolute;inset-block-end:-1px;inset-inline-start:0}.badge-premium{align-items:center;gap:var(--space-2xs);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-wider);text-transform:uppercase;color:var(--color-text-inverse);background:var(--gradient-primary);border-radius:var(--radius-full);padding:2px 10px;font-weight:700;line-height:1.6;display:inline-flex}.list-premium-badge{vertical-align:middle;margin-inline-start:var(--space-sm);font-size:.65rem}.badge-practice{align-items:center;gap:var(--space-2xs);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-wider);text-transform:uppercase;color:var(--color-accent);background:var(--color-accent-dim);border-radius:var(--radius-full);border:1px solid #9d65c933;padding:2px 10px;font-weight:700;line-height:1.6;display:inline-flex}.badge-new{font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-wider);text-transform:uppercase;color:var(--color-success);background:var(--color-success-dim);border-radius:var(--radius-full);align-items:center;padding:2px 8px;font-weight:700;line-height:1.6;display:inline-flex}.input-field{width:100%;padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-md);min-height:44px;color:var(--color-text-primary);font-size:var(--font-size-base);transition:border-color var(--transition-fast), box-shadow var(--transition-fast), background-color var(--transition-fast)}.input-field::placeholder{color:var(--color-text-muted)}.input-field:hover{border-color:var(--color-border-hover);background-color:var(--color-surface-hover)}.input-field:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-dim);background-color:var(--color-surface)}.input-field:disabled{opacity:.5;cursor:not-allowed}textarea.input-field{resize:vertical;min-height:100px}.divider{background:var(--color-border);width:100%;height:1px;margin-block:var(--space-lg);border:none}.divider-gold{background:linear-gradient(90deg, transparent 0%, var(--color-primary-dim) 50%, transparent 100%);width:100%;height:1px;margin-block:var(--space-lg);border:none}.avatar{border-radius:var(--radius-full);border:2px solid var(--color-primary);background:var(--color-surface);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:inline-flex;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.avatar-sm{width:32px;height:32px}.avatar-lg{width:56px;height:56px}.avatar-xl{border-width:3px;width:80px;height:80px}.overlay-gradient{background:var(--gradient-card-overlay);pointer-events:none;border-radius:inherit;position:absolute;inset:0}.overlay-gradient-heavy{background:var(--gradient-card-overlay-heavy);pointer-events:none;border-radius:inherit;position:absolute;inset:0}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.truncate-2{-webkit-line-clamp:2;text-overflow:ellipsis;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.truncate-3{-webkit-line-clamp:3;text-overflow:ellipsis;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.text-primary{color:var(--color-text-primary)}.text-secondary{color:var(--color-text-secondary)}.text-muted{color:var(--color-text-muted)}.text-gold{color:var(--color-primary)}.text-accent{color:var(--color-accent)}.text-error{color:var(--color-error)}.text-success{color:var(--color-success)}.text-center{text-align:center}.text-start{text-align:start}.text-end{text-align:end}.font-display{font-family:var(--font-display)}.font-body{font-family:var(--font-body)}.font-arabic{font-family:var(--font-arabic)}.visually-hidden{clip:rect(0, 0, 0, 0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}.spinner{border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:var(--radius-full);width:24px;height:24px;animation:.8s linear infinite spin}.spinner-lg{border-width:3px;width:40px;height:40px}.progress-bar{background:var(--color-surface-elevated);border-radius:var(--radius-full);width:100%;height:4px;overflow:hidden}.progress-bar-fill{background:var(--gradient-primary);border-radius:var(--radius-full);height:100%;transition:width var(--transition-slow)}.chip{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);font-size:var(--font-size-xs);color:var(--color-text-secondary);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full);cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);font-weight:500;display:inline-flex}.chip:hover{background:var(--color-surface-hover);color:var(--color-text-primary);border-color:var(--color-border-hover)}.chip.active{color:var(--color-primary);background:var(--color-primary-dim);border-color:#d4af374d}.tooltip{position:relative}.tooltip:after{content:attr(data-tooltip);padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-xs);color:var(--color-text-primary);background:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-sm);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--transition-fast);z-index:var(--z-popover);position:absolute;inset-block-end:calc(100% + 8px);inset-inline-start:50%;transform:translate(-50%)}.tooltip:hover:after{opacity:1}[dir=rtl]{text-align:right}[dir=rtl] .tooltip:after{transform:translate(50%)}@media (max-width:640px){:root{--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem}.container{padding-inline:var(--space-md)}.grid-categories{gap:var(--space-sm);grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.grid-tracks{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.grid-videos{gap:var(--space-md);grid-template-columns:1fr}.section-title{font-size:var(--font-size-lg)}.sidebar{display:none}.bottom-nav{display:flex}.desktop-nav{display:none}.hide-mobile{display:none!important}}@media (min-width:641px) and (max-width:1024px){.container{padding-inline:var(--space-lg)}.grid-categories{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.sidebar{display:none}.bottom-nav{display:flex}.desktop-nav{display:none}.hide-tablet{display:none!important}}@media (min-width:1025px){.sidebar{display:flex}.bottom-nav{display:none}.desktop-nav{display:flex}.hide-desktop{display:none!important}}@media (min-width:1440px){.grid-tracks{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.grid-videos{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}}@media print{body{color:#000;background:#fff}.sidebar,.bottom-nav,.mini-player,.btn-icon,.navbar{display:none!important}}.favorite-btn{top:var(--space-sm);right:var(--space-sm);border-radius:var(--radius-full);-webkit-backdrop-filter:blur(8px);width:32px;height:32px;color:var(--color-text-secondary);cursor:pointer;z-index:10;transition:all var(--transition-bounce);background:#0006;border:1px solid #ffffff1a;justify-content:center;align-items:center;display:flex;position:absolute}[dir=rtl] .favorite-btn{right:auto;left:var(--space-sm)}.favorite-btn svg{width:18px;height:18px;transition:transform var(--transition-fast)}.favorite-btn:hover{color:var(--color-text-primary);background:#0009;transform:scale(1.05)}.favorite-btn.active{color:var(--color-primary);border-color:#d4af374d}.favorite-btn.active svg{transform:scale(1.1)}.favorite-btn:active svg{transform:scale(.9)}.favorite-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.favorite-btn.inline{flex-shrink:0;width:36px;height:36px;position:relative;top:auto;left:auto;right:auto}[dir=rtl] .favorite-btn.inline{left:auto;right:auto}.video-modal-backdrop{z-index:var(--z-modal);background:var(--color-overlay-heavy);-webkit-backdrop-filter:blur(16px);padding:var(--space-lg);justify-content:center;align-items:center;animation:.3s ease-out modalBackdropIn;display:flex;position:fixed;inset:0}@keyframes modalBackdropIn{0%{opacity:0}to{opacity:1}}.video-modal{border-radius:var(--radius-xl);background:var(--color-surface);border:1px solid var(--color-border-hover);width:100%;max-width:960px;box-shadow:var(--shadow-xl), var(--shadow-glow-primary);animation:.4s cubic-bezier(.34,1.56,.64,1) modalSlideIn;position:relative;overflow:hidden}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.video-modal__player-wrapper{aspect-ratio:16/9;background:#000;width:100%;position:relative}.video-modal__waiting{justify-content:center;align-items:center;display:flex}.video-modal__player{object-fit:contain;background:#000;width:100%;height:100%;display:block}.video-modal__info{padding:var(--space-lg) var(--space-xl);border-top:1px solid var(--color-border)}.video-modal__badges{gap:var(--space-sm);margin-bottom:var(--space-sm);display:flex}.video-modal__title{font-size:var(--font-size-xl);color:var(--color-text-primary);margin-bottom:var(--space-xs);font-weight:700;line-height:var(--line-height-tight)}.video-modal__description{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.video-modal__close{top:var(--space-md);z-index:calc(var(--z-modal) + 1);border-radius:var(--radius-full);border:1px solid var(--color-border-hover);background:var(--color-glass-heavy);-webkit-backdrop-filter:blur(12px);width:40px;height:40px;color:var(--color-text-primary);font-size:var(--font-size-lg);cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);justify-content:center;align-items:center;display:flex;position:absolute;inset-inline-end:var(--space-md)}.video-modal__close:hover{background:var(--color-surface-hover);border-color:var(--color-primary);transform:rotate(90deg)scale(1.1)}@media (max-width:768px){.video-modal{border-radius:var(--radius-md);max-width:100%}.video-modal__info{padding:var(--space-md)}.video-modal__title{font-size:var(--font-size-lg)}}@media (max-width:480px){.video-modal-backdrop{padding:var(--space-sm)}}
