@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;--purple: #6a3d9a;--purple-light: #f0e6f6}*{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}.etymology-grid{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.etymology-item{display:grid;grid-template-columns:auto auto 1fr;grid-template-rows:auto auto;gap:.2rem 1rem;align-items:baseline;padding:.8rem 1rem;background:var(--teal-light);border-radius:8px}.etymology-ar{font-family:Amiri,serif;font-size:1.4em;font-weight:700;color:var(--teal);direction:rtl;grid-row:1 / 3;align-self:center}.etymology-verb{font-family:JetBrains Mono,monospace;font-size:.8em;color:var(--teal);grid-column:2}.etymology-phonetic{font-size:.88rem;grid-column:3;grid-row:1}.etymology-syntactic{font-size:.88rem;color:var(--text-light);grid-column:2 / 4;grid-row:2}@media(max-width:600px){.etymology-item{grid-template-columns:auto 1fr;grid-template-rows:auto auto auto}.etymology-ar{grid-row:1 / 2}.etymology-verb{grid-column:2;grid-row:1}.etymology-phonetic{grid-column:1 / 3;grid-row:2}.etymology-syntactic{grid-column:1 / 3;grid-row:3}}.cases-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:1.5rem 0}.case-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;text-align:center;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease}.case-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}.case-marfoo{border-top:4px solid var(--teal)}.case-mansoob{border-top:4px solid var(--accent)}.case-majroor{border-top:4px solid var(--purple)}.case-name-ar{font-family:Amiri,serif;font-size:1.8rem;direction:rtl;font-weight:700;margin-bottom:.3rem}.case-marfoo .case-name-ar{color:var(--teal)}.case-mansoob .case-name-ar{color:var(--accent)}.case-majroor .case-name-ar{color:var(--purple)}.case-name-fr{font-size:1rem;font-weight:600;color:var(--text);margin-bottom:.5rem}.case-marker{font-family:Amiri,serif;font-size:2rem;direction:rtl;color:var(--text-arabic);font-weight:700;margin-bottom:.3rem}.case-role{font-size:.82rem;color:var(--text-light);font-style:italic}.marker-demo{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin:1.5rem 0}.marker-box{display:flex;flex-direction:column;align-items:center;gap:.3rem;background:var(--bg-card);padding:1.2rem;border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow)}.marker-type{font-size:.8rem;color:var(--text-light);text-transform:uppercase;letter-spacing:.04em}.marker-example{font-family:Amiri,serif;font-size:2rem;direction:rtl;color:var(--text-arabic);font-weight:700}.marker-translit{font-family:JetBrains Mono,monospace;font-size:.85rem;color:var(--text-light);font-style:italic}.marker-vowel{font-family:Amiri,serif;font-size:2.5rem;direction:rtl;color:var(--accent);font-weight:700;line-height:1.6;margin-top:.5rem}.usage-cards{margin:1rem 0 1.5rem}.usage-card{display:flex;align-items:flex-start;gap:1rem;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}.usage-card:hover{transform:translate(4px)}.usage-number{width:32px;height:32px;background:var(--accent);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;flex-shrink:0;margin-top:.2rem}.usage-content{flex:1}.usage-title{font-weight:600;color:var(--text);margin-bottom:.3rem;font-size:.95rem}.usage-example{margin-bottom:.2rem}.usage-example .arabic{font-size:1.4em;font-weight:700}.usage-trans{font-size:.85rem;color:var(--text-light);font-style:italic}.prep-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:1.5rem 0}.prep-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem;text-align:center;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease}.prep-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}.prep-ar{font-family:Amiri,serif;font-size:2rem;direction:rtl;color:var(--purple);font-weight:700;margin-bottom:.2rem}.prep-translit{font-family:JetBrains Mono,monospace;font-size:.8rem;color:var(--text-light);font-style:italic;margin-bottom:.3rem}.prep-meaning{font-size:.9rem;color:var(--text);font-weight:600;margin-bottom:.6rem}.prep-example{background:var(--bg);border-radius:6px;padding:.6rem}.prep-example .arabic{display:block;font-size:1.1em;margin-bottom:.2rem}.prep-example small{color:var(--text-light);font-size:.78rem;font-style:italic}.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(--purple-light);color:var(--purple)}.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}.idafa-rules{margin:1.5rem 0}.idafa-rule{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;margin-bottom:.6rem;box-shadow:var(--shadow)}.rule-number{width:28px;height:28px;background:var(--purple);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;flex-shrink:0}.rule-text{font-size:.95rem}.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}.verb-ar{font-family:Amiri,serif;font-size:1.4em;direction:rtl;font-weight:700;color:var(--accent-dark);text-align:right}.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}.cases-overview,.marker-demo{grid-template-columns:1fr}.prep-cards{grid-template-columns:repeat(2,1fr)}.quiz-options{grid-template-columns:1fr}}