@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&family=Tajawal:wght@400;700;900&display=swap");:root{--blue:#2563eb;--blue-lt:#dbeafe;--yellow:#fde047;--yellow-dk:#ca8a04;--mint:#86efac;--mint-dk:#16a34a;--coral:#fb7185;--coral-dk:#be123c;--purple:#c084fc;--white:#fffef7;--black:#0a0a0a;--gray:#f5f5f0;--gray2:#e5e5e0;--border:3px solid var(--black);--shadow:4px 4px 0 var(--black);--shadow-lg:6px 6px 0 var(--black);--shadow-xl:8px 8px 0 var(--black);--radius:4px}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Cairo,Tajawal,sans-serif;background-color:var(--white);background-image:linear-gradient(rgba(37,99,235,.07) 1px,transparent 0),linear-gradient(90deg,rgba(37,99,235,.07) 1px,transparent 0);background-size:28px 28px;color:var(--black);min-height:100vh;direction:rtl;overflow-x:hidden}@keyframes bounce-in{0%{transform:scale(.8);opacity:0}60%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes slide-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes wiggle{0%,to{transform:rotate(-1deg)}50%{transform:rotate(1deg)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes spin{to{transform:rotate(1turn)}}.card{background:var(--white);border:var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.5rem;position:relative;animation:slide-up .3s ease both;transition:box-shadow .15s,transform .15s}.card:hover{box-shadow:var(--shadow-lg);transform:translate(-2px,-2px)}.card-blue{background:var(--blue-lt)}.card-yellow{background:var(--yellow)}.card-mint{background:var(--mint)}.card-coral{background:#ffe4e6}.card-header{background:var(--black);color:var(--white);padding:.6rem 1rem;font-weight:900;font-size:.85rem;letter-spacing:.04em;margin:-1.5rem -1.5rem 1.25rem;border-radius:var(--radius) var(--radius) 0 0;display:flex;align-items:center;gap:.5rem}.sticker{width:40px;height:40px;border-radius:50%;border:2px solid var(--black);font-size:1.2rem;flex-shrink:0;box-shadow:2px 2px 0 var(--black)}.btn,.sticker{display:inline-flex;align-items:center;justify-content:center}.btn{gap:.5rem;padding:.6rem 1.4rem;border:var(--border);border-radius:var(--radius);font-family:Cairo,sans-serif;font-size:.9rem;font-weight:700;cursor:pointer;box-shadow:var(--shadow);transition:box-shadow .12s,transform .12s;text-decoration:none;white-space:nowrap}.btn:hover:not(:disabled){box-shadow:var(--shadow-lg);transform:translate(-2px,-2px)}.btn:active:not(:disabled){box-shadow:1px 1px 0 var(--black);transform:translate(2px,2px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-blue{background:var(--blue);color:#fff}.btn-yellow{background:var(--yellow);color:var(--black)}.btn-mint{background:var(--mint);color:var(--black)}.btn-coral{background:var(--coral);color:#fff}.btn-white{background:var(--white);color:var(--black)}.btn-black{background:var(--black);color:var(--white)}.btn-ghost{background:transparent;color:var(--black)}.btn-icon{width:40px;height:40px;padding:0;border:var(--border);border-radius:var(--radius);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;box-shadow:var(--shadow);background:var(--white);transition:box-shadow .12s,transform .12s}.btn-icon:hover{box-shadow:var(--shadow-lg);transform:translate(-2px,-2px)}.input{width:100%;padding:.65rem 1rem;border:var(--border);border-radius:var(--radius);font-family:Cairo,sans-serif;font-size:1rem;background:var(--white);color:var(--black);outline:none;box-shadow:var(--shadow);transition:box-shadow .15s;direction:rtl}.input:focus{box-shadow:4px 4px 0 var(--blue);border-color:var(--blue)}.input::-moz-placeholder{color:#9ca3af;font-weight:400}.input::placeholder{color:#9ca3af;font-weight:400}select.input{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%230a0a0a'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:12px;padding-left:2rem}.label{display:block;font-size:.82rem;margin-bottom:.4rem;color:var(--black)}.badge,.label{font-weight:700}.badge{display:inline-flex;align-items:center;gap:.3rem;padding:.15rem .6rem;border:2px solid var(--black);border-radius:99px;font-size:.72rem;box-shadow:2px 2px 0 var(--black)}.badge-blue{background:var(--blue);color:#fff}.badge-yellow{background:var(--yellow);color:var(--black)}.badge-mint{background:var(--mint);color:var(--black)}.badge-coral{background:var(--coral);color:#fff}.progress-track{height:14px;background:var(--gray2);border:2px solid var(--black);border-radius:99px;overflow:hidden}.progress-fill{height:100%;background:var(--blue);transition:width .35s ease;border-radius:99px}.progress-fill.yellow{background:var(--yellow)}.progress-fill.mint{background:var(--mint)}.nav-link{display:flex;align-items:center;gap:.4rem;color:var(--black);text-decoration:none;padding:.4rem .85rem;border:2px solid transparent;border-radius:var(--radius);font-weight:700;font-size:.87rem;transition:all .12s}.nav-link:hover{background:var(--yellow);transform:translate(-1px,-1px)}.nav-link.active,.nav-link:hover{border-color:var(--black);box-shadow:3px 3px 0 var(--black)}.nav-link.active{background:var(--blue);color:#fff}.table-row{display:grid;padding:.65rem .9rem;border-bottom:2px solid var(--black);transition:background .12s;align-items:center}.table-row:hover{background:var(--blue-lt)}.table-header{background:var(--black);color:var(--white);padding:.5rem .9rem;font-weight:900;font-size:.78rem}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--gray)}::-webkit-scrollbar-thumb{background:var(--black);border-radius:3px}.stat-val{font-family:Tajawal,sans-serif;font-weight:900;line-height:1}.divider{border:none;border-top:2px solid var(--black);margin:1.5rem 0}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);background:var(--black);color:var(--white);padding:.75rem 1.5rem;border:2px solid var(--black);border-radius:var(--radius);box-shadow:var(--shadow-lg);font-weight:700;font-size:.9rem;z-index:9999;animation:bounce-in .3s ease}.ribbon{position:absolute;top:-2px;left:-2px;background:var(--yellow);font-size:.65rem;padding:.15rem .5rem;border:2px solid var(--black);border-radius:var(--radius) 0 var(--radius) 0}.page-title,.ribbon{color:var(--black);font-weight:900}.page-title{font-family:Tajawal,sans-serif;font-size:clamp(1.6rem,4vw,2.4rem);line-height:1.15}.highlight-blue{color:var(--blue);font-weight:900}.highlight-yellow{color:var(--yellow-dk);font-weight:900}.highlight-mint{color:var(--mint-dk);font-weight:900}.highlight-coral{color:var(--coral-dk);font-weight:900}.arabic-word{font-family:Cairo,sans-serif;direction:rtl;text-align:right}.arabic-word-xl{font-size:2.8rem;font-weight:900;line-height:1.3}.quiz-option{width:100%;padding:.9rem 1.2rem;border:var(--border);border-radius:var(--radius);background:var(--white);box-shadow:var(--shadow);font-family:Cairo,sans-serif;font-size:1rem;font-weight:600;cursor:pointer;text-align:right;direction:rtl;transition:all .12s}.quiz-option:hover:not(:disabled){background:var(--blue-lt);box-shadow:var(--shadow-lg);transform:translate(-2px,-2px)}.quiz-option.correct{background:var(--mint);box-shadow:var(--shadow)}.quiz-option.wrong{background:#ffe4e6;box-shadow:var(--shadow)}.rank-gold{background:linear-gradient(135deg,#fde047,#f59e0b);border:3px solid #92400e}.rank-silver{background:linear-gradient(135deg,#e5e7eb,#9ca3af);border:3px solid #374151}.rank-bronze{background:linear-gradient(135deg,#fcd34d,#b45309);border:3px solid #78350f}.avatar{width:44px;height:44px;border-radius:50%;border:3px solid var(--black);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1rem;box-shadow:2px 2px 0 var(--black);flex-shrink:0}.wod-card{background:var(--yellow);border:var(--border);border-radius:var(--radius);box-shadow:var(--shadow-xl);padding:1.5rem;position:relative;animation:float 4s ease-in-out infinite}.timer-display{font-family:Tajawal,monospace;font-weight:900;font-size:1.8rem;color:var(--blue);letter-spacing:.05em}.alert{padding:.75rem 1rem;border:var(--border);border-radius:var(--radius);font-weight:600;font-size:.9rem;box-shadow:var(--shadow)}.alert-success{background:var(--mint)}.alert-error{background:#ffe4e6}.alert-info{background:var(--blue-lt)}.alert-warning{background:var(--yellow)}