@import"https://fonts.googleapis.com/css2?family=Amiri&display=swap";:root{--color-bg: #0d1b0e;--color-surface: #1a2e1c;--color-surface-hover: #234226;--color-primary: #2e7d32;--color-primary-light: #4caf50;--color-accent: #c9a84c;--color-accent-glow: #ffd54f;--color-text: #e8f5e9;--color-text-muted: #81c784;--color-complete: #ffd54f;--color-ring-bg: #1a3a1c;--radius-card: 16px;--font-arabic: "Amiri", serif}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--color-bg);color:var(--color-text);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.app{min-height:100vh;display:flex;flex-direction:column;max-width:480px;margin:0 auto;padding:16px}.app-header{text-align:center;padding:20px 0 16px}.app-title{font-family:var(--font-arabic);font-size:2rem;color:var(--color-accent);margin-bottom:12px;letter-spacing:1px}.overall-progress{display:flex;flex-direction:column;align-items:center;gap:6px}.progress-bar{width:100%;height:8px;background:var(--color-ring-bg);border-radius:4px;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-accent));border-radius:4px;transition:width .4s ease}.progress-text{font-size:.85rem;color:var(--color-text-muted)}.recitation-list{flex:1;display:flex;flex-direction:column;gap:8px;padding:12px 0}.habit-drag-wrapper{position:relative;display:flex;align-items:stretch;border-radius:12px;transition:opacity .15s,box-shadow .15s}.habit-drag-wrapper.is-dragging{opacity:.4}.habit-drag-wrapper.drag-over{box-shadow:0 0 0 2px var(--color-accent)}.drag-handle{display:flex;align-items:center;padding:0 6px 0 2px;color:var(--color-text-muted);font-size:1.1rem;opacity:.35;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;flex-shrink:0}.drag-handle:active{cursor:grabbing;opacity:.8}.habit-drag-wrapper .habit-row{flex:1;min-width:0}.edit-habit-btn{display:flex;align-items:center;padding:0 4px 0 2px;background:none;border:none;color:var(--color-accent);opacity:.5;font-size:1rem;cursor:pointer;flex-shrink:0;touch-action:manipulation}.edit-habit-btn:active{opacity:1}.assign-group-btn{display:flex;align-items:center;padding:0 4px 0 2px;background:none;border:none;color:var(--color-text-muted);font-size:1rem;opacity:.3;cursor:pointer;flex-shrink:0;touch-action:manipulation}.assign-group-btn:active{opacity:1}.modal-subtitle{text-align:center;font-size:.85rem;color:var(--color-text-muted);margin-top:-12px}.habit-group-card{border:1px solid var(--color-primary);border-radius:14px;overflow:hidden;background:var(--color-surface)}.habit-group-header{display:flex;align-items:center;background:#2e7d3226;border-bottom:1px solid var(--color-primary)}.habit-group-card.collapsed .habit-group-header{border-bottom:none;border-radius:14px}.habit-group-header-tap{flex:1;display:flex;align-items:center;justify-content:space-between;padding:10px 8px 8px 14px;background:none;border:none;color:inherit;font:inherit;cursor:pointer;text-align:left}.habit-group-header-tap:active{opacity:.7}.habit-group-rename-btn{padding:8px 12px;background:none;border:none;color:var(--color-text-muted);font-size:1rem;cursor:pointer;opacity:.5;transition:opacity .15s;flex-shrink:0}.habit-group-rename-btn:active{opacity:1}.habit-group-header-right{display:flex;align-items:center;gap:8px}.habit-group-chevron{font-size:.75rem;color:var(--color-text-muted);transition:transform .2s}.habit-group-name{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--color-accent)}.habit-group-count{font-size:.75rem;color:var(--color-text-muted)}.habit-group-items{display:flex;flex-direction:column;gap:1px;background:var(--color-ring-bg);padding:0}.habit-group-items .habit-drag-wrapper{background:var(--color-surface)}.habit-group-items .habit-drag-wrapper:last-child{border-bottom-left-radius:14px;border-bottom-right-radius:14px}.habit-group-ungrouped{display:flex;flex-direction:column;gap:8px}.habit-group-divider{display:flex;align-items:center;gap:10px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);opacity:.5;padding:4px 0 0}.habit-group-divider:after{content:"";flex:1;height:1px;background:var(--color-surface)}.habit-row{position:relative;background:var(--color-surface);border-radius:12px;overflow:hidden;transition:background .2s}.habit-row.complete{background:linear-gradient(135deg,#1a2e1c,#243d1f)}.habit-tap{display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 40px 14px 16px;background:none;border:none;color:var(--color-text);cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:left}.habit-tap:active:not(:disabled){opacity:.8}.habit-tap:disabled{cursor:default}.timer-row{cursor:default}.habit-info{display:flex;flex-direction:column;gap:2px;min-width:0}.habit-name{font-size:.95rem;font-weight:600;color:var(--color-text)}.habit-arabic{font-family:var(--font-arabic);font-size:.9rem;color:var(--color-accent);direction:rtl}.habit-counter{flex-shrink:0}.habit-count{font-size:1.3rem;font-weight:700;font-variant-numeric:tabular-nums}.habit-of{font-size:.75rem;font-weight:400;color:var(--color-text-muted);margin-left:1px}.habit-check{font-size:1.3rem;color:var(--color-complete);animation:pop .4s ease}@keyframes pop{0%{transform:scale(0)}60%{transform:scale(1.3)}to{transform:scale(1)}}.habit-duration-tooltip{padding:3px 52px 3px 16px;font-size:.75rem;color:var(--color-accent);font-variant-numeric:tabular-nums;background:var(--color-bg)}.habit-progress-track{height:3px;background:var(--color-ring-bg)}.habit-progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary-light),var(--color-accent));transition:width .3s ease}.complete .habit-progress-fill{background:var(--color-accent)}.habit-actions{position:absolute;top:50%;right:6px;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px}.habit-action-btn{background:none;border:none;color:var(--color-text-muted);font-size:1rem;cursor:pointer;padding:2px 6px;opacity:.4;transition:opacity .2s;line-height:1}.habit-action-btn:active{opacity:1}.timer-right{display:flex;align-items:center;gap:10px;flex-shrink:0}.timer-time{font-size:1.1rem;font-weight:700;font-variant-numeric:tabular-nums}.timer-btns{display:flex;gap:4px}.timer-btn-sm{width:32px;height:32px;border:none;border-radius:50%;font-size:.8rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.timer-btn-sm.play{background:var(--color-primary);color:var(--color-text)}.timer-btn-sm.pause{background:var(--color-accent);color:var(--color-bg)}.timer-btn-sm.reset{background:var(--color-surface-hover);color:var(--color-text-muted);font-size:1rem}.timer-btn-sm:disabled{opacity:.4;cursor:default}.app-footer{display:flex;align-items:center;justify-content:space-between;padding:16px 0 80px;border-top:1px solid var(--color-surface)}.date-text{font-size:.8rem;color:var(--color-text-muted)}.reset-button{padding:8px 20px;background:var(--color-surface);color:var(--color-text-muted);border:1px solid var(--color-primary);border-radius:8px;font-size:.85rem;cursor:pointer;transition:background .2s}.reset-button:active{background:var(--color-surface-hover)}.tab-bar{display:flex;gap:4px;background:var(--color-surface);border-radius:12px;padding:4px;margin-bottom:8px}.tab-button{flex:1;padding:10px;border:none;border-radius:10px;background:transparent;color:var(--color-text-muted);font-size:.9rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s}.tab-button.active{background:var(--color-primary);color:var(--color-text)}.fab-group{position:fixed;bottom:24px;right:24px;display:flex;flex-direction:column;align-items:center;gap:12px;z-index:10}.fab{width:56px;height:56px;border-radius:50%;border:none;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));color:var(--color-bg);font-size:2rem;font-weight:300;cursor:pointer;box-shadow:0 4px 16px #0006;display:flex;align-items:center;justify-content:center;transition:transform .2s}.fab-secondary{width:44px;height:44px;font-size:1.3rem;background:var(--color-surface);border:1px solid var(--color-primary);color:var(--color-accent);box-shadow:0 2px 8px #0000004d}.fab:active{transform:scale(.9)}.habit-group-empty{font-size:.8rem;color:var(--color-text-muted);padding:10px 12px;font-style:italic;opacity:.6}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:flex-end;justify-content:center;z-index:100;padding:16px}.modal-content{background:var(--color-surface);border-radius:20px 20px 12px 12px;padding:24px;width:100%;max-width:420px;max-height:85vh;overflow-y:auto}.modal-title{font-size:1.2rem;color:var(--color-accent);margin-bottom:20px;text-align:center}.form-group{margin-bottom:16px}.form-label{display:block;font-size:.8rem;color:var(--color-text-muted);margin-bottom:6px}.form-input{width:100%;padding:12px;border:1px solid var(--color-primary);border-radius:10px;background:var(--color-bg);color:var(--color-text);font-size:1rem;outline:none;transition:border-color .2s}.form-input:focus{border-color:var(--color-accent)}.form-input.arabic-input{font-family:var(--font-arabic);font-size:1.2rem}.group-chips{display:flex;flex-wrap:wrap;gap:8px}.group-chip{padding:6px 14px;border:1px solid var(--color-primary);border-radius:20px;background:transparent;color:var(--color-text-muted);font-size:.85rem;cursor:pointer;transition:background .2s,color .2s,border-color .2s}.group-chip.active{background:var(--color-primary);color:var(--color-text);border-color:var(--color-primary)}.group-chip.new-group-chip{border-style:dashed;color:var(--color-accent);border-color:var(--color-accent)}.group-chip.new-group-chip.active{background:var(--color-accent);color:var(--color-bg)}.type-toggle{display:flex;gap:4px;background:var(--color-bg);border-radius:10px;padding:4px}.toggle-btn{flex:1;padding:10px;border:none;border-radius:8px;background:transparent;color:var(--color-text-muted);font-size:.9rem;cursor:pointer;transition:background .2s,color .2s}.toggle-btn.active{background:var(--color-primary);color:var(--color-text)}.modal-actions{display:flex;gap:12px;margin-top:20px}.btn-cancel{flex:1;padding:12px;border:1px solid var(--color-primary);border-radius:10px;background:transparent;color:var(--color-text-muted);font-size:.9rem;cursor:pointer}.btn-save{flex:1;padding:12px;border:none;border-radius:10px;background:var(--color-primary);color:var(--color-text);font-size:.9rem;font-weight:600;cursor:pointer;transition:opacity .2s}.btn-save:disabled{opacity:.4;cursor:default}.calendar-view{flex:1;padding:8px 0}.streak-banner{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px;margin-bottom:16px;background:var(--color-surface);border-radius:var(--radius-card)}.streak-flame{font-size:1.6rem}.streak-count{font-size:2rem;font-weight:700;color:var(--color-accent)}.streak-label{font-size:.9rem;color:var(--color-text-muted)}.calendar-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cal-nav-btn{background:var(--color-surface);border:none;color:var(--color-text);font-size:1.2rem;padding:8px 14px;border-radius:8px;cursor:pointer}.cal-nav-btn:active{background:var(--color-surface-hover)}.cal-month-label{font-size:1rem;font-weight:600;color:var(--color-text)}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.cal-weekday{text-align:center;font-size:.7rem;color:var(--color-text-muted);padding:6px 0;font-weight:600}.cal-day{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 4px;border-radius:8px;min-height:44px;gap:3px}.cal-day-num{font-size:.8rem;color:var(--color-text)}.cal-day.empty{visibility:hidden}.cal-dot{width:6px;height:6px;border-radius:50%}.cal-dot.green{background:var(--color-primary-light)}.cal-dot.yellow{background:var(--color-accent)}.cal-day:not(.empty):not(:disabled){cursor:pointer;background:none;border:none;color:inherit;font:inherit}.cal-day:disabled{opacity:.3;cursor:default;background:none;border:none;color:inherit;font:inherit}.cal-day.is-today:not(.empty){background:var(--color-surface);border:1px solid var(--color-primary)}.cal-day.is-selected{background:var(--color-primary)!important;border-radius:8px}.cal-day.is-selected .cal-day-num{color:var(--color-text);font-weight:700}.day-detail{margin-top:16px;padding:16px;background:var(--color-surface);border-radius:12px;animation:slideUp .2s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.day-detail-label{font-size:.95rem;font-weight:600;color:var(--color-text);margin-bottom:8px}.day-detail-stats{display:flex;justify-content:space-between;align-items:center}.day-detail-count{font-size:1.1rem;font-weight:700;color:var(--color-text)}.day-detail-status{font-size:.85rem;color:var(--color-text-muted)}.day-detail-status.done{color:var(--color-complete)}.day-detail-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.day-detail-header .day-detail-label{margin-bottom:0}.day-detail-goto{background:none;border:1px solid var(--color-primary);border-radius:8px;color:var(--color-primary-light);font-size:.8rem;padding:4px 10px;cursor:pointer;transition:background .2s}.day-detail-goto:active{background:var(--color-surface-hover)}.day-detail-habits{margin-top:12px;display:flex;flex-direction:column;gap:6px}.day-detail-habit{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;background:var(--color-bg);border-radius:8px;border-left:3px solid var(--color-surface-hover)}.day-detail-habit.done{border-left-color:var(--color-primary-light)}.day-detail-habit-name{font-size:.85rem;color:var(--color-text)}.day-detail-habit-check{color:var(--color-complete);font-size:1rem;font-weight:700}.day-detail-habit-progress{font-size:.8rem;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.pin-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:200;padding:24px}.pin-modal{background:var(--color-surface);border-radius:20px;padding:32px 24px;width:100%;max-width:320px;text-align:center}.pin-title{font-size:1.2rem;color:var(--color-accent);margin-bottom:6px}.pin-subtitle{font-size:.8rem;color:var(--color-text-muted);margin-bottom:24px}.pin-input{width:160px;padding:14px;border:2px solid var(--color-primary);border-radius:12px;background:var(--color-bg);color:var(--color-text);font-size:1.8rem;text-align:center;letter-spacing:8px;outline:none;transition:border-color .2s}.pin-input:focus{border-color:var(--color-accent)}.pin-error{color:#ef5350;font-size:.8rem;margin-top:8px}.pin-actions{display:flex;gap:12px;margin-top:24px}.pin-btn{flex:1;padding:12px;border:none;border-radius:10px;font-size:.9rem;font-weight:600;cursor:pointer}.pin-btn.cancel{background:transparent;border:1px solid var(--color-primary);color:var(--color-text-muted)}.pin-btn.confirm{background:var(--color-primary);color:var(--color-text)}.journal-row .habit-tap{cursor:pointer}.journal-hint{font-family:inherit!important;font-size:.75rem!important;color:var(--color-text-muted)!important;direction:ltr!important}.journal-editor{padding:0 12px 12px}.journal-textarea{width:100%;min-height:120px;padding:12px;border:1px solid var(--color-primary);border-radius:10px;background:var(--color-bg);color:var(--color-text);font-family:inherit;font-size:.9rem;line-height:1.5;resize:vertical;outline:none;transition:border-color .2s}.journal-textarea:focus{border-color:var(--color-accent)}.journal-textarea::placeholder{color:var(--color-text-muted);opacity:.6}@media(max-width:360px){.app-title{font-size:1.6rem}}.loading-screen{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--color-bg)}.loading-spinner{width:48px;height:48px;border:4px solid var(--color-surface);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.auth-screen{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px 16px;background:var(--color-bg)}.auth-card{background:var(--color-surface);border-radius:16px;padding:32px 24px;width:100%;max-width:400px;box-shadow:0 4px 24px #0000004d}.auth-title{text-align:center;margin-bottom:24px}.auth-tabs{display:flex;gap:0;margin-bottom:24px;border-radius:8px;overflow:hidden;border:1px solid var(--color-border)}.auth-tab{flex:1;padding:10px;background:transparent;border:none;color:var(--color-text-muted);font-size:.95rem;cursor:pointer;transition:background .2s,color .2s}.auth-tab.active{background:var(--color-accent);color:#fff;font-weight:600}.auth-error{color:#ef4444;font-size:.88rem;margin-bottom:12px;text-align:center}.auth-success{color:#22c55e;font-size:.88rem;margin-bottom:12px;text-align:center}.auth-submit{width:100%;margin-top:8px}.app-header-top{display:flex;align-items:center;justify-content:space-between}.sign-out-btn{background:transparent;border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-muted);font-size:1rem;padding:4px 10px;cursor:pointer;transition:color .2s,border-color .2s}.sign-out-btn:hover{color:var(--color-text);border-color:var(--color-text-muted)}.quote-banner{display:flex;flex-direction:column;align-items:center;text-align:center;padding:16px 20px;margin:12px 16px 4px;background:linear-gradient(135deg,#6366f11f,#8b5cf61f);border-left:3px solid var(--color-accent);border-radius:10px;gap:6px}.quote-text{font-size:.95rem;font-style:italic;color:var(--color-text);line-height:1.5}.quote-author{font-size:.8rem;color:var(--color-accent);font-weight:600;letter-spacing:.03em}.quote-dismiss-btn{margin-top:8px;padding:5px 16px;background:var(--color-accent);color:#fff;border:none;border-radius:20px;font-size:.8rem;font-weight:600;cursor:pointer;transition:opacity .2s}.quote-dismiss-btn:hover{opacity:.85}.habit-complete-btn{color:#22c55e!important;font-size:1.1rem!important;font-weight:700!important;border-color:#22c55e!important}.habit-complete-btn:hover{background:#22c55e26!important}.install-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:linear-gradient(135deg,#1a2e1b,#1e3320);border-bottom:1px solid var(--color-accent);flex-wrap:wrap}.install-banner-text{display:flex;align-items:center;gap:8px;font-size:.88rem;color:var(--color-text)}.install-banner-icon{font-size:1.1rem}.install-banner-actions{display:flex;align-items:center;gap:8px}.install-btn{padding:7px 16px;background:var(--color-accent);color:#fff;border:none;border-radius:20px;font-size:.85rem;font-weight:600;cursor:pointer;white-space:nowrap}.install-dismiss{background:transparent;border:none;color:var(--color-text-muted);font-size:1rem;cursor:pointer;padding:4px 6px}.ios-install-steps{padding-left:20px;line-height:2;color:var(--color-text)}.ios-icon{font-size:1.1rem}.profile-modal{max-width:420px}.profile-header{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--color-border)}.profile-avatar{width:56px;height:56px;border-radius:50%;background:var(--color-accent);color:#fff;font-size:1.5rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}.profile-email{font-weight:600;font-size:1rem;color:var(--color-text)}.profile-joined{font-size:.8rem;color:var(--color-text-muted);margin-top:2px}.profile-info{display:flex;flex-direction:column;gap:12px}.profile-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--color-border)}.profile-row-label{font-size:.85rem;color:var(--color-text-muted)}.profile-row-value{font-size:.9rem;color:var(--color-text);font-weight:500}.profile-uid{font-family:monospace;font-size:.8rem}.sync-now-btn{margin-top:8px;padding:12px;background:#6366f11a;color:var(--color-accent);border:1px solid rgba(99,102,241,.3);border-radius:10px;font-size:.9rem;font-weight:500;cursor:pointer;transition:background .2s;width:100%}.sync-now-btn:hover{background:#6366f133}.sync-now-btn:disabled{opacity:.6;cursor:not-allowed}.sign-out-full-btn{margin-top:8px;padding:12px;background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.3);border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;transition:background .2s;width:100%}.sign-out-full-btn:hover{background:#ef444433}.forgot-password-btn{display:block;width:100%;margin-top:12px;background:transparent;border:none;color:var(--color-accent);font-size:.88rem;cursor:pointer;text-align:center;padding:4px;opacity:.85}.forgot-password-btn:hover{opacity:1;text-decoration:underline}.name-row{display:flex;gap:12px}.name-row .form-group{flex:1}