.page{flex-direction:column;min-height:100vh;display:flex}.topbar{z-index:20;align-items:center;gap:var(--spacing-md);padding:14px var(--spacing-md);-webkit-backdrop-filter:saturate(160%)blur(12px);backdrop-filter:saturate(160%)blur(12px);border-bottom:1px solid var(--color-border);background:#f7f7f7db;display:flex;position:sticky;top:0}.brand{align-items:center;display:flex}.brand img{width:auto;height:36px;display:block}.topbar .meta{color:var(--color-text-muted);margin-inline-start:auto;font-size:13px}.wrap{width:100%;max-width:680px;padding:var(--spacing-lg) var(--spacing-md) var(--spacing-xl);margin:0 auto}.lesson-head{text-align:center;margin-bottom:var(--spacing-xl)}.lesson-kicker{letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-light);font-size:13px}.lesson-title-ar{font-family:var(--font-ar);color:var(--color-title);direction:rtl;margin:10px 0 6px;font-size:clamp(2rem,6vw,2.9rem);line-height:1.7}.lesson-title-fr{color:var(--color-text-muted);font-size:15px}.rule-divider{width:56px;height:3px;margin:var(--spacing-md) auto 0;background:var(--color-accent);opacity:.85;border-radius:2px}.block{margin-bottom:var(--spacing-xl)}.block-label{margin-bottom:var(--spacing-md);align-items:center;gap:12px;display:flex}.block-label-ar{font-family:var(--font-ar);color:var(--color-accent);direction:rtl;font-size:1.45rem;font-weight:700;line-height:2}.block-label-fr{letter-spacing:.07em;text-transform:uppercase;color:var(--color-text-light);font-size:12px}.block-label:after{content:"";background:var(--color-border);flex:1;height:1px}.ar{font-family:var(--font-ar);text-align:right;font-size:1.5rem;line-height:var(--leading-ar);color:var(--color-title);direction:rtl;margin:0}.ar.prose{font-size:1.32rem}.numbered .ar{line-height:1.75}.numbered{direction:rtl;gap:2px;margin:0;padding:0;list-style:none;display:grid}.numbered.two-col{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(var(--rows), auto);gap:4px var(--spacing-md);grid-auto-flow:column}@media (width<=620px){.numbered.two-col{grid-template-rows:none;grid-template-columns:1fr;grid-auto-flow:row}}.numbered li{border-radius:var(--radius-sm);transition:background var(--transition-fast);align-items:baseline;gap:12px;padding:3px 12px;display:flex}.numbered li:hover{background:var(--color-surface-alt)}.num{text-align:center;min-width:1.9em;font-family:var(--font-ar);color:var(--color-text-light);border:1px solid var(--color-border);border-radius:var(--radius-full);flex:none;padding:1px 0;font-size:.95rem}.rule-box{background:var(--color-bg-alt);border:1px solid var(--color-border);border-inline-start:4px solid var(--color-accent);border-radius:var(--radius-md);padding:var(--spacing-md) var(--spacing-md) 10px;box-shadow:var(--shadow-md)}.section-heading{text-align:center;margin:var(--spacing-xl) 0 var(--spacing-md);font-size:1.85rem;font-weight:700}.section-heading .num{vertical-align:middle;margin-inline-end:12px;font-weight:400;display:inline-block}.table-scroll{border:1px solid var(--color-border);border-radius:var(--radius-md);overflow-x:auto}.ar-table{border-collapse:collapse;width:100%;font-family:var(--font-ar);color:var(--color-title);direction:rtl;font-size:1.32rem;line-height:1.9}.ar-table th,.ar-table td{text-align:center;border-bottom:1px solid var(--color-border-light);white-space:nowrap;padding:6px 14px}.ar-table th{background:var(--color-bg-alt);border-bottom-color:var(--color-border);font-weight:700}.ar-table tr:last-child td{border-bottom:none}.note{background:var(--color-bg-alt);border-inline-start:2px solid var(--color-border);border-radius:var(--radius-sm);padding:6px var(--spacing-sm)}.note .ar.prose{font-size:1.15rem}.dialogue{direction:rtl;grid-template-columns:max-content minmax(0,1fr);align-items:baseline;gap:4px 14px;display:grid}.speaker{white-space:nowrap;font-size:1.32rem;font-weight:700}.exercise{background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-md);margin-bottom:var(--spacing-sm)}.exercise-head{align-items:center;gap:10px;margin-bottom:14px;display:flex}.exercise-badge{border-radius:var(--radius-full);background:var(--color-accent-light);width:30px;height:30px;color:var(--color-accent-hover);flex:none;place-items:center;font-size:14px;font-weight:600;display:grid}.exercise-head h3{letter-spacing:.07em;text-transform:uppercase;color:var(--color-text-light);font-size:13px;font-weight:600}.prompt{margin-bottom:12px}.blank{border-bottom:2px dotted var(--color-accent);opacity:.5;min-width:4.5em;display:inline-block}.word-bank{direction:rtl;flex-wrap:wrap;justify-content:flex-start;gap:8px;margin:10px 0 14px;display:flex}.word-bank .tok{background:var(--color-accent-light);border-radius:var(--radius-full);padding:4px 16px}.tok{border-radius:5px;padding:0 1px}.tok.link{cursor:pointer;font:inherit;color:inherit;text-underline-offset:.28em;transition:background var(--transition-fast), text-decoration-color var(--transition-fast);direction:rtl;background:0 0;border:none;-webkit-text-decoration:underline #047a5759;text-decoration:underline #047a5759;text-decoration-thickness:1.5px}.tok.link:hover{background:var(--color-accent-light);-webkit-text-decoration-color:var(--color-accent);text-decoration-color:var(--color-accent)}.tok.link.active{background:var(--color-accent-solid);color:var(--color-on-accent);text-decoration-color:#0000}.overlay{z-index:40;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:fade var(--transition-base);background:#0a0a0a52;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}@media (width>=640px){.overlay{padding:var(--spacing-md);align-items:center}}@keyframes fade{0%{opacity:0}}.modal{background:var(--color-bg-alt);border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;max-width:540px;max-height:88vh;box-shadow:var(--shadow-xl);animation:rise var(--transition-base);overflow-y:auto}@media (width>=640px){.modal{border-radius:var(--radius-lg)}}@keyframes rise{0%{opacity:0;transform:translateY(14px)}}.modal-head{align-items:flex-start;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-md) var(--spacing-sm);background:var(--color-bg-alt);border-bottom:1px solid var(--color-border-light);display:flex;position:sticky;top:0}.modal-lemma{font-family:var(--font-ar);color:var(--color-title);direction:rtl;font-size:2.3rem;line-height:1.8}.pos-tag{letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent-hover);background:var(--color-accent-light);border-radius:var(--radius-full);margin-top:4px;padding:3px 11px;font-size:11px;display:inline-block}.close{border-radius:var(--radius-full);border:1px solid var(--color-border);cursor:pointer;width:34px;height:34px;color:var(--color-text-muted);transition:background var(--transition-fast);background:0 0;flex:none;justify-content:center;align-items:center;margin-inline-start:auto;display:flex}.close:hover{background:var(--color-border-light)}.modal-body{padding:var(--spacing-sm) var(--spacing-md) var(--spacing-md)}.field{border-bottom:1px solid var(--color-border-light);padding:14px 0}.field:last-child{border-bottom:none}.field-label{letter-spacing:.07em;text-transform:uppercase;color:var(--color-text-light);margin-bottom:7px;font-size:11px}.sense{color:var(--color-title);font-size:1.15rem;font-weight:500}.ar-inline{font-family:var(--font-ar);direction:rtl;font-size:1.3rem}.pill-row{flex-wrap:wrap;gap:8px;display:flex}.pill{background:var(--color-border-light);border-radius:var(--radius-full);align-items:baseline;gap:8px;padding:5px 14px;display:flex}.pill small{color:var(--color-text-light);font-size:11px}.example{background:var(--color-surface-alt);border-radius:var(--radius-md);padding:14px var(--spacing-sm)}.example .ar-inline{margin-bottom:6px;line-height:2.1;display:block}.example .fr{color:var(--color-text-muted);font-size:14px;font-style:italic}.forms{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}@media (width<=420px){.forms{grid-template-columns:1fr}}.form-cell{background:var(--color-surface-alt);border:1px solid var(--color-border-light);border-radius:var(--radius-md);padding:10px 14px}.form-cell-head{align-items:baseline;gap:8px;margin-bottom:2px;display:flex}.form-cell-ar{color:var(--color-accent-hover);font-size:.95rem}.form-cell-fr{letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-light);font-size:10.5px}.form-cell-value{color:var(--color-title);font-size:1.45rem;line-height:1.9}.irregular-note{color:#7a5b12;border-radius:var(--radius-sm);background:#fff8e6;margin-top:10px;padding:9px 12px;font-size:13px}.siblings{flex-wrap:wrap;gap:8px;display:flex}.sibling{border:1px solid var(--color-border);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);background:0 0;padding:5px 14px}.sibling:hover{border-color:var(--color-accent);background:var(--color-accent-light)}.state{text-align:center;padding:var(--spacing-xl) var(--spacing-md);color:var(--color-text-muted)}.state code{background:var(--color-border-light);border-radius:5px;padding:2px 7px;font-size:13px}:root{--color-bg:#fff;--color-bg-alt:#f7f7f7;--color-surface-alt:#fafafa;--color-title:#0a0a0a;--color-text:#3a3a3c;--color-text-muted:#5a5a5c;--color-text-light:#5a5a5c;--color-border:#e5e5e5;--color-border-light:#ededed;--color-accent:#047a57;--color-accent-solid:#27a964;--color-on-accent:#0a0a0a;--color-accent-light:#b9e0cc;--color-accent-hover:#0a0a0a;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--shadow-sm:none;--shadow-md:none;--shadow-lg:none;--shadow-xl:0 14px 34px -14px #00000047;--spacing-sm:16px;--spacing-md:24px;--spacing-lg:40px;--spacing-xl:64px;--max-width:1200px;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-base:.3s cubic-bezier(.4, 0, .2, 1);--font-ar:"Amiri", "Noto Naskh Arabic", serif;--font-fr:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--leading-ar:2.15}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-fr);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.6}h1,h2,h3{color:var(--color-title);margin:0;font-weight:600}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:4px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
