*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
  :root{--bg:#FAF7F2;--card:#FFFFFF;--border:#EAE5DC;--text:#2D3A3A;--text-soft:#6B6B6B;
    --text-mute:#9B9B9B;--green:#6BAA75;--green-bg:#E8F3EA;--gold:#C29A4D;--gold-bg:#FFF3E0;
    --red:#C77;--red-bg:#FBEAEA;
    --shadow-card:0 1px 2px rgba(45,58,58,.04),0 8px 22px rgba(45,58,58,.055);
    --shadow-lift:0 2px 6px rgba(45,58,58,.06),0 14px 30px rgba(45,58,58,.08);}
  [data-theme="dark"]{--bg:#171C1A;--card:#212824;--border:#33403A;--text:#E8EFEA;--text-soft:#ABB8B0;
    --text-mute:#7A877F;--green:#7FBF8B;--green-bg:#1F2E25;--gold:#D9B36A;--gold-bg:#2E2718;
    --red:#D98;--red-bg:#332122;
    --shadow-card:0 1px 2px rgba(0,0,0,.28),0 8px 22px rgba(0,0,0,.24);
    --shadow-lift:0 2px 6px rgba(0,0,0,.32),0 14px 30px rgba(0,0,0,.28);}
  [data-theme="dark"] .progress-bar{background:#2C3530;}
  [data-theme="dark"] .tool-card{border-color:var(--border);}
  [data-theme="dark"] .wiz-logo,[data-theme="dark"] .dash-logo{filter:brightness(1.05);}
  body{font-family:'Tajawal','Segoe UI',Tahoma,Arial,sans-serif;background:var(--bg);color:var(--text);
    line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh;font-size:15px;padding-bottom:40px;}
  #app{max-width:640px;margin:0 auto;padding:16px;}

  .header{position:relative;text-align:center;margin-bottom:18px;padding:24px 18px 22px;
    background:linear-gradient(160deg,#FFFFFF 0%,#F7F3EC 100%);border-radius:20px;
    box-shadow:0 4px 16px rgba(123,168,143,0.10);border:1px solid #EFEAE0;}
  .header-date{font-size:13px;color:var(--text-soft);margin-bottom:6px;}
  .header-day{font-size:24px;font-weight:800;letter-spacing:-.3px;}
  .header-sub{font-size:12px;color:var(--green);margin-top:6px;font-weight:500;}
  .dash-logo{width:54px;height:54px;object-fit:contain;margin-bottom:8px;}
  .gear{position:absolute;top:16px;left:16px;background:rgba(255,255,255,0.7);border:1px solid var(--border);
    width:38px;height:38px;border-radius:12px;font-size:18px;cursor:pointer;color:var(--text-soft);}

  /* Wizard */
  .wiz-head{position:relative;text-align:center;margin-bottom:16px;padding:24px 20px;
    background:linear-gradient(160deg,#FFFFFF 0%,#F5F8F3 100%);border-radius:20px;
    box-shadow:0 4px 16px rgba(123,168,143,0.10);border:1px solid #EFEAE0;}
  .wiz-logo{width:80px;height:80px;object-fit:contain;margin-bottom:6px;}
  .wiz-cancel{position:absolute;top:14px;left:14px;background:rgba(255,255,255,0.8);border:1px solid var(--border);
    padding:7px 12px;border-radius:10px;font-family:inherit;font-size:12px;font-weight:500;
    color:var(--text-soft);cursor:pointer;}
  .wiz-title{font-size:22px;font-weight:700;letter-spacing:-0.3px;}
  .wiz-sub{font-size:13px;color:var(--text-soft);margin-top:6px;}
  .steps{display:flex;gap:6px;justify-content:center;margin-top:16px;}
  .step-dot{width:8px;height:8px;border-radius:50%;background:var(--border);transition:all .3s;}
  .step-dot.active{background:var(--green);width:24px;border-radius:4px;}

  .donate-link{display:block;text-align:center;margin:18px auto 0;padding:11px;
    color:var(--gold);font-size:13px;font-weight:700;text-decoration:none;
    border:1px solid #EDDFC2;border-radius:14px;background:var(--gold-bg);
    box-shadow:0 1px 3px rgba(194,154,77,.10);}
  .donate-link svg{vertical-align:middle;margin-left:5px;}
  .import-link{display:block;text-align:center;margin:18px auto 0;padding:11px;cursor:pointer;
    color:var(--text-soft);font-size:13px;font-weight:500;border:1px solid var(--border);
    border-radius:12px;background:var(--card);}
  .top-bar{display:flex;align-items:center;gap:12px;margin-bottom:14px;padding:14px 16px;
    background:var(--card);border-radius:16px;box-shadow:var(--shadow-card);}
  .back-btn{background:var(--bg);border:none;width:38px;height:38px;border-radius:10px;
    font-size:18px;cursor:pointer;color:var(--text-soft);}
  .top-title{font-size:17px;font-weight:700;}
  .trk-row{display:flex;align-items:center;gap:10px;padding:11px;background:var(--bg);
    border-radius:10px;margin-bottom:8px;}
  .trk-info{flex:1;min-width:0;}
  .trk-label{font-weight:700;font-size:14px;}
  .trk-type{font-size:11px;color:var(--green);background:var(--green-bg);padding:1px 7px;border-radius:6px;font-weight:500;}
  .trk-meta{font-size:11px;color:var(--text-mute);margin-top:2px;}
  .trk-actions{display:flex;gap:6px;}
  .mini-btn{width:34px;height:34px;border-radius:9px;border:none;cursor:pointer;font-size:14px;background:var(--card);}
  .mini-btn.del{background:var(--red-bg);color:var(--red);}
  .lead-row{display:flex;align-items:center;gap:12px;padding:11px;background:var(--bg);border-radius:10px;margin-bottom:8px;}
  .lead-row.me{background:var(--green-bg);}
  .lead-rank{font-size:18px;font-weight:700;min-width:28px;text-align:center;color:var(--text-soft);}
  .lead-info{flex:1;min-width:0;}
  .lead-name{font-weight:700;font-size:14px;}
  .lead-meta{font-size:11px;color:var(--text-mute);margin-top:2px;}
  .lead-row.col{flex-direction:column;align-items:stretch;gap:6px;}
  .lead-top{display:flex;align-items:center;gap:10px;}
  .lead-top .lead-name{flex:1;}
  .prog-chips{display:flex;flex-wrap:wrap;gap:5px;padding-right:34px;}
  .prog-chip{font-size:11px;background:var(--bg);border:1px solid var(--border);border-radius:7px;
    padding:2px 7px;color:var(--text-soft);white-space:nowrap;}
  .prog-chip .pc-name{color:var(--text-mute);}
  .com-badge{font-size:10px;background:var(--green-bg);color:var(--green);border-radius:6px;padding:1px 6px;font-weight:700;}
  .lib-back{color:var(--green);font-weight:700;font-size:14px;cursor:pointer;padding:6px 2px;margin-bottom:6px;}
  .quran-feature{border:1.5px solid var(--green)!important;background:var(--green-bg);}
  .progress-est{font-size:11px;color:var(--text-mute);margin-top:3px;}
  .cap-warn{background:#FBEEDF;border:1px solid #E0A878;border-radius:12px;padding:12px 14px;margin-top:12px;display:flex;gap:10px;align-items:flex-start;}
  .cap-warn-txt{flex:1;font-size:13px;color:#9A5B2E;line-height:1.5;}
  .cap-warn-x{background:transparent;border:1px solid #C99A6A;color:#9A5B2E;border-radius:8px;padding:5px 10px;font-size:12px;font-family:inherit;cursor:pointer;white-space:nowrap;}
  .ach-item{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#FBF6E9,#F3EAD3);
    border:1px solid #E6D5A8;border-radius:12px;padding:12px 14px;margin-bottom:8px;}
  .ach-medal{font-size:24px;}
  .ach-name{font-weight:700;color:#4E8159;}
  .ach-date{font-size:12px;color:var(--text-mute);margin-top:2px;}
  .unread-badge{background:#C0392B;color:#fff;border-radius:20px;padding:1px 8px;font-size:12px;margin-right:4px;}
  .unread-banner{background:#C0392B;color:#fff;border-radius:12px;padding:12px 14px;margin-bottom:12px;
    font-weight:700;text-align:center;cursor:pointer;font-size:14px;transition:transform .08s;}
  .unread-banner:active{transform:scale(.98);}
  .activate-card{background:var(--gold-bg);border:none;border-right:4px solid var(--gold);border-radius:14px;box-shadow:var(--shadow-card);padding:12px 14px;margin-bottom:12px;cursor:pointer;transition:transform .08s;}
  .activate-card:active{transform:scale(.98);}
  .rib-box{background:var(--card);border:1.5px dashed var(--green);border-radius:10px;padding:10px;cursor:pointer;transition:transform .08s;}
  .rib-box:active{transform:scale(.98);}
  .trk-streak{font-size:12px;color:var(--gold);font-weight:700;background:var(--gold-bg);padding:2px 9px;border-radius:20px;margin-right:4px;}
  .trk-badge{font-size:11px;color:var(--green);font-weight:700;background:var(--green-bg);padding:2px 9px;border-radius:20px;margin-right:4px;}
  .motiv-line{font-size:12px;color:var(--gold);background:var(--gold-bg);border-radius:8px;padding:6px 9px;margin-top:6px;line-height:1.5;}
  .lag-banner{background:var(--gold-bg);border:none;border-right:4px solid var(--gold);box-shadow:var(--shadow-card);color:var(--text);border-radius:12px;padding:11px 13px;margin-bottom:12px;font-size:13px;line-height:1.6;}
  /* صندوق شرح الحلقات */
  .halqa-intro{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:14px;}
  .halqa-intro-head{font-weight:800;font-size:15px;color:var(--text);margin-bottom:6px;}
  .halqa-intro-p{font-size:13px;color:var(--text-soft);line-height:1.7;margin:0 0 12px;}
  .halqa-type{display:flex;gap:11px;align-items:flex-start;padding:10px 0;border-top:1px dashed var(--border);}
  .halqa-type-icon{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .halqa-type-name{font-weight:800;font-size:14px;margin-bottom:3px;}
  .halqa-type-d{font-size:12.5px;color:var(--text-soft);line-height:1.7;}
  /* المظهر: أيقونات الوضع */
  .mode-row{display:flex;gap:10px;}
  .mode-ic{width:52px;height:46px;border:1.5px solid var(--border);border-radius:12px;display:flex;
    align-items:center;justify-content:center;font-size:22px;cursor:pointer;background:var(--card);transition:transform .08s;}
  .mode-ic:active{transform:scale(.94);}
  .mode-ic.on{border-color:var(--green);background:var(--green-bg);box-shadow:0 0 0 2px var(--green) inset;}
  /* المظهر: دوائر الألوان */
  .accent-row{display:flex;gap:12px;flex-wrap:wrap;}
  .accent-dot{width:34px;height:34px;border-radius:50%;cursor:pointer;border:2px solid transparent;
    box-shadow:0 1px 4px rgba(0,0,0,.15);transition:transform .1s;}
  .accent-dot:active{transform:scale(.9);}
  .accent-dot.on{border-color:var(--text);transform:scale(1.12);box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--text);}
  /* إنجازاتي وإحصاءاتي */
  .stat-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px;}
  .stat-box{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:12px 6px;text-align:center;}
  .stat-box .stat-value{font-size:21px;font-weight:800;color:var(--green);font-variant-numeric:tabular-nums;}
  .stat-box .stat-label{font-size:11px;color:var(--text-mute);margin-top:3px;}
  .ach-badge{display:flex;align-items:center;gap:10px;background:var(--green-bg);border:1px solid var(--green);border-radius:11px;padding:9px 11px;margin-bottom:8px;}
  .ach-badge-n{font-weight:800;font-size:13px;color:var(--green);}
  .ach-badge-s{font-size:11px;color:var(--text-soft);}
  .ach-row{display:flex;justify-content:space-between;align-items:center;background:var(--gold-bg);border-radius:9px;padding:9px 11px;margin-bottom:7px;font-size:13px;font-weight:600;}
  .ach-row .ach-date{font-size:11px;color:var(--text-mute);font-weight:400;}
  /* التقرير الشهريّ */
  .rep-chart{display:flex;align-items:flex-end;gap:2px;height:120px;padding:8px;background:var(--bg);border-radius:10px;}
  .rep-bar{flex:1;min-height:3px;border-radius:2px 2px 0 0;transition:height .3s;}
  /* شيت الاختيار */
  #sheet-wrap{position:fixed;inset:0;z-index:9997;display:flex;align-items:flex-end;justify-content:center;}
  .sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.4);}
  .sheet{position:relative;background:var(--card);border-radius:18px 18px 0 0;padding:18px;width:100%;max-width:560px;max-height:70vh;overflow:auto;animation:sheetUp .25s ease;}
  .sheet-title{font-weight:800;font-size:15px;margin-bottom:10px;color:var(--text);}
  @keyframes sheetUp{from{transform:translateY(40px);opacity:0;}to{transform:translateY(0);opacity:1;}}
  /* بطاقة برنامج الحلقة */
  .prog-card{background:var(--green-bg);border:1.5px solid var(--green);border-radius:14px;padding:14px;margin-bottom:14px;}
  .prog-card-title{font-weight:800;font-size:15px;color:var(--green);margin-bottom:4px;}
  .prog-card-sub{font-size:12px;color:var(--text-soft);line-height:1.6;margin-bottom:10px;}
  .prog-card-row{padding:8px 0;border-top:1px dashed var(--green);}
  .prog-card-h{font-weight:700;font-size:13.5px;color:var(--text);}
  .prog-card-d{font-size:12.5px;color:var(--text-soft);line-height:1.7;margin-top:2px;}
  .prog-card-legend{margin-top:10px;padding-top:9px;border-top:1px dashed var(--green);font-size:12px;color:var(--text-soft);line-height:1.8;}
  /* شاشة الافتتاح */
  #splash{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:14px;transition:opacity .45s ease;}
  #splash img{width:96px;height:96px;border-radius:22px;animation:splashIn .6s ease;}
  #splash .splash-name{font-size:18px;font-weight:800;color:var(--green);animation:splashIn .8s ease;}
  #splash.hide{opacity:0;pointer-events:none;}
  @keyframes splashIn{from{opacity:0;transform:scale(.86);}to{opacity:1;transform:scale(1);}}
  /* Toast (تنبيهات أنيقة) */
  #toast-wrap{position:fixed;bottom:24px;left:0;right:0;z-index:9998;display:flex;flex-direction:column;
    align-items:center;gap:8px;pointer-events:none;padding:0 16px;}
  .toast{background:var(--card);color:var(--text);border:1.5px solid var(--green);border-radius:14px;
    padding:12px 18px;font-size:14px;line-height:1.6;box-shadow:0 6px 24px rgba(0,0,0,.16);max-width:560px;
    text-align:center;animation:toastIn .3s ease;}
  .toast.gold{border-color:var(--gold);background:var(--gold-bg);}
  .toast.out{opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s;}
  @keyframes toastIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
  /* حركة إتمام المهمّة */
  .task-item.just-done{animation:donePulse .5s ease;}
  .task-item.just-done .checkbox{animation:checkPop .45s ease;}
  @keyframes donePulse{0%{background:var(--green-bg);}50%{background:var(--green-bg);transform:scale(1.015);}100%{transform:scale(1);}}
  @keyframes checkPop{0%{transform:scale(.6);}55%{transform:scale(1.25);}100%{transform:scale(1);}}
  /* شريط تقدّم متدرّج: أخضر، ويتذهّب قرب الختم */
  .progress-fill{background:linear-gradient(90deg,var(--green),#8FBF7F)!important;}
  .progress-fill.near-done{background:linear-gradient(90deg,var(--green),var(--gold))!important;}
  .msg-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;margin-bottom:10px;}
  .msg-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap;}
  .msg-kind{font-size:13px;background:var(--green-bg);color:#4E8159;padding:2px 9px;border-radius:20px;font-weight:700;}
  .msg-title{font-weight:700;color:var(--text);flex:1;}
  .msg-body{color:var(--text-soft);line-height:1.7;white-space:pre-wrap;}
  .msg-date{font-size:11px;color:var(--text-mute);margin-top:8px;}
  .tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;}
  .tool-card{background:var(--card);border:1px solid transparent;border-radius:18px;padding:16px 14px;
    box-shadow:var(--shadow-card);
    display:flex;flex-direction:column;gap:8px;cursor:pointer;transition:transform .08s, box-shadow .15s;min-height:96px;}
  .tool-card:active{transform:scale(.97);}
  .tool-icon{font-size:26px;line-height:1;display:flex;align-items:center;height:30px;}
  .tool-title{font-weight:700;color:var(--text);font-size:15px;}
  .tool-sub{font-size:12px;color:var(--text-mute);margin-top:2px;}
  .commit-row{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap;}
  .commit-stat{flex:1;min-width:90px;background:var(--bg);border-radius:14px;padding:14px 8px;text-align:center;
    display:flex;flex-direction:column;justify-content:center;}
  .commit-week{flex:2;min-width:180px;background:var(--bg);border-radius:14px;padding:12px 8px;
    display:flex;justify-content:space-around;align-items:center;}
  .wk-day{display:flex;flex-direction:column;align-items:center;gap:5px;}
  .wk-letter{font-size:12px;color:var(--text-mute);}
  .wk-dot{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--border);display:flex;
    align-items:center;justify-content:center;font-size:13px;color:#fff;}
  .wk-dot.on{background:var(--green);border-color:var(--green);}
  .wk-dot.future{opacity:.4;}
  .signout-icon{display:flex;flex-direction:column;align-items:center;gap:4px;margin:16px auto 0;
    background:transparent;border:none;color:var(--text-mute);cursor:pointer;transition:transform .08s;padding:6px;}
  .signout-icon svg{width:26px;height:26px;}
  .signout-icon span{font-size:12px;}
  .signout-icon:active{transform:scale(.92);}
  .catchup-btn{display:block;width:100%;margin-top:6px;padding:9px;border:1px dashed var(--gold);
    background:var(--gold-bg);color:#8A6A2E;border-radius:10px;font-family:inherit;font-size:13px;cursor:pointer;}
  .catchup-btn:active{transform:scale(.98);}
  .tabs-scroll{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;}
  .tabs-scroll .toggle{white-space:nowrap;flex:0 0 auto;}
  .admin-tools{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px;padding-right:34px;}
  .admin-tools .mini-btn{width:auto;height:auto;padding:7px 14px;font-size:12px;white-space:nowrap;}
  .lead-streak{font-size:14px;font-weight:700;color:var(--gold);}
  .invite-box{background:var(--bg);border:1.5px dashed var(--green);border-radius:12px;padding:14px;
    text-align:center;font-size:22px;font-weight:700;letter-spacing:3px;color:var(--green);margin-bottom:10px;}
  .btn-join{background:var(--green);color:#fff;border:none;border-radius:9px;padding:8px 16px;
    font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;}
  .btn-done{background:var(--green-bg);color:var(--green);border:1.5px solid var(--green);border-radius:9px;
    padding:7px 14px;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;}
  .trk-label,.lead-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}
  .task-title{overflow:hidden;text-overflow:ellipsis;}
  .day-chips{display:flex;flex-wrap:wrap;gap:6px;}
  .day-chip{padding:7px 12px;border-radius:9px;border:1.5px solid var(--border);background:var(--bg);
    font-size:13px;font-weight:500;cursor:pointer;color:var(--text-soft);}
  .day-chip.on{background:var(--green);color:#fff;border-color:var(--green);}
  .adv-toggle{background:none;border:none;color:var(--green);font-family:inherit;font-size:13px;
    font-weight:700;cursor:pointer;padding:6px 0;margin-top:4px;}
  .adv-box{background:var(--bg);border-radius:10px;padding:12px;margin-top:6px;}
  .day-pick{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
  .day-chip{padding:7px 10px;border-radius:9px;border:1.5px solid var(--border);background:var(--card);
    font-size:12px;font-weight:500;cursor:pointer;color:var(--text-soft);}
  .day-chip.on{background:var(--green);color:#fff;border-color:var(--green);}
  .subject-card.off{opacity:0.6;}
  .trk-group{margin-top:4px;}
  .trk-group+.trk-group{margin-top:10px;padding-top:8px;border-top:1px dashed var(--border);}
  .trk-group-t{font-size:12px;font-weight:800;color:var(--text-soft);letter-spacing:.2px;margin:2px 2px 4px;}
  .join-choice{background:var(--green-bg);border:1.5px solid var(--green);border-radius:12px;padding:14px;margin:0 0 8px;}
  .jc-title{font-size:13px;font-weight:700;margin-bottom:10px;}
  .cat-box{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:10px;margin-bottom:8px;}
  .cat-head{display:flex;gap:8px;align-items:center;margin-bottom:8px;}
  .cat-head input{flex:1;}
  .cat-rank-title{font-size:12px;font-weight:700;color:var(--text-soft);margin-bottom:4px;}
  .pub-toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-soft);margin:4px 0 12px;cursor:pointer;}
  .pub-toggle input{width:18px;height:18px;}
  .info-links{text-align:center;margin:16px 0 0;font-size:13px;color:var(--text-soft);}
  .matn-btn{margin-top:7px;background:var(--green-bg);color:var(--green);border:none;border-radius:8px;
    padding:6px 12px;font-family:inherit;font-size:12.5px;font-weight:700;cursor:pointer;}
  .matn-btn:active{filter:brightness(.95);}
  /* شاشة نصّ المتن: البيت مقروءًا، وسترُه للاختبار الذاتيّ */
  .matn-head{font-weight:700;color:var(--accent);margin:14px 0 6px;padding-bottom:5px;
  border-bottom:1px solid var(--border);font-size:.95rem;line-height:1.7;}
.matn-row:first-child .matn-head,.matn-head:first-child{margin-top:0;}
.matn-row{display:flex;gap:10px;align-items:flex-start;padding:12px 4px;border-bottom:1px solid var(--border);cursor:pointer;}
  .matn-row:last-child{border-bottom:none;}
  .matn-row:active{background:var(--green-bg);border-radius:8px;}
  .matn-num{flex:0 0 auto;min-width:26px;height:26px;border-radius:50%;background:var(--green-bg);color:var(--green);
    font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:2px;}
  .matn-line{flex:1;min-width:0;font-size:17px;line-height:2.1;font-weight:500;}
  .matn-row.hidden .matn-line{background:var(--border);border-radius:8px;min-height:38px;
    display:flex;align-items:center;justify-content:center;}
  .matn-veil{font-size:13px;color:var(--text-mute);font-weight:500;}
  /* أسطر التعريف في شاشة الدخول: أيقونة ثابتة العرض ونصّ يلتفّ بحرّية */
  .pitch-row{display:flex;align-items:flex-start;gap:8px;margin-bottom:7px;}
  .pitch-row svg{flex:0 0 auto;margin-top:3px;}
  .pitch-row span{flex:1;min-width:0;}
  .info-links span{cursor:pointer;text-decoration:underline;padding:0 2px;}
  .info-h{font-size:20px;font-weight:800;margin-bottom:10px;color:var(--green);}
  .info-sub{font-size:14px;font-weight:700;margin:14px 0 4px;}
  .info-p{font-size:14px;line-height:1.8;color:var(--text-soft);margin:0;}

  .section{background:var(--card);border-radius:18px;padding:18px;margin-bottom:14px;
    box-shadow:var(--shadow-card);}
  .section-title{font-size:16px;font-weight:800;margin-bottom:15px;letter-spacing:-.2px;}

  .lib-item{display:flex;align-items:center;gap:12px;padding:13px;border-radius:12px;margin-bottom:8px;
    border:2px solid var(--border);cursor:pointer;transition:all .15s;}
  .lib-item.selected{border-color:var(--green);background:var(--green-bg);}
  .lib-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
  .lib-info{flex:1;min-width:0;}
  .lib-name{font-weight:700;font-size:15px;}
  .lib-meta{font-size:11px;color:var(--text-mute);margin-top:2px;}
  .lib-check{width:24px;height:24px;border:2px solid var(--border);border-radius:6px;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;}
  .lib-item.selected .lib-check{background:var(--green);border-color:var(--green);}
  .lib-item.selected .lib-check::after{content:'✓';color:white;font-size:15px;font-weight:bold;}

  .cfg-text{background:var(--bg);border-radius:12px;padding:14px;margin-bottom:10px;
    border-right:4px solid var(--c,var(--text-soft));}
  .cfg-name svg,.section-title svg,.result-name svg,.ring-name svg,.trk-label svg,.top-title svg{vertical-align:middle;margin-left:2px;}
  .cfg-name{font-weight:700;margin-bottom:10px;}
  .field{margin-bottom:12px;}
  .field:last-child{margin-bottom:0;}
  .field-label{font-size:13px;color:var(--text-soft);margin-bottom:6px;display:block;}
  .field input{width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:10px;
    font-family:inherit;font-size:15px;background:var(--card);color:var(--text);}
  .field input:focus{outline:none;border-color:var(--green);}
  .toggles{display:flex;gap:8px;}
  .toggle{flex:1;padding:10px;border:2px solid var(--border);border-radius:10px;text-align:center;
    font-size:14px;font-weight:500;cursor:pointer;color:var(--text-soft);}
  .toggle.on{border-color:var(--green);background:var(--green-bg);color:var(--green);}

  .cap-row{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
  .cap-unit{font-weight:700;min-width:55px;}
  .cap-inputs{display:flex;gap:8px;flex:1;}
  .cap-inputs .field{flex:1;margin:0;}

  .result-text{background:var(--bg);border-radius:12px;padding:14px;margin-bottom:10px;
    border-right:4px solid var(--c,var(--text-soft));}
  .result-name{font-weight:700;font-size:15px;margin-bottom:8px;}
  .result-line{font-size:13px;color:var(--text-soft);margin-bottom:4px;}
  .result-line b{color:var(--text);}
  .result-line.warn{color:#A05;}

  .cap-bar-wrap{margin-bottom:12px;}
  .cap-bar-label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:4px;}
  .cap-bar{height:10px;background:#F0EBE0;border-radius:99px;overflow:hidden;}
  .cap-bar-fill{height:100%;border-radius:99px;transition:width .5s ease;}

  .alert{padding:13px 16px;border-radius:12px;margin-bottom:12px;font-size:13px;}
  .alert-warn{background:var(--gold-bg);color:#7A5C2C;border-right:3px solid var(--gold);}
  .alert-ok{background:var(--green-bg);color:#3C6B45;border-right:3px solid var(--green);}

  .btn{display:block;width:100%;padding:14px;border:none;border-radius:12px;font-family:inherit;
    font-size:15px;font-weight:700;cursor:pointer;margin-top:10px;transition:transform .08s ease, filter .08s ease, opacity .08s ease;}
  .btn:active{transform:scale(0.97);filter:brightness(0.92);}
  .btn-primary{background:var(--green);color:white;box-shadow:0 3px 10px color-mix(in srgb,var(--green) 28%,transparent);}
  .btn-secondary{background:var(--card);color:var(--text-soft);border:1px solid var(--border);}
  .btn-ghost{background:transparent;color:var(--text-mute);border:none;font-weight:500;font-size:13px;padding:10px;}
  .btn-row{display:flex;gap:10px;}
  .btn-row .btn{margin-top:0;}
  .btn-join:active,.btn-done:active,.mini-btn:active,.reset-btn:active,.lib-item:active,
  .tab:active,.toggle:active,.day-chip:active,.day-opt:active,.subject-card:active,
  .back-btn:active,.task-check:active,.info-links span:active,.link-btn:active{
    transform:scale(0.96);filter:brightness(0.93);}
  .btn-join,.btn-done,.mini-btn,.reset-btn,.lib-item,.tab,.toggle,.day-chip,.day-opt,
  .subject-card,.back-btn,.task-check,.link-btn{transition:transform .08s ease, filter .08s ease;}

  /* Dashboard */
  .mode-toggle{display:flex;background:var(--card);border-radius:14px;padding:5px;margin-bottom:16px;
    box-shadow:var(--shadow-card);}
  .mode-btn{flex:1;padding:12px;border:none;background:transparent;border-radius:10px;font-family:inherit;
    font-size:14px;font-weight:500;color:var(--text-soft);cursor:pointer;}
  .mode-btn.active{background:var(--green);color:white;}
  .subject-card{background:var(--card);border-radius:18px;padding:16px;margin-bottom:12px;
    box-shadow:var(--shadow-card);border-right:4px solid var(--card-color,var(--text-soft));}
  .subject-header{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
  .subject-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
  .subject-name{font-size:16px;font-weight:700;flex:1;}
  .task-item{display:flex;align-items:flex-start;gap:12px;padding:12px;border-radius:12px;
    margin-bottom:6px;cursor:pointer;}
  .task-item:active{background:var(--bg);}
  .task-item.done{background:var(--green-bg);}
  .task-item.done .task-text{text-decoration:line-through;opacity:.6;}
  .checkbox{width:26px;height:26px;min-width:26px;border:2px solid var(--border);border-radius:8px;
    display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;}
  .task-item.done .checkbox{background:var(--green);border-color:var(--green);}
  .checkbox::after{content:'';width:8px;height:12px;border:solid white;border-width:0 2px 2px 0;
    transform:rotate(45deg) translate(-1px,-2px);opacity:0;}
  .task-item.done .checkbox::after{opacity:1;}
  .task-content{flex:1;min-width:0;}
  .task-label{font-size:12px;color:var(--text-mute);}
  .task-text{font-size:15px;font-weight:500;}
  .progress-item{margin-bottom:13px;}
  .progress-item:last-child{margin-bottom:0;}
  .progress-label{display:flex;justify-content:space-between;font-size:12px;color:var(--text-soft);margin-bottom:4px;}
  .progress-label .value{color:var(--text);font-weight:500;}
  .progress-bar{height:9px;background:#F0EBE0;border-radius:99px;overflow:hidden;}
  .progress-fill{height:100%;border-radius:99px;transition:width .5s ease;}
  .stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
  .stat-item{background:var(--bg);padding:14px 12px;border-radius:12px;text-align:center;}
  .stat-value{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.3px;}
  .stat-label{font-size:11px;color:var(--text-soft);margin-top:3px;}
  .reset-btn{display:block;margin:20px auto 0;padding:9px 18px;background:transparent;
    border:1px solid var(--border);color:var(--text-mute);border-radius:8px;font-family:inherit;
    font-size:12px;cursor:pointer;}
  .hint{font-size:12px;color:var(--text-mute);margin-top:8px;line-height:1.6;}
  .btn-add{background:var(--card);color:var(--green);border:1.5px dashed var(--green);font-weight:500;}
  .btn-google{background:#fff;color:#3c4043;border:1.5px solid var(--border);}
  .or-sep{text-align:center;color:var(--text-mute);font-size:12px;margin:14px 0;position:relative;}
  .link-btn{display:block;width:100%;background:none;border:none;color:var(--green);font-family:inherit;
    font-size:13px;font-weight:500;cursor:pointer;margin-top:10px;text-decoration:underline;}
  .del-custom{background:var(--red-bg);border:none;color:var(--red);width:26px;height:26px;border-radius:7px;
    font-size:16px;cursor:pointer;flex-shrink:0;line-height:1;}
  .free-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--gold-bg);
    color:#7A5C2C;padding:12px 16px;border-radius:12px;margin-bottom:14px;border-right:3px solid var(--gold);
    font-size:13px;font-weight:500;}
  .act-btn{background:var(--gold);color:white;border:none;padding:8px 14px;border-radius:9px;
    font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
  .day-opts{display:flex;gap:8px;flex-wrap:wrap;}
  .day-opt{flex:1;min-width:48px;padding:12px 8px;border:2px solid var(--border);border-radius:10px;
    text-align:center;font-size:15px;font-weight:700;cursor:pointer;color:var(--text-soft);}
  .day-opt.on{border-color:var(--green);background:var(--green-bg);color:var(--green);}

  /* بطاقات التسعير */
  .plan{border:1.5px solid var(--border);border-radius:14px;padding:14px;margin-bottom:10px;position:relative;}
  .plan-year{border-color:var(--green);}
  .plan-founder{border-color:var(--gold);background:var(--gold-bg);}
  .plan-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;}
  .plan-name{font-weight:700;font-size:16px;}
  .plan-price{font-weight:700;font-size:16px;color:var(--green);}
  .plan-founder .plan-price{color:var(--gold);}
  .plan-feat{font-size:13px;color:var(--text-soft);line-height:1.6;}
  .badge{position:absolute;top:-10px;right:14px;background:var(--gold);color:white;font-size:11px;
    font-weight:700;padding:3px 10px;border-radius:8px;}

  /* تبويبات الفنون */
  .tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:12px;-webkit-overflow-scrolling:touch;}
  .tab{white-space:nowrap;padding:8px 14px;border:1.5px solid var(--border);border-radius:20px;
    font-size:13px;font-weight:500;color:var(--text-soft);cursor:pointer;background:var(--card);flex-shrink:0;}
  .tab.on{background:var(--green);color:white;border-color:var(--green);}
  .search-box{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:12px;
    font-family:inherit;font-size:15px;background:var(--card);margin-bottom:12px;}
  .search-box:focus{outline:none;border-color:var(--green);}

  /* دائرة تقدّم */
  .ring-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
  .ring-card{background:var(--bg);border-radius:14px;padding:14px;text-align:center;min-width:0;overflow:hidden;}
  .ring{position:relative;width:84px;height:84px;margin:0 auto 8px;}
  .ring svg{transform:rotate(-90deg);}
  .ring-val{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;
    justify-content:center;font-size:17px;font-weight:700;}
  .ring-name{font-size:12px;font-weight:700;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
  .ring-sub{font-size:10px;color:var(--text-mute);margin-top:2px;}
  .ring-est{font-size:11px;color:var(--green);font-weight:700;margin-top:4px;}
  .summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:4px;}
  .sum-item{background:var(--bg);border-radius:12px;padding:12px 8px;text-align:center;}
  .sum-val{font-size:23px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.3px;}
  .sum-label{font-size:10px;color:var(--text-soft);margin-top:2px;}
  @media (min-width:600px){#app{padding:28px 16px;}}

/* ═══ نصّ القرآن: عرضٌ متّصلٌ كالمصحف ═══
   الحفظ يقوم على وصل الآية بما بعدها، فلا يُقطَّع النصّ سطرًا لكلّ آية.
   والسترُ يُبقي مواضع الكلمات كما هي (لونٌ شفّافٌ وخطٌّ تحته)، فلا ينزاح
   النصّ عند الكشف، ويستظهر الطالبُ من البياض كما يستظهر من ورقةٍ مسطَّرة. */
.q-flow{font-size:1.45rem;line-height:2.9;text-align:justify;text-align-last:center;
  padding:6px 2px 10px;letter-spacing:0;word-spacing:.06em;}
.q-sura{display:block;text-align:center;font-weight:700;font-size:1.05rem;color:var(--green);
  background:var(--green-bg);border:1px solid var(--border);border-radius:12px;
  padding:8px 12px;margin:14px 0 12px;line-height:1.8;}
.q-aya{cursor:pointer;border-radius:6px;transition:background .15s;}
.q-aya:hover{background:var(--green-bg);}
.q-num{display:inline-block;font-size:.72em;color:var(--green);font-weight:700;
  border:1.5px solid var(--green);border-radius:50%;min-width:1.9em;height:1.9em;
  line-height:1.75em;text-align:center;margin:0 .3em;vertical-align:.15em;
  font-family:system-ui,sans-serif;}
/* الكلمة المستورة: موضعها محفوظٌ وخطٌّ تحتها */
.q-veil{color:transparent;border-bottom:1.5px solid var(--border);
  -webkit-user-select:none;user-select:none;}
.q-aya.hid .q-num{opacity:.85;}
@media (max-width:380px){ .q-flow{font-size:1.3rem;line-height:2.7;} }
.q-basmala{display:block;text-align:center;font-size:1.3rem;line-height:2.4;margin:0 0 8px;}

/* التصحيح: كلمةٌ لم يُطابقها المسموع. باللون الذهبيّ لا الأحمر — فنحن
   نُشير إلى موضع الخلاف ولا نجزم بأنّ الخطأ من الطالب. */
.rec-miss{color:var(--gold);background:var(--gold-bg);border-radius:5px;
  padding:0 3px;box-shadow:inset 0 -2px 0 var(--gold);}

/* مهمّةٌ أُنجز بعضُها: لا تامّةٌ ولا متروكة */
.task-item.part .checkbox{border-color:var(--gold);
  background:linear-gradient(135deg,var(--gold) 0 50%,transparent 50% 100%);}