@font-face{font-family:Google Sans Variable;font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/google-sans-latin-wght-normal-Bwkq70f6.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Google Sans Variable;font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/google-sans-latin-ext-wght-normal-DjTdUnS9.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Google Sans Variable;font-style:italic;font-weight:400 700;font-display:swap;src:url(/assets/google-sans-latin-wght-italic-4eNTmejQ.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Google Sans Variable;font-style:italic;font-weight:400 700;font-display:swap;src:url(/assets/google-sans-latin-ext-wght-italic-DB4dv-wu.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}:root{--font:"Google Sans Variable", "Google Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--r-sm:14px;--r-md:22px;--r-lg:30px;--r-xl:40px;--tap:46px;--blur:blur(24px) saturate(180%);--ease:cubic-bezier(.2, .8, .2, 1);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}:root,[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#000;--text:#f2f0ea;--muted:#a1a1a6;--inverse:#000;--faint:#f2f0ea47;--line:#ffffff21;--chip:#ffffff1c;--card:#ffffff0d;--field:#ffffff12;--glass:#2626288c;--glass-strong:#1e1e20d1;--glass-border:#ffffff24;--glass-shadow:inset 0 1px 0 #ffffff2e, 0 12px 32px #0000008c;--scrim:#00000080;--sel:#f2f0ea29;--red:#ff6b6b;--red-fill:#ff6b6b33;--amber:#ffc24b;--amber-fill:#ffc24b2e;--green:#5fd99a;--blue:#6db5ff;--blue-fill:#6db5ff38;--blue-glow:#6db5ff80;--purple:#c7a4ff;--purple-fill:#c7a4ff2e;--heat-1:#ff6b6b29;--heat-2:#ff6b6b57;--heat-3:#ff6b6b94;--heat-4:#ff6b6b;--heat-ink-4:#000}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#fff;--text:#111;--muted:#5c5c61;--inverse:#fff;--faint:#11111138;--line:#0000001c;--chip:#0000000f;--card:#f6f6f4;--field:#00000009;--glass:#ffffffad;--glass-strong:#fafafae0;--glass-border:#00000012;--glass-shadow:inset 0 1px 0 #fffffff2, 0 10px 30px #0000001f;--scrim:#0003;--sel:#11111117;--red:#c4251c;--red-fill:#c4251c1c;--amber:#a65a00;--amber-fill:#e6961433;--green:#17773f;--blue:#1d5fd6;--blue-fill:#1d5fd61f;--blue-glow:#1d5fd652;--purple:#6a3cc2;--purple-fill:#6a3cc21c;--heat-1:#f6d3d0;--heat-2:#eba29c;--heat-3:#d8584f;--heat-4:#a51e16;--heat-ink-4:#fff}[data-theme=vintage]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f2e6cc;--text:#2a1c0c;--muted:#5e4a2e;--inverse:#f7eedb;--faint:#2a1c0c40;--line:#5a3c1433;--chip:#5a3c1417;--card:#fffaee8c;--field:#fffbf2b3;--glass:#fbf4e5a3;--glass-strong:#f9f1e0e0;--glass-border:#6e501e29;--glass-shadow:inset 0 1px 0 #fffcf2d9, 0 10px 30px #5a3c0f2e;--scrim:#3c280a33;--sel:#2a1c0c1c;--red:#9e2418;--red-fill:#9e241821;--amber:#8e5200;--amber-fill:#c8821438;--green:#3b6627;--blue:#274c8c;--blue-fill:#274c8c24;--blue-glow:#274c8c59;--purple:#633876;--purple-fill:#63387624;--heat-1:#ebc7b4;--heat-2:#d9967c;--heat-3:#b4523a;--heat-4:#842015;--heat-ink-4:#f7eedb}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;margin:0;overflow-x:clip}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;overscroll-behavior:none;font-size:16px;line-height:1.4}#app{min-height:100%}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0}button:disabled{cursor:default;opacity:.45}:focus-visible{outline:2.5px solid var(--blue);outline-offset:2px;border-radius:12px}a{color:inherit}h1,h2,h3,p{margin:0}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;overflow:hidden;position:absolute!important}.muted{color:var(--muted)}.ar{direction:rtl;font-family:UthmanicHafs,serif}.num{font-variant-numeric:tabular-nums}svg.i{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}svg.f{fill:currentColor;stroke:none}.glass{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}.glass-strong{background:var(--glass-strong);-webkit-backdrop-filter:blur(30px)saturate(180%);backdrop-filter:blur(30px)saturate(180%);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}@media (prefers-reduced-transparency:reduce){.glass,.glass-strong{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none}}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.glass{background:var(--glass-strong)}}.btn{min-height:var(--tap);background:var(--chip);color:var(--text);white-space:normal;text-align:center;padding:0 20px;max-width:100%;transition:transform .15s var(--ease), background .2s;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding-block:6px;font-size:15px;font-weight:500;line-height:1.2;display:inline-flex}.btn:active:not(:disabled){transform:scale(.97)}.btn.primary{background:var(--text);color:var(--inverse)}.btn.outline{border:1px solid var(--line);background:0 0}.btn.ghost{background:0 0}.btn.danger{border:1px solid var(--red);color:var(--red);background:0 0}.btn.big{min-height:56px;padding:0 24px;font-size:17px}.btn.wide{width:100%}.btn.sm{min-height:38px;padding:0 14px;font-size:14px}.icon-btn{width:var(--tap);height:var(--tap);color:var(--text);transition:transform .15s var(--ease);border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.icon-btn:active{transform:scale(.94)}.chip{background:var(--chip)}.pill{background:var(--chip);border-radius:999px;align-items:center;gap:6px;height:28px;padding:0 11px;font-size:13px;font-weight:500;display:inline-flex}.pill.solid{background:var(--text);color:var(--inverse)}.badge{background:var(--text);min-width:20px;height:20px;color:var(--inverse);border-radius:10px;justify-content:center;align-items:center;padding:0 6px;font-size:12px;font-weight:700;display:inline-flex}.seg{background:var(--chip);border-radius:999px;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:3px;padding:3px;display:grid}.seg button{min-height:40px;color:var(--muted);border-radius:999px;padding:0 12px;font-size:14.5px;font-weight:500}.seg button[aria-pressed=true]{background:var(--bg);color:var(--text);box-shadow:0 1px 4px #00000024}.field{flex-direction:column;gap:6px;display:flex}.field>span{color:var(--muted);font-size:13.5px}.input{border:1px solid var(--line);background:var(--field);border-radius:26px;outline:none;width:100%;height:52px;padding:0 18px;font-size:16px;transition:border-color .2s}.input:focus{border-color:var(--text)}textarea.input{resize:vertical;border-radius:22px;height:auto;min-height:90px;padding:14px 18px}input[type=range]{width:100%;height:44px;accent-color:var(--text);cursor:pointer}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md)}.card-pad{padding:16px 18px}.list-row{border-top:1px solid var(--line);text-align:left;align-items:center;gap:12px;width:100%;min-height:60px;display:flex}.list-row:first-of-type{border-top:0}.avatar{background:var(--chip);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-weight:500;display:flex}.title-xl{letter-spacing:-.02em;font-size:34px;font-weight:500;line-height:1.1}.title-lg{letter-spacing:-.01em;font-size:22px;font-weight:500}.title-md{font-size:17px;font-weight:500}.error-text{color:var(--red);font-size:14px}.empty{text-align:center;color:var(--muted);padding:28px 12px;font-size:15px}.row{align-items:center;gap:10px;display:flex}.col{flex-direction:column;gap:10px;display:flex}.grow{flex:auto;min-width:0}.stack{flex-direction:column;gap:12px;display:flex}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}@media (max-width:720px){.grid-2:not(.keep){grid-template-columns:minmax(0,1fr)}}select.input{appearance:none;background-image:linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);background-position:calc(100% - 22px),calc(100% - 16px);background-repeat:no-repeat;background-size:6px 6px;padding-right:40px}option{background:var(--bg);color:var(--text)}.ellipsis{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.scrim{background:var(--scrim);z-index:50;animation:fade .2s var(--ease);position:fixed;inset:0}.sheet{z-index:51;left:max(8px, var(--safe-left));right:max(8px, var(--safe-right));bottom:max(8px, var(--safe-bottom));max-height:calc(100dvh - 24px - var(--safe-top));animation:rise .28s var(--ease);overscroll-behavior:contain;border-radius:38px;padding:8px 20px 20px;position:fixed;overflow-y:auto}.sheet:focus{outline:none}.sheet .handle{background:var(--faint);border-radius:3px;width:38px;height:5px;margin:0 auto 10px}@media (min-width:760px){.sheet{width:480px;max-height:84vh;margin-left:-240px;inset:8vh auto auto 50%}}@media (min-width:1000px){.sheet.side{left:auto;right:max(14px, var(--safe-right));top:max(14px, var(--safe-top));bottom:max(14px, var(--safe-bottom));border-radius:30px;width:380px;max-height:none;margin:0}.scrim.side{display:none}.side-open .reader main{max-width:none!important;margin:0!important;padding-right:410px!important}.side-open .reader-top,.side-open .live-capsule{margin:0 0 0 max(14px, var(--safe-left));max-width:none;right:410px}.side-open .page-arrows{max-width:none;padding-right:410px}.side-open .reader .tabbar{right:410px}}@keyframes rise{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}@keyframes fade{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.toast{z-index:60;left:50%;bottom:calc(96px + var(--safe-bottom));animation:rise .25s var(--ease);border-radius:999px;max-width:90vw;padding:12px 20px;font-size:15px;font-weight:500;position:fixed;transform:translate(-50%)}.page-pad{padding:calc(20px + var(--safe-top)) max(16px, var(--safe-right)) calc(110px + var(--safe-bottom)) max(16px, var(--safe-left));max-width:1100px;margin:0 auto}.tabbar{z-index:40;left:max(16px, var(--safe-left));right:max(16px, var(--safe-right));bottom:calc(14px + var(--safe-bottom));border-radius:33px;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:2px;max-width:560px;height:66px;margin:0 auto;padding:5px;display:grid;position:fixed}.tabbar button{color:var(--muted);border-radius:28px;flex-direction:column;justify-content:center;align-items:center;gap:3px;font-size:11.5px;font-weight:500;display:flex;position:relative}.tabbar button[aria-current=page]{background:var(--chip);color:var(--text)}.tabbar .badge{min-width:18px;height:18px;margin-left:6px;font-size:11px;position:absolute;top:5px;left:50%}.sidebar{z-index:40;top:max(14px, var(--safe-top));bottom:max(14px, var(--safe-bottom));left:max(14px, var(--safe-left));border-radius:28px;flex-direction:column;gap:4px;width:250px;padding:20px 12px 14px;display:flex;position:fixed}.sidebar .brand{letter-spacing:-.02em;padding:0 10px 14px;font-size:22px;font-weight:500}.sidebar button.nav{height:46px;color:var(--muted);text-align:left;border-radius:23px;align-items:center;gap:12px;padding:0 12px;font-size:15px;font-weight:500;display:flex}.sidebar button.nav[aria-current=page]{background:var(--chip);color:var(--text)}.with-sidebar{padding-left:calc(278px + var(--safe-left))}@media (max-width:899px){.sidebar{display:none}.with-sidebar{padding-left:0}}@media (min-width:900px){.tabbar.teacher{display:none}.page-pad.teacher{padding-bottom:40px}}.reader{min-height:100dvh;position:relative}.reader-top{z-index:30;top:calc(10px + var(--safe-top));left:max(14px, var(--safe-left));right:max(14px, var(--safe-right));align-items:center;gap:10px;max-width:760px;margin:0 auto;display:flex;position:fixed}.reader-top .title{border-radius:25px;flex-direction:column;flex:1;justify-content:center;align-items:center;min-width:0;height:50px;display:flex}.reader-top .title b{letter-spacing:-.01em;font-size:15px;font-weight:500}.reader-top .title small{color:var(--muted);font-size:12px}.reader-top .icon-btn{width:50px;height:50px}.live-capsule{z-index:29;top:calc(70px + var(--safe-top));left:max(14px, var(--safe-left));right:max(14px, var(--safe-right));border-radius:28px;align-items:center;gap:12px;max-width:760px;min-height:56px;margin:0 auto;padding:6px 8px 6px 16px;display:flex;position:fixed}.live-dot{background:var(--blue);width:10px;height:10px;box-shadow:0 0 0 4px var(--blue-fill);border-radius:50%;flex-shrink:0}.live-dot.off{background:var(--faint);box-shadow:none}.page-arrows{z-index:20;bottom:calc(96px + var(--safe-bottom));padding:0 max(12px, var(--safe-left));pointer-events:none;justify-content:space-between;max-width:1000px;margin:0 auto;display:flex;position:fixed;left:0;right:0}.page-arrows .icon-btn{pointer-events:auto}@media (hover:none){.page-arrows{display:none}}@media (hover:hover) and (pointer:fine){.page-arrows{max-width:1060px;top:50%;bottom:auto;transform:translateY(-50%)}}.mushaf{padding:calc(var(--top-space,132px) + var(--safe-top)) 14px calc(150px + var(--safe-bottom));-webkit-user-select:none;user-select:none;direction:rtl;max-width:900px;margin:0 auto}.mushaf .sheader{direction:rtl;justify-content:center;align-items:center;gap:14px;margin:.4em 0 .2em;display:flex}.mushaf .sheader:before,.mushaf .sheader:after{content:"";background:var(--line);flex:1;max-width:30%;height:1px}.mushaf .sheader span{border:1px solid var(--line);border-radius:999px;padding:0 .6em;font-family:SurahNames,UthmanicHafs,serif;font-size:1.15em;line-height:1.6}.mushaf .basmala{text-align:center}.mushaf .line{white-space:nowrap;justify-content:space-between;align-items:center;line-height:1.95;display:flex}.mushaf .line.center{justify-content:center;gap:.18em}.mushaf.flow .ayah{text-align:right;border-bottom:1px solid var(--line);white-space:normal;padding:.15em .1em;line-height:2;display:block}.mushaf.flow .ayah .w,.mushaf.flow .ayah .ae{margin-inline:.09em}.w,.ae{cursor:pointer;border-bottom:.09em solid #0000;border-radius:.22em .22em .06em .06em;padding:0 .06em;line-height:1.7;transition:background .2s,box-shadow .2s;display:inline-block;position:relative}.ae{color:var(--text);cursor:default}@media (hover:hover) and (pointer:fine){.w:hover{background:var(--sel)}}.w.hl{background:linear-gradient(transparent 16%, color-mix(in srgb, var(--hl) 50%, transparent) 16%, color-mix(in srgb, var(--hl) 50%, transparent) 90%, transparent 90%)}[data-theme=dark] .w.hl{background:linear-gradient(transparent 16%, color-mix(in srgb, var(--hl) 38%, transparent) 16%, color-mix(in srgb, var(--hl) 38%, transparent) 90%, transparent 90%)}@supports not (background:color-mix(in srgb, red 50%, transparent)){.w.hl{background:var(--sel);border-bottom-color:var(--hl)}}.w.m-mistake{background:var(--red-fill);border-bottom-color:var(--red)}.w.m-hesitation{background:var(--amber-fill);border-bottom:.09em dashed var(--amber)}.w.m-mastered{border-bottom-color:var(--green)}.w.m-unsure{background:var(--purple-fill);border-bottom:.09em dotted var(--purple)}.w.m-practised{opacity:.78}.w .q{background:var(--purple);width:1.05em;min-width:17px;height:1.05em;min-height:17px;color:var(--inverse);font-family:var(--font);pointer-events:none;border-radius:50%;justify-content:center;align-items:center;font-size:max(11px,.38em);font-weight:700;line-height:1;display:flex;position:absolute;top:-.1em;left:-.25em}.w.point{background:var(--blue-fill);box-shadow:0 0 0 2px var(--blue), 0 0 18px var(--blue-glow);animation:pulse 1.6s var(--ease) 2}.w.sel{background:var(--sel);box-shadow:0 0 0 1.5px var(--text)}.w.inrange{background:var(--sel)}@keyframes pulse{50%{box-shadow:0 0 0 4px var(--blue), 0 0 26px var(--blue-glow)}}.integrity-fail{text-align:center;max-width:460px;margin:20vh auto 0;padding:24px}.mushaf{-webkit-touch-callout:none;position:relative}.w.flash,.ae.flash{animation:flash 3.2s var(--ease)}@keyframes flash{0%,55%{background-color:var(--blue-fill);box-shadow:0 0 0 .06em var(--blue-fill)}to{background-color:#0000}}.pencil{pointer-events:none;z-index:2;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.pencil.active{pointer-events:auto;touch-action:pinch-zoom;cursor:crosshair}.pencil.active.erase{cursor:pointer}.pencil .stroke{fill:none;stroke-linecap:round;stroke-linejoin:round}.pencil .hit{fill:none;stroke:#0000;pointer-events:stroke;stroke-linecap:round}.bars{align-items:flex-end;gap:10px;height:170px;display:flex}.bars .b{flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.bars .fill{background:var(--faint);border-radius:4px 4px 0 0;width:100%;min-height:2px}.bars .fill.now{background:var(--text)}.hbar{align-items:center;gap:12px;font-size:14px;display:flex}.hbar .track{flex:1;height:16px}.hbar .fill{background:var(--text);opacity:.6;border-radius:0 4px 4px 0;height:16px}.heat{grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;display:grid}.heat button{border-radius:10px;height:44px;font-size:13px;font-weight:500}.h0{background:var(--chip);color:var(--muted)}.h1{background:var(--heat-1)}.h2{background:var(--heat-2)}.h3{background:var(--heat-3);color:#fff}.h4{background:var(--heat-4);color:var(--heat-ink-4)}[data-theme=dark] .h3{color:var(--text)}.pin-dots{justify-content:center;gap:14px;margin:18px 0 8px;display:flex}.pin-dots i{border:2px solid var(--text);border-radius:50%;width:16px;height:16px}.pin-dots i.on{background:var(--text)}.pin-pad{grid-template-columns:repeat(3,76px);justify-content:center;gap:14px;margin-top:18px;display:grid}.pin-pad button{background:var(--chip);border-radius:50%;width:76px;height:76px;font-size:28px;font-weight:500}.pin-pad button:active{background:var(--faint)}.wave{flex:1;align-items:center;gap:2px;min-width:0;height:30px;display:flex;overflow:hidden}.wave i{background:var(--faint);border-radius:2px;flex-shrink:0;width:3px}.wave i.on{background:var(--text)}.rec-dot{background:var(--red);border-radius:50%;width:12px;height:12px;animation:1.2s infinite pulse-dot}@keyframes pulse-dot{50%{opacity:.35}}.theme-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}@media (max-width:560px){.theme-cards{grid-template-columns:minmax(0,1fr)}}.theme-card{text-align:left;border:2px solid var(--line);border-radius:26px;flex-direction:column;gap:10px;min-height:120px;padding:14px;display:flex}.theme-card[aria-pressed=true]{border-color:var(--text)}.theme-card .preview{direction:rtl;border-radius:16px;justify-content:center;align-items:center;height:86px;font-family:UthmanicHafs,serif;font-size:26px;display:flex}@media (max-width:560px){.theme-card{flex-direction:row;align-items:center;min-height:0}.theme-card .preview{width:120px;height:64px;font-size:20px}}.tabs{scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:6px;margin:0 -2px;padding:2px;display:flex;position:relative;overflow-x:auto}.tabs::-webkit-scrollbar{display:none}.tabs button{background:var(--chip);min-height:40px;color:var(--muted);border-radius:999px;flex-shrink:0;align-items:center;gap:6px;padding:0 16px;font-size:14.5px;font-weight:500;display:inline-flex}.tabs button[aria-selected=true]{background:var(--text);color:var(--inverse)}.tabs button[aria-selected=true] .badge{background:var(--inverse);color:var(--text)}.chip-row{flex-wrap:wrap;gap:8px;display:flex}.chip-btn{background:var(--chip);text-align:left;border-radius:999px;align-items:center;gap:6px;min-height:36px;padding:6px 14px;font-size:14px;font-weight:500;display:inline-flex}.chip-btn.on,.chip-btn[aria-pressed=true].on{background:var(--text);color:var(--inverse)}.switch-row{align-items:center;gap:14px;width:100%;min-height:48px;display:flex}.switch{background:var(--faint);border-radius:15px;flex-shrink:0;width:50px;height:30px;padding:3px;transition:background .2s;display:flex}.switch i{width:24px;height:24px;transition:transform .2s var(--ease);background:#fff;border-radius:12px;box-shadow:0 1px 3px #00000040}.switch.on{background:var(--green)}.switch.on i{transform:translate(20px)}.colors{flex-wrap:wrap;align-items:center;gap:7px;display:flex}.swatch{border:2px solid var(--bg);width:30px;height:30px;box-shadow:0 0 0 1px var(--line);border-radius:50%;flex-shrink:0;display:inline-block;position:relative}.swatch[aria-checked=true],.swatch.picked{box-shadow:0 0 0 2.5px var(--text)}.swatch.any{cursor:pointer;background:conic-gradient(#f44,#fb3,#4d4,#3cf,#66f,#d4f,#f44);overflow:hidden}.swatch.any input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.stepper{align-items:center;gap:8px;display:inline-flex}.stepper b{text-align:center;min-width:58px;font-weight:500}.stepper .icon-btn{width:40px;height:40px}.days{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;display:grid}.days button{border:1px solid var(--line);border-radius:14px;min-height:44px;font-size:14px;font-weight:500}.days button[aria-pressed=true]{background:var(--text);color:var(--inverse);border-color:var(--text)}.cat{text-align:left;border:1px solid var(--line);border-radius:18px;min-height:54px;padding:6px 12px}.cat[aria-pressed=true]{background:var(--text);color:var(--inverse);border-color:var(--text)}.progress{background:var(--chip);border-radius:3px;height:6px;overflow:hidden}.progress i{background:var(--text);height:100%;transition:width .3s;display:block}.badge.live{background:var(--blue);color:#fff;letter-spacing:.04em;font-size:9.5px}.ticks{flex-direction:column;gap:6px;margin:0;padding:0;font-size:14.5px;list-style:none;display:flex}.ticks li{align-items:center;gap:8px;display:flex}.steps{flex-direction:column;gap:8px;margin:0;padding-left:22px;line-height:1.45;display:flex}.link{color:var(--blue);font-weight:500;text-decoration:underline}.facts{grid-template-columns:minmax(110px,40%) 1fr;gap:8px 12px;margin:10px 0 0;font-size:14.5px;display:grid}.facts dt{color:var(--muted)}.facts dd{overflow-wrap:anywhere;margin:0}.small-label{margin-bottom:4px;font-size:12.5px}.mark-chip{background:var(--red-fill);border-bottom:3px solid var(--red);border-radius:5px;flex-shrink:0;width:26px;height:18px}.mark-chip[data-kind=hesitation]{background:var(--amber-fill);border-bottom:3px dashed var(--amber)}.mark-chip[data-kind=unsure]{background:var(--purple-fill);border-bottom:3px dotted var(--purple)}.mark-chip[data-kind=highlight]{border-bottom:0}.trap{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}.check{align-items:flex-start;gap:12px;font-size:15px}.check input{width:22px;height:22px;accent-color:var(--text);flex-shrink:0}.code-input{text-align:center;letter-spacing:.12em;text-transform:uppercase;height:68px;font-size:30px;font-weight:500}.scrim.clear{background:0 0;animation:none}.bubble{z-index:52;max-width:calc(100vw - 20px);animation:rise .2s var(--ease);border-radius:24px;padding:14px 16px;position:fixed}.info-row{align-items:flex-start;gap:10px;display:flex}.swatch-line{flex-shrink:0;width:18px;height:0;margin-top:10px}.q-dot{background:var(--purple);width:20px;height:20px;color:var(--inverse);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}.voice{width:100%}.voice .play{background:var(--text);color:var(--inverse);width:42px;height:42px}.wave-wrap{flex:1;align-items:center;min-width:0;height:36px;display:flex;position:relative}.wave-wrap .wave{width:100%}.seek{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.speed{background:var(--chip);border-radius:15px;min-width:40px;height:30px;font-size:12.5px;font-weight:600}.invite-code{background:var(--field);border-radius:20px;flex-direction:column;align-items:center;gap:2px;padding:12px;display:flex}.invite-code b{letter-spacing:.1em;font-size:30px;font-weight:600}.invite-code .link-text{overflow-wrap:anywhere;text-align:center;font-size:13px}.tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.tile{text-align:left}.tile-value{letter-spacing:-.02em;font-size:32px;font-weight:500;line-height:1.25}.split{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start;gap:12px;display:grid}@media (max-width:1000px){.split{grid-template-columns:minmax(0,1fr)}}@media (max-width:640px){.tiles{grid-template-columns:minmax(0,1fr);gap:8px}.tile{grid-template-columns:1fr auto;grid-template-areas:"label value""sub value";align-items:center;column-gap:12px;padding:12px 16px;display:grid}.tile>:first-child{grid-area:label}.tile>:nth-child(2){grid-area:value;font-size:26px}.tile>:nth-child(3){grid-area:sub;font-size:12.5px!important}.title-xl{font-size:29px}.student-row .side-info,.student-row .pill-text{display:none}.small-tiles{grid-template-columns:minmax(0,1fr)!important}.facts{grid-template-columns:minmax(100px,42%) 1fr;font-size:14px}}.hbar-label{flex-shrink:0;width:130px}@media (max-width:420px){.hbar-label{width:96px;font-size:13px}}.banner{border-color:var(--text)}.greet .title-xl{margin-top:4px}.occasion{border-color:color-mix(in srgb, var(--amber) 45%, var(--line))}.hadith{margin:0}.hadith blockquote{margin:0;font-size:16px;line-height:1.55}.hadith figcaption{margin-top:8px;font-size:13px}.continue{border-radius:var(--r-md);background:var(--text);color:var(--inverse);align-items:center;gap:14px;width:100%;padding:18px 20px;display:flex}.continue .muted{color:inherit;opacity:.7}.continue .go{background:var(--inverse);width:48px;height:48px;color:var(--text);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.stats .card{padding:12px 14px}.stat{letter-spacing:-.02em;margin-top:4px;font-size:24px;font-weight:500}.stat small{color:var(--muted);font-size:13px;font-weight:400}.live-card{border-color:var(--blue)}.soon{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-fill)}.nudge{border-style:dashed}.choice{background:var(--card);border:1px solid var(--line);text-align:left;width:100%;transition:transform .15s var(--ease);border-radius:26px;align-items:center;gap:14px;padding:18px;display:flex}.choice:active{transform:scale(.985)}.choice b{font-size:18px;font-weight:500;display:block}.choice .grow>span{color:var(--muted);margin-top:2px;font-size:14px;line-height:1.4;display:block}.choice-icon{background:var(--text);width:52px;height:52px;color:var(--inverse);border-radius:18px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.learner .avatar{width:44px;height:44px}.reader-chips{z-index:35;left:50%;bottom:calc(92px + var(--safe-bottom));gap:8px;max-width:calc(100vw - 24px);display:flex;position:fixed;transform:translate(-50%)}.reader-chips .chip-btn{white-space:nowrap;min-height:40px}.tool-panel{z-index:41;left:max(12px, var(--safe-left));right:max(12px, var(--safe-right));bottom:calc(92px + var(--safe-bottom));max-width:600px;animation:rise .2s var(--ease);border-radius:26px;flex-direction:column;gap:8px;margin:0 auto;padding:10px 12px;display:flex;position:fixed}.tool-panel .seg{flex-shrink:0}.tool-panel .seg button{min-height:36px;font-size:13.5px}.lesson-tools{max-width:600px}.lesson-tools button[aria-pressed=true]{background:var(--text);color:var(--inverse)}.live-capsule .btn.sm{min-height:36px;padding:0 12px}.chat-page{max-width:780px;height:100dvh;padding:calc(10px + var(--safe-top)) max(12px, var(--safe-right)) calc(92px + var(--safe-bottom)) max(12px, var(--safe-left));flex-direction:column;margin:0 auto;display:flex}.chat-page.embedded{width:100%;max-width:none;height:100%;margin:0;padding:0}.chat-head{border-radius:26px;align-items:center;gap:10px;min-width:0;margin-bottom:6px;padding:8px 10px;display:flex}.chat-head .grow>div{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chat-head .btn.sm{min-height:36px}.thread{flex-direction:column;flex:1;height:100%;min-height:0;display:flex}.thread-list{overscroll-behavior:contain;flex-direction:column;flex:1;gap:6px;min-height:0;padding:8px 2px 12px;display:flex;overflow-y:auto}.day-sep{justify-content:center;margin:10px 0 4px;display:flex}.day-sep span{color:var(--muted);background:var(--chip);border-radius:999px;padding:3px 10px;font-size:12px}.bubble-row{flex-direction:column;align-items:flex-start;display:flex}.bubble-row.me{align-items:flex-end}.msg{background:var(--chip);cursor:pointer;border-radius:20px;flex-direction:column;gap:6px;max-width:min(82%,500px);padding:9px 13px 6px;display:flex}.them .msg{border-bottom-left-radius:6px}.me .msg{background:var(--text);color:var(--inverse);border-bottom-right-radius:6px}.me .msg .muted,.me .msg .msg-meta{color:inherit;opacity:.72}.me .msg .voice .play{background:var(--inverse);color:var(--text)}.me .msg .wave i{opacity:.35;background:currentColor}.me .msg .wave i.on{opacity:1}.msg.voice{min-width:230px}.msg.reminder{background:var(--amber-fill);color:var(--text);border:1px solid color-mix(in srgb, var(--amber) 40%, transparent)}.msg.reminder .muted,.msg.reminder .msg-meta{color:var(--muted);opacity:1}.msg-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15.5px;line-height:1.4}.msg-meta{color:var(--muted);align-self:flex-end;font-size:11.5px}.msg-actions{gap:2px;margin-top:2px;display:flex}.ref-card{width:100%;min-width:180px;color:inherit;background:#80808029;border-radius:14px;flex-direction:column;gap:2px;padding:6px 10px 8px;display:flex}.ref-card .ar{text-align:right;font-size:26px;line-height:1.75}.ref-card .muted{text-align:left;font-size:12px}.req-card{border:1px solid var(--line);background:var(--card);border-radius:22px;flex-direction:column;gap:8px;width:min(94%,480px);padding:12px 14px;display:flex}.req-words{text-align:right;font-size:24px;line-height:1.75}.msg.typing{cursor:default;flex-direction:row;gap:4px;padding:12px 14px}.msg.typing i{background:var(--muted);border-radius:50%;width:7px;height:7px;animation:1.2s infinite dot}.msg.typing i:nth-child(2){animation-delay:.15s}.msg.typing i:nth-child(3){animation-delay:.3s}@keyframes dot{30%{opacity:1;transform:translateY(-4px)}0%,60%,to{opacity:.45;transform:none}}.chat-empty{flex-direction:column;align-items:center;gap:10px;max-width:420px;margin:8vh auto 0;line-height:1.5;display:flex}.composer{border-top:1px solid var(--line);flex-direction:column;gap:8px;padding:8px 0 2px;display:flex}.quick{scrollbar-width:none;gap:6px;display:flex;overflow-x:auto}.quick::-webkit-scrollbar{display:none}.quick .chip-btn{white-space:nowrap;flex-shrink:0;min-height:34px;font-size:13.5px}.attach{background:var(--chip);border-radius:16px;align-items:center;gap:10px;padding:6px 10px;display:flex}.attach .ar{font-size:22px;line-height:1.6}.compose-row{align-items:flex-end;gap:8px;display:flex}.compose-row textarea.input{resize:none;border-radius:23px;height:46px;min-height:46px;padding:11px 16px;line-height:1.4}.compose-row .icon-btn{width:46px;height:46px}.compose-row .send{background:var(--text);color:var(--inverse)}.compose-row .send:disabled{background:var(--chip);color:var(--muted);opacity:1}.sheet-chat{flex-direction:column;height:min(68dvh,640px);display:flex}@media (min-width:1000px){.sheet.side .sheet-chat{height:calc(100dvh - 110px)}}.profile-chat{height:min(70dvh,700px)}.page-pad.teacher.full{padding-bottom:calc(96px + var(--safe-bottom))}.messages-layout{height:calc(100dvh - 40px - var(--safe-top) - var(--safe-bottom));grid-template-columns:330px minmax(0,1fr);gap:18px;display:grid}.messages-side{min-width:0;min-height:0;overflow-y:auto}.messages-main{flex-direction:column;min-width:0;min-height:0;display:flex}.thread,.composer,.thread-list,.chat-page{min-width:0}.conv-list{flex-direction:column;gap:2px;display:flex}.conv{text-align:left;border-radius:18px;align-items:center;gap:12px;width:100%;padding:10px;display:flex}.conv.on{background:var(--chip)}.narrow-only{display:none}@media (min-width:900px){.page-pad.teacher.full{padding-top:max(20px, var(--safe-top));max-width:none;padding-bottom:20px}}@media (max-width:899px){.messages-layout{grid-template-columns:minmax(0,1fr);height:auto}.messages-layout.in-thread{height:calc(100dvh - 130px - var(--safe-top) - var(--safe-bottom))}.hide-narrow{display:none}.narrow-only{display:inline-flex}.messages-side{overflow:visible}}
