@import"https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Lora:ital,wght@0,400;0,600;1,400&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg: #faf7f2;--bg-card: #ffffff;--bg-dark: #1a1a2e;--accent: #c4873b;--accent-light: #f5e6d0;--accent-dark: #8b5e2a;--teal: #2a7a6e;--teal-light: #e0f2ef;--text: #2c2c2c;--text-light: #6b6b6b;--text-arabic: #1a1a2e;--border: #e8e0d4;--shadow: 0 2px 20px rgba(0,0,0,.06);--shadow-hover: 0 4px 30px rgba(0,0,0,.1);--radius: 12px;--correct: #2a7a4e;--correct-bg: #e8f5ec;--wrong: #b83b3b;--wrong-bg: #fce8e8}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Lora,Georgia,serif;background:var(--bg);color:var(--text);line-height:1.7;min-height:100vh}.arabic{font-family:Amiri,serif;direction:rtl;font-size:1.3em;color:var(--text-arabic);line-height:2}.transliteration{font-family:JetBrains Mono,monospace;font-size:.85em;color:var(--text-light);font-style:italic}header{background:var(--bg-dark);color:#fff;padding:3rem 2rem;text-align:center;position:relative;overflow:hidden}header:before{content:"اللغة العربية";font-family:Amiri,serif;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:8rem;opacity:.03;white-space:nowrap;pointer-events:none}header h1{font-family:Amiri,serif;font-size:2.8rem;font-weight:700;margin-bottom:.3rem;direction:rtl;color:var(--accent)}header p{font-size:1.1rem;opacity:.8;max-width:500px;margin:.5rem auto 0}nav{background:var(--bg-card);border-bottom:1px solid var(--border);padding:0;position:sticky;top:0;z-index:100;box-shadow:0 2px 10px #0000000a}nav ul{display:flex;list-style:none;max-width:900px;margin:0 auto;overflow-x:auto}nav a{display:block;padding:1rem 1.5rem;text-decoration:none;color:var(--text-light);font-size:.95rem;white-space:nowrap;border-bottom:3px solid transparent;transition:all .3s ease}nav a:hover,nav a.active{color:var(--accent);border-bottom-color:var(--accent)}nav a.nav-home{color:var(--accent);font-weight:600;border-bottom-color:transparent;border-right:1px solid var(--border);margin-right:.5rem}main{max-width:860px;margin:0 auto;padding:2rem 1.5rem 4rem}section{margin-bottom:3rem;animation:fadeIn .6s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}h2{font-size:1.6rem;color:var(--accent-dark);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid var(--accent-light);display:flex;align-items:center;gap:.8rem}h2 .arabic{font-size:1.4em;color:var(--accent-dark)}h3{font-size:1.15rem;color:var(--teal);margin:1.5rem 0 .8rem}p{margin-bottom:1rem}.concept-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem 2rem;margin:1.5rem 0;box-shadow:var(--shadow);position:relative}.concept-box.highlight{border-left:4px solid var(--accent)}.concept-box.teal{border-left:4px solid var(--teal)}.concept-box h4{font-size:1rem;color:var(--accent-dark);margin-bottom:.8rem;text-transform:uppercase;letter-spacing:.05em}.vocab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}.vocab-item{background:var(--teal-light);border-radius:8px;padding:.6rem;text-align:center}.vocab-item .arabic{display:block;font-size:1.1em}.vocab-fr{font-size:.8rem;color:var(--text-light)}.structure-demo{display:flex;align-items:center;justify-content:center;gap:.8rem;margin:1.5rem 0;flex-wrap:wrap}.struct-block{display:flex;flex-direction:column;align-items:center;gap:.3rem}.struct-part{font-family:Amiri,serif;font-size:1.3rem;padding:.6rem 1.2rem;border-radius:8px;font-weight:700;direction:rtl}.struct-subject{background:var(--teal-light);color:var(--teal)}.struct-adj{background:var(--accent-light);color:var(--accent-dark)}.struct-verb{background:#e8e0f2;color:#5a3d8a}.struct-label{font-size:.75rem;color:var(--text-light);text-transform:uppercase;letter-spacing:.04em}.struct-plus{font-size:1.5rem;color:var(--text-light);font-weight:300}.absence-demo{text-align:center;padding:2rem;background:linear-gradient(135deg,var(--accent-light) 0%,#fff 100%);border-radius:var(--radius);margin:1.5rem 0}.absence-comparison{display:flex;align-items:center;justify-content:center;gap:2rem;margin-bottom:1.5rem;flex-wrap:wrap}.absence-col{display:flex;flex-direction:column;align-items:center;gap:.3rem;background:var(--bg-card);padding:1.2rem 2rem;border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow)}.absence-lang{font-size:.8rem;color:var(--text-light);text-transform:uppercase;letter-spacing:.04em}.absence-sentence{font-size:1.1rem}.absence-etre{color:var(--wrong);font-weight:700;text-decoration:line-through}.absence-translit{font-family:JetBrains Mono,monospace;font-size:.85rem;color:var(--text-light);font-style:italic}.absence-arrow{font-size:2rem;color:var(--accent);font-weight:700}.absence-highlight{font-size:.95rem;color:var(--accent-dark);background:var(--bg-card);display:inline-block;padding:.5rem 1.2rem;border-radius:8px;border:1px solid var(--accent)}.verb-showcase{text-align:center;padding:2rem;background:linear-gradient(135deg,var(--teal-light) 0%,#fff 100%);border-radius:var(--radius);margin:1.5rem 0;border:1px solid var(--border)}.verb-showcase-ar{font-family:Amiri,serif;font-size:3.5rem;direction:rtl;color:var(--text-arabic);font-weight:700;line-height:1.4}.verb-showcase-translit{font-family:JetBrains Mono,monospace;font-size:1rem;color:var(--text-light);font-style:italic;margin-top:.3rem}.verb-showcase-meaning{font-size:1.1rem;color:var(--teal);font-weight:600;margin-top:.5rem}.time-comparison{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:center;margin:1.5rem 0}.time-col{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;text-align:center;box-shadow:var(--shadow)}.present-col{border-top:3px solid var(--teal)}.past-col{border-top:3px solid var(--accent)}.time-label{font-size:.8rem;color:var(--text-light);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.8rem}.time-ar{font-family:Amiri,serif;font-size:1.5rem;direction:rtl;color:var(--text-arabic);font-weight:700;margin-bottom:.3rem}.time-fr{font-size:.9rem;color:var(--text-light);font-style:italic}.time-arrow{font-size:2rem;color:var(--accent);font-weight:700}.case-demo{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;margin:1.5rem 0;box-shadow:var(--shadow)}.case-row{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.case-label{font-size:.85rem;color:var(--text-light);min-width:160px;font-weight:600}.case-sentence{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;direction:rtl}.case-word{font-family:Amiri,serif;font-size:1.6rem;font-weight:700;padding:.3rem .8rem;border-radius:6px}.case-word.marfoo{background:var(--teal-light);color:var(--teal)}.case-word.mansoob{background:var(--accent-light);color:var(--accent-dark)}.case-word.kana-word{background:#e8e0f2;color:#5a3d8a}.case-tag{font-size:.7rem;color:var(--teal);text-transform:uppercase;letter-spacing:.04em}.case-tag.tag-mansoob{color:var(--accent-dark)}.case-arrow{text-align:center;font-size:1.2rem;color:var(--accent);font-weight:700;margin:.5rem 0}.tanwin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}.tanwin-item{text-align:center;background:var(--bg);border-radius:8px;padding:1rem;border:1px solid var(--border)}.tanwin-mark{display:block;font-family:Amiri,serif;font-size:2.5rem;direction:rtl;color:var(--text-arabic);font-weight:700;line-height:1.2}.tanwin-name{display:block;font-family:JetBrains Mono,monospace;font-size:.75rem;color:var(--text-light);font-style:italic;margin-top:.3rem}.tanwin-case{display:block;font-size:.8rem;color:var(--accent-dark);font-weight:600;margin-top:.3rem}.future-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;margin:1.5rem 0}.future-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow);text-align:center;transition:transform .2s ease,box-shadow .2s ease}.future-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}.future-particle{font-family:Amiri,serif;font-size:2.5rem;direction:rtl;color:var(--accent);font-weight:700;margin-bottom:.3rem}.future-translit{font-family:JetBrains Mono,monospace;font-size:.85rem;color:var(--text-light);font-style:italic;margin-bottom:.5rem}.future-meaning{font-size:.9rem;color:var(--text);font-weight:600;margin-bottom:.8rem}.future-example{background:var(--bg);border-radius:8px;padding:.8rem}.future-example small{display:block;color:var(--text-light);font-size:.82rem;font-style:italic;margin-top:.3rem}.sentence-examples{margin:1.5rem 0}.sentence-card{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:1.2rem 1.5rem;margin-bottom:.8rem;box-shadow:var(--shadow);transition:transform .2s ease}.sentence-card:hover{transform:translate(4px)}.ar-line{font-family:Amiri,serif;font-size:1.5rem;direction:rtl;color:var(--text-arabic);font-weight:700;line-height:2}.fr-line{font-size:.9rem;color:var(--text-light);font-style:italic;margin-top:.2rem}.sentence-card .note{font-size:.8rem;color:var(--accent-dark);background:var(--accent-light);display:inline-block;padding:.2rem .6rem;border-radius:4px;margin-top:.3rem;width:fit-content}.conj-table-wrapper{overflow-x:auto;margin:1rem 0}table{width:100%;border-collapse:collapse;font-size:.95rem}thead{background:var(--bg-dark);color:#fff}th{padding:.8rem 1rem;text-align:left;font-weight:600;font-size:.85rem}th.ar{font-family:Amiri,serif;font-size:1.1rem;direction:rtl;text-align:right}td{padding:.6rem 1rem;border-bottom:1px solid var(--border)}tbody tr:hover{background:var(--accent-light)}.pronoun-fr{font-weight:600;color:var(--text);font-size:.9rem}.pronoun-ar{font-family:Amiri,serif;font-size:1.2em;direction:rtl;color:var(--text-arabic);text-align:right}.verb-ar{font-family:Amiri,serif;font-size:1.4em;direction:rtl;font-weight:700;color:var(--accent-dark);text-align:right}.verb-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.verb-tab{padding:.6rem 1.2rem;background:var(--bg);border:1px solid var(--border);border-radius:8px;cursor:pointer;font-size:.9rem;transition:all .2s ease}.verb-tab:hover{border-color:var(--accent)}.verb-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.tab-arabic{font-family:Amiri,serif;font-size:1.1em;direction:rtl}.verb-content{display:none}.verb-content.active{display:block}.pronoun-order-toggle{display:flex;align-items:center;gap:1rem;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:.8rem 1.2rem;margin:1rem 0;box-shadow:var(--shadow)}.toggle-label{font-size:.85rem;color:var(--text-light);white-space:nowrap}.toggle-buttons{display:flex;gap:.5rem}.toggle-btn{padding:.4rem 1rem;background:var(--bg);border:1px solid var(--border);border-radius:6px;cursor:pointer;font-size:.82rem;font-family:Lora,serif;transition:all .2s ease;color:var(--text)}.toggle-btn:hover{border-color:var(--accent)}.toggle-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.group-header td{background:var(--accent-light);font-size:.75rem;font-weight:700;color:var(--accent-dark);text-transform:uppercase;letter-spacing:.05em;padding:.4rem 1rem}.quiz-area{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;margin:1.5rem 0;box-shadow:var(--shadow)}.quiz-prompt{text-align:center;margin-bottom:1.5rem}.quiz-prompt .context{font-size:.95rem;color:var(--text-light);margin-bottom:.5rem}.quiz-prompt .question-verb{font-family:Amiri,serif;font-size:2.2rem;color:var(--text-arabic);direction:rtl}.quiz-prompt .question-info{font-size:1rem;color:var(--accent-dark);margin-top:.5rem;font-weight:600}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-bottom:1rem}.quiz-option{padding:1rem;background:var(--bg);border:2px solid var(--border);border-radius:10px;cursor:pointer;text-align:center;transition:all .2s ease;font-family:Amiri,serif;font-size:1.4rem;direction:rtl}.quiz-option.fr-option{font-family:Lora,Georgia,serif;font-size:1rem;direction:ltr}.quiz-option:hover:not(.disabled){border-color:var(--accent);background:var(--accent-light);transform:translateY(-1px)}.quiz-option.correct{border-color:var(--correct);background:var(--correct);color:#fff}.quiz-option.wrong{border-color:var(--wrong);background:var(--wrong);color:#fff}.quiz-option.disabled{cursor:default;opacity:.7}.quiz-feedback{text-align:center;padding:1rem;border-radius:8px;margin-top:1rem;display:none;font-size:.95rem}.quiz-feedback.show{display:block}.quiz-feedback.correct{background:var(--correct-bg);color:var(--correct)}.quiz-feedback.wrong{background:var(--wrong-bg);color:var(--wrong)}.quiz-controls{text-align:center;margin-top:1.2rem}.btn{padding:.7rem 2rem;background:var(--accent);color:#fff;border:none;border-radius:8px;font-family:Lora,serif;font-size:1rem;cursor:pointer;transition:all .2s ease}.btn:hover{background:var(--accent-dark);transform:translateY(-1px)}.score-display{text-align:center;font-size:.95rem;color:var(--text-light);margin-bottom:1rem}.score-display strong{color:var(--teal);font-size:1.1em}.score-separator{margin:0 .8rem;color:var(--border)}footer{text-align:center;padding:2rem;color:var(--text-light);font-size:.85rem;border-top:1px solid var(--border)}@media(max-width:600px){header h1{font-size:2rem}nav a{padding:.8rem 1rem;font-size:.85rem}main{padding:1.5rem 1rem 3rem}.absence-comparison{gap:1rem}.time-comparison{grid-template-columns:1fr}.time-arrow{text-align:center;transform:rotate(90deg)}.future-cards,.tanwin-grid,.quiz-options{grid-template-columns:1fr}.vocab-grid{grid-template-columns:repeat(2,1fr)}.verb-tabs{flex-direction:column}.pronoun-order-toggle{flex-direction:column;align-items:flex-start}.case-label{min-width:auto}}