:root{--green-950:#06281a;--green-900:#0b3d28;--green-800:#0b5d3b;--green-700:#147a4c;--green-600:#1c9a5e;--green-100:#e8f6ee;--gold-500:#c9a227;--gold-400:#e0c15a;--gold-200:#f3e6b8;--cream:#f7f1e4;--cream-2:#efe4cc;--ink:#1a241c;--muted:#5d6b62;--card:#fff;--danger:#b42318;--shadow:0 10px 28px #0b3d281f;--radius:18px;--header:56px;--tab:68px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100dvh}html{font-size:16px}body{background:var(--cream);color:var(--ink);-webkit-tap-highlight-color:transparent;touch-action:manipulation;font-family:Cairo,sans-serif;line-height:1.6}button,a{cursor:pointer;font-family:inherit}button{color:inherit;background:0 0;border:none}img{max-width:100%;display:block}.app-shell{background:var(--cream);max-width:480px;min-height:100dvh;margin:0 auto;position:relative;box-shadow:0 0 0 1px #0b3d280f}.topbar{z-index:40;height:calc(var(--header) + var(--safe-top));padding-top:var(--safe-top);background:linear-gradient(180deg, var(--green-800), var(--green-900));color:#fff;align-items:center;gap:8px;padding-inline:12px;display:flex;position:sticky;top:0}.topbar h1{text-align:center;flex:1;font-size:1.05rem;font-weight:700}.icon-btn{color:#fff;border-radius:12px;place-items:center;min-width:44px;min-height:44px;transition:background .16s,transform .16s;display:grid}.icon-btn:active{background:#ffffff1f;transform:scale(.96)}.page{padding:16px 16px calc(var(--tab) + var(--safe-bottom) + 20px)}.page.no-tab{padding-bottom:calc(var(--safe-bottom) + 24px)}.hero{background:linear-gradient(160deg, var(--green-800) 0%, var(--green-950) 100%);color:#fff;box-shadow:var(--shadow);border-radius:22px;padding:20px 18px 18px;position:relative;overflow:hidden}.hero:after{content:"";border:18px solid #e0c15a2e;border-radius:50%;width:180px;height:180px;position:absolute;inset:auto -40px -50px auto}.hero-kicker{color:var(--gold-400);letter-spacing:.4px;font-size:.8rem;font-weight:700}.hero h2{margin:4px 0 2px;font-size:1.35rem}.hero .meta{opacity:.9;font-size:.88rem}.next-prayer{background:#ffffff1a;border:1px solid #e0c15a47;border-radius:16px;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;padding:12px 14px;display:flex}.next-prayer strong{color:var(--gold-200);font-size:1.2rem;display:block}.prayer-row{grid-template-columns:repeat(5,1fr);gap:8px;margin-top:16px;display:grid}.prayer-chip{background:var(--card);text-align:center;box-shadow:var(--shadow);border-radius:14px;min-height:72px;padding:10px 4px}.prayer-chip.active{background:var(--green-800);color:#fff}.prayer-chip .name{color:var(--muted);font-size:.78rem}.prayer-chip.active .name{color:var(--gold-200)}.prayer-chip .time{margin-top:4px;font-size:.86rem;font-weight:800}.section-title{justify-content:space-between;align-items:center;margin:22px 4px 12px;font-weight:800;display:flex}.grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.tile{background:var(--card);min-height:96px;color:var(--ink);box-shadow:var(--shadow);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:12px 8px 10px;text-decoration:none;transition:transform .16s,background .16s;display:flex}.tile:active{transform:scale(.97)}.tile .glyph{background:var(--green-100);width:42px;height:42px;color:var(--green-800);border-radius:12px;place-items:center;display:grid}.tile span{text-align:center;font-size:.82rem;font-weight:700}.tabbar{width:min(480px,100%);height:calc(var(--tab) + var(--safe-bottom));padding-bottom:var(--safe-bottom);z-index:50;background:#fff;border-top:1px solid #eadfca;grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.tab{color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:48px;font-size:.72rem;font-weight:700;text-decoration:none;display:flex}.tab.active{color:var(--green-800)}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px}.list{flex-direction:column;gap:10px;display:flex}.list-item{background:var(--card);color:inherit;box-shadow:var(--shadow);border-radius:16px;align-items:center;gap:12px;min-height:64px;padding:12px 14px;text-decoration:none;display:flex}.list-item:active{transform:scale(.99)}.badge{background:var(--green-800);width:40px;height:40px;color:var(--gold-200);border-radius:12px;flex-shrink:0;place-items:center;font-weight:800;display:grid}.list-item .grow{flex:1;min-width:0}.list-item h3{font-size:.98rem}.list-item p,.muted{color:var(--muted);font-size:.82rem}.search{background:#fff;border:1px solid #e2d6bb;border-radius:14px;outline:none;width:100%;margin-bottom:12px;padding:12px 14px;font-size:1rem}.search:focus{border-color:var(--green-700);box-shadow:0 0 0 3px #147a4c26}.ayah{box-shadow:var(--shadow);background:#fff;border-radius:16px;margin-bottom:10px;padding:16px}.ayah-ar{text-align:right;font-family:Amiri,serif;font-size:1.45rem;line-height:2.1}.ayah-meta{color:var(--muted);justify-content:space-between;margin-top:10px;font-size:.8rem;display:flex}.zikr{box-shadow:var(--shadow);background:#fff;border-radius:18px;padding:16px}.zikr-text{font-family:Amiri,serif;font-size:1.28rem;line-height:2}.counter-btn{background:var(--green-800);color:#fff;border-radius:14px;width:100%;min-height:52px;margin-top:14px;font-size:1rem;font-weight:800}.counter-btn:active{transform:scale(.98)}.progress{background:var(--cream-2);border-radius:99px;height:6px;margin-top:10px;overflow:hidden}.progress>span{background:linear-gradient(90deg, var(--green-700), var(--gold-500));height:100%;display:block}.chips{gap:8px;margin-bottom:8px;padding-bottom:8px;display:flex;overflow-x:auto}.chip{background:#fff;border:1px solid #e2d6bb;border-radius:999px;flex-shrink:0;min-height:40px;padding:0 14px;font-size:.85rem;font-weight:700}.chip.active{background:var(--green-800);color:#fff;border-color:var(--green-800)}.tasbih-wrap{place-items:center;padding:24px 8px;display:grid}.tasbih-circle{border:10px solid var(--gold-400);background:radial-gradient(circle at 35% 30%, var(--green-700), var(--green-950));color:#fff;border-radius:50%;place-items:center;width:min(260px,72vw);height:min(260px,72vw);font-size:3.4rem;font-weight:800;display:grid;box-shadow:0 16px 40px #0b3d2847}.tasbih-actions{grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:18px;display:grid}.ghost{background:#fff;border:1px solid #e2d6bb;border-radius:14px;min-height:48px;font-weight:800}.ghost:disabled{opacity:.4;cursor:not-allowed}select.search{appearance:none}.qibla-disc{background:conic-gradient(from 0deg, #0b5d3b 0 2deg, transparent 2deg 88deg, #c9a227 88deg 92deg, transparent 92deg 178deg, #0b5d3b 178deg 182deg, transparent 182deg 268deg, #c9a227 268deg 272deg, transparent 272deg 360deg), radial-gradient(circle, #fff 58%, #efe4cc 59% 70%, #147a4c 71%);width:min(280px,78vw);height:min(280px,78vw);box-shadow:var(--shadow);border-radius:50%;margin:20px auto;position:relative}.needle{transform-origin:bottom;background:linear-gradient(#b42318,#7a120c);border-radius:8px;width:8px;height:38%;margin-left:-4px;position:absolute;top:12%;left:50%}.center-dot{background:var(--gold-500);border-radius:50%;width:16px;height:16px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.name-card{background:linear-gradient(160deg, var(--green-800), var(--green-950));color:#fff;text-align:center;box-shadow:var(--shadow);border-radius:20px;padding:22px 16px}.name-ar{color:var(--gold-200);font-family:Amiri,serif;font-size:2.2rem}.settings-row{border-bottom:1px solid #eadfca;justify-content:space-between;align-items:center;padding:12px 0;display:flex}.switch{background:#cfc3a6;border-radius:99px;width:48px;height:28px;position:relative}.switch.on{background:var(--green-700)}.switch:after{content:"";background:#fff;border-radius:50%;width:22px;height:22px;position:absolute;top:3px;right:3px}.switch.on:after{left:3px;right:auto}.empty{text-align:center;color:var(--muted);padding:32px 12px}html[data-theme=dark]{--cream:#0d1a14;--cream-2:#163024;--ink:#f3eee2;--muted:#b7c4bc;--card:#14261d;--shadow:0 10px 28px #00000047}html[data-theme=dark] body,html[data-theme=dark] .app-shell{background:var(--cream);color:var(--ink)}html[data-theme=dark] .search,html[data-theme=dark] .ghost,html[data-theme=dark] .chip,html[data-theme=dark] .tabbar,html[data-theme=dark] .list-item,html[data-theme=dark] .card,html[data-theme=dark] .ayah,html[data-theme=dark] .zikr,html[data-theme=dark] .prayer-chip,html[data-theme=dark] .tile{background:var(--card);color:var(--ink);border-color:#234536}html[data-theme=dark] .tabbar{border-top-color:#234536}html[data-font=sm] .ayah-ar,html[data-font=sm] .zikr-text{font-size:1.15rem}html[data-font=lg] .ayah-ar,html[data-font=lg] .zikr-text{font-size:1.7rem}.quick-row{grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;display:grid}.quick-btn{color:#fff;background:#ffffff1f;border-radius:14px;place-items:center;min-height:48px;font-weight:800;text-decoration:none;display:grid}.mini-bar{left:50%;bottom:calc(var(--tab) + var(--safe-bottom) + 8px);background:var(--green-900);color:#fff;z-index:60;width:min(448px,100% - 32px);box-shadow:var(--shadow);border-radius:16px;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;display:flex;position:fixed;transform:translate(-50%)}.toast{left:50%;bottom:calc(var(--tab) + var(--safe-bottom) + 16px);background:var(--green-900);color:#fff;z-index:70;border-radius:12px;padding:10px 16px;position:fixed;transform:translate(-50%)}.cal-grid{text-align:center;grid-template-columns:repeat(7,1fr);gap:4px;display:grid}.cal-head{color:var(--muted);font-size:.72rem;font-weight:700}.cal-day{background:var(--cream);border-radius:10px;place-items:center;min-height:40px;font-size:.85rem;display:grid;position:relative}.cal-day.event{background:var(--green-100);color:var(--green-900)}.cal-day.today{outline:2px solid var(--gold-500);background:var(--green-900);color:#fff}.cal-day .dot{background:var(--gold-500);border-radius:50%;width:5px;height:5px;position:absolute;bottom:5px}.week-table{border-collapse:collapse;width:100%;font-size:.8rem}.week-table th,.week-table td{text-align:center;border-bottom:1px solid var(--cream-2);padding:8px 4px}.audio-bar{gap:8px;margin:8px 0 14px;display:flex}.fav{color:var(--gold-500);font-weight:800}@media (width>=768px){.app-shell{min-height:100dvh}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}