:root{--bg: #f8f3ea;--surface: #fffaf2;--surface-soft: #fbf5eb;--surface-muted: #f0e9de;--ink: #14213d;--ink-strong: #0f172a;--muted: #5c6674;--muted-soft: #7a8391;--line: #ddd3c4;--line-soft: #ebe2d6;--teal: #1f6f67;--teal-dark: #145852;--teal-soft: #e4f1ed;--teal-line: #b8d8d1;--red: #8f3f3f;--red-soft: #f7e6e2;--red-line: #e6c6bf;--gold: #b98b3d;--radius-card: 16px;--radius-control: 12px;--shadow-soft: 0 12px 28px rgb(47 37 22 / 6%);--shadow-nav: 0 10px 28px rgb(47 37 22 / 10%);color:var(--ink);background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-width:320px;min-height:100vh;background:var(--bg)}html.quiz-scroll-lock,body.quiz-scroll-lock{height:100dvh;overflow:hidden;overscroll-behavior:none}body.quiz-scroll-lock{position:fixed;top:0;right:0;bottom:0;left:0;width:100%}button{font:inherit;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid rgb(185 139 61 / 72%);outline-offset:3px}.app-shell{min-height:100vh;padding:max(22px,env(safe-area-inset-top)) 16px 32px}.app-shell.has-bottom-nav{padding-bottom:calc(106px + env(safe-area-inset-bottom))}.home-view,.quiz-view,.result-view{width:min(100%,720px);margin:0 auto}.home-header{padding:10px 2px 24px;text-align:center}.home-logo{display:block;width:clamp(68px,20vw,84px);height:clamp(68px,20vw,84px);margin:0 auto 16px;object-fit:contain}.eyebrow{margin:0 0 8px;color:var(--muted-soft);font-size:.75rem;font-weight:750;letter-spacing:0;text-transform:uppercase}h1,h2,p{margin-top:0}h1{margin-bottom:7px;color:var(--ink-strong);font-size:clamp(2.15rem,10.5vw,3.55rem);font-weight:800;line-height:1.02;letter-spacing:0}.subtitle{margin-bottom:6px;color:#3f4b59;font-size:1.02rem;line-height:1.45}.level-note{margin-bottom:17px;color:var(--muted-soft);font-size:.92rem;line-height:1.45}.mastery{display:inline-flex;align-items:center;min-height:34px;margin-bottom:0;padding:7px 11px;border:1px solid var(--line-soft);border-radius:999px;background:#fffaf2b8;color:var(--teal-dark);font-size:.9rem;font-weight:760}.level-list{display:grid;gap:10px}.level-card,.summary-card{display:grid;grid-template-columns:1fr;gap:14px;min-width:0;padding:16px;border:1px solid var(--line-soft);border-radius:var(--radius-card);background:#fffaf2c7;box-shadow:0 8px 22px #2f25160a}.level-card:has(.status-ready),.level-card:has(.status-in-progress){border-color:var(--teal-line);background:var(--surface);box-shadow:var(--shadow-soft)}.level-card__topline{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}.level-card h2{margin-bottom:7px;color:var(--ink);font-size:1.05rem;font-weight:800;line-height:1.2}.level-card p{margin-bottom:0;color:var(--muted);font-size:.94rem;line-height:1.45}.rehearsal-overview{display:grid;min-height:calc(100vh - 150px);align-content:start}.rehearsal-overview .home-header{padding-top:18px;padding-bottom:18px}.summary-card{gap:5px;margin-bottom:14px;background:#fffaf2bd;box-shadow:none}.summary-card p{margin-bottom:0;color:var(--muted);font-size:.95rem;font-weight:650;line-height:1.45}.summary-card p:first-child{color:var(--ink);font-size:1.02rem;font-weight:800}.overview-action{width:100%}.level-card.is-complete{border-color:#e2dccf;background:#f5f3eb;box-shadow:none}.level-card.is-complete h2,.level-card.is-locked h2{color:#344054}.level-card.is-locked{border-color:#e6ded2;background:#f2eee7;color:var(--muted);box-shadow:none}.status{flex:0 0 auto;padding:5px 8px;border:1px solid transparent;border-radius:999px;color:var(--muted);background:var(--surface-muted);font-size:.68rem;font-weight:800;line-height:1;letter-spacing:0}.status-completed{border-color:#c8ddd5;color:var(--teal-dark);background:var(--teal-soft)}.status-in-progress,.status-ready{border-color:var(--teal-line);color:var(--teal-dark);background:var(--teal-soft)}.status-locked{color:#6b7280;background:#e9e2d7}.complete-mark{display:inline-grid;width:32px;height:32px;place-items:center;border-radius:999px;background:var(--teal);color:#fff;font-size:.9rem;font-weight:900}.primary-button,.secondary-button,.back-button{min-height:46px;border:0;border-radius:var(--radius-control);cursor:pointer;font-weight:760;line-height:1.15}.primary-button{width:100%;padding:12px 16px;background:var(--teal);color:#fff;box-shadow:0 7px 16px #1f6f6724}.primary-button:hover{background:var(--teal-dark)}.secondary-button{width:100%;padding:12px 16px;border:1px solid var(--line);background:#fffaf2c7;color:var(--ink)}.secondary-button:hover{border-color:#cbbfaa;background:var(--surface)}.back-button{min-height:38px;padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:#fffaf2c2;color:var(--teal-dark);text-align:left;box-shadow:none}.back-button:hover{border-color:#b8cbc4;background:var(--surface)}.quiz-topbar{display:flex;align-items:center;justify-content:flex-start;gap:16px;margin-bottom:12px;color:var(--muted);font-weight:760}body.quiz-scroll-lock .app-shell{height:100dvh;min-height:100dvh;overflow:hidden;padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))}body.quiz-scroll-lock .quiz-view{display:flex;flex-direction:column;height:calc(100dvh - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)));overflow:hidden}body.quiz-scroll-lock .quiz-card{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden}body.quiz-scroll-lock .options-grid{flex:0 0 auto}.quiz-card,.result-card{padding:18px;border:1px solid var(--line-soft);border-radius:var(--radius-card);background:var(--surface);box-shadow:var(--shadow-soft)}.quiz-meta{display:flex;justify-content:space-between;gap:12px;margin-bottom:20px;color:var(--muted-soft);font-size:.88rem;font-weight:760;line-height:1.35}.quiz-meta p{margin-bottom:0}.name-prompt{margin-bottom:18px;text-align:center}.arabic-name{margin-bottom:8px;color:var(--ink-strong);font-family:Traditional Arabic,Noto Naskh Arabic,Amiri,serif;font-size:clamp(3.25rem,18vw,6.8rem);font-weight:600;line-height:1.08}.transliteration{margin-bottom:0;color:var(--teal-dark);font-size:1.14rem;font-weight:760;line-height:1.25}.options-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.option-button{display:flex;min-width:0;min-height:82px;align-items:center;justify-content:center;padding:12px 10px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);cursor:pointer;font-size:.95rem;font-weight:700;line-height:1.22;overflow-wrap:anywhere;text-align:center}.option-button:hover:not(:disabled){border-color:var(--teal);background:#fffdf8}.option-button:disabled{cursor:default}.option-button.is-correct{border-color:var(--teal);background:var(--teal-soft);color:var(--teal-dark);box-shadow:inset 0 0 0 1px #1f6f671f}.option-button.is-wrong{border-color:var(--red-line);background:var(--red-soft);color:var(--red);box-shadow:inset 0 0 0 1px #8f3f3f14}.feedback{display:grid;gap:4px;margin-top:14px;padding:11px 12px;border:1px solid transparent;border-radius:13px;font-size:.94rem;font-weight:650;line-height:1.35}.feedback strong{font-weight:820}.feedback--correct{border-color:var(--teal-line);background:var(--teal-soft);color:var(--teal-dark)}.feedback--wrong{border-color:var(--red-line);background:var(--red-soft);color:var(--red)}.next-button{margin-top:12px}.result-view{display:grid;min-height:calc(100vh - 56px);place-items:center}.result-card{width:100%}.result-card h1{margin-bottom:12px;font-size:clamp(1.95rem,9vw,3.1rem);line-height:1.05}.result-card p{color:var(--muted);line-height:1.45}.result-card .primary-button{margin-top:12px}.result-card .secondary-button{margin-top:10px}.result-lead{color:var(--ink);font-size:1.05rem;font-weight:820}.result-card--perfect{border-color:var(--teal-line)}.result-card--retry{border-color:var(--red-line)}.bottom-nav{position:fixed;right:16px;bottom:max(10px,env(safe-area-inset-bottom));left:16px;z-index:10;display:grid;grid-template-columns:1fr 1fr;gap:6px;width:min(calc(100% - 32px),520px);margin:0 auto;padding:7px;border:1px solid rgb(221 211 196 / 82%);border-radius:16px;background:#fffaf2f5;box-shadow:var(--shadow-nav);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.bottom-nav__item{min-width:0;min-height:42px;border:0;border-radius:11px;background:transparent;color:var(--muted);cursor:pointer;font-weight:800;line-height:1.1}.bottom-nav__item.is-active{background:var(--teal-soft);color:var(--teal-dark)}@media (min-width: 620px){.app-shell{padding:40px 24px 56px}.app-shell.has-bottom-nav{padding-bottom:calc(122px + env(safe-area-inset-bottom))}.level-card{grid-template-columns:1fr auto;align-items:center}.primary-button{width:auto;min-width:164px}.result-card .primary-button,.result-card .secondary-button{width:100%}.quiz-card,.result-card{padding:26px}.options-grid{gap:12px}}@media (max-height: 700px){body.quiz-scroll-lock .app-shell{padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom))}body.quiz-scroll-lock .quiz-view{height:calc(100dvh - max(10px,env(safe-area-inset-top)) - max(10px,env(safe-area-inset-bottom)))}body.quiz-scroll-lock .quiz-topbar{margin-bottom:8px}body.quiz-scroll-lock .quiz-card{padding:12px}body.quiz-scroll-lock .quiz-meta{margin-bottom:10px;font-size:.86rem}body.quiz-scroll-lock .name-prompt{margin-bottom:12px}body.quiz-scroll-lock .arabic-name{margin-bottom:4px;font-size:clamp(2.65rem,15vh,4.1rem)}body.quiz-scroll-lock .transliteration{font-size:1rem}body.quiz-scroll-lock .option-button{min-height:66px;padding:9px 8px;font-size:.88rem}body.quiz-scroll-lock .feedback{margin-top:10px;padding:9px 10px;font-size:.88rem}body.quiz-scroll-lock .next-button{margin-top:10px;min-height:42px}}