@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Amiri:wght@400;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#0a0e27 0%,#1a1f4b 25%,#2d1b69 50%,#1a1f4b 75%,#0a0e27 100%);min-height:100vh;color:#fff;position:relative;overflow-x:hidden}#root{min-height:100vh;position:relative}.quotes-bar-fixed{position:fixed!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;z-index:999999!important;pointer-events:auto!important;isolation:isolate!important}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(2px 2px at 20px 30px,#eee,transparent),radial-gradient(2px 2px at 40px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 90px 40px,#fff,transparent),radial-gradient(1px 1px at 130px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 160px 30px,#ddd,transparent),radial-gradient(2px 2px at 200px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 240px 40px,#fff,transparent),radial-gradient(1px 1px at 280px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 320px 30px,#ddd,transparent),radial-gradient(2px 2px at 360px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 400px 40px,#fff,transparent),radial-gradient(1px 1px at 440px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 480px 30px,#ddd,transparent),radial-gradient(2px 2px at 520px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 560px 40px,#fff,transparent),radial-gradient(1px 1px at 600px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 640px 30px,#ddd,transparent),radial-gradient(2px 2px at 680px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 720px 40px,#fff,transparent),radial-gradient(1px 1px at 760px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 800px 30px,#ddd,transparent),radial-gradient(2px 2px at 840px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 880px 40px,#fff,transparent),radial-gradient(1px 1px at 920px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 960px 30px,#ddd,transparent),radial-gradient(2px 2px at 1000px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 1040px 40px,#fff,transparent),radial-gradient(1px 1px at 1080px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 1120px 30px,#ddd,transparent),radial-gradient(2px 2px at 1160px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 1200px 40px,#fff,transparent),radial-gradient(1px 1px at 1240px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 1280px 30px,#ddd,transparent),radial-gradient(2px 2px at 1320px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 1360px 40px,#fff,transparent),radial-gradient(1px 1px at 1400px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 1440px 30px,#ddd,transparent),radial-gradient(2px 2px at 1480px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 1520px 40px,#fff,transparent),radial-gradient(1px 1px at 1560px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 1600px 30px,#ddd,transparent),radial-gradient(2px 2px at 1640px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 1680px 40px,#fff,transparent),radial-gradient(1px 1px at 1720px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 1760px 30px,#ddd,transparent),radial-gradient(2px 2px at 1800px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 1840px 40px,#fff,transparent),radial-gradient(1px 1px at 1880px 80px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 1920px 30px,#ddd,transparent);background-repeat:repeat;background-size:200px 100px;animation:twinkle 20s linear infinite;z-index:-1}@keyframes twinkle{0%{opacity:.3}50%{opacity:1}to{opacity:.3}}#root{min-height:100vh;padding-bottom:60px}.container{max-width:1200px;margin:0 auto;padding:0 20px}.card{background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:16px;box-shadow:0 8px 32px #0000004d;padding:24px;margin-bottom:20px;transition:transform .2s ease,box-shadow .2s ease}.card:hover{transform:translateY(-2px);box-shadow:0 12px 40px #0006;border-color:#ffffff4d}.btn{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:12px 24px;border-radius:8px;cursor:pointer;font-weight:500;transition:all .2s ease;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 15px #667eea4d}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px #667eea66}.btn-secondary{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-secondary:hover{background:rgba(255,255,255,.2);box-shadow:0 6px 20px #0003}.input{width:100%;padding:12px 16px;border:2px solid rgba(255,255,255,.2);border-radius:8px;font-size:16px;transition:border-color .2s ease;background:rgba(255,255,255,.1);color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.input::placeholder{color:#fff9}.input:focus{outline:none;border-color:#667eea;background:rgba(255,255,255,.15)}.textarea{width:100%;padding:12px 16px;border:2px solid rgba(255,255,255,.2);border-radius:8px;font-size:16px;font-family:inherit;resize:vertical;min-height:100px;transition:border-color .2s ease;background:rgba(255,255,255,.1);color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.textarea::placeholder{color:#fff9}.textarea:focus{outline:none;border-color:#667eea;background:rgba(255,255,255,.15)}.badge{display:inline-flex;align-items:center;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.badge-success{background:rgba(34,197,94,.2);color:#4ade80;border:1px solid rgba(34,197,94,.3)}.badge-warning{background:rgba(251,191,36,.2);color:#fbbf24;border:1px solid rgba(251,191,36,.3)}.badge-danger{background:rgba(239,68,68,.2);color:#f87171;border:1px solid rgba(239,68,68,.3)}.badge-info{background:rgba(59,130,246,.2);color:#60a5fa;border:1px solid rgba(59,130,246,.3)}.streak{background:linear-gradient(135deg,#ff6b6b 0%,#ffa500 100%);color:#fff;padding:8px 16px;border-radius:20px;font-weight:600;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 15px #ff6b6b4d}.achievement{background:linear-gradient(135deg,#4ecdc4 0%,#44a08d 100%);color:#fff;padding:16px;border-radius:12px;text-align:center;margin:16px 0;box-shadow:0 8px 25px #4ecdc44d}.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.flex{display:flex;align-items:center;gap:12px}.flex-between{display:flex;justify-content:space-between;align-items:center}.flex-center{display:flex;justify-content:center;align-items:center}.text-center{text-align:center}.mb-4{margin-bottom:16px}.mt-4{margin-top:16px}.text-sm{font-size:14px}.text-lg{font-size:18px}.font-bold{font-weight:600}.text-muted{color:#fff9}nav{background:rgba(255,255,255,.1)!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;border-bottom:1px solid rgba(255,255,255,.2)!important}nav h1{color:#fff!important}nav a{color:#fffc!important}nav a:hover{color:#fff!important;background:rgba(255,255,255,.1)!important}nav a.active{background:rgba(102,126,234,.3)!important;color:#fff!important}.font-arabic{font-family:Amiri,Noto Sans Arabic,Arial,sans-serif;font-weight:600;line-height:1.8}@media (max-width: 768px){.container{padding:0 16px}.card{padding:16px}.grid-2,.grid-3{grid-template-columns:1fr}.quote{font-size:12px;gap:15px}}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:slideInFromTop .3s ease-out}.hover\:scale-102:hover{transform:scale(1.02)}.nav-glass{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(15,23,42,.8);border:1px solid rgba(168,85,247,.2)}.gradient-text{background:linear-gradient(45deg,#ffffff,#e2e8f0,#ffffff);background-size:200% 200%;animation:gradientShift 3s ease infinite;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes gradient-x{0%,to{background-size:400% 400%;background-position:0% 50%}50%{background-size:400% 400%;background-position:100% 50%}}.animate-gradient-x{animation:gradient-x 6s ease infinite}@keyframes float{0%,to{transform:translateY(0) translate(0) rotate(0)}25%{transform:translateY(-20px) translate(10px) rotate(2deg)}50%{transform:translateY(-10px) translate(-10px) rotate(-1deg)}75%{transform:translateY(-30px) translate(5px) rotate(1deg)}}@keyframes float-delayed{0%,to{transform:translateY(0) translate(0) rotate(0)}20%{transform:translateY(-15px) translate(-8px) rotate(-1deg)}40%{transform:translateY(-25px) translate(12px) rotate(2deg)}60%{transform:translateY(-5px) translate(-15px) rotate(-2deg)}80%{transform:translateY(-20px) translate(8px) rotate(1deg)}}@keyframes float-slow{0%,to{transform:translateY(0) translate(0) scale(1) rotate(0)}33%{transform:translateY(-12px) translate(15px) scale(1.05) rotate(1deg)}66%{transform:translateY(-8px) translate(-12px) scale(.95) rotate(-1deg)}}.animate-float{animation:float 15s ease-in-out infinite}.animate-float-delayed{animation:float-delayed 18s ease-in-out infinite;animation-delay:-5s}.animate-float-slow{animation:float-slow 22s ease-in-out infinite;animation-delay:-8s}.border-3{border-width:3px}.border-t-3{border-top-width:3px}.border-b-2{border-bottom-width:2px}.border-gradient{background:linear-gradient(45deg,#3b82f6,#8b5cf6,#3b82f6);border-radius:1.5rem;opacity:.3}.quotes-arabic-text,.quotes-english-text{font-style:italic!important;font-weight:700!important}