:root{--teal:#0f8b7d;--teal-d:#0b6b61;--teal-l:#d9f4ef;--ink:#123b3a;--muted:#5f7a78;--gold:#f5a623;--orange:#f39c12;--cream:#fffcf6;--line:#e9e2d2;--pink:#fde3e6;--yellow:#fff2c7;--blue:#dcecff;--green:#dcf7e6;--purple:#ece3ff;--danger:#b3261e;--r:18px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:Lora,Georgia,serif;color:var(--ink);background:var(--cream);line-height:1.45}h1,h2,h3{margin:0 0 .25rem;line-height:1.15}h1{font-size:clamp(1.4rem,3.2vw,2.3rem)}h2{font-size:1.15rem}button,input,select{font:inherit;color:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}:focus-visible{outline:3px solid var(--teal);outline-offset:2px}.muted{color:var(--muted)}small{font-size:.78rem;color:var(--muted)}.block{display:block}.grow{flex:1}.hl{background:var(--yellow);padding:0 .3em;border-radius:6px}.teal-t{color:var(--teal)}.orange-t{color:var(--orange)}.ok-msg{color:var(--teal-d);font-weight:700}.error{color:var(--danger);font-weight:600;margin:.4rem 0}.row{display:flex;align-items:center;gap:.5rem}.wrap{flex-wrap:wrap}.row-between{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}.ar{font-family:Amiri,serif;direction:rtl}.ar.inline{display:inline;font-size:1.2em}.ar.teal{color:var(--teal)}.big-ar{font-size:1.8rem;text-align:center;line-height:1.9}.huge{font-size:clamp(2rem,6vw,3.4rem);color:var(--teal-d);text-align:center;margin:.5rem 0;line-height:1.8}.huge .now{background:#ffe9a6;border-radius:10px;box-shadow:0 0 0 4px #ffe9a6}.translit{color:var(--teal);font-style:italic;text-align:center;margin:.2rem 0}.meaning{text-align:center;margin:.2rem 0}.btn{border:2px solid var(--line);background:#fff;padding:.6rem 1.1rem;border-radius:999px;font-weight:700}.btn:hover{border-color:var(--teal)}.btn.primary{background:var(--teal);color:#fff;border-color:var(--teal)}.btn.orange{background:linear-gradient(#ffb936,#f39c12);color:#3a2500;border-color:#e08e0b}.btn.teal-o{border-color:#a9e0d7;background:var(--teal-l);color:var(--teal-d)}.btn.teal-solid,.chip.teal-solid{background:var(--teal);color:#fff;border-color:var(--teal)}.btn.ghost{background:#e4f8ef;border-color:#bfe9d4;color:var(--teal-d)}.btn.danger{background:#fff;color:var(--danger);border-color:#f0c4c0}.btn.sm{padding:.35rem .8rem;font-size:.85rem}.btn.big{width:100%;padding:.85rem;font-size:1.05rem}.btn:disabled{opacity:.55;cursor:not-allowed}.link{background:none;border:0;text-decoration:underline;color:var(--teal-d);padding:.3rem}.link:disabled{opacity:.5;text-decoration:none}.icon-btn{border:0;background:transparent;font-size:1.25rem;width:40px;height:40px;border-radius:50%}.icon-btn:hover,.icon-btn.on{background:var(--teal-l)}.heart{color:#bbb;background:#fff;border:2px solid #f0d9d9}.heart.on{color:#e0364a;background:var(--pink)}.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 .4rem}.chip{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .7rem;border-radius:999px;font-size:.8rem;font-weight:700;border:1.5px solid transparent;background:#fff}.chip.sm{font-size:.72rem;padding:.15rem .55rem}.chip.tiny{font-size:.62rem;padding:.1rem .45rem}.chip.green{background:var(--green);border-color:#a8e4c0;color:#146c43}.chip.yellow{background:var(--yellow);border-color:#f3dc8a;color:#7a5200}.chip.orange{background:#ffe9c9;border-color:#f6c98a;color:#8a4b00}.chip.blue{background:var(--blue);border-color:#b5d2f5;color:#1d4d8a}.chip.pink{background:var(--pink);border-color:#f5b9c2;color:#a3233a}.chip.teal{background:var(--teal-l);border-color:#a9e0d7;color:var(--teal-d)}.chip.white{background:#fff;border-color:var(--line);color:var(--ink)}.chip.dark{background:#0009;color:#fff}.chip.purple{background:var(--purple)}.chip.ring{box-shadow:0 0 0 3px var(--teal)}.chip.loop{cursor:pointer;background:#fff;border-color:var(--line)}.chip.loop.on{background:var(--orange);color:#fff}.panel{background:#fff;border:1.5px solid var(--line);border-radius:var(--r);padding:1.1rem;box-shadow:0 6px 18px #0f8b7d0d;margin-bottom:1rem}.avatar{display:inline-grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#ffe3a3,#ffb0c0);border:2px solid #fff;box-shadow:0 0 0 2px var(--line);overflow:hidden;flex:none}.avatar img{width:100%;height:100%;object-fit:cover}.bar{display:block;height:10px;border-radius:99px;background:#e9efe9;overflow:hidden;margin:.35rem 0}.bar i{display:block;height:100%;background:linear-gradient(90deg,#f5a623,#2fbf8d);border-radius:99px;transition:width .3s}.tabs{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:thin}.tabs button{white-space:nowrap;border:0;background:transparent;padding:.55rem .9rem;border-radius:999px;font-weight:700;color:var(--muted)}.pill-tabs{background:#f3ead8;padding:.3rem;border-radius:999px}.pill-tabs .on{background:var(--teal);color:#fff}.tabs.underline{border-bottom:1.5px solid var(--line);align-items:center;margin-bottom:1rem}.tabs.underline .on{background:var(--teal-l);color:var(--teal-d);box-shadow:inset 0 0 0 2px #a9e0d7}.tj-guide{margin-left:auto;display:flex;align-items:center;gap:.4rem}.tj-note{background:var(--yellow);padding:.5rem .8rem;border-radius:12px;margin:0 0 1rem}.seg{display:inline-flex;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:2px}.seg button{border:0;background:transparent;padding:.35rem .8rem;border-radius:999px;font-weight:700;font-size:.85rem}.seg .on{background:var(--teal);color:#fff}.login{min-height:100dvh;display:grid;place-content:center;justify-items:center;gap:1rem;padding:1.5rem;background:radial-gradient(circle at 20% 0,#c9f0e8,#fff8e6 60%)}.login-card{width:min(92vw,26rem);background:#fff;border-radius:28px;padding:1.75rem;text-align:center;box-shadow:0 20px 50px #0f8b7d22;border:1.5px solid var(--line)}.login-card form,.login-card>div{text-align:left}.login-card h1,.login-card .muted{text-align:center}.login-logo{font-size:3rem}.login label,.child-form label{display:block;font-weight:700;margin:.7rem 0 .3rem}.login input[type=tel],.child-form input:not([type=range]){width:100%;padding:.8rem 1rem;border:2px solid var(--line);border-radius:14px;background:#fffdf8}.hint{font-size:.8rem;color:var(--muted)}.login-foot{color:var(--muted);font-size:.85rem}.otp{display:flex;gap:.45rem;justify-content:center;margin:1rem 0}.otp input{width:2.7rem;height:3.3rem;text-align:center;font-size:1.5rem;font-weight:700;border:2px solid var(--line);border-radius:12px;background:#fffdf8}.otp input:focus{border-color:var(--teal)}.devbox{background:var(--yellow);border-radius:10px;padding:.4rem .7rem;font-size:.85rem;text-align:center}.avatar-pick{display:flex;flex-wrap:wrap;gap:.4rem}.avatar-pick button{font-size:1.6rem;width:3rem;height:3rem;border-radius:50%;border:2px solid var(--line);background:#fff}.avatar-pick .on{border-color:var(--teal);background:var(--teal-l)}.app{min-height:100dvh;display:flex;flex-direction:column;background:linear-gradient(#fffcf6,#f7fbf8)}.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:.75rem;padding:.6rem 1rem;background:#fffcf6e8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1.5px solid var(--line);flex-wrap:wrap}.brand{display:flex;align-items:center;gap:.5rem}.brand b{display:block;font-size:1.25rem;color:var(--teal-d)}.brand small{font-size:.55rem;letter-spacing:.12em;color:var(--orange)}.logo{font-size:1.6rem}.nav{display:flex;gap:.3rem;background:#f3ead8;padding:.3rem;border-radius:999px;margin:0 auto}.nav a{display:flex;align-items:center;gap:.35rem;padding:.5rem .95rem;border-radius:999px;font-weight:700;font-size:.9rem}.nav a i{font-style:normal}.nav .on{background:var(--teal);color:#fff}.stats{display:flex;gap:.4rem}.pill{padding:.35rem .8rem;border-radius:999px;font-weight:700;font-size:.85rem;border:1.5px solid}.pill.fire{background:#ffe9d2;border-color:#f7c99c;color:#a24a00}.pill.gold{background:var(--yellow);border-color:#f3dc8a;color:#7a5200}.me{display:flex;align-items:center;gap:.5rem;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:.2rem .8rem .2rem .25rem;text-align:left}.me b{display:block;font-size:.85rem}.me small{font-size:.65rem}.parent{border:1.5px solid var(--line);background:#efefef;border-radius:999px;padding:.5rem .9rem;font-weight:700}.locale-picker{display:flex;align-items:center;gap:.35rem;font-size:.75rem;font-weight:700;color:var(--muted)}.locale-picker select{border:1.5px solid var(--line);border-radius:8px;background:#fff;padding:.4rem .5rem;font:inherit;color:var(--ink)}.story-status{max-width:42rem;margin:3rem auto;text-align:center;padding:2rem}.page{flex:1;width:100%;max-width:1400px;margin:0 auto;padding:1rem}.foot{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap;padding:.8rem 1rem;border-top:1.5px solid var(--line);background:#fff;font-size:.8rem;font-weight:700}.toggles button{background:none;border:0;padding:.2rem .5rem;color:var(--muted)}.toggles .on{color:var(--teal-d)}.toast{position:fixed;left:50%;bottom:5.5rem;transform:translate(-50%);background:#123b3a;color:#fff;padding:.7rem 1.2rem;border-radius:999px;z-index:60;box-shadow:0 8px 24px #0004;max-width:90vw;text-align:center}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0b2a2a88;display:grid;place-items:center;z-index:50;padding:1rem}.modal{background:#fff;border-radius:24px;padding:1.3rem;width:min(94vw,30rem);max-height:90dvh;overflow:auto}.modal header{display:flex;justify-content:space-between;align-items:center}.kid-list{list-style:none;padding:0;margin:0 0 .75rem}.kid-list button{width:100%;display:flex;align-items:center;gap:.6rem;padding:.5rem;border:1.5px solid var(--line);border-radius:14px;background:#fff;margin-bottom:.4rem;text-align:left}.kid-list .on{border-color:var(--teal);background:var(--teal-l)}.kid-list span:last-child{margin-left:auto;font-size:.8rem}.topline{display:flex;justify-content:space-between;gap:.75rem;align-items:center;flex-wrap:wrap;margin-bottom:1rem}.bubble{background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:.45rem 1rem;font-size:.85rem}.hero{display:flex;justify-content:space-between;gap:1.2rem;align-items:center;flex-wrap:wrap;padding:1.6rem;border-radius:26px;background:linear-gradient(120deg,#d7f5f0,#fdf6dc);border:1.5px solid #cfeee6;margin-bottom:1rem}.hero>div:first-child{flex:1 1 320px}.goal{background:#ffffffb0;border-radius:14px;padding:.6rem .9rem;font-size:.8rem;font-weight:700;display:grid;grid-template-columns:1fr auto;gap:.2rem}.goal .bar{grid-column:1/-1}.box{background:#fff;border-radius:20px;padding:.9rem;box-shadow:0 10px 24px #f5a62333;min-width:220px}.box-top{display:flex;gap:.6rem;align-items:center;margin-bottom:.6rem}.box small{display:block}.gift{font-size:2rem;background:var(--yellow);border-radius:14px;padding:.2rem .5rem}.box .btn{width:100%}.grid-2{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:1rem;align-items:start}.trail{position:relative;height:600px;margin-top:.5rem;border-radius:20px;background:linear-gradient(#eefaf8,#f9fdfb)}.trail-line{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.trail-line path{fill:none;stroke:#a9e6da;stroke-width:5;stroke-linecap:round}.node{position:absolute;display:flex;align-items:center;gap:.6rem;background:none;border:0;padding:0;text-align:left;max-width:min(370px,70%)}.node-card{display:grid;gap:.16rem;min-width:190px;background:#fff;border-radius:12px;padding:.55rem .8rem;box-shadow:0 8px 20px #0f8b7d22;font-size:.8rem}.node-card small{color:var(--teal);font-weight:700;font-size:.62rem}.node-card em{color:var(--teal);font-style:normal;font-weight:700}.node-xp{color:var(--ink);font-size:.72rem}.node-remaining{color:#a45b00!important}.orb{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#ffe9a6;font-size:1.6rem;box-shadow:0 0 0 6px #ffe9a655;flex:none}.node.n2 .orb{background:#2fbf8d;box-shadow:0 0 0 6px #2fbf8d44;width:70px;height:70px}.node.n3 .orb{background:#7cc4f5;box-shadow:0 0 0 6px #7cc4f544}.orb.done{outline:3px solid var(--teal)}.node.locked{opacity:.65;filter:grayscale(.6)}.node.next .node-card{box-shadow:0 0 0 2px var(--teal),0 8px 20px #0f8b7d33}.tag{position:absolute;left:0;bottom:-14px;background:#ffe9a6;font-size:.65rem;font-weight:700;padding:.1rem .5rem;border-radius:99px}.n1{left:3%;top:2%}.n2{left:26%;top:21%;flex-direction:row-reverse}.n3{left:3%;top:40%}.n4{left:3%;top:59%}.n5{right:3%;top:78%}.node:hover .node-card{transform:translateY(-2px)}.side{display:block}.quest-row{display:grid;grid-template-columns:auto 1fr auto;gap:.6rem;align-items:center;padding:.6rem;border-radius:14px;background:#fff7ea;margin-top:.5rem}.quest-row.done{background:#e8f9ef}.quest-row small{display:block}.q-ic{font-size:1.5rem}.leader-list{list-style:none;display:grid;gap:.45rem;margin:.75rem 0 0;padding:0;max-height:330px;overflow:auto}.leader-optin{display:flex;align-items:flex-start;gap:.55rem;margin:.65rem 0;padding:.6rem;border:1px solid var(--line);border-radius:9px;background:#f8fbf9;cursor:pointer}.leader-optin input{margin:.2rem 0 0;accent-color:var(--teal);flex:none}.leader-optin span{display:grid;gap:.15rem;min-width:0}.leader-optin b{font-size:.78rem}.leader-optin small{font-size:.68rem;line-height:1.4;color:var(--muted)}.leader-row{display:grid;grid-template-columns:28px 38px minmax(0,1fr) auto;align-items:center;gap:.55rem;padding:.55rem;border:1px solid var(--line);border-radius:10px;background:#fff}.leader-row.current{border-color:var(--teal);background:#f0faf6}.leader-rank{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#f0f3ef;font-size:.78rem;font-weight:800}.leader-rank.rank-1{background:#ffe7a3;color:#785400}.leader-rank.rank-2{background:#e6edf2;color:#43535e}.leader-rank.rank-3{background:#f3dbc8;color:#774822}.leader-avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--teal-l);font-size:1.2rem;overflow:hidden}.leader-info{min-width:0}.leader-name{display:flex;align-items:center;gap:.35rem;min-width:0}.leader-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leader-name small{color:var(--teal-d);font-weight:700}.leader-info>small{display:block;font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.leader-progress{height:4px;margin-top:.3rem;background:#e7efeb;border-radius:99px;overflow:hidden}.leader-progress i{display:block;height:100%;background:var(--teal);border-radius:inherit}.leader-xp{text-align:right;font-size:.9rem;color:var(--teal-d);font-variant-numeric:tabular-nums}.leader-xp small{display:block;color:var(--muted);font-size:.62rem;font-weight:600}.badges{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:.6rem 0}.badge{border-radius:12px;padding:.65rem;text-align:center;display:grid;align-content:start;gap:.25rem;font-size:.85rem;min-width:0}.badge span{font-size:1.5rem}.badge b{overflow-wrap:anywhere}.badge small{font-size:.68rem;line-height:1.3;color:var(--muted)}.badge.yellow{background:var(--yellow)}.badge.pink{background:var(--pink)}.badge.blue{background:var(--blue)}.badge.purple{background:var(--purple)}.badge.off{opacity:.55;filter:grayscale(.65)}.badge.earned{box-shadow:inset 0 0 0 2px #36ae76}.badge.earned small{color:var(--teal-d)}.badge-progress{height:4px;margin-top:.1rem;background:#ffffffa6;border-radius:99px;overflow:hidden}.badge-progress i{display:block;height:100%;background:var(--teal);border-radius:inherit;transition:width .2s}.tip{display:flex;gap:.6rem;width:100%;text-align:left;border:0;border-radius:14px;background:linear-gradient(90deg,#d7f5f0,#fdf1cf);padding:.6rem;font-size:.8rem}.tip-av{font-size:1.8rem}.reps{display:flex;gap:.3rem;justify-content:center;margin:.8rem 0;font-size:1.6rem}.reps span{filter:grayscale(1);opacity:.35}.reps .on{filter:none;opacity:1}.studio-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;flex-wrap:wrap;margin-bottom:.8rem}.studio-head>div:first-of-type{flex:1 1 300px}.back{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);background:var(--teal);color:#fff;font-size:1.2rem}.controls{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.s-title small{font-size:1rem;color:var(--muted)}.crumbs{font-size:.75rem;color:var(--muted);margin:0 0 .3rem}.studio{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1rem;align-items:start}.ayah-h{display:flex;align-items:center;gap:.6rem}.num{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--teal-l);color:var(--teal-d);font-weight:700;flex:none}.ayah-box{margin:.8rem 0;padding:1rem;border-radius:20px;background:linear-gradient(#f4fbf9,#fff);border:1.5px dashed #bfe5dd;text-align:center}.verse-details{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:.8rem 0}.verse-insight{min-width:0;padding:.85rem 1rem;border:1px solid var(--line);border-radius:12px;background:#fff}.verse-insight h2{margin:0;font-size:1rem;color:var(--teal-d)}.verse-insight p{margin:.45rem 0 0;line-height:1.65;overflow-wrap:anywhere}.verse-insight small{color:var(--muted);text-align:right}.verse-context{background:#f3faf8}.words{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.7rem;margin-top:.6rem}.word{position:relative;display:grid;gap:.15rem;justify-items:center;padding:.9rem .5rem;border-radius:18px;border:2px solid transparent;text-align:center;transition:transform .15s}.word:hover{transform:translateY(-3px)}.word.green{background:var(--green);border-color:#b6ecc9}.word.blue{background:var(--blue);border-color:#bcd7f6}.word.yellow{background:var(--yellow);border-color:#f5e094}.word.pink{background:var(--pink);border-color:#f7c3cb}.word.seen{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--teal)}.wn{position:absolute;left:8px;top:8px;background:#fff;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:.7rem;font-weight:700}.wsp{position:absolute;right:8px;top:8px;font-size:.8rem}.wd-ar{font-size:2.1rem;line-height:1.6}.word b{color:#9b2c3d}.word i{font-size:.85rem}.hintcard{background:var(--teal-l);border-radius:14px;padding:.8rem 1rem}.player .seek{width:100%;accent-color:var(--teal);margin:.4rem 0}.p-row{display:flex;justify-content:space-between;align-items:center;gap:.5rem;flex-wrap:wrap}.play{width:56px;height:56px;border-radius:50%;border:0;background:var(--teal);color:#fff;font-size:1.4rem;box-shadow:0 6px 14px #0f8b7d55}.nav-ayah{width:100%;display:grid;grid-template-columns:auto 1fr;gap:.6rem;align-items:center;text-align:left;padding:.6rem;border-radius:14px;border:2px solid var(--line);background:#fff;margin-top:.5rem}.nav-ayah small{display:block}.nav-ayah.cur{background:var(--green);border-color:#8fdcae}.ayah-options{display:grid;gap:.4rem;max-height:min(70vh,520px);overflow-y:auto;overscroll-behavior:contain;padding:.1rem .2rem .1rem 0}.nav-ayah{min-height:54px;padding:.4rem .55rem}.nav-preview{display:block;min-width:0;overflow:hidden}.nav-ar,.nav-meaning{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-ar{font-size:1.05rem;line-height:1.35}.nav-meaning{font-size:.76rem;line-height:1.3;color:var(--muted)}.verse-meaning .row-between{align-items:center;gap:.5rem}.verse-meaning .btn{flex:none}.why{background:linear-gradient(#fffbe8,#fff)}.sunnah{background:#fff;border:1.5px solid #f3dc8a;border-radius:12px;padding:.6rem;font-size:.85rem}.quiz .opts{display:grid;gap:.5rem;margin-top:.7rem}.opt.right{background:#c8f5dc;border-color:#2fbf8d}.opt.wrong{background:#fdd;border-color:#e57373}.story{display:grid;grid-template-columns:1.05fr 1fr;gap:1rem}.illus{position:relative;border-radius:22px;overflow:hidden;min-height:340px;background:#06213d;border:4px solid #fff;box-shadow:0 12px 30px #0f4c7544}.illus .scene{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.ambience{position:absolute;left:12px;top:12px;z-index:2}.hot{position:absolute;z-index:2;width:38px;height:38px;border-radius:50%;border:0;background:#ffe27acc;color:#8a5a00;font-size:1.1rem;box-shadow:0 0 0 6px #ffe27a55,0 0 22px #ffe27a;animation:pulse2 2s infinite;transform:translate(-50%,-50%)}@keyframes pulse2{50%{box-shadow:0 0 0 12px #ffe27a22,0 0 30px #ffe27a}}.illus-foot{position:absolute;left:0;right:0;bottom:0;margin:0;padding:.6rem .9rem;background:linear-gradient(transparent,#000a);color:#fff;font-size:.8rem;display:flex;justify-content:space-between;gap:.5rem;align-items:center;z-index:2}.text{margin:0;display:flex;flex-direction:column;gap:.8rem}.place{color:var(--teal);letter-spacing:.06em;font-weight:700}.story-text{margin:0;line-height:1.7;font-weight:700}.w-now{background:#ffe27a;border-radius:8px;padding:0 .12em}.w-allah{background:var(--green);border-radius:8px;padding:0 .2em}.w-key{color:#1d6db5}.dua-box{background:linear-gradient(#e7fbf6,#fff);border:1.5px solid #bfe9df;border-radius:18px;padding:.9rem}.lesson{display:flex;gap:.6rem;background:#fff5db;border:1.5px solid #f3dc8a;border-radius:16px;padding:.8rem}.lesson p{margin:.2rem 0 0;font-weight:700}.story-bar{display:grid;grid-template-columns:auto 1fr;gap:1rem;margin-top:1rem}.voice select{display:block;padding:.4rem;border:1.5px solid var(--line);border-radius:10px;background:#fff;max-width:100%}.reward{background:#fff8e6;border-radius:14px;padding:.5rem .8rem;font-size:.8rem}.story-controls{grid-column:1/-1}.playwrap{display:flex;align-items:center;gap:.7rem;flex:1;max-width:520px;justify-content:center}.tbar{display:flex;align-items:center;gap:.5rem;flex:1}.tbar .bar{flex:1;margin:0}.index{display:grid;gap:.6rem}.index div{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}.index b{width:100%}.story-wrap.glow{filter:sepia(.28) saturate(.95) brightness(.98)}.arena{max-width:920px;margin:0 auto}.arena-heading{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.8rem}.arena-heading h1{margin:.15rem 0}.arena-heading .eyebrow{margin:0;color:var(--teal-d);font-size:.72rem;font-weight:800;text-transform:uppercase}.game-modes{display:flex;gap:.35rem;overflow-x:auto;border-bottom:1.5px solid var(--line);margin-bottom:.9rem}.game-modes button{flex:1;min-width:max-content;border:0;border-bottom:3px solid transparent;background:transparent;padding:.75rem .8rem;color:var(--muted);font:inherit;font-weight:700}.game-modes button.on{border-color:var(--teal);color:var(--teal-d);background:#e8f8f3}.arena-game{min-height:350px}.arena-game h2{font-size:1.15rem;margin:0}.arena-stats{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:flex-end;color:var(--muted);font-size:.82rem}.arena-stats b{color:var(--ink)}.memory{display:grid;margin:0 auto;width:70%;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;margin-top:.8rem}.mcard{aspect-ratio:1;border-radius:12px;border:2px solid var(--line);background:linear-gradient(135deg,#d7f5f0,#fdf6dc);font-size:1.4rem;font-weight:700;display:grid;place-items:center;transition:transform .2s}.mcard.up{background:#fff}.mcard.emoji.up{font-size:2.2rem}.mcard.name.up{font-size:1rem;color:var(--teal-d)}.mcard.ok{background:var(--green);border-color:#8fdcae}.mcard:hover:not(:disabled){transform:translateY(-2px)}.mcard:disabled{cursor:default}.symbol-question{display:flex;align-items:baseline;justify-content:center;gap:.5rem;flex-wrap:wrap;margin:2rem auto 1rem;text-align:center}.symbol-question strong{font-size:1.6rem;color:var(--teal-d)}.symbol-question span{color:var(--muted)}.symbol-options{display:grid;grid-template-columns:repeat(4,minmax(64px,100px));justify-content:center;gap:.8rem}.symbol-option{aspect-ratio:1;border:2px solid var(--line);border-radius:12px;background:#f6fbf8;font-size:2.2rem;transition:transform .15s,border-color .15s}.symbol-option:hover:not(:disabled){transform:translateY(-3px);border-color:var(--teal)}.symbol-option.correct{background:var(--green);border-color:#36ae76}.symbol-option.incorrect{background:#fde9e8;border-color:#e57373}.dua-select{display:grid;gap:.25rem;font-size:.78rem;color:var(--muted)}.dua-select select{max-width:220px;padding:.45rem .6rem;border:1.5px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font:inherit}.dua-meaning{max-width:650px;margin:1rem auto;text-align:center;font-size:1rem;color:var(--muted)}.dua-target{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;min-height:76px;padding:1rem;background:#f1faf5;border:1px dashed #a8dcc3;border-radius:12px;font-size:1.5rem;line-height:1.8}.dua-target span{white-space:nowrap}.dua-target span:not(.placed){color:#97b0a4}.dua-tiles{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin:1rem 0}.dua-tile{padding:.55rem .75rem;border:1.5px solid #9bd2b5;border-radius:8px;background:#fff;font-size:1.25rem;color:var(--ink)}.dua-tile:disabled{opacity:.28}.game-feedback{min-height:1.5em;text-align:center;color:#b85042}.game-complete{display:grid;justify-items:center;text-align:center;padding:2rem 1rem}.game-complete>span{font-size:2.4rem}.game-complete p{color:var(--muted)}@media (max-width:1000px){.grid-2,.studio,.story{grid-template-columns:1fr}.illus{min-height:300px}.hide-md,.nav a span{display:none}.nav a{padding:.5rem .8rem}.nav{margin:0}}@media (max-width:720px){.top{gap:.5rem;padding:.5rem .75rem}.brand{margin-right:auto}.hide-sm{display:none}.stats{order:2}.me{order:3;padding:.2rem}.nav{position:fixed;left:0;right:0;bottom:0;z-index:30;border-radius:0;justify-content:space-around;padding:.35rem .3rem calc(.35rem + env(safe-area-inset-bottom));background:#fff;border-top:1.5px solid var(--line)}.nav a{flex-direction:column;gap:0;font-size:.62rem;padding:.35rem .5rem;border-radius:14px}.nav a span{display:block;max-width:70px;text-align:center;line-height:1.1}.nav a i{font-size:1.3rem}.page{padding:.75rem .75rem 5.5rem}.foot{padding-bottom:5rem;font-size:.7rem}.toast{bottom:6.5rem}.hero{padding:1rem}.box{width:100%}.trail{height:auto;display:flex;flex-direction:column;gap:1.4rem;padding:1rem}.trail-line{display:none}.node{position:static;flex-direction:row!important;max-width:none;width:100%}.node-card{flex:1}.tj-guide{margin-left:0}.verse-details{grid-template-columns:1fr}.words{grid-template-columns:1fr 1fr}.story-bar{grid-template-columns:1fr}.story-controls .btn{flex:1}.playwrap{order:-1;width:100%;max-width:none;flex-basis:100%}.memory{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}.mcard.name.up{font-size:.8rem}.otp input{width:2.4rem;height:3rem}.controls{width:100%}.arena-heading{align-items:flex-start}.arena-heading .btn{flex:none}.game-modes button{padding:.65rem .55rem;font-size:.85rem}.arena-stats{gap:.45rem;font-size:.73rem}.symbol-options{grid-template-columns:repeat(4,minmax(56px,72px));gap:.5rem}.symbol-option{font-size:1.8rem}.dua-select select{max-width:150px}.dua-target{font-size:1.2rem;padding:.75rem .4rem}}@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}