:root{
  --g1:#0f9d6e; --g2:#0b7a58; --g3:#065f46; --gl:#d6f5e9; --gl2:#eafaf3;
  --gold:#f5a524; --gold2:#dd8a0e; --goldl:#fef0d3;
  --pur:#7c5cfc; --pink:#ec4899;
  --ink:#0f1c19; --txt:#1f2d2a; --mut:#6b7c77; --faint:#9fb0ab;
  --card:#ffffff; --line:#eef2f1; --soft:#f6faf9; --bg:#eef3f2;
  --r:20px; --sh:0 10px 30px rgba(6,60,46,.10); --sh2:0 4px 14px rgba(6,60,46,.07);
  --maxw:460px;
}
[data-theme="dark"]{
  --ink:#eaf3f0; --txt:#dce8e4; --mut:#9fb4ae; --faint:#6f817b;
  --card:#16201d; --line:#243430; --soft:#121a18; --bg:#0c1311; --gl:#143a2c; --gl2:#11271f; --goldl:#3a2e12;
  --sh:0 10px 30px rgba(0,0,0,.4); --sh2:0 4px 14px rgba(0,0,0,.3);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Poppins','Segoe UI',system-ui,-apple-system,Roboto,sans-serif;background:var(--bg);color:var(--txt);line-height:1.5;-webkit-font-smoothing:antialiased}
button{font-family:inherit;cursor:pointer}
input{font-family:inherit}
a{color:inherit;text-decoration:none}
.svg{width:1.05em;height:1.05em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:-.16em;flex:0 0 auto}

/* App shell: phone column centered on desktop, full screen on mobile */
#root{min-height:100%}
.app{max-width:var(--maxw);margin:0 auto;min-height:100vh;min-height:100dvh;background:var(--soft);position:relative;display:flex;flex-direction:column;box-shadow:0 0 40px rgba(6,60,46,.08);overflow:hidden}
.scr{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:78px}
.scr::-webkit-scrollbar{width:0}
.pad{padding:16px 15px 24px}
.safe-top{padding-top:max(16px,env(safe-area-inset-top))}

/* Hero */
.hero{background:linear-gradient(150deg,#12b07b 0%,var(--g2) 55%,var(--g3) 100%);color:#fff;padding:calc(16px + env(safe-area-inset-top)) 16px 20px;border-radius:0 0 26px 26px;position:relative;overflow:hidden}
.hero:before{content:'';position:absolute;width:180px;height:180px;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%);top:-60px;right:-40px}
.hero .top{display:flex;align-items:center;gap:11px;position:relative}
.av{width:42px;height:42px;border-radius:13px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 auto}
.av img{width:100%;height:100%;object-fit:cover}
.hero .nm{flex:1;min-width:0}
.hero .nm b{font-size:14.5px;display:block;font-weight:700}
.hero .nm span{font-size:10.5px;opacity:.9}
.lvl{display:flex;align-items:center;gap:4px;background:var(--gold);color:#3a2400;padding:5px 10px;border-radius:20px;font-size:11px;font-weight:800;box-shadow:0 4px 10px rgba(245,165,36,.4)}
.hijri{font-size:11px;opacity:.92;margin-top:13px;display:flex;align-items:center;gap:6px}
.prayer{display:flex;gap:6px;margin-top:11px}
.prayer div{flex:1;text-align:center;background:rgba(255,255,255,.14);border-radius:13px;padding:8px 2px}
.prayer div.now{background:#fff;color:var(--g2)}
.prayer div span{font-size:8.5px;display:block;opacity:.85;text-transform:uppercase;letter-spacing:.3px}
.prayer div b{font-size:13px}
.xpwrap{margin-top:14px}
.xpwrap .l{display:flex;justify-content:space-between;font-size:10px;margin-bottom:5px;opacity:.95;align-items:center}
.xpwrap .l span{display:flex;align-items:center;gap:4px}
.bar{height:8px;background:rgba(255,255,255,.25);border-radius:10px;overflow:hidden}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),#ffd277);border-radius:10px;transition:width .5s}

.card{background:var(--card);border-radius:var(--r);padding:15px;box-shadow:var(--sh2);margin-top:13px}
.card h4{font-size:13px;font-weight:700;display:flex;align-items:center;gap:7px;margin-bottom:11px}
.see{margin-left:auto;font-size:10.5px;color:var(--g1);font-weight:600}
.mut{color:var(--mut)} .ctr{text-align:center}
.lab{font-size:10.5px;color:var(--mut);margin:11px 0 5px;font-weight:600}
.inp{width:100%;border:1.5px solid var(--line);border-radius:13px;padding:12px 13px;font-size:13px;background:var(--card);color:var(--txt)}
.inp::placeholder{color:var(--faint)}
.field{position:relative}
.field .fic{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--faint);width:16px;height:16px}
.r2{display:flex;gap:10px}.r2>*{flex:1}
.btn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;border:none;border-radius:14px;padding:13px;font-size:13.5px;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--g1),var(--g2));margin-top:15px;box-shadow:0 8px 18px rgba(11,122,88,.28)}
.btn:active{transform:translateY(1px)}
.btn.gold{background:linear-gradient(135deg,var(--gold),var(--gold2));box-shadow:0 8px 18px rgba(245,165,36,.32)}
.btn.gh{background:var(--card);color:var(--g2);border:1.5px solid var(--gl);box-shadow:none}
.btn.gr{background:var(--soft);color:var(--txt);border:1.5px solid var(--line);box-shadow:none}
.btn:disabled{opacity:.5}

.streak{display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,#fff7ea,var(--card));border:1px solid var(--goldl);border-radius:16px;padding:12px 14px;margin-top:13px}
.streak .fire{font-size:24px;color:var(--gold2);display:flex}
.streak .t{flex:1}
.streak .t b{font-size:18px;display:block}
.streak .t span{font-size:10.5px;color:var(--mut)}
.streak .days{display:flex;gap:4px}
.streak .days i{width:8px;height:8px;border-radius:50%;background:var(--goldl)}
.streak .days i.on{background:var(--gold)}
.msn{display:flex;align-items:center;gap:9px;font-size:11.5px;padding:9px 0;border-bottom:1px solid var(--line);width:100%;background:none;border-left:0;border-right:0;border-top:0;text-align:left;color:var(--txt)}
.msn:last-child{border-bottom:none}
.msn .svg{width:17px;height:17px;color:var(--g1)}
.msn b{margin-left:auto;font-size:10px;color:var(--g2);font-weight:800}
.msn.done{color:var(--faint);text-decoration:line-through}
.week{display:flex;align-items:flex-end;gap:7px;height:70px;margin-top:4px}
.week .c{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;justify-content:flex-end;height:100%}
.week .c i{width:100%;background:var(--gl);border-radius:6px;min-height:4px}
.week .c.on i{background:linear-gradient(180deg,var(--g1),var(--g2))}
.week .c small{font-size:9px;color:var(--faint)}
.week .c em{font-size:9px;font-style:normal;color:var(--g2);font-weight:700}
.s3{display:flex;gap:10px;margin-top:13px}
.s{flex:1;background:var(--card);border-radius:16px;padding:13px 6px;text-align:center;box-shadow:var(--sh2)}
.s .ic{font-size:18px;color:var(--g1);display:flex;justify-content:center}
.s b{display:block;font-size:21px;color:var(--g1);margin-top:5px;font-weight:800}
.s span{font-size:9.5px;color:var(--mut)}
.s.go .ic,.s.go b{color:var(--gold2)} .s.pu .ic,.s.pu b{color:var(--pur)}
.cats{display:flex;gap:8px;margin-top:5px}
.cat{flex:1;border:1.5px solid var(--line);border-radius:13px;padding:9px 4px;text-align:center;font-size:10.5px;font-weight:700;background:var(--card);color:var(--txt);display:flex;flex-direction:column;align-items:center;gap:3px}
.cat .svg{width:16px;height:16px}
.cat small{display:block;font-weight:400;color:var(--mut);font-size:8.5px}
.cat.sel{border-color:var(--g1);background:var(--gl2);color:var(--g2)}
.cat.gold{border-color:var(--gold);background:var(--goldl);color:var(--gold2)}
.juz{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:6px}
.j{border:1.5px solid var(--line);border-radius:14px;padding:12px 4px;text-align:center;font-size:12.5px;font-weight:700;background:var(--card);color:var(--txt);position:relative}
.j small{display:block;font-weight:500;font-size:9px;color:var(--mut);margin-top:3px}
.j .ring{height:3px;background:var(--line);border-radius:3px;margin-top:6px;overflow:hidden}
.j .ring i{display:block;height:100%;background:var(--g1)}
.j.done{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;border-color:transparent}
.j.done small{color:rgba(255,255,255,.85)} .j.done .ring{background:rgba(255,255,255,.3)} .j.done .ring i{background:#fff}
.j.part{border-color:var(--g1)}
.j .chk{position:absolute;top:5px;right:6px;width:13px;height:13px}
.due{display:flex;align-items:center;gap:11px;padding:13px;border-radius:15px;background:var(--card);box-shadow:var(--sh2);margin-top:10px;border-left:4px solid var(--g1)}
.due.od{border-left-color:var(--gold)}
.due .t{flex:1}
.due .t b{font-size:12.5px;display:block} .due .t span{font-size:10px;color:var(--mut);display:flex;align-items:center;gap:4px}
.due .t span .svg{width:12px;height:12px}
.tg{font-size:9.5px;font-weight:700;padding:6px 12px;border-radius:20px;border:none}
.tg.o{background:var(--goldl);color:var(--gold2)} .tg.g{background:var(--gl);color:var(--g2)}
.ay{background:var(--card);border-radius:16px;padding:15px;margin-top:11px;box-shadow:var(--sh2)}
.ay .h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.ay .n{width:26px;height:26px;border-radius:9px;background:var(--gl);color:var(--g2);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}
.ay .tools{margin-left:auto;display:flex;gap:11px;color:var(--faint)}
.ay .tools .svg{width:15px;height:15px}
.arab{font-size:23px;line-height:2.1;text-align:right;font-family:'Traditional Arabic','Amiri','Noto Naskh Arabic',serif;direction:rtl;color:var(--ink)}
.tr{font-size:11px;color:var(--mut);margin-top:9px;line-height:1.6}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:4px}
.cal .h{font-size:9px;color:var(--faint);text-align:center;font-weight:700}
.cal .d{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:11px;border-radius:9px;position:relative}
.cal .d.on{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;font-weight:700}
.cal .d.has:after{content:'';position:absolute;bottom:3px;width:4px;height:4px;border-radius:50%;background:var(--gold)}
.act{display:flex;align-items:center;gap:10px;background:var(--gl2);border-radius:13px;padding:10px 12px;margin-top:8px}
.act.gold{background:var(--goldl)}
.act .s2{width:22px;height:22px;color:var(--g2);display:flex}
.act.gold .s2{color:var(--gold2)}
.act .t{flex:1}
.act .t b{font-size:11.5px;display:block} .act .t span{font-size:9.5px;color:var(--mut)}
.act .xp{font-size:10px;font-weight:800;color:var(--g2)}
.act.gold .xp{color:var(--gold2)}
.acard{background:linear-gradient(155deg,#13b27c,var(--g3));border-radius:20px;padding:17px;color:#fff;margin-top:11px;position:relative;overflow:hidden;box-shadow:var(--sh)}
.acard:before{content:'';position:absolute;width:160px;height:160px;background:radial-gradient(circle,rgba(255,255,255,.15),transparent 70%);top:-50px;right:-30px}
.acard .hd{display:flex;justify-content:space-between;align-items:center;font-size:9.5px;opacity:.9;position:relative}
.acard .hd img{width:20px;height:20px;border-radius:6px}
.acard h3{font-size:18px;margin:11px 0 13px;position:relative}
.acard .gr{display:flex;gap:10px;position:relative}
.acard .gr div{flex:1;background:rgba(255,255,255,.16);border-radius:14px;padding:11px;text-align:center}
.acard .gr div b{font-size:19px;display:block} .acard .gr div span{font-size:9px;opacity:.85}
.acard .st{display:flex;justify-content:space-around;margin-top:13px;text-align:center;position:relative}
.acard .st div b{font-size:15px;display:block} .acard .st div span{font-size:9px;opacity:.85}
.acard .bdg{background:var(--gold);color:#3a2400;text-align:center;border-radius:12px;padding:9px;font-weight:800;font-size:11.5px;margin-top:12px;position:relative;display:flex;align-items:center;justify-content:center;gap:6px}
.acard .q{font-size:10px;font-style:italic;text-align:center;margin-top:11px;background:rgba(255,255,255,.13);border-radius:11px;padding:10px;opacity:.96;position:relative}
.tgl{display:flex;align-items:center;justify-content:space-between;font-size:11.5px;padding:5px 0}
.tgl span{display:flex;align-items:center;gap:6px}
.tgl span .svg{width:15px;height:15px;color:var(--mut)}
.sw{width:38px;height:21px;background:var(--g1);border-radius:20px;position:relative;flex:0 0 auto;border:none}
.sw:after{content:'';position:absolute;width:17px;height:17px;background:#fff;border-radius:50%;top:2px;right:2px;transition:.2s}
.sw.off{background:#cdd8d5} .sw.off:after{right:auto;left:2px}
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:6px}
.bg{text-align:center}
.bg .med{width:54px;height:54px;border-radius:16px;margin:0 auto 6px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--gold),var(--gold2));box-shadow:0 6px 14px rgba(245,165,36,.3);color:#fff}
.bg .med .svg{width:26px;height:26px;stroke-width:1.9}
.bg.lock .med{background:var(--line);box-shadow:none;color:var(--faint)}
.bg b{font-size:10px;display:block}
.bg span{font-size:8.5px;color:var(--mut)}
.h2t{font-size:17px;font-weight:800;display:flex;align-items:center;gap:7px}

/* Bottom nav */
.nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:var(--maxw);height:calc(62px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:color-mix(in srgb,var(--card) 96%,transparent);backdrop-filter:blur(8px);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-around;z-index:30}
.nav a{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:8px;color:var(--faint);font-weight:600}
.nav a .ic{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:11px}
.nav a .ic .svg{width:19px;height:19px}
.nav a.active{color:var(--g2)}
.nav a.active .ic{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;box-shadow:0 6px 14px rgba(11,122,88,.3)}

/* Splash / Login / Onboarding */
.splash{flex:1;background:linear-gradient(160deg,#12b07b,var(--g3));display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;padding:30px}
.splash img{width:104px;height:104px;border-radius:26px;box-shadow:0 20px 40px rgba(0,0,0,.25);margin-bottom:22px}
.splash h2{font-size:24px;font-weight:800}
.splash p{font-size:12px;opacity:.9;margin-top:6px}
.spin{margin-top:26px;width:42px;height:42px;border:4px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:sp 1s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.lg{flex:1;padding:30px 22px;display:flex;flex-direction:column;justify-content:center}
.lg img{width:74px;height:74px;border-radius:20px;margin:0 auto 14px;box-shadow:var(--sh)}
.lg h2{text-align:center;font-size:21px;font-weight:800}
.lg .sub{text-align:center;font-size:11.5px;color:var(--mut);margin-bottom:20px}
.dv{display:flex;align-items:center;gap:9px;color:var(--faint);font-size:10px;margin:15px 0}
.dv:before,.dv:after{content:'';flex:1;height:1px;background:var(--line)}
.lnk{text-align:center;font-size:11.5px;color:var(--g2);margin-top:15px;font-weight:600}
.steps{display:flex;gap:6px;margin-bottom:20px}
.steps i{flex:1;height:5px;border-radius:5px;background:var(--line)}
.steps i.on{background:var(--g1)}
.bigq{font-size:19px;font-weight:800;margin-bottom:6px}
.jp{display:flex;align-items:center;justify-content:center;gap:18px;margin:26px 0}
.jp button{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);color:var(--g2);display:flex;align-items:center;justify-content:center}
.jp b{font-size:50px;color:var(--g1);min-width:66px;text-align:center;font-weight:800}
.toast{position:fixed;left:50%;bottom:84px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 18px;border-radius:30px;font-size:12px;font-weight:600;z-index:50;box-shadow:var(--sh);display:flex;align-items:center;gap:7px;animation:pop .3s}
@keyframes pop{from{opacity:0;transform:translate(-50%,8px)}}
.fab{position:fixed;right:calc(50% - var(--maxw)/2 + 16px);bottom:84px;width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;border:none;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(11,122,88,.4);z-index:25}
.fab .svg{width:24px;height:24px}
@media(max-width:480px){.fab{right:16px}}
.topbar{display:flex;align-items:center;gap:10px;padding:calc(14px + env(safe-area-inset-top)) 15px 14px}
.topbar .svg{width:22px;height:22px}
.modal-bg{position:fixed;inset:0;background:rgba(8,20,17,.5);z-index:60;display:flex;align-items:flex-end;justify-content:center}
.sheet{width:100%;max-width:var(--maxw);background:var(--card);border-radius:24px 24px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));animation:up .3s}
@keyframes up{from{transform:translateY(100%)}}
.sheet h3{font-size:16px;font-weight:800;margin-bottom:4px;display:flex;align-items:center;gap:8px}

/* Countdown waktu sholat */
.countdown{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.18);padding:5px 12px;border-radius:20px;font-size:11px;font-weight:700;font-variant-numeric:tabular-nums}

/* Navigasi halaman mushaf & basmalah */
.pgnav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
.pgnav button{display:flex;align-items:center;gap:5px;border:1.5px solid var(--gl);background:var(--card);color:var(--g2);border-radius:12px;padding:9px 13px;font-size:12px;font-weight:700}
.pgnav button .svg{width:15px;height:15px}
.pgnav button:disabled{opacity:.38;cursor:default}
.pgnav .lbl{font-size:10.5px;color:var(--mut);font-weight:600;text-align:center;line-height:1.4}
.basm{text-align:center;font-family:'Traditional Arabic','Amiri','Noto Naskh Arabic',serif;font-size:25px;color:var(--g2);padding:6px 8px 14px;direction:rtl}

/* Feedback interaksi: hover & tekan */
.btn,.tg,.cat,.j,.msn,.sw,.due button,.s,.picker,.pgnav button,.nav a .ic,.see,.lnk,.lvl,.bg .med{transition:transform .12s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease,filter .18s ease,opacity .15s ease}
.btn:active{transform:translateY(1px) scale(.99)}
.tg:active,.cat:active,.j:active,.due button:active,.s:active,.picker:active,.pgnav button:not(:disabled):active,.msn:active{transform:scale(.96)}
.cat,.j,.s,.msn,.see,.lnk,.picker{cursor:pointer}
@media(hover:hover){
  .btn:hover{filter:brightness(1.06);box-shadow:0 11px 24px rgba(11,122,88,.34)}
  .btn.gold:hover{box-shadow:0 11px 24px rgba(245,165,36,.4)}
  .btn.gh:hover,.btn.gr:hover{background:var(--gl2);border-color:var(--g1)}
  .tg:hover{filter:brightness(.96)}
  .cat:hover{border-color:var(--g1);background:var(--gl2)}
  .j:hover{border-color:var(--g1);box-shadow:var(--sh2)}
  .s:hover{box-shadow:var(--sh);transform:translateY(-1px)}
  .msn:hover{background:var(--soft)}
  .due button:hover{filter:brightness(.95)}
  .picker:hover{filter:brightness(1.05)}
  .pgnav button:not(:disabled):hover{background:var(--gl2);border-color:var(--g1)}
  .nav a:not(.active):hover{color:var(--g2)}
  .nav a:not(.active):hover .ic{background:var(--gl2)}
  .see:hover,.lnk:hover{text-decoration:underline}
}

/* Muroja'ah: guide + manual add */
.h4l{font-size:13px;font-weight:700;display:flex;align-items:center;gap:7px}
.mj-guide{background:linear-gradient(135deg,var(--gl2),var(--card))}
.mj-ghead{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;padding:0;cursor:pointer;color:var(--ink)}
.mj-ghead .svg{width:16px;height:16px;color:var(--g2)}
.mj-steps{margin:12px 0 4px;display:flex;flex-direction:column;gap:11px}
.mj-step{display:flex;gap:11px;align-items:flex-start}
.mj-step .n{flex:none;width:30px;height:30px;border-radius:10px;background:var(--gl);color:var(--g2);display:flex;align-items:center;justify-content:center}
.mj-step .n .svg{width:15px;height:15px}
.mj-step b{font-size:12.5px;display:block;margin-bottom:2px}
.mj-step p{font-size:11px;line-height:1.55;margin:0}
.mj-tl{margin-top:12px;padding-top:11px;border-top:1px dashed var(--line)}
.mj-tl .lbl{font-size:10.5px;color:var(--mut);font-weight:600;display:block;margin-bottom:7px}
.mj-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mj-chips .svg{width:12px;height:12px;color:var(--faint)}
.chip{min-width:26px;text-align:center;padding:4px 8px;border-radius:9px;background:var(--card);border:1.5px solid var(--gl);color:var(--g2);font-size:11px;font-weight:700;box-shadow:var(--sh2)}
.mj-add{display:flex;gap:9px;align-items:stretch}
.mj-add .inp{flex:1}
.mj-add .btn{width:auto;margin-top:0;padding:0 16px;white-space:nowrap}
@media (hover:hover){.mj-ghead:hover .svg{filter:brightness(1.1)}}

/* --- Dark mode: perbaiki kartu streak (dulu memakai warna terang -> tulisan tak terbaca) --- */
[data-theme="dark"] .streak{background:linear-gradient(135deg,#2a2411,var(--card));border-color:#3a2e12}
[data-theme="dark"] .streak .days i{background:#3a2e12}
[data-theme="dark"] .streak .days i.on{background:var(--gold)}

/* Tombol share kecil di kartu streak (Home) */
.streak .shb{width:34px;height:34px;flex:0 0 auto;border:none;border-radius:11px;background:var(--gold);color:#3a2400;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 10px rgba(245,165,36,.35)}
.streak .shb:active{transform:scale(.92)}
.streak .shb svg{width:16px;height:16px}

/* --- Murojaah: pemilih granularitas + grid kotak halaman --- */
.mseg{display:flex;gap:6px;background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:4px;margin-top:10px}
.mseg button{flex:1;border:none;background:transparent;color:var(--mut);font-size:11.5px;font-weight:700;padding:9px 6px;border-radius:10px;cursor:pointer;transition:.15s}
.mseg button.on{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;box-shadow:0 3px 8px rgba(6,60,46,.2)}
.mseg button:active{transform:scale(.96)}

.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;margin-top:12px}
.mgrid.wide{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
.mbox{border:1.5px solid var(--line);background:var(--card);border-radius:13px;padding:12px 6px;text-align:center;cursor:pointer;transition:.15s;position:relative;overflow:hidden}
.mbox:hover{border-color:var(--g1)}
.mbox:active{transform:scale(.94)}
.mbox b{display:block;font-size:15px;color:var(--ink);font-weight:800;line-height:1.1}
.mbox small{display:block;font-size:8.5px;color:var(--faint);margin-top:3px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
.mbox.added{background:linear-gradient(135deg,var(--gl),var(--gl2));border-color:var(--g1)}
.mbox.added b{color:var(--g2)}
.mbox .ck{position:absolute;top:3px;right:3px;color:var(--g1);display:flex}
.mbox .ck svg{width:12px;height:12px}
.memp{text-align:center;padding:22px 14px;color:var(--mut);font-size:12px;line-height:1.7}
.mcount{font-size:10.5px;color:var(--mut);margin-top:10px;display:flex;align-items:center;gap:5px}

/* Tombol ganti kutipan di kartu pencapaian (Data) */
.qrow{display:flex;justify-content:center;margin-top:9px}
.qbtn{border:none;background:rgba(255,255,255,.2);color:#fff;font-size:10.5px;font-weight:600;padding:6px 13px;border-radius:20px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.qbtn:active{transform:scale(.95)}
.qbtn svg{width:12px;height:12px}

/* --- Panel admin & gerbang kode --- */
.astat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.astat div{background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:12px;text-align:center}
.astat div b{display:block;font-size:22px;color:var(--g2);font-weight:800}
.astat div span{font-size:9px;color:var(--mut);text-transform:uppercase;letter-spacing:.4px}
.clist{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.crow{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;font-size:12px;background:var(--card)}
.crow .cd{font-weight:700;font-family:'Courier New',monospace;letter-spacing:.5px;color:var(--ink)}
.crow small{color:var(--faint);font-size:10px}
.crow .tag{margin-left:auto;font-size:9px;font-weight:800;padding:3px 9px;border-radius:20px;text-transform:uppercase;letter-spacing:.4px}
.crow .tag.free{background:var(--gl);color:var(--g2)}
.crow .tag.used{background:var(--goldl);color:var(--gold2)}
.ghint{font-size:10.5px;color:var(--faint);margin-top:14px;text-align:center;line-height:1.7}

/* --- Setup awal (pilih juz hafalan) --- */
.setup{height:100%;overflow-y:auto;background:var(--bg,#f6f8f7)}
.setup-in{max-width:460px;margin:0 auto;padding:36px 22px 44px;text-align:center;display:flex;flex-direction:column;align-items:center}
.setup-in h2{font-size:20px;color:var(--ink)}
.jgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;width:100%;margin-top:16px}
.jbox{position:relative;aspect-ratio:1/1;border:1.5px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font-weight:700;font-size:14px;cursor:pointer;transition:transform .08s ease,background .15s,border-color .15s;display:flex;align-items:center;justify-content:center}
.jbox:active{transform:scale(.9)}
.jbox.on{background:linear-gradient(135deg,var(--g1),var(--g3));border-color:var(--g2);color:#fff}
.jbox .jck{position:absolute;top:2px;right:2px;color:#fff;opacity:.95}
.jbox .jck svg{width:12px;height:12px}

/* ===== Muroja'ah: pemilih juz ===== */
.mlbl{display:block;font-size:11px;font-weight:700;color:var(--mut);margin:2px 0 7px}
.jsel{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:10px;-webkit-overflow-scrolling:touch}
.jsel::-webkit-scrollbar{height:0}
.jchip{flex:0 0 auto;border:1px solid var(--line);background:var(--soft);color:var(--txt);font-size:12.5px;font-weight:700;padding:8px 14px;border-radius:20px;cursor:pointer;transition:transform .12s ease}
.jchip:active{transform:scale(.94)}
.jchip.on{background:linear-gradient(135deg,var(--g1),var(--g3));color:#fff;border-color:transparent;box-shadow:0 4px 12px rgba(15,157,110,.35)}

/* ===== Quran: petunjuk geser ===== */
.swipehint{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;color:var(--mut);margin:8px 0 2px;opacity:.85}
.swipehint .svg{width:13px;height:13px}

/* ===== Ikon gamifikasi kustom ===== */
.gic{display:inline-block;vertical-align:-.22em;flex:none}
@keyframes gicFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.6px)}}
@keyframes gicFlicker{0%,100%{transform:scale(1) rotate(0);opacity:1}45%{transform:scale(1.07) rotate(-2deg);opacity:.9}70%{transform:scale(.97) rotate(1deg)}}
@keyframes gicPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.13)}}
@keyframes gicTwinkle{0%,100%{opacity:1;transform:rotate(0)}50%{opacity:.75;transform:rotate(-5deg)}}
.gic-float{animation:gicFloat 3s ease-in-out infinite}
.gic-flicker{animation:gicFlicker 1.7s ease-in-out infinite;transform-origin:50% 82%}
.gic-pulse{animation:gicPulse 2.2s ease-in-out infinite}
.gic-twinkle{animation:gicTwinkle 2.8s ease-in-out infinite;transform-origin:60% 42%}
@media (prefers-reduced-motion: reduce){.gic-float,.gic-flicker,.gic-pulse,.gic-twinkle{animation:none}}

/* ===== Perbaikan kontras mode gelap ===== */
[data-theme="dark"]{--mut:#b3c5c0;--faint:#8a9c96}
[data-theme="dark"] .btn.gh,[data-theme="dark"] .btn.gr,[data-theme="dark"] .see,[data-theme="dark"] .nav a.active,[data-theme="dark"] .msn b,[data-theme="dark"] .chip,[data-theme="dark"] .qbtn,[data-theme="dark"] .pgnav button,[data-theme="dark"] .basm,[data-theme="dark"] .mbox.added b,[data-theme="dark"] .h4l,[data-theme="dark"] .mcount{color:#4fe0a6}
[data-theme="dark"] .mseg button.on,[data-theme="dark"] .jchip.on{color:#fff}
[data-theme="dark"] .mbox b{color:var(--txt)}
[data-theme="dark"] .ay .n{background:#1c4133;color:#5fe3aa}
[data-theme="dark"] .sw.off{background:#3a4a45}
[data-theme="dark"] .jchip{background:#182420;color:var(--txt)}
[data-theme="dark"] .swipehint{opacity:1;color:#9fc7ba}

/* ===== Daily Quest redesign: UI/UX skill implementation ===== */
button,.nav a{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid color-mix(in srgb,var(--g1) 45%,transparent);outline-offset:2px}
.quest-screen{background:var(--soft)}
.quest-head{background:linear-gradient(145deg,#0d8c64,var(--g3));color:#fff;padding:calc(22px + env(safe-area-inset-top)) 18px 28px;border-radius:0 0 30px 30px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px;position:relative;overflow:hidden}
.quest-head:after{content:"";position:absolute;width:170px;height:170px;border:36px solid rgba(255,255,255,.06);border-radius:50%;right:-70px;top:-85px;pointer-events:none}
.quest-head h1{font-size:27px;line-height:1.15;letter-spacing:-.7px;margin-top:3px}
.quest-head p{font-size:12px;color:rgba(255,255,255,.78);margin-top:4px}
.eyebrow{display:block;font-size:9px;letter-spacing:1.3px;font-weight:800;color:var(--g1)}
.quest-head .eyebrow{color:#b9f4dd}
.quest-xp{min-width:68px;padding:9px 10px;border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px rgba(255,255,255,.14);background:rgba(255,255,255,.11);border-radius:16px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:0 6px;position:relative;z-index:1}
.quest-xp .gic{grid-row:1/3}.quest-xp b{font-size:15px;line-height:1}.quest-xp span{font-size:8px;opacity:.8;letter-spacing:.7px}
.section-title{font-size:13px;margin:2px 0 9px}
.quest-types{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.quest-type{min-height:92px;border:1.5px solid var(--line);background:var(--card);color:var(--txt);border-radius:17px;padding:10px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;transition:transform .18s ease,border-color .18s ease,background .18s ease;box-shadow:0 2px 8px rgba(6,60,46,.03)}
.quest-type:active,.quest-page:active,.progress-juz:active{transform:scale(.97)}
.quest-type-icon{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:var(--soft);color:var(--mut);margin-bottom:2px}
.quest-type-icon .svg{width:19px;height:19px}
.quest-type b{font-size:10.5px}.quest-type small{font-size:8px;color:var(--mut)}
.quest-type.on{border-color:var(--g1);background:var(--gl2)}
.quest-type.on .quest-type-icon{background:var(--g1);color:#fff}
.quest-type.on.ziyadah{border-color:var(--gold);background:var(--goldl)}
.quest-type.on.ziyadah .quest-type-icon{background:var(--gold2)}
.quest-progress{margin-top:13px;padding:14px 15px;background:var(--ink);color:var(--card);border-radius:18px}
.quest-progress-copy{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
.quest-progress-copy div{display:flex;flex-direction:column}.quest-progress-copy span{font-size:8.5px;letter-spacing:.8px;opacity:.65}.quest-progress-copy b{font-size:12px}.quest-progress-copy strong{font-size:18px;font-variant-numeric:tabular-nums}
.quest-bar{height:7px;background:color-mix(in srgb,var(--card) 16%,transparent);border-radius:10px;overflow:hidden}
.quest-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--g1),#58dbaa);transition:width .3s ease}
.quest-builder{margin-top:14px;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:15px;box-shadow:var(--sh2)}
.quest-builder-title,.quest-list-head,.progress-editor-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.quest-builder-title h2,.quest-list-head h2{font-size:16px;line-height:1.2;margin-top:2px}
.reward-chip{font-size:9.5px;color:var(--gold2);background:var(--goldl);padding:6px 9px;border-radius:20px;font-weight:800;display:flex;align-items:center;gap:4px;white-space:nowrap}
.quest-builder .mlbl{margin-top:15px}
.quest-page-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:13px}
.quest-page-grid.wide{grid-template-columns:repeat(2,1fr)}
.quest-page{min-height:52px;border:1.5px solid var(--line);border-radius:13px;background:var(--soft);color:var(--txt);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .16s ease,background .2s ease,border-color .2s ease;position:relative}
.quest-page b{font-size:12px;font-variant-numeric:tabular-nums}.quest-page small{font-size:7.5px;color:var(--mut);margin-top:1px}.quest-page .svg{width:18px;height:18px}
.quest-page.picked{background:#fff7e3;border-color:var(--gold);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 20%,transparent)}
.quest-page.picked:after{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);position:absolute;right:5px;top:5px}
.quest-page.active{background:var(--card);border-color:var(--g1);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--g1) 18%,transparent)}
.quest-page.complete{background:var(--gl2);color:var(--g2);border-color:transparent}.quest-page.complete small{color:var(--g2)}
.quest-cta-wrap{margin-top:13px;padding:12px;border-radius:16px;background:var(--goldl);border:1px solid color-mix(in srgb,var(--gold) 30%,transparent)}
.quest-cta-wrap>div{display:flex;justify-content:space-between;align-items:center;font-size:10.5px}.quest-cta-wrap>div span{color:var(--gold2);font-weight:700}
.quest-cta{margin-top:9px;background:linear-gradient(135deg,var(--gold),var(--gold2));box-shadow:0 8px 18px rgba(221,138,14,.25)}
.quest-list{margin-top:20px}
.quest-list-head{margin-bottom:9px}.quest-list-head>span{font-size:9.5px;background:var(--gl);color:var(--g2);font-weight:800;padding:5px 9px;border-radius:20px}.quest-list-head.danger .eyebrow,.quest-list-head.danger h2{color:#d54848}
.quest-row{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--g1);padding:11px;border-radius:16px;margin-top:8px;min-height:66px;transition:opacity .2s ease,background .2s ease}
.quest-check{width:34px;height:34px;border-radius:11px;background:var(--gl2);color:var(--g2);display:flex;align-items:center;justify-content:center;flex:0 0 auto}.quest-check .svg{width:17px;height:17px}
.quest-row-copy{flex:1;min-width:0}.quest-row-copy b{font-size:11.5px;display:block}.quest-row-copy span{font-size:9px;color:var(--mut);display:flex;align-items:center;flex-wrap:wrap;gap:4px}.quest-row-copy i{width:3px;height:3px;background:var(--faint);border-radius:50%}
.quest-row>button{min-height:44px;border:none;background:var(--gl);color:var(--g2);border-radius:12px;font-size:9.5px;font-weight:800;padding:7px 9px;max-width:80px}
.quest-row.done{opacity:.72;background:var(--gl2);border-left-color:#56bb92}.quest-row.done .quest-check{background:var(--g1);color:#fff}
.quest-done-label{display:flex;align-items:center;gap:3px;color:var(--g2);font-size:9px;font-weight:800}.quest-done-label .svg{width:13px;height:13px}
.quest-row.failed{border-left-color:#d54848;background:color-mix(in srgb,#d54848 7%,var(--card))}.quest-row.failed .quest-check{background:color-mix(in srgb,#d54848 12%,var(--card));color:#d54848}
.quest-empty{min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--mut);padding:18px}.quest-empty>.svg{width:25px;height:25px;color:var(--faint);margin-bottom:7px}.quest-empty b{font-size:12px;color:var(--txt)}.quest-empty span{font-size:9.5px;margin-top:3px;max-width:230px}
.xp-float{position:fixed;left:50%;bottom:87px;transform:translateX(-50%);z-index:60;background:var(--ink);color:var(--card);border:1px solid color-mix(in srgb,var(--card) 16%,transparent);box-shadow:var(--sh);border-radius:24px;padding:10px 15px;font-size:11px;font-weight:800;display:flex;align-items:center;gap:6px;animation:questPop .28s ease-out}
@keyframes questPop{from{opacity:0;transform:translate(-50%,10px) scale(.96)}to{opacity:1;transform:translate(-50%,0) scale(1)}}

/* ===== Editable juz progress ===== */
.progress-editor-head h4{margin:2px 0 0}.progress-editor-head>span{font-size:9.5px;font-weight:800;color:var(--g2);background:var(--gl);padding:5px 9px;border-radius:20px}
.progress-helper{font-size:10px;line-height:1.65;margin-top:9px}
.progress-juz-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin-top:12px}
.progress-juz{min-height:49px;border:1.5px solid var(--line);background:var(--soft);color:var(--txt);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:.18s ease}
.progress-juz b{font-size:11px}.progress-juz small{font-size:7.5px;color:var(--mut)}
.progress-juz.on{border-color:var(--g1);background:var(--gl2);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--g1) 18%,transparent)}
.progress-juz.complete:after{content:"✓";font-size:8px;color:var(--g1);position:absolute}.progress-juz{position:relative}.progress-juz.complete:after{right:4px;top:3px}
.progress-control{margin-top:13px;border-top:1px solid var(--line);padding-top:13px}
.progress-control-copy{display:flex;align-items:center;justify-content:space-between}.progress-control-copy b{font-size:14px}.progress-control-copy span{font-size:10px;color:var(--mut)}
.progress-stepper{display:flex;align-items:center;justify-content:center;gap:17px;margin:13px 0 8px}.progress-stepper button{width:44px;height:44px;border-radius:14px;border:1.5px solid var(--line);background:var(--soft);color:var(--g2);display:flex;align-items:center;justify-content:center}.progress-stepper strong{font-size:26px;min-width:42px;text-align:center;font-variant-numeric:tabular-nums}
.progress-control label{display:block;font-size:9.5px;color:var(--mut);font-weight:700;margin-top:8px}.progress-control input[type="range"]{width:100%;accent-color:var(--g1);height:28px}.progress-scale{display:flex;justify-content:space-between;font-size:8.5px;color:var(--faint)}

/* Bottom-nav skill rule: 5 predictable destinations, full touch areas */
.nav a{min-width:58px;min-height:52px;justify-content:center;border-radius:12px}

[data-theme="dark"] .quest-progress{background:#e1eee9;color:#10201b}
[data-theme="dark"] .quest-page.picked{background:#3a2e12}
[data-theme="dark"] .quest-row.failed{background:#2d1b1b}
[data-theme="dark"] .quest-type.on.ziyadah{background:#3a2e12}
@media (prefers-reduced-motion:reduce){.quest-type,.quest-page,.quest-row,.quest-bar i,.xp-float{animation:none!important;transition:none!important}}

/* Beranda terhubung ke quest harian */
.home-quest-empty{width:100%;min-height:62px;border:1.5px dashed var(--line);background:var(--soft);color:var(--txt);border-radius:15px;padding:10px;display:flex;align-items:center;gap:10px;text-align:left}
.home-quest-empty>span{width:38px;height:38px;border-radius:12px;background:var(--gl);color:var(--g2);display:flex;align-items:center;justify-content:center;flex:none}
.home-quest-empty>div{display:flex;flex-direction:column;flex:1}.home-quest-empty b{font-size:11.5px}.home-quest-empty small{font-size:9px;color:var(--mut);margin-top:2px}.home-quest-empty>.svg{color:var(--faint)}

/* ===== Journal / Riwayat: pastel scanning UI ===== */
.journal-screen{background:var(--soft)}
.journal-head{padding:calc(22px + env(safe-area-inset-top)) 18px 26px;background:linear-gradient(145deg,#dff7c8,#bde99f);color:#193a2d;border-radius:0 0 30px 30px;display:flex;align-items:flex-end;justify-content:space-between;position:relative;overflow:hidden}
.journal-head:before,.journal-head:after{content:"";position:absolute;border:1px solid rgba(15,157,110,.16);border-radius:50%;pointer-events:none}
.journal-head:before{width:210px;height:90px;right:-75px;top:-18px;transform:rotate(-12deg)}
.journal-head:after{width:180px;height:70px;right:-40px;bottom:-45px;transform:rotate(10deg)}
.journal-head .eyebrow{color:#398161}.journal-head h1{font-size:27px;letter-spacing:-.7px;line-height:1.15;margin-top:3px}.journal-head p{font-size:11px;color:#4e7465;margin-top:4px}
.journal-head-icon{width:47px;height:47px;border-radius:16px;background:rgba(255,255,255,.62);box-shadow:inset 0 1px rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;color:var(--g2);position:relative;z-index:1}.journal-head-icon .svg{width:23px;height:23px}
.journal-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:0}
.journal-stats>div{min-height:91px;background:var(--card);border:1px solid var(--line);border-radius:17px;padding:11px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;gap:3px 7px;box-shadow:0 3px 10px rgba(6,60,46,.04)}
.stat-icon{grid-row:1/3;width:29px;height:29px;border-radius:10px;display:flex;align-items:center;justify-content:center}.stat-icon .svg{width:15px;height:15px}.stat-icon.success{background:#dff6e9;color:#16845e}.stat-icon.reward{background:#fff2c9;color:#b97800}.stat-icon.failed{background:#fde7e5;color:#c84d48}
.journal-stats b{font-size:17px;line-height:1;font-variant-numeric:tabular-nums}.journal-stats small{font-size:7.8px;color:var(--mut);line-height:1.2}
.journal-calendar{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:14px;margin-top:13px;box-shadow:var(--sh2)}
.journal-month{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.journal-month button{width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:var(--soft);color:var(--txt);display:flex;align-items:center;justify-content:center}.journal-month button:active{transform:scale(.96)}.journal-month>div{text-align:center;display:flex;flex-direction:column}.journal-month span{font-size:8px;color:var(--mut);letter-spacing:1px;font-weight:700}.journal-month b{font-size:14px;margin-top:1px}
.journal-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.journal-day-name{text-align:center;color:var(--faint);font-size:8.5px;font-weight:800;padding:3px 0 5px}
.journal-day{min-width:0;aspect-ratio:1;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--txt);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10.5px;position:relative;transition:background .18s ease,border-color .18s ease,transform .15s ease}.journal-day:not(.empty):active{transform:scale(.93)}.journal-day.today{border-color:var(--gl);font-weight:800}.journal-day.selected{background:var(--g1);color:#fff;box-shadow:0 5px 12px rgba(15,157,110,.24);font-weight:800}.journal-day.empty{pointer-events:none}
.journal-dots{height:4px;display:flex;gap:2px;align-items:center}.journal-dots em{width:4px;height:4px;border-radius:50%;display:block}.journal-dots .ziyadah,.journal-legend i.ziyadah{background:#e7a52d}.journal-dots .baca,.journal-legend i.baca{background:#48a9d4}.journal-dots .murojaah,.journal-legend i.murojaah{background:#37ae78}.journal-dots .failed,.journal-legend i.failed{background:#d85b58}.journal-day.selected .journal-dots em{box-shadow:0 0 0 1px rgba(255,255,255,.7)}
.journal-legend{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px 11px;padding-top:11px;margin-top:8px;border-top:1px solid var(--line)}.journal-legend span{font-size:7.8px;color:var(--mut);display:flex;align-items:center;gap:4px}.journal-legend i{width:6px;height:6px;border-radius:50%}
.journal-filters{display:flex;gap:7px;overflow-x:auto;padding:2px 1px 5px;margin-top:13px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.journal-filters::-webkit-scrollbar{display:none}.journal-filters button{flex:0 0 auto;min-height:44px;border:1.5px solid var(--line);background:var(--card);color:var(--mut);border-radius:22px;padding:8px 13px;font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:5px;transition:transform .15s ease,background .18s ease,border-color .18s ease}.journal-filters button .svg{width:13px;height:13px}.journal-filters button:active{transform:scale(.96)}.journal-filters button.on{background:var(--ink);border-color:var(--ink);color:var(--card)}.journal-filters button.on.ziyadah{background:#c98613;border-color:#c98613;color:#fff}.journal-filters button.on.baca{background:#318db5;border-color:#318db5;color:#fff}.journal-filters button.on.murojaah{background:var(--g1);border-color:var(--g1);color:#fff}
.journal-list{margin-top:16px}.journal-list-title{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-bottom:9px}.journal-list-title h2{font-size:15px;line-height:1.25;margin-top:2px}.journal-list-title>span{font-size:8.5px;color:var(--mut);background:var(--card);border:1px solid var(--line);border-radius:20px;padding:5px 8px;white-space:nowrap}
.journal-entry{min-height:72px;border:1px solid var(--line);border-left:4px solid var(--g1);background:var(--card);border-radius:17px;padding:11px;display:flex;align-items:center;gap:10px;margin-top:8px;box-shadow:0 3px 10px rgba(6,60,46,.035);position:relative;overflow:hidden}.journal-entry:after{content:"";position:absolute;width:60px;height:60px;border-radius:50%;right:-38px;bottom:-38px;background:currentColor;opacity:.035}.journal-entry.ziyadah{border-left-color:#d79825}.journal-entry.baca{border-left-color:#48a9d4}.journal-entry.murojaah{border-left-color:#37ae78}.journal-entry.failed{border-left-color:#d85b58;background:color-mix(in srgb,#d85b58 6%,var(--card))}.journal-entry.pending{border-left-color:#8fa39c}
.journal-entry-icon{width:39px;height:39px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.journal-entry-icon .svg{width:19px;height:19px}.journal-entry.ziyadah .journal-entry-icon{background:#fff1ce;color:#b6770b}.journal-entry.baca .journal-entry-icon{background:#ddf4fb;color:#2582aa}.journal-entry.murojaah .journal-entry-icon{background:#def6e9;color:#16845e}.journal-entry.failed .journal-entry-icon{background:#fde5e3;color:#c84d48}
.journal-entry-copy{flex:1;min-width:0}.journal-entry-copy>div{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.journal-entry-copy b{font-size:11.5px}.journal-entry-copy strong{font-size:7.5px;padding:3px 6px;border-radius:10px;background:#fde5e3;color:#b74340}.journal-entry.pending .journal-entry-copy strong{background:var(--line);color:var(--mut)}.journal-entry-copy>span{display:block;font-size:9px;color:var(--mut);margin-top:3px;white-space:normal;line-height:1.4}
.journal-xp{flex:0 0 auto;border-radius:12px;padding:7px 8px;font-size:9px;font-weight:800;font-variant-numeric:tabular-nums;background:#dff6e9;color:#16845e}.journal-xp.failed{background:#fde7e5;color:#b74340}.journal-xp.pending{background:var(--line);color:var(--mut)}
.journal-empty{min-height:150px;border:1.5px dashed var(--line);border-radius:18px;background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}.journal-empty>span{width:43px;height:43px;border-radius:14px;background:var(--soft);color:var(--faint);display:flex;align-items:center;justify-content:center;margin-bottom:8px}.journal-empty b{font-size:12px}.journal-empty p{font-size:9.5px;color:var(--mut);margin-top:3px;max-width:230px}
[data-theme="dark"] .journal-head{background:linear-gradient(145deg,#173f31,#1c5b42);color:#e8f7ef}[data-theme="dark"] .journal-head p{color:#b7d9ca}[data-theme="dark"] .journal-head .eyebrow{color:#80d7b1}[data-theme="dark"] .journal-head-icon{background:rgba(255,255,255,.1);color:#9ee3c4}
[data-theme="dark"] .journal-entry.failed{background:#2c1b1b}[data-theme="dark"] .journal-entry.ziyadah .journal-entry-icon{background:#3a2e12}[data-theme="dark"] .journal-entry.baca .journal-entry-icon{background:#153543}[data-theme="dark"] .journal-entry.murojaah .journal-entry-icon{background:#143a2c}[data-theme="dark"] .journal-day.selected{color:#fff}
@media (prefers-reduced-motion:reduce){.journal-day,.journal-filters button,.journal-month button{transition:none!important}}

/* ===== Mission controls v2 ===== */
.quest-juz-picker{display:grid;grid-template-columns:44px 1fr 44px;gap:8px;align-items:center}.quest-juz-picker button{height:44px;border:1.5px solid var(--line);border-radius:13px;background:var(--soft);color:var(--g2);display:flex;align-items:center;justify-content:center}.quest-juz-picker select{height:44px;width:100%;border:1.5px solid var(--line);border-radius:13px;background:var(--card);color:var(--txt);padding:0 12px;font-size:12px;font-weight:700}.quest-juz-picker button:disabled{opacity:.35}
.quest-juz-status{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:8px 10px;margin-top:8px;font-size:9.5px;color:var(--mut)}.quest-juz-status span{display:flex;align-items:center;gap:5px}.quest-juz-status b{color:var(--txt)}.quest-juz-status.complete{background:var(--gl2);color:var(--g2);border-color:var(--gl)}.quest-juz-status.complete b{color:var(--g2)}
.quest-page.memorized{background:var(--gl2);border-color:var(--gl);color:var(--g2);opacity:.78}.quest-page.memorized small{color:var(--g2)}.quest-page:disabled{cursor:not-allowed}
.quest-edit-toggle{min-height:40px;border:1px solid var(--line);background:var(--card);color:var(--mut);border-radius:12px;padding:7px 9px;font-size:9px;font-weight:800;display:flex;align-items:center;gap:5px}.quest-edit-toggle.on{background:var(--goldl);color:var(--gold2);border-color:var(--gold)}.quest-row .danger-btn{background:#fde7e5;color:#b74340}.quest-row .danger-btn .svg{width:13px;height:13px}

/* ===== Home quick actions and daily insight ===== */
.home-insight{width:100%;border:1px solid #d9ead0;background:linear-gradient(135deg,#f3fbe9,#e5f6d8);color:#244237;border-radius:18px;padding:13px;margin-top:13px;display:flex;align-items:flex-start;gap:10px;text-align:left;box-shadow:0 3px 10px rgba(56,112,72,.06)}.home-insight.night{background:linear-gradient(135deg,#eef0ff,#e4e8fb);border-color:#d9ddf2}.home-insight.friday{background:linear-gradient(135deg,#fff8df,#f8edc1);border-color:#efe0a8}.home-insight-icon{width:39px;height:39px;border-radius:13px;background:rgba(255,255,255,.7);color:var(--g2);display:flex;align-items:center;justify-content:center;flex:none}.home-insight>div{flex:1;min-width:0}.home-insight small{font-size:7.5px;font-weight:800;letter-spacing:1px;color:var(--g2);display:block}.home-insight b{font-size:11.5px;display:block;margin-top:2px}.home-insight p{font-size:9px;color:#527064;line-height:1.45;margin-top:2px}.home-insight em{display:block;font-size:8px;color:#72887f;font-style:normal;margin-top:5px;padding-top:5px;border-top:1px solid rgba(36,66,55,.08)}.home-insight>.svg{margin-top:12px;color:#739083}
.home-quest-row{display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid var(--line)}.home-quest-row:last-child{border-bottom:0}.home-quest-kind{width:32px;height:32px;border-radius:10px;background:var(--gl2);color:var(--g2);display:flex;align-items:center;justify-content:center;flex:none}.home-quest-copy{flex:1;border:0;background:none;color:var(--txt);text-align:left;display:flex;flex-direction:column}.home-quest-copy b{font-size:10.5px}.home-quest-copy small{font-size:8.5px;color:var(--mut);margin-top:2px}.home-quest-check{width:44px;height:44px;border:0;border-radius:13px;background:var(--gl);color:var(--g2);display:flex;align-items:center;justify-content:center}.home-quest-done{width:32px;height:32px;border-radius:10px;background:var(--g1);color:#fff;display:flex;align-items:center;justify-content:center}.home-quest-row.done{opacity:.65}

/* ===== Daily insight screen ===== */
.insight-screen{background:var(--soft)}.insight-head{padding:calc(20px + env(safe-area-inset-top)) 17px 24px;background:linear-gradient(145deg,#dff7c8,#bde99f);color:#193a2d;border-radius:0 0 30px 30px;display:flex;gap:12px;align-items:flex-start}.insight-head>button{width:44px;height:44px;border:1px solid rgba(25,58,45,.12);border-radius:14px;background:rgba(255,255,255,.55);color:#245a45;display:flex;align-items:center;justify-content:center;flex:none}.insight-head h1{font-size:24px;letter-spacing:-.5px;line-height:1.15;margin-top:3px}.insight-head p{font-size:10.5px;color:#4e7465;margin-top:4px;line-height:1.5}.insight-head .eyebrow{color:#398161}
.sunnah-reminder{display:flex;gap:11px;border-radius:18px;padding:14px;background:var(--card);border:1px solid var(--line);box-shadow:var(--sh2)}.sunnah-reminder>span{width:40px;height:40px;border-radius:13px;background:var(--gl2);color:var(--g2);display:flex;align-items:center;justify-content:center;flex:none}.sunnah-reminder b{font-size:12px}.sunnah-reminder p{font-size:9.5px;color:var(--mut);line-height:1.55;margin-top:3px}.sunnah-reminder small{font-size:7.8px;color:var(--faint);display:block;margin-top:5px}.sunnah-reminder.night>span{background:#e7e9fb;color:#5365a6}.sunnah-reminder.friday>span{background:var(--goldl);color:var(--gold2)}
.daily-quiz,.virtue-list{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:15px;margin-top:13px;box-shadow:var(--sh2)}.insight-section-head{display:flex;align-items:center;justify-content:space-between}.insight-section-head h2{font-size:15px;margin-top:2px}.insight-section-head>.svg{width:22px;height:22px;color:var(--g1)}.quiz-question{font-size:12.5px;font-weight:700;line-height:1.55;margin-top:14px}.quiz-options{display:grid;gap:8px;margin-top:11px}.quiz-options button{min-height:48px;border:1.5px solid var(--line);border-radius:14px;background:var(--soft);color:var(--txt);padding:9px 11px;display:flex;align-items:center;gap:9px;text-align:left;font-size:10.5px}.quiz-options button>span{width:27px;height:27px;border-radius:9px;background:var(--card);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:800;flex:none}.quiz-options button>.svg{margin-left:auto}.quiz-options button.correct{border-color:var(--g1);background:var(--gl2);color:var(--g2)}.quiz-options button.wrong{border-color:#dc7772;background:#fdefee}.quiz-feedback{border-radius:14px;padding:11px;margin-top:10px;background:var(--gl2);color:var(--g2)}.quiz-feedback.wrong{background:#fdefee;color:#a94a46}.quiz-feedback b{font-size:10.5px}.quiz-feedback p{font-size:9px;line-height:1.5;margin-top:2px}.quiz-feedback small{font-size:7.5px;opacity:.72;display:block;margin-top:4px}
.motivation-card{display:flex;gap:11px;align-items:flex-start;background:linear-gradient(135deg,var(--goldl),var(--card));border:1px solid var(--goldl);border-radius:18px;padding:14px;margin-top:13px}.motivation-card>.svg{width:22px;height:22px;color:var(--gold2);flex:none}.motivation-card p{font-size:10.5px;line-height:1.6;margin-top:3px}.virtue-list article{display:flex;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}.virtue-list article:last-child{border-bottom:0}.virtue-list article>span{width:29px;height:29px;border-radius:10px;background:var(--gl2);color:var(--g2);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;flex:none}.virtue-list article b{font-size:10.5px}.virtue-list article p{font-size:9px;color:var(--mut);line-height:1.5;margin-top:2px}.virtue-list article small{font-size:7.5px;color:var(--faint);display:block;margin-top:4px}.source-note{display:flex;gap:9px;padding:12px;color:var(--mut);font-size:8.5px;line-height:1.55}.source-note>.svg{width:16px;height:16px;flex:none;margin-top:1px}
[data-theme="dark"] .home-insight,[data-theme="dark"] .home-insight.night,[data-theme="dark"] .home-insight.friday{background:#182820;border-color:#2b4037;color:var(--txt)}[data-theme="dark"] .home-insight p,[data-theme="dark"] .home-insight em{color:var(--mut)}[data-theme="dark"] .insight-head{background:linear-gradient(145deg,#173f31,#1c5b42);color:#e8f7ef}[data-theme="dark"] .insight-head p{color:#b7d9ca}[data-theme="dark"] .quiz-options button.wrong,[data-theme="dark"] .quiz-feedback.wrong{background:#2d1b1b}[data-theme="dark"] .quest-page.memorized{background:#143a2c}
@media(prefers-reduced-motion:reduce){.home-insight,.home-quest-check,.quiz-options button{transition:none!important}}

/* ===== Compact mission lanes ===== */
.quest-lanes{display:grid;gap:10px;margin-top:10px}.quest-lane{--lane:#0f9d6e;--lane-soft:#e8f8f1;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:11px;box-shadow:0 3px 10px rgba(6,60,46,.035);overflow:hidden}.quest-lane.ziyadah{--lane:#d88755;--lane-soft:#fff0e7}.quest-lane.baca{--lane:#438fbd;--lane-soft:#e6f4fb}.quest-lane.murojaah{--lane:#21996b;--lane-soft:#e3f7ee}
.quest-lane-head{display:flex;align-items:center;gap:8px}.quest-lane-icon{width:34px;height:34px;border-radius:11px;background:var(--lane-soft);color:var(--lane);display:flex;align-items:center;justify-content:center;flex:none}.quest-lane-head>div{display:flex;flex-direction:column;flex:1}.quest-lane-head b{font-size:11px}.quest-lane-head small{font-size:8px;color:var(--mut)}.quest-lane-head strong{font-size:8px;color:var(--lane);background:var(--lane-soft);padding:5px 7px;border-radius:20px;white-space:nowrap}
.quest-lane-scroll{display:flex;gap:8px;overflow-x:auto;padding:9px 1px 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.quest-lane-scroll::-webkit-scrollbar{display:none}.quest-mini{flex:0 0 158px;min-height:58px;border:1px solid color-mix(in srgb,var(--lane) 18%,var(--line));background:var(--lane-soft);border-radius:14px;padding:8px;display:flex;align-items:center;gap:7px}.quest-mini-status{width:31px;height:31px;border-radius:10px;background:var(--card);color:var(--lane);display:flex;align-items:center;justify-content:center;flex:none}.quest-mini-status .svg{width:15px;height:15px}.quest-mini>div{display:flex;flex-direction:column;min-width:0;flex:1}.quest-mini b{font-size:9.5px}.quest-mini small{font-size:8px;color:var(--mut)}.quest-mini>button{border:0;min-height:32px;border-radius:10px;padding:5px 7px;font-size:7.8px;font-weight:800;flex:none}.mini-finish{background:var(--lane);color:#fff}.mini-remove{width:32px;background:#fde6e4;color:#b44340;display:flex;align-items:center;justify-content:center}.mini-done{font-size:7.5px;color:var(--g2);font-weight:800}.quest-mini.done{opacity:.64}.quest-mini.done .quest-mini-status{background:var(--g1);color:#fff}.quest-mini.editing{border-style:dashed}

/* ===== Audience setup and settings ===== */
.setup-kicker{font-size:8px;letter-spacing:1.4px;font-weight:800;color:var(--g1);margin-top:11px}.audience-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:14px}.audience-picker.compact{margin:14px 0}.audience-choice{min-height:106px;border:1.5px solid var(--line);border-radius:18px;background:var(--card);color:var(--txt);padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:transform .16s ease,border-color .18s ease,background .18s ease}.audience-choice:active{transform:scale(.97)}.audience-choice>span{width:39px;height:39px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--soft);color:var(--mut)}.audience-choice b{font-size:12px}.audience-choice small{font-size:8px;color:var(--mut)}.audience-choice.akhwat.on{border-color:#e586a5;background:#fff0f5}.audience-choice.akhwat.on>span{background:#f7cddd;color:#b7446c}.audience-choice.ikhwan.on{border-color:var(--g1);background:var(--gl2)}.audience-choice.ikhwan.on>span{background:var(--gl);color:var(--g2)}.setup-divider{width:100%;height:1px;background:var(--line);margin:20px 0 4px}.personal-theme-setting{padding:8px 0 12px;border-bottom:1px solid var(--line)}.personal-theme-setting>span{font-size:11.5px;display:flex;align-items:center;gap:6px}.personal-theme-setting>div{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}.personal-theme-setting button{min-height:40px;border:1px solid var(--line);border-radius:12px;background:var(--soft);color:var(--mut);font-size:10px;font-weight:700}.personal-theme-setting button.akhwat.on{background:#fff0f5;border-color:#e586a5;color:#b7446c}.personal-theme-setting button.ikhwan.on{background:var(--gl2);border-color:var(--g1);color:var(--g2)}

/* ===== Akhwat personalized palette inspired by soft rose wellness UI ===== */
html[data-audience="akhwat"] body{background:#fff5f8}html[data-audience="akhwat"] .app{background:#fff9fb;box-shadow:0 0 40px rgba(166,65,102,.08)}
html[data-audience="akhwat"] .hero{background:linear-gradient(150deg,#ef9fba 0%,#d96790 56%,#a83e67 100%)}html[data-audience="akhwat"] .quest-head{background:linear-gradient(145deg,#efabc0,#c95881)}html[data-audience="akhwat"] .journal-head,html[data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#fff1f5,#f5bfd1);color:#54253a}html[data-audience="akhwat"] .journal-head p,html[data-audience="akhwat"] .insight-head p{color:#84546a}html[data-audience="akhwat"] .journal-head .eyebrow,html[data-audience="akhwat"] .insight-head .eyebrow{color:#b7446c}
html[data-audience="akhwat"] .nav a.active{color:#b7446c}html[data-audience="akhwat"] .nav a.active .ic,html[data-audience="akhwat"] .fab{background:linear-gradient(135deg,#e985a6,#bd466f);box-shadow:0 6px 14px rgba(189,70,111,.28)}html[data-audience="akhwat"] .acard{background:linear-gradient(155deg,#e98eac,#aa3d65)}html[data-audience="akhwat"] .splash{background:linear-gradient(160deg,#ef9fba,#a83e67)}
html[data-audience="akhwat"] .setup{background:linear-gradient(180deg,#fff7fa,#fff0f5)}html[data-audience="akhwat"] .setup-kicker{color:#b7446c}html[data-audience="akhwat"] .setup .btn,html[data-audience="akhwat"] .lg>.btn{background:linear-gradient(135deg,#e985a6,#bd466f);box-shadow:0 8px 18px rgba(189,70,111,.24)}html[data-audience="akhwat"] .steps i.on{background:#d65f89}
html[data-audience="akhwat"] .home-insight{background:linear-gradient(135deg,#fff2f6,#fce3eb);border-color:#f2c8d6}html[data-audience="akhwat"] .home-insight small{color:#b7446c}html[data-audience="akhwat"] .home-insight-icon{color:#b7446c}
[data-theme="dark"][data-audience="akhwat"] body{background:#160f13}[data-theme="dark"][data-audience="akhwat"] .app{background:#171014}[data-theme="dark"][data-audience="akhwat"] .journal-head,[data-theme="dark"][data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#482333,#6a2c45);color:#fff1f5}[data-theme="dark"] .quest-lane{background:var(--card)}[data-theme="dark"] .quest-lane.ziyadah{--lane-soft:#38251f}[data-theme="dark"] .quest-lane.baca{--lane-soft:#173341}[data-theme="dark"] .quest-lane.murojaah{--lane-soft:#14372b}
@media(prefers-reduced-motion:reduce){.audience-choice,.quest-mini{transition:none!important}}

/* ===== Akhwat palette v2: balanced sage + dusty rose + warm cream ===== */
html[data-audience="akhwat"]{
  --g1:#829d8e;--g2:#617d6f;--g3:#465f54;--gl:#e2ece6;--gl2:#f0f5f2;
  --gold:#c69268;--gold2:#a67149;--goldl:#f6eadf;
  --ink:#342e31;--txt:#4b4347;--mut:#786f73;--faint:#a79da2;
  --card:#fffdfc;--line:#ebe4e1;--soft:#faf8f6;--bg:#f4f1ef;
  --rose:#b97988;--rose-deep:#8d5c69;--rose-soft:#f3e6e9;
}
html[data-audience="akhwat"] body{background:#f1eeeb}
html[data-audience="akhwat"] .app{background:#faf8f6;box-shadow:0 0 40px rgba(85,67,75,.08)}
html[data-audience="akhwat"] .hero{background:linear-gradient(145deg,#aabcb0 0%,#8fa99a 38%,#a57e88 72%,#725b63 100%)}
html[data-audience="akhwat"] .quest-head{background:linear-gradient(145deg,#a7b9ae 0%,#8ea596 48%,#9a737e 100%)}
html[data-audience="akhwat"] .journal-head,html[data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#f6f0eb,#eadfdd);color:#4e3e45}
html[data-audience="akhwat"] .journal-head p,html[data-audience="akhwat"] .insight-head p{color:#75666d}
html[data-audience="akhwat"] .journal-head .eyebrow,html[data-audience="akhwat"] .insight-head .eyebrow{color:#8d6873}
html[data-audience="akhwat"] .journal-head-icon{background:rgba(255,253,252,.72);color:#6b8075}
html[data-audience="akhwat"] .nav a.active{color:#79636c}
html[data-audience="akhwat"] .nav a.active .ic,html[data-audience="akhwat"] .fab{background:linear-gradient(135deg,#8fa596,#8e6974);box-shadow:0 6px 14px rgba(100,78,87,.24)}
html[data-audience="akhwat"] .acard{background:linear-gradient(155deg,#9eb2a6,#7f988a 50%,#94707a)}
html[data-audience="akhwat"] .splash{background:linear-gradient(160deg,#a7b9ae,#8f737c)}
html[data-audience="akhwat"] .setup{background:linear-gradient(180deg,#faf8f6,#f3eeeb)}
html[data-audience="akhwat"] .setup-kicker{color:#8d6873}
html[data-audience="akhwat"] .setup .btn,html[data-audience="akhwat"] .lg>.btn{background:linear-gradient(135deg,#8da596,#8d6873);box-shadow:0 8px 18px rgba(98,78,86,.2)}
html[data-audience="akhwat"] .steps i.on{background:#8d817f}
html[data-audience="akhwat"] .home-insight,html[data-audience="akhwat"] .home-insight.night,html[data-audience="akhwat"] .home-insight.friday{background:linear-gradient(135deg,#f5f1ec,#e9eee9);border-color:#deded7}
html[data-audience="akhwat"] .home-insight small,html[data-audience="akhwat"] .home-insight-icon{color:#7b6a71}
html[data-audience="akhwat"] .audience-choice.akhwat.on{border-color:#a7828d;background:#f4eeec}
html[data-audience="akhwat"] .audience-choice.akhwat.on>span{background:#eadfdd;color:#8d6873}
html[data-audience="akhwat"] .personal-theme-setting button.akhwat.on{background:#f2ecea;border-color:#a7828d;color:#795e68}
html[data-audience="akhwat"] .quest-lane.ziyadah{--lane:#b77c68;--lane-soft:#f4e9e3}
html[data-audience="akhwat"] .quest-lane.baca{--lane:#718fa2;--lane-soft:#e8eff2}
html[data-audience="akhwat"] .quest-lane.murojaah{--lane:#708f80;--lane-soft:#e7efea}
html[data-audience="akhwat"] .quest-type.on.ziyadah{border-color:#b77c68;background:#f4e9e3}
html[data-audience="akhwat"] .quest-type.on.ziyadah .quest-type-icon{background:#b77c68}
html[data-audience="akhwat"] .quest-progress{background:#4d474a;color:#fffdfc}
html[data-audience="akhwat"] .quest-bar i{background:linear-gradient(90deg,#8da596,#c09aa3)}
html[data-audience="akhwat"] .btn:not(.gold):not(.gr):not(.gh){background:linear-gradient(135deg,#829d8e,#617d6f);box-shadow:0 8px 18px rgba(82,108,95,.2)}
[data-theme="dark"][data-audience="akhwat"]{
  --g1:#9db7a8;--g2:#bdd0c6;--g3:#6e887a;--gl:#283a31;--gl2:#202d27;
  --card:#1d191b;--line:#352d31;--soft:#171416;--bg:#120f11;--ink:#f2ecef;--txt:#e8dfe3;--mut:#bcaeb5;--faint:#867a80;
}
[data-theme="dark"][data-audience="akhwat"] body,[data-theme="dark"][data-audience="akhwat"] .app{background:#120f11}
[data-theme="dark"][data-audience="akhwat"] .journal-head,[data-theme="dark"][data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#34312f,#46383d);color:#f7eff2}

/* ===== Akhwat palette v3: feminine blush + dusty rose, soft not neon ===== */
html[data-audience="akhwat"]{
  --g1:#c78398;--g2:#9f5f74;--g3:#704553;--gl:#f3dfe6;--gl2:#fbf0f4;
  --gold:#c79a6c;--gold2:#a8794f;--goldl:#f8ecdf;
  --ink:#3f3036;--txt:#54444a;--mut:#7d6b72;--faint:#aa969e;
  --card:#fffdfd;--line:#efE1e6;--soft:#fff7fa;--bg:#f9f0f4;
  --rose:#c78398;--rose-deep:#8e5367;--rose-soft:#f6e5eb;
  --success:#749481;--success-deep:#557462;--success-soft:#e5efe9;
}
html[data-audience="akhwat"] body{background:#f7edf1}
html[data-audience="akhwat"] .app{background:#fff7fa;box-shadow:0 0 40px rgba(125,73,93,.1)}
html[data-audience="akhwat"] .hero{background:linear-gradient(145deg,#e7adbf 0%,#cf879f 45%,#ad657f 72%,#754655 100%)}
html[data-audience="akhwat"] .quest-head{background:linear-gradient(145deg,#e5a8bb 0%,#c97e97 54%,#96596e 100%)}
html[data-audience="akhwat"] .journal-head,html[data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#fdebf1,#f3cad8);color:#563542}
html[data-audience="akhwat"] .journal-head p,html[data-audience="akhwat"] .insight-head p{color:#815d6b}
html[data-audience="akhwat"] .journal-head .eyebrow,html[data-audience="akhwat"] .insight-head .eyebrow{color:#a75f78}
html[data-audience="akhwat"] .journal-head-icon{background:rgba(255,253,253,.75);color:#a75f78}
html[data-audience="akhwat"] .nav{background:color-mix(in srgb,#fffdfd 96%,transparent);border-color:#f0dfe5}
html[data-audience="akhwat"] .nav a.active{color:#9f5f74}
html[data-audience="akhwat"] .nav a.active .ic,html[data-audience="akhwat"] .fab{background:linear-gradient(135deg,#d18aa2,#9c5a71);box-shadow:0 6px 14px rgba(156,90,113,.27)}
html[data-audience="akhwat"] .acard{background:linear-gradient(155deg,#dda0b4,#c37992 52%,#8e5367)}
html[data-audience="akhwat"] .splash{background:linear-gradient(160deg,#e4a6ba,#985b70)}
html[data-audience="akhwat"] .setup{background:linear-gradient(180deg,#fff8fa,#faedf2)}
html[data-audience="akhwat"] .setup-kicker{color:#a75f78}
html[data-audience="akhwat"] .setup .btn,html[data-audience="akhwat"] .lg>.btn{background:linear-gradient(135deg,#d28ba3,#9f5f74);box-shadow:0 8px 18px rgba(159,95,116,.24)}
html[data-audience="akhwat"] .steps i.on{background:#c78398}
html[data-audience="akhwat"] .home-insight,html[data-audience="akhwat"] .home-insight.night,html[data-audience="akhwat"] .home-insight.friday{background:linear-gradient(135deg,#fff3f7,#f8e4eb);border-color:#efced9}
html[data-audience="akhwat"] .home-insight small,html[data-audience="akhwat"] .home-insight-icon{color:#9f5f74}
html[data-audience="akhwat"] .audience-choice.akhwat.on{border-color:#c78398;background:#faedf2}
html[data-audience="akhwat"] .audience-choice.akhwat.on>span{background:#f1d8e1;color:#9f5f74}
html[data-audience="akhwat"] .personal-theme-setting button.akhwat.on{background:#faedf2;border-color:#c78398;color:#8e5367}
html[data-audience="akhwat"] .quest-lane.ziyadah{--lane:#bb7189;--lane-soft:#f8e7ed}
html[data-audience="akhwat"] .quest-lane.baca{--lane:#758ea8;--lane-soft:#eaf0f5}
html[data-audience="akhwat"] .quest-lane.murojaah{--lane:#749481;--lane-soft:#e7efe9}
html[data-audience="akhwat"] .quest-type.on.ziyadah{border-color:#bb7189;background:#f8e7ed}
html[data-audience="akhwat"] .quest-type.on.ziyadah .quest-type-icon{background:#bb7189}
html[data-audience="akhwat"] .quest-progress{background:#5a3f49;color:#fff}
html[data-audience="akhwat"] .quest-bar i{background:linear-gradient(90deg,#e3a3b8,#c78398)}
html[data-audience="akhwat"] .btn:not(.gold):not(.gr):not(.gh){background:linear-gradient(135deg,#c78398,#9f5f74);box-shadow:0 8px 18px rgba(159,95,116,.22)}
html[data-audience="akhwat"] .jchip.on,html[data-audience="akhwat"] .mseg button.on{background:linear-gradient(135deg,#c78398,#9f5f74);border-color:transparent;color:#fff}
html[data-audience="akhwat"] .progress-juz.on{border-color:#c78398;background:#fbf0f4}
html[data-audience="akhwat"] .progress-juz.complete:after{color:var(--success)}
/* Semantic success stays muted green */
html[data-audience="akhwat"] .quest-page.complete,html[data-audience="akhwat"] .quest-page.memorized{background:var(--success-soft);border-color:#cfe0d6;color:var(--success-deep)}
html[data-audience="akhwat"] .quest-page.complete small,html[data-audience="akhwat"] .quest-page.memorized small{color:var(--success-deep)}
html[data-audience="akhwat"] .quest-mini.done .quest-mini-status,html[data-audience="akhwat"] .home-quest-done{background:var(--success);color:#fff}
html[data-audience="akhwat"] .home-quest-check{background:var(--success-soft);color:var(--success-deep)}
html[data-audience="akhwat"] .journal-xp.success{background:var(--success-soft);color:var(--success-deep)}
html[data-audience="akhwat"] .stat-icon.success{background:var(--success-soft);color:var(--success-deep)}
html[data-audience="akhwat"] .quest-juz-status.complete{background:var(--success-soft);color:var(--success-deep);border-color:#cfe0d6}
[data-theme="dark"][data-audience="akhwat"]{
  --g1:#d69aad;--g2:#efbdd0;--g3:#9b6075;--gl:#432b35;--gl2:#322229;
  --card:#21181c;--line:#3c2931;--soft:#1a1316;--bg:#140e11;--ink:#faedf2;--txt:#f1e2e8;--mut:#c5aeb7;--faint:#917c84;
  --success:#91ad9c;--success-deep:#bfd2c6;--success-soft:#25372e;
}
[data-theme="dark"][data-audience="akhwat"] body,[data-theme="dark"][data-audience="akhwat"] .app{background:#140e11}
[data-theme="dark"][data-audience="akhwat"] .journal-head,[data-theme="dark"][data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#4c2d39,#693c4d);color:#fff1f6}

/* ===== Akhwat palette v4: brighter uplifting blush, still soft ===== */
html[data-audience="akhwat"]{
  --g1:#d88aa5;--g2:#aa5675;--g3:#774055;--gl:#f8dce7;--gl2:#fff0f5;
  --gold:#dfa861;--gold2:#b77a37;--goldl:#fff0d9;
  --card:#fffefe;--line:#f0dde5;--soft:#fff7fa;--bg:#fceff4;
  --rose:#d88aa5;--rose-deep:#99516a;--rose-soft:#fae4ec;
  --success:#78a68a;--success-deep:#4f7861;--success-soft:#e4f1e9;
}
html[data-audience="akhwat"] body{background:#faedf3}
html[data-audience="akhwat"] .app{background:#fff8fb;box-shadow:0 0 42px rgba(145,72,100,.11)}
html[data-audience="akhwat"] .hero{background:linear-gradient(145deg,#f2b5c8 0%,#df8da8 42%,#c56988 72%,#82475b 100%)}
html[data-audience="akhwat"] .quest-head{background:linear-gradient(145deg,#efadc2 0%,#d87f9d 52%,#a65371 100%)}
html[data-audience="akhwat"] .journal-head,html[data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#fff0f5,#f6cedc);color:#573341}
html[data-audience="akhwat"] .journal-head:before,html[data-audience="akhwat"] .journal-head:after{border-color:rgba(180,78,116,.15)}
html[data-audience="akhwat"] .nav a.active .ic,html[data-audience="akhwat"] .fab{background:linear-gradient(135deg,#df8da8,#a95272);box-shadow:0 7px 16px rgba(169,82,114,.3)}
html[data-audience="akhwat"] .acard{background:linear-gradient(155deg,#e7a6ba,#ce7895 52%,#98526b)}
html[data-audience="akhwat"] .splash{background:linear-gradient(160deg,#efadc2,#a95472)}
html[data-audience="akhwat"] .setup .btn,html[data-audience="akhwat"] .lg>.btn{background:linear-gradient(135deg,#df8da8,#aa5675);box-shadow:0 9px 20px rgba(170,86,117,.26)}
html[data-audience="akhwat"] .home-insight,html[data-audience="akhwat"] .home-insight.night,html[data-audience="akhwat"] .home-insight.friday{background:linear-gradient(135deg,#fff4f8,#f9e3eb);border-color:#f0c9d7}
html[data-audience="akhwat"] .quest-lane.ziyadah{--lane:#c86e8b;--lane-soft:#fbe6ed}
html[data-audience="akhwat"] .quest-lane.baca{--lane:#6f91b0;--lane-soft:#e8f1f7}
html[data-audience="akhwat"] .quest-lane.murojaah{--lane:#70a084;--lane-soft:#e5f2ea}
html[data-audience="akhwat"] .quest-type.on.ziyadah{border-color:#cc7692;background:#fbe6ed}
html[data-audience="akhwat"] .quest-type.on.ziyadah .quest-type-icon{background:#c86e8b}
html[data-audience="akhwat"] .quest-progress{background:#62404e;color:#fff}
html[data-audience="akhwat"] .quest-bar i{background:linear-gradient(90deg,#f0acc1,#dd819f)}
html[data-audience="akhwat"] .btn:not(.gold):not(.gr):not(.gh){background:linear-gradient(135deg,#d88aa5,#aa5675);box-shadow:0 8px 19px rgba(170,86,117,.24)}
html[data-audience="akhwat"] .streak{background:linear-gradient(135deg,#fff5e6,#fffafd);border-color:#f2dfbd}
html[data-audience="akhwat"] .lvl{background:#f3bd67;color:#4d3212;box-shadow:0 4px 11px rgba(223,168,97,.38)}
html[data-audience="akhwat"] .week .c.on i{background:linear-gradient(180deg,#e49ab1,#bf6886)}
html[data-audience="akhwat"] .bar>i{background:linear-gradient(90deg,#f1b35f,#ffd58c)}
html[data-audience="akhwat"] .quest-mini.done .quest-mini-status,html[data-audience="akhwat"] .home-quest-done{background:#78a68a}
html[data-audience="akhwat"] .home-quest-check{background:#e4f1e9;color:#4f7861}

/* ===== Akhwat palette v5: brighter light + comfortable berry dark ===== */
html[data-audience="akhwat"]{
  --g1:#e092ad;--g2:#b55879;--g3:#7c3f56;--gl:#f9dce7;--gl2:#fff0f5;
  --rose:#e092ad;--rose-deep:#9f4d6b;--rose-soft:#fbe3ec;
}
html[data-audience="akhwat"] .hero{background:linear-gradient(145deg,#f5bfd1 0%,#e68fab 42%,#cc698b 72%,#88455c 100%)}
html[data-audience="akhwat"] .quest-head{background:linear-gradient(145deg,#f2b4c8 0%,#df86a4 52%,#aa5271 100%)}
html[data-audience="akhwat"] .nav a.active .ic,html[data-audience="akhwat"] .fab{background:linear-gradient(135deg,#e795b0,#b55879)}
html[data-audience="akhwat"] .acard{background:linear-gradient(155deg,#edafc2,#d37b99 52%,#a0526c)}
html[data-audience="akhwat"] .btn:not(.gold):not(.gr):not(.gh){background:linear-gradient(135deg,#e092ad,#b55879)}

html[data-theme="dark"][data-audience="akhwat"]{
  --g1:#ee9fba;--g2:#f4bad0;--g3:#a65070;
  --gl:#4b2b38;--gl2:#37212a;
  --card:#2a1b22;--line:#50303d;--soft:#21161b;--bg:#160e12;
  --ink:#fff1f6;--txt:#f6e5ec;--mut:#d9bac6;--faint:#a98492;
  --gold:#e8b66c;--gold2:#f1c98e;--goldl:#45331f;
  --success:#8db49c;--success-deep:#c2d8ca;--success-soft:#253a30;
  --sh:0 10px 30px rgba(0,0,0,.38);--sh2:0 4px 14px rgba(0,0,0,.26);
}
html[data-theme="dark"][data-audience="akhwat"] body{background:#110b0e}
html[data-theme="dark"][data-audience="akhwat"] .app{background:#160e12;box-shadow:0 0 42px rgba(0,0,0,.42)}
html[data-theme="dark"][data-audience="akhwat"] .hero{background:linear-gradient(145deg,#9e4d6b 0%,#78384f 48%,#4c2332 100%)}
html[data-theme="dark"][data-audience="akhwat"] .quest-head{background:linear-gradient(145deg,#91435f 0%,#6c3047 55%,#44202e 100%)}
html[data-theme="dark"][data-audience="akhwat"] .journal-head,html[data-theme="dark"][data-audience="akhwat"] .insight-head{background:linear-gradient(145deg,#4b2936,#6e344b);color:#fff1f6}
html[data-theme="dark"][data-audience="akhwat"] .journal-head p,html[data-theme="dark"][data-audience="akhwat"] .insight-head p{color:#e4c4d0}
html[data-theme="dark"][data-audience="akhwat"] .journal-head .eyebrow,html[data-theme="dark"][data-audience="akhwat"] .insight-head .eyebrow{color:#f2a8c1}
html[data-theme="dark"][data-audience="akhwat"] .nav{background:rgba(35,22,28,.96);border-color:#4a2b37}
html[data-theme="dark"][data-audience="akhwat"] .nav a{color:#a98492}
html[data-theme="dark"][data-audience="akhwat"] .nav a.active{color:#f4bad0}
html[data-theme="dark"][data-audience="akhwat"] .nav a.active .ic,html[data-theme="dark"][data-audience="akhwat"] .fab{background:linear-gradient(135deg,#d77e9c,#9f4d6b);color:#fff}
html[data-theme="dark"][data-audience="akhwat"] .card,html[data-theme="dark"][data-audience="akhwat"] .quest-builder,html[data-theme="dark"][data-audience="akhwat"] .journal-calendar,html[data-theme="dark"][data-audience="akhwat"] .daily-quiz,html[data-theme="dark"][data-audience="akhwat"] .virtue-list{background:#2a1b22;border-color:#4a2d39}
html[data-theme="dark"][data-audience="akhwat"] .quest-progress{background:#3d2730;color:#fff1f6}
html[data-theme="dark"][data-audience="akhwat"] .quest-bar{background:#5a3544}
html[data-theme="dark"][data-audience="akhwat"] .quest-bar i{background:linear-gradient(90deg,#f0a6bf,#d57596)}
html[data-theme="dark"][data-audience="akhwat"] .quest-lane{background:#291a21;border-color:#492c37}
html[data-theme="dark"][data-audience="akhwat"] .quest-lane.ziyadah{--lane:#e493ae;--lane-soft:#452734}
html[data-theme="dark"][data-audience="akhwat"] .quest-lane.baca{--lane:#a5c2d7;--lane-soft:#233440}
html[data-theme="dark"][data-audience="akhwat"] .quest-lane.murojaah{--lane:#9fc5ae;--lane-soft:#26382f}
html[data-theme="dark"][data-audience="akhwat"] .home-insight,html[data-theme="dark"][data-audience="akhwat"] .home-insight.night,html[data-theme="dark"][data-audience="akhwat"] .home-insight.friday{background:linear-gradient(135deg,#35212a,#2c1d23);border-color:#50303d;color:#f6e5ec}
html[data-theme="dark"][data-audience="akhwat"] .home-insight p,html[data-theme="dark"][data-audience="akhwat"] .home-insight em{color:#d4b5c1}
html[data-theme="dark"][data-audience="akhwat"] .inp,html[data-theme="dark"][data-audience="akhwat"] select{background:#24171d;border-color:#4a2d39;color:#f6e5ec}
html[data-theme="dark"][data-audience="akhwat"] .btn.gr{background:#302027;border-color:#4c2e3a;color:#f0dfe6}
html[data-theme="dark"][data-audience="akhwat"] .quest-page.picked{background:#4a2b38;border-color:#df86a4}
html[data-theme="dark"][data-audience="akhwat"] .journal-entry.failed{background:#392024}
html[data-theme="dark"][data-audience="akhwat"] .acard{background:linear-gradient(155deg,#8e425e,#672f46 55%,#44202e)}