@import"https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap";.onboarding-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:200;padding-top:max(12px,var(--app-safe-top, env(safe-area-inset-top, 0px)));padding-inline-end:max(12px,var(--app-safe-right, env(safe-area-inset-right, 0px)));padding-bottom:max(12px,var(--app-safe-bottom, env(safe-area-inset-bottom, 0px)));padding-inline-start:max(12px,var(--app-safe-left, env(safe-area-inset-left, 0px)));overflow-y:auto;overscroll-behavior:contain;animation:fadeInUp .3s ease}.onboarding-modal{background:var(--card-bg);border-radius:var(--radius-xl);padding:40px 28px 28px;max-width:380px;width:100%;text-align:center;box-shadow:var(--shadow-xl);border:1px solid var(--card-border);max-height:calc(100dvh - max(12px,var(--app-safe-top, env(safe-area-inset-top, 0px))) - max(12px,var(--app-safe-bottom, env(safe-area-inset-bottom, 0px))));overflow-y:auto;overscroll-behavior:contain}.onboarding-slide{min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center}.onboarding-icon{font-size:64px;margin-bottom:20px}.onboarding-title{font-size:1.3rem;font-weight:700;color:var(--text-primary);margin-bottom:12px}.onboarding-desc{font-size:.9rem;color:var(--text-secondary);line-height:1.6;max-width:300px}.onboarding-dots{display:flex;justify-content:center;gap:8px;margin:24px 0}.onboarding-dot{width:8px;height:8px;border-radius:50%;background:var(--gray-300);transition:all .25s ease}.onboarding-dot.active{background:var(--accent-color);width:24px;border-radius:4px}.onboarding-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.onboarding-skip{padding:10px 20px;background:transparent;border:none;color:var(--text-secondary);font-size:.9rem;cursor:pointer;font-family:inherit;transition:color .15s ease;min-height:44px;flex:1 1 8rem}.onboarding-skip:hover{color:var(--text-primary)}.onboarding-next{padding:12px 28px;background:linear-gradient(135deg,var(--green-700),var(--green-600));color:#fff;border:none;border-radius:var(--radius-md);font-size:.95rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .15s ease;min-height:44px;flex:1 1 8rem}.onboarding-next:hover{filter:brightness(1.1);transform:translateY(-1px)}@media (max-height: 540px),(max-width: 360px){.onboarding-overlay{align-items:flex-start}.onboarding-modal{padding:20px 18px 18px}.onboarding-slide{min-height:0;justify-content:flex-start}.onboarding-icon{font-size:42px;margin-bottom:8px}.onboarding-title{margin-bottom:6px}.onboarding-dots{margin:12px 0}}@media (max-width: 300px){.onboarding-actions{flex-direction:column-reverse;align-items:stretch}.onboarding-actions>button{flex-basis:auto;width:100%}}.campaign-banner-strip{position:relative;background:var(--card-bg);border:1px solid var(--border-color, #e8e8e8);border-radius:14px;overflow:hidden;margin:10px 16px;animation:campaignFadeIn .3s ease}.campaign-banner-image{width:100%;display:block;object-fit:cover;max-height:120px;cursor:pointer}.campaign-banner-content{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;gap:10px}.campaign-banner-title{font-size:.85rem;font-weight:600;color:var(--text-primary);flex:1}.campaign-card-inline{position:relative;background:var(--card-bg);border:1px solid var(--border-color, #e8e8e8);border-radius:14px;overflow:hidden;margin:10px 16px;animation:campaignFadeIn .3s ease}.campaign-card-img{width:100%;display:block;object-fit:cover;max-height:200px;cursor:pointer}.campaign-card-body{padding:14px}.campaign-card-body .campaign-card-title{font-size:.95rem;font-weight:700;color:var(--text-primary);margin:0 0 6px}.campaign-card-text{font-size:.82rem;color:var(--text-secondary);margin:0 0 10px;line-height:1.5}.campaign-cta-btn{display:inline-block;padding:7px 18px;background:var(--accent-color, #556B2F);color:#fff;border:none;border-radius:20px;font-size:.78rem;font-weight:600;cursor:pointer;transition:opacity .2s;font-family:inherit}.campaign-cta-btn:active{opacity:.8}.campaign-cta-lg{padding:10px 28px;font-size:.9rem;width:100%;text-align:center}.campaign-dismiss{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;border:none;background:rgba(0,0,0,.45);color:#fff;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;line-height:1}[dir=rtl] .campaign-dismiss,html[lang=ar] .campaign-dismiss{right:auto;left:8px}.campaign-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;animation:campaignFadeIn .25s ease}.campaign-modal{position:relative;background:var(--card-bg, #fff);border-radius:18px;overflow:hidden;max-width:360px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 12px 40px #00000040}.campaign-modal-close{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;border:none;background:rgba(0,0,0,.5);color:#fff;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3}[dir=rtl] .campaign-modal-close,html[lang=ar] .campaign-modal-close{right:auto;left:10px}.campaign-modal-image{width:100%;display:block;object-fit:cover;max-height:400px;cursor:pointer}.campaign-modal-body{padding:18px}.campaign-modal-body h3{font-size:1.1rem;font-weight:700;color:var(--text-primary);margin:0 0 8px}.campaign-modal-body p{font-size:.85rem;color:var(--text-secondary);margin:0 0 14px;line-height:1.5}@keyframes campaignFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 400px){.campaign-banner-strip,.campaign-card-inline{margin:8px 12px}.campaign-modal{max-width:95vw}}.mosque-announcements{width:100%;min-width:0}.campaign-banner-strip{border-inline-start:4px solid var(--accent-color, #556B2F)}.campaign-banner-content{display:flex;flex-direction:column;align-items:flex-start;padding-inline-end:56px;gap:6px}.campaign-banner-title{margin:0;font-size:.95rem}.campaign-banner-text{margin:0;color:var(--text-secondary);font-size:.86rem;line-height:1.6}.campaign-banner-text,.campaign-card-text,.campaign-modal-body p{white-space:pre-wrap;overflow-wrap:anywhere}.campaign-card-inline{box-shadow:0 3px 12px #0000000d}.campaign-card-body{padding:20px;padding-inline-end:56px}.campaign-card-img{max-height:240px;aspect-ratio:2 / 1}.campaign-banner-image,.campaign-card-img,.campaign-modal-image{cursor:default}.campaign-dismiss,.campaign-modal-close{width:40px;height:40px;font-size:22px}.campaign-dismiss:focus-visible,.campaign-modal-close:focus-visible{outline:3px solid var(--accent-color, #556B2F);outline-offset:2px}.campaign-modal{max-width:460px;max-height:88dvh}.campaign-modal-body{padding:24px;padding-block-start:54px}.campaign-modal-body h3{padding-inline-end:12px;overflow-wrap:anywhere}.campaign-legacy-link{text-decoration:none;display:inline-flex;margin-block-start:8px}.announcement-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:4px 16px 12px}.announcement-controls>p{margin:0}@media (max-width: 480px){.campaign-dismiss,.campaign-modal-close{width:44px;height:44px}.campaign-modal-overlay{padding:16px}}@media (prefers-reduced-motion: reduce){.campaign-banner-strip,.campaign-card-inline,.campaign-modal-overlay{animation:none}}.ln-notice{display:flex;align-items:flex-start;gap:14px;padding:16px;background:var(--card-bg);border:1px solid var(--card-border);border-inline-start:4px solid var(--accent-secondary);border-radius:var(--radius-md);box-shadow:0 2px 10px #2e2b260f;margin-bottom:20px}.ln-icon{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);background:var(--accent-secondary-light);color:var(--accent-secondary)}.ln-body{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}.ln-title{font-size:15px;font-weight:700;color:var(--text-primary)}.ln-sub{font-size:13px;line-height:1.55;color:var(--text-secondary)}.ln-error{font-size:12.5px;line-height:1.5;color:var(--color-error-dark);background:var(--color-error-light);border-radius:var(--radius-xs);padding:6px 10px}.ln-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}.ln-btn{border:none;border-radius:var(--radius-sm);padding:9px 16px;font-size:13.5px;font-weight:600;font-family:inherit;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.ln-btn:disabled{opacity:.6;cursor:default}.ln-btn-primary{background:var(--cta-gradient);color:var(--text-on-primary);box-shadow:var(--cta-shadow)}.ln-btn-primary:not(:disabled):hover{box-shadow:var(--cta-shadow-hover);transform:translateY(-1px)}.ln-btn-ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--input-border)}.ln-btn-ghost:hover{background:var(--card-hover);color:var(--text-primary)}@media (max-width: 480px){.ln-notice{padding:12px;gap:10px}.ln-icon{width:34px;height:34px}.ln-title{font-size:14px}.ln-sub{font-size:12.5px}.ln-actions{gap:8px}.ln-btn{padding:8px 12px;font-size:12.5px;flex:1 1 auto;text-align:center}}[data-theme=dark] .ln-notice{background:var(--card-bg);border-color:var(--card-border);box-shadow:0 2px 10px #00000040}.ecosystem-gateway{position:relative;overflow:hidden;display:grid;gap:16px;padding:20px;border:1px solid color-mix(in srgb,var(--accent-color) 24%,var(--card-border));border-radius:var(--radius-xl);background:radial-gradient(circle at 90% 10%,rgba(196,154,44,.16),transparent 42%),linear-gradient(145deg,var(--card-bg),var(--bg-tertiary));box-shadow:var(--shadow-md)}.ecosystem-gateway-copy{min-width:0}.ecosystem-gateway-eyebrow{display:inline-block;color:var(--accent-color);font-size:var(--text-xs);font-weight:800;letter-spacing:.04em}.ecosystem-gateway h2{margin:5px 0 6px;font-size:clamp(1.1rem,5vw,1.45rem);line-height:1.35}.ecosystem-gateway p{margin:0;color:var(--text-secondary);font-size:var(--text-sm);line-height:1.65}.ecosystem-gateway-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.ecosystem-platform{min-width:0;min-height:72px;display:flex;align-items:center;gap:9px;padding:10px;border:1px solid var(--card-border);border-radius:var(--radius-md);background:var(--card-bg);color:var(--text-primary);font:inherit;text-align:start;cursor:pointer;transition:border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.ecosystem-platform:hover{transform:translateY(-1px);border-color:var(--accent-color);box-shadow:var(--shadow-sm)}.ecosystem-platform:focus-visible{outline:3px solid var(--accent-color);outline-offset:2px}.ecosystem-platform>span:last-child{min-width:0;display:grid;gap:2px}.ecosystem-platform strong,.ecosystem-platform small{display:block;overflow-wrap:anywhere}.ecosystem-platform strong{font-size:.75rem;line-height:1.35}.ecosystem-platform small{color:var(--text-tertiary);font-size:.62rem;line-height:1.35}.ecosystem-platform-mark{width:34px;height:34px;flex:0 0 34px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;background:var(--accent-light);color:var(--accent-color);font-size:1.05rem;font-weight:800}.ecosystem-platform--android .ecosystem-platform-mark{background:#e8f5e8;color:#2d6b2d}.ecosystem-platform--web .ecosystem-platform-mark svg{width:20px;height:20px}@media (max-width: 560px){.ecosystem-gateway-actions{grid-template-columns:1fr}.ecosystem-platform{min-height:58px}.ecosystem-platform strong{font-size:.82rem}.ecosystem-platform small{font-size:.68rem}}.hp-container{display:flex;flex-direction:column;gap:20px;padding-bottom:16px;animation:fadeInUp .4s ease}.hp-greeting{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 4px 0}.hp-greeting-text{display:flex;flex-direction:column;gap:2px;min-width:0}.hp-greeting-title{font-size:var(--text-xl);font-weight:700;color:var(--text-primary);letter-spacing:-.02em;line-height:1.25}[dir=rtl] .hp-greeting-title{font-family:Cairo,sans-serif;letter-spacing:0}.hp-greeting-name{color:var(--accent-color)}.hp-greeting-date{display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:3px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);padding:8px 12px;box-shadow:var(--shadow-xs);flex-shrink:0}[dir=rtl] .hp-greeting-date{align-items:flex-start;text-align:left}.hp-greeting-hijri{font-family:Cairo,sans-serif;font-size:var(--text-base, .95rem);font-weight:700;color:var(--accent-color);line-height:1.3}.hp-greeting-gregorian{font-size:var(--text-xs);color:var(--text-tertiary);font-weight:500;line-height:1.3}.hp-hero{position:relative;background:linear-gradient(135deg,#3D4F20 0%,#465A26 25%,#556B2F 50%,#6B7D3E 75%,#556B2F 100%);border-radius:var(--radius-xl);padding:28px 20px;text-align:center;color:#fff;overflow:hidden;box-shadow:0 8px 32px #556b2f59;transition:transform var(--transition-normal)}.hp-hero:hover{transform:translateY(-2px)}.hp-hero-bg{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.hp-hero-orb{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 70%)}.hp-orb-1{width:300px;height:300px;top:-100px;right:-80px}.hp-orb-2{width:200px;height:200px;bottom:-60px;left:-60px}.hp-hero-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:6px}.hp-hero-label{font-size:var(--text-xs);font-weight:600;color:#ffffffa6;text-transform:uppercase;letter-spacing:1.5px}.hp-hero-name{font-size:var(--text-2xl);font-weight:800;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.2)}[dir=rtl] .hp-hero-name{font-family:Cairo,sans-serif;font-weight:700}.hp-hero-timer{font-size:3.2rem;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:2px;line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.25);margin:4px 0}@media (max-width: 480px){.hp-hero-timer{font-size:2.6rem}}.hp-hero-sublabel{font-size:var(--text-xs);color:#ffffff8c;font-weight:500}.hp-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.hp-section-header h3{font-size:var(--text-sm);font-weight:700;color:var(--text-primary);text-transform:uppercase;letter-spacing:.8px}[dir=rtl] .hp-section-header h3{font-family:Cairo,sans-serif}.hp-prayer-section{background:var(--card-bg);border-radius:var(--radius-xl);padding:16px;border:1px solid var(--card-border);box-shadow:var(--shadow-sm)}.hp-prayer-list{display:flex;flex-direction:column;gap:6px}.hp-prayer-card{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:var(--prayer-card-bg);border-radius:var(--radius-md);border:1.5px solid transparent;transition:all var(--transition-fast)}.hp-prayer-card:hover{background:var(--prayer-card-hover)}.hp-prayer-card-left{display:flex;align-items:center;gap:12px}.hp-prayer-card-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-full);background:var(--accent-light)}.hp-prayer-card-icon svg{width:18px;height:18px}.hp-prayer-card-info{display:flex;align-items:center;gap:8px}.hp-prayer-card-name{font-size:var(--text-md);font-weight:600;color:var(--text-primary)}[dir=rtl] .hp-prayer-card-name{font-family:Cairo,sans-serif}.hp-prayer-card-time{font-size:var(--text-md);font-weight:700;font-family:Inter,monospace;color:var(--text-primary);font-variant-numeric:tabular-nums}.hp-prayer-card--next{background:linear-gradient(135deg,#465A26 0%,#556B2F 100%);border-color:#ffffff26;box-shadow:0 4px 16px #556b2f4d}.hp-prayer-card--next .hp-prayer-card-icon{background:rgba(255,255,255,.15)}.hp-prayer-card--next .hp-prayer-card-name,.hp-prayer-card--next .hp-prayer-card-time{color:#fff}.hp-prayer-card-badge{display:inline-flex;align-items:center;padding:2px 8px;background:rgba(255,255,255,.2);border-radius:var(--radius-full);font-size:.65rem;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.5px}.hp-quick-actions{animation-delay:.1s}.hp-qaction-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}@media (min-width: 768px){.hp-qaction-grid{grid-template-columns:repeat(6,1fr)}}.hp-qaction{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent;font-family:inherit}.hp-qaction:hover{border-color:var(--accent-color);box-shadow:var(--shadow-md);transform:translateY(-2px)}.hp-qaction:active{transform:scale(.96)}.hp-qaction-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);transition:all var(--transition-fast)}.hp-qaction-icon svg{width:22px;height:22px}.hp-qaction-label{font-size:var(--text-xs);font-weight:600;color:var(--text-primary);text-align:center;line-height:1.3}[dir=rtl] .hp-qaction-label{font-family:Cairo,sans-serif}.hp-qaction-sublabel{font-size:.6rem;color:var(--text-tertiary);text-align:center;line-height:1.3}.hp-qaction--quran .hp-qaction-icon{background:linear-gradient(135deg,#F3F1EA,#E0DCC8);color:#556b2f}.hp-qaction--hifz .hp-qaction-icon{background:linear-gradient(135deg,#FDF8ED,#F9EDD0);color:#a67c00}.hp-qaction--qibla .hp-qaction-icon{background:linear-gradient(135deg,#F0EDE4,#E0DCC8);color:#6b6458}.hp-qaction--azkar .hp-qaction-icon{background:linear-gradient(135deg,#F3F1EA,#E4E0CE);color:#6b7d3e}.hp-qaction--tracker .hp-qaction-icon{background:linear-gradient(135deg,#F3F1EA,#E0DCC8);color:#465a26}.hp-qaction--calendar .hp-qaction-icon{background:linear-gradient(135deg,#FDF8ED,#F2E8CC);color:#8a6600}.hp-location{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px;color:var(--text-tertiary);font-size:var(--text-xs)}.hp-location svg{width:14px;height:14px}.hp-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:60vh;color:var(--text-secondary);text-align:center;gap:16px}.hp-loading-spinner{width:40px;height:40px;border:3px solid var(--card-border);border-top-color:var(--accent-color);border-radius:50%;animation:spin .8s linear infinite}.hp-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:60vh;text-align:center;gap:16px;padding:40px 20px}.hp-error-icon{width:64px;height:64px;border-radius:var(--radius-full);background:var(--color-error-light);color:var(--color-error);display:flex;align-items:center;justify-content:center}.hp-error-icon svg{width:28px;height:28px}.hp-error h2{font-size:var(--text-xl);font-weight:700;color:var(--text-primary)}.hp-error p{font-size:var(--text-base);color:var(--text-secondary);max-width:280px}.hp-location-quality{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--text-tertiary);background:var(--bg-tertiary);border:1px solid var(--divider-subtle);border-radius:999px;padding:3px 10px}.hp-location-quality svg{width:13px;height:13px}.hp-prayer-status{display:flex;align-items:center;justify-content:center;gap:10px;padding:22px 16px;font-size:13.5px;color:var(--text-secondary);background:var(--prayer-card-bg);border:1px dashed var(--card-border);border-radius:var(--radius-md);text-align:center}.hp-prayer-status svg{width:18px;height:18px;color:var(--text-tertiary);flex-shrink:0}.hp-prayer-status--error{color:var(--color-error-dark);border-color:var(--color-error-light);background:var(--color-error-light)}.hp-prayer-retry{border:none;border-radius:var(--radius-xs);padding:6px 14px;font-size:12.5px;font-weight:600;font-family:inherit;cursor:pointer;background:var(--cta-gradient);color:var(--text-on-primary)}.hp-loading-spinner--sm{width:20px;height:20px;border-width:2px;margin:0}:root{--green-50: #F3F1EA;--green-100: #E0DCC8;--green-200: #C4BE9E;--green-300: #A8A078;--green-400: #8B9658;--green-500: #6B7D3E;--green-600: #556B2F;--green-700: #465A26;--green-800: #3A4A1F;--green-900: #2D3A18;--gold-50: #FDF8ED;--gold-100: #F9EDD0;--gold-200: #F2D9A0;--gold-300: #E8C26A;--gold-400: #D4A843;--gold-500: #C49A2C;--gold-600: #A67C00;--gold-700: #8A6600;--gray-50: #FCFAF6;--gray-100: #F7F3EA;--gray-200: #EDE6D6;--gray-300: #D4CBB5;--gray-400: #B0A68E;--gray-500: #8A8272;--gray-600: #6B6458;--gray-700: #4A453C;--gray-800: #2E2B26;--gray-900: #1A1815;--color-success: #4A8B4A;--color-success-light: #E8F5E8;--color-success-dark: #2D6B2D;--color-warning: #C98620;--color-warning-light: #FDF3E0;--color-warning-dark: #8A5E00;--color-error: #C74B4B;--color-error-light: #FCE8E8;--color-error-dark: #9B2C2C;--color-info: #4A7CA8;--color-info-light: #E8F0F8;--bg-primary: #F5F0E8;--bg-secondary: #FFFFFF;--bg-tertiary: #F7F3EA;--bg-gradient: linear-gradient(165deg, #EDE6D6 0%, #F0EBE0 35%, #F5F0E8 70%, #F7F3EA 100%);--text-primary: #2E2B26;--text-secondary: #6B6458;--text-tertiary: #8A8272;--text-on-gradient: #FFFFFF;--text-on-primary: #FFFFFF;--card-bg: #FFFFFF;--card-bg-elevated: #FFFFFF;--card-border: #EDE6D6;--card-border-subtle: #F0EBE0;--card-hover: #FCFAF6;--card-active: #F7F3EA;--input-bg: #FFFFFF;--input-border: #D4CBB5;--input-border-hover: #B0A68E;--input-focus: #556B2F;--input-placeholder: #B0A68E;--accent-color: #556B2F;--accent-light: rgba(85, 107, 47, .08);--accent-medium: rgba(85, 107, 47, .15);--cta-gradient: linear-gradient(135deg, #465A26 0%, #556B2F 50%, #6B7D3E 100%);--cta-shadow: 0 4px 16px rgba(85, 107, 47, .28);--cta-shadow-hover: 0 6px 22px rgba(85, 107, 47, .38);--accent-secondary: #C49A2C;--accent-secondary-light: rgba(196, 154, 44, .12);--divider: #EDE6D6;--divider-subtle: #F0EBE0;--next-prayer-bg: linear-gradient(135deg, #465A26 0%, #556B2F 50%, #6B7D3E 100%);--next-prayer-border: #556B2F;--nav-bg: rgba(255, 255, 255, .92);--nav-border: rgba(237, 230, 214, .8);--nav-active: #556B2F;--nav-inactive: #8A8272;--prayer-card-bg: #FDFCF9;--prayer-card-hover: #F7F3EA;--loading-spinner: #556B2F;--skeleton-bg: #EDE6D6;--skeleton-shine: #F7F3EA;--overlay-bg: rgba(26, 24, 21, .5);--modal-bg: #FFFFFF;--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(255, 255, 255, .5);--radius-xs: 6px;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--radius-xl: 24px;--radius-2xl: 32px;--radius-full: 9999px;--shadow-xs: 0 1px 2px rgba(46, 43, 38, .04);--shadow-sm: 0 1px 4px rgba(46, 43, 38, .06);--shadow-md: 0 4px 16px rgba(46, 43, 38, .08);--shadow-lg: 0 8px 30px rgba(46, 43, 38, .1);--shadow-xl: 0 16px 48px rgba(46, 43, 38, .12);--shadow-glow: 0 0 24px rgba(85, 107, 47, .15);--shadow-inner: inset 0 2px 4px rgba(46, 43, 38, .04);--text-xs: .7rem;--text-sm: .8rem;--text-base: .9rem;--text-md: 1rem;--text-lg: 1.15rem;--text-xl: 1.35rem;--text-2xl: 1.65rem;--text-3xl: 2rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .4s cubic-bezier(.4, 0, .2, 1);--transition-bounce: .3s cubic-bezier(.34, 1.56, .64, 1);--border-color: var(--card-border);--primary: var(--green-500)}[data-theme=dark]{--bg-primary: #12100E;--bg-secondary: #1A1815;--bg-tertiary: #242119;--bg-gradient: linear-gradient(165deg, #0E0D0B 0%, #12100E 35%, #1A1815 70%, #242119 100%);--text-primary: #F0EBE0;--text-secondary: #B0A68E;--text-tertiary: #8A8272;--text-on-gradient: #F0EBE0;--text-on-primary: #FFFFFF;--card-bg: #242119;--card-bg-elevated: #2E2A24;--card-border: #3E3A34;--card-border-subtle: #2E2A24;--card-hover: #2E2A24;--card-active: #38342D;--input-bg: #242119;--input-border: #3E3A34;--input-border-hover: #4A453C;--input-focus: #8B9658;--input-placeholder: #6B6458;--accent-color: #8B9658;--accent-light: rgba(139, 150, 88, .12);--accent-medium: rgba(139, 150, 88, .2);--accent-secondary: #D4A843;--accent-secondary-light: rgba(212, 168, 67, .15);--divider: #3E3A34;--divider-subtle: #2E2A24;--next-prayer-bg: linear-gradient(135deg, #3D4F20 0%, #465A26 50%, #556B2F 100%);--next-prayer-border: #8B9658;--nav-bg: rgba(26, 24, 21, .92);--nav-border: rgba(62, 58, 52, .6);--nav-active: #8B9658;--nav-inactive: #6B6458;--prayer-card-bg: #1E1C18;--prayer-card-hover: #242119;--loading-spinner: #8B9658;--skeleton-bg: #2E2A24;--skeleton-shine: #38342D;--overlay-bg: rgba(0, 0, 0, .6);--modal-bg: #242119;--glass-bg: rgba(36, 33, 25, .85);--glass-border: rgba(62, 58, 52, .5);--shadow-xs: 0 1px 2px rgba(0, 0, 0, .2);--shadow-sm: 0 1px 4px rgba(0, 0, 0, .25);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 30px rgba(0, 0, 0, .35);--shadow-xl: 0 16px 48px rgba(0, 0, 0, .4);--shadow-glow: 0 0 24px rgba(139, 150, 88, .2);--border-color: var(--card-border);--primary: var(--accent-color)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInBottom{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes press{0%{transform:scale(1)}50%{transform:scale(.96)}to{transform:scale(1)}}.fade-in-up{animation:fadeInUp .4s cubic-bezier(.4,0,.2,1) both}.fade-in-down{animation:fadeInDown .35s cubic-bezier(.4,0,.2,1) both}.fade-in{animation:fadeIn .3s ease both}.scale-in{animation:scaleIn .3s cubic-bezier(.34,1.56,.64,1) both}.press-anim{animation:press .2s ease}.skeleton{background:linear-gradient(90deg,var(--skeleton-bg) 25%,var(--skeleton-shine) 50%,var(--skeleton-bg) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:var(--radius-sm)}.skeleton-text{height:.9rem;margin-bottom:var(--space-2)}.skeleton-title{height:1.3rem;width:60%;margin-bottom:var(--space-3)}.skeleton-card{height:80px;border-radius:var(--radius-md);margin-bottom:var(--space-3)}.skeleton-circle{border-radius:var(--radius-full)}.glass{background:var(--glass-bg);backdrop-filter:blur(20px) saturate(1.8);-webkit-backdrop-filter:blur(20px) saturate(1.8);border:1px solid var(--glass-border)}.glass-strong{background:rgba(255,255,255,.95);backdrop-filter:blur(30px) saturate(2);-webkit-backdrop-filter:blur(30px) saturate(2);border:1px solid rgba(255,255,255,.6)}[data-theme=dark] .glass-strong{background:rgba(36,33,25,.95);border:1px solid rgba(62,58,52,.6)}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;line-height:1.4}.badge-success{background:var(--color-success-light);color:var(--color-success-dark)}.badge-warning{background:var(--color-warning-light);color:var(--color-warning-dark)}.badge-error{background:var(--color-error-light);color:var(--color-error-dark)}.badge-info{background:var(--color-info-light);color:var(--color-info)}.badge-primary{background:var(--accent-light);color:var(--accent-color)}.badge-gold{background:var(--gold-100);color:var(--gold-700)}.badge-dot:before{content:"";width:6px;height:6px;border-radius:var(--radius-full);background:currentColor;opacity:.7}.card{background:var(--card-bg);border-radius:var(--radius-lg);border:1px solid var(--card-border);box-shadow:var(--shadow-sm);transition:all var(--transition-normal);overflow:hidden}.card:hover{box-shadow:var(--shadow-md);border-color:var(--card-border)}.card-elevated{background:var(--card-bg-elevated);border-radius:var(--radius-xl);border:1px solid var(--card-border-subtle);box-shadow:var(--shadow-md);transition:all var(--transition-normal)}.card-elevated:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-pressable{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.card-pressable:active{transform:scale(.98);box-shadow:var(--shadow-xs)}.card-gradient{background:linear-gradient(135deg,var(--green-700) 0%,var(--green-600) 100%);color:#fff;border:none}.card-gradient-gold{background:linear-gradient(135deg,var(--gold-500) 0%,var(--gold-600) 100%);color:#fff;border:none}.card-header{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--divider-subtle)}.card-body{padding:var(--space-4) var(--space-5)}.card-footer{padding:var(--space-3) var(--space-5);border-top:1px solid var(--divider-subtle);background:var(--bg-tertiary)}.icon-box{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);background:var(--accent-light);color:var(--accent-color);flex-shrink:0;transition:all var(--transition-fast)}.icon-box-sm{width:36px;height:36px;border-radius:var(--radius-sm)}.icon-box-lg{width:56px;height:56px;border-radius:var(--radius-lg)}.icon-box-gold{background:var(--accent-secondary-light);color:var(--accent-secondary)}.icon-box-gradient{background:linear-gradient(135deg,var(--green-600),var(--green-500));color:#fff}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:linear-gradient(135deg,var(--green-700),var(--green-600));color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:600;cursor:pointer;transition:all var(--transition-fast);font-family:inherit;box-shadow:0 2px 8px #556b2f40;position:relative;overflow:hidden}.btn-primary:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,rgba(255,255,255,.15),transparent);opacity:0;transition:opacity var(--transition-fast)}.btn-primary:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 4px 16px #556b2f59}.btn-primary:not(:disabled):hover:after{opacity:1}.btn-primary:not(:disabled):active{transform:translateY(0) scale(.98);box-shadow:0 1px 4px #556b2f40}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:var(--card-bg);color:var(--text-primary);border:1.5px solid var(--card-border);border-radius:var(--radius-md);font-size:var(--text-base);font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.btn-secondary:not(:disabled):hover{border-color:var(--accent-color);background:var(--accent-light);color:var(--accent-color)}.btn-secondary:not(:disabled):active{transform:scale(.98)}.btn-gold{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:linear-gradient(135deg,var(--gold-500),var(--gold-600));color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:600;cursor:pointer;transition:all var(--transition-fast);font-family:inherit;box-shadow:0 2px 8px #c49a2c40}.btn-gold:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 4px 16px #c49a2c59}.btn-gold:not(:disabled):active{transform:translateY(0) scale(.98)}.btn-danger{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:linear-gradient(135deg,var(--color-error),var(--color-error-dark));color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:600;cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.btn-danger:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-1px)}.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:transparent;color:var(--accent-color);border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.btn-ghost:not(:disabled):hover{background:var(--accent-light)}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-full);background:var(--card-bg);border:1px solid var(--card-border);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.btn-icon:not(:disabled):hover{background:var(--accent-light);color:var(--accent-color);border-color:var(--accent-color)}.btn-icon:not(:disabled):active{transform:scale(.92)}.input-field{width:100%;padding:12px 16px;background:var(--input-bg);border:1.5px solid var(--input-border);border-radius:var(--radius-md);font-size:var(--text-base);font-family:inherit;color:var(--text-primary);transition:all var(--transition-fast);outline:none}.input-field:hover{border-color:var(--input-border-hover)}.input-field:focus{border-color:var(--input-focus);box-shadow:0 0 0 3px var(--accent-light)}.input-field::placeholder{color:var(--input-placeholder)}.input-field.error{border-color:var(--color-error);box-shadow:0 0 0 3px var(--color-error-light)}.select-field{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238A8272' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:40px}[dir=rtl] .select-field{background-position:left 12px center;padding-right:16px;padding-left:40px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;text-align:center;color:var(--text-secondary)}.empty-state-icon{width:64px;height:64px;border-radius:var(--radius-full);background:var(--accent-light);color:var(--accent-color);display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:1.5rem}.empty-state-title{font-size:var(--text-lg);font-weight:700;color:var(--text-primary);margin-bottom:8px}.empty-state-text{font-size:var(--text-base);max-width:280px;line-height:1.5;color:var(--text-secondary)}.empty-state-action{margin-top:16px}.pwa-install-banner{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:linear-gradient(135deg,var(--green-800),var(--green-700));color:#fff;font-size:.85rem;gap:12px;flex-wrap:wrap;animation:slideInBottom .3s ease}.pwa-install-text{flex:1;min-width:0;font-weight:500;overflow-wrap:anywhere}.pwa-install-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.pwa-install-btn{padding:6px 14px;background:white;color:var(--green-800);border:none;border-radius:var(--radius-sm);font-size:.8rem;font-weight:600;cursor:pointer;font-family:inherit;min-height:44px}.pwa-dismiss-btn{background:none;border:none;color:#ffffffb3;font-size:1rem;cursor:pointer;padding:4px;min-width:44px;min-height:44px}@media (max-width: 420px){.pwa-install-banner{align-items:stretch;padding-inline-start:calc(12px + var(--app-safe-left, env(safe-area-inset-left, 0px)));padding-inline-end:calc(12px + var(--app-safe-right, env(safe-area-inset-right, 0px)))}.pwa-install-text{flex-basis:100%;line-height:1.5}.pwa-install-actions{width:100%;justify-content:flex-end}}.app-loading-spinner{display:flex;align-items:center;justify-content:center;min-height:200px;padding:40px 0}.app-spinner{width:36px;height:36px;border:3px solid var(--gray-200);border-top-color:var(--accent-color);border-radius:50%;animation:spin .7s linear infinite}:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Inter,Cairo,sans-serif;background:var(--bg-primary);min-height:100vh;color:var(--text-primary);transition:background var(--transition-normal),color var(--transition-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[dir=rtl]{font-family:Cairo,Inter,sans-serif}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.app-layout{display:flex;flex-direction:column;min-height:100vh;max-width:520px;margin:0 auto}.app{min-height:100vh;padding:0 16px 90px;max-width:520px;margin:0 auto}.top-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:var(--bg-primary);position:sticky;top:0;z-index:90;gap:8px;min-width:0}.top-bar-title{font-size:var(--text-xl);font-weight:800;color:var(--accent-color);letter-spacing:-.02em;display:inline-flex;align-items:center;gap:.45rem;flex:1 1 auto;min-width:0}.top-bar-brand-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-bar-logo{width:30px;height:30px;object-fit:contain;border-radius:8px;background:#faf8f0;padding:1px;flex-shrink:0;box-shadow:0 1px 2px #2a27221f,0 2px 6px #2a272214}[dir=rtl] .top-bar-title{font-family:Cairo,sans-serif;font-weight:700}.top-bar-user{display:flex;align-items:center;gap:8px;padding:6px 14px;background:var(--accent-light);border:1.5px solid rgba(85,107,47,.2);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);font-family:inherit;font-size:.8rem;font-weight:500;color:var(--accent-color);flex:0 1 auto;min-width:44px;max-width:min(48%,220px)}.top-bar-role{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-bar-user:hover{background:var(--accent-color);color:#fff;border-color:var(--accent-color)}.top-bar-avatar{width:24px;height:24px;border-radius:50%;background:var(--accent-color);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;transition:all var(--transition-fast);flex-shrink:0}@media (max-width: 360px){.top-bar{padding-inline:12px}.top-bar-title{font-size:var(--text-lg)}.top-bar-user{padding-inline:8px;max-width:46%}}.top-bar-user:hover .top-bar-avatar{background:white;color:var(--accent-color)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:520px;height:68px;background:var(--nav-bg);border-top:1px solid var(--nav-border);display:flex;align-items:center;justify-content:space-around;z-index:100;animation:slideInBottom .3s ease;box-shadow:0 -4px 20px #0000000f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}[data-theme=dark] .bottom-nav{box-shadow:0 -4px 20px #00000040}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:6px 0;flex:1;background:none;border:none;cursor:pointer;color:var(--nav-inactive);font-family:inherit;font-size:.65rem;font-weight:500;transition:all var(--transition-fast);position:relative;-webkit-tap-highlight-color:transparent}.bottom-nav-item:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:0;height:3px;background:var(--nav-active);border-radius:0 0 3px 3px;transition:width var(--transition-normal)}.bottom-nav-item.active{color:var(--nav-active);font-weight:600}.bottom-nav-item.active:before{width:28px}.bottom-nav-item:active{transform:scale(.92)}.bottom-nav-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;transition:transform var(--transition-bounce)}.bottom-nav-item.active .bottom-nav-icon{transform:translateY(-2px)}.bottom-nav-icon svg{display:block}.bottom-nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:72px}.more-menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay-bg);z-index:99;animation:fadeIn .2s ease}.more-menu{position:fixed;bottom:76px;left:50%;transform:translate(-50%);width:calc(100% - 32px);max-width:488px;background:var(--modal-bg);border:1px solid var(--card-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);padding:8px;z-index:101;animation:fadeInUp .25s ease}.more-menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;background:none;border:none;border-radius:var(--radius-md);cursor:pointer;color:var(--text-primary);font-family:inherit;font-size:.9rem;transition:all var(--transition-fast)}.more-menu-item:hover{background:var(--card-hover)}.more-menu-item:active{transform:scale(.98)}.more-menu-item.active{color:var(--nav-active);font-weight:600;background:var(--accent-light)}.more-menu-item-icon{display:flex;align-items:center;width:22px;height:22px}.navigation{display:none}.next-prayer-countdown{display:flex;flex-direction:column;align-items:center;gap:6px;padding:24px 16px 20px;margin-bottom:20px;text-align:center;background:var(--next-prayer-bg);border-radius:var(--radius-xl);color:#fff;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}.next-prayer-countdown:before{content:"";position:absolute;top:-50%;right:-20%;width:200px;height:200px;background:radial-gradient(circle,rgba(255,255,255,.08) 0%,transparent 70%);pointer-events:none}.countdown-label{font-size:var(--text-xs);font-weight:500;color:#ffffffb3;text-transform:uppercase;letter-spacing:1px}.countdown-prayer-name{font-size:var(--text-xl);font-weight:700;color:#fff}[dir=rtl] .countdown-prayer-name{font-family:Cairo,sans-serif;font-weight:700}.countdown-timer{font-size:2.8rem;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:2px;line-height:1;text-shadow:0 2px 8px rgba(0,0,0,.15)}.countdown-remaining{font-size:var(--text-xs);color:#fff9;font-weight:500}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:60vh;color:var(--text-secondary);text-align:center}.spinner{width:40px;height:40px;border:3px solid var(--card-border);border-top:3px solid var(--accent-color);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}.error{text-align:center;color:var(--text-primary);padding:40px 20px}.error h1{font-size:1.8rem;margin-bottom:24px;color:var(--accent-color)}.error button{background:var(--accent-color);color:#fff;border:none;padding:12px 24px;border-radius:var(--radius-full);font-size:.95rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:inherit}.error button:hover{background:var(--green-900);transform:translateY(-1px);filter:brightness(1.1)}.content{display:flex;flex-direction:column;gap:20px;animation:fadeInUp .4s ease}.date-section{display:flex;justify-content:center}.date-card{background:var(--card-bg);padding:20px;border-radius:var(--radius-xl);text-align:center;box-shadow:var(--shadow-md);width:100%;border:1px solid var(--card-border);position:relative;overflow:hidden}.date-card:after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--green-600),var(--gold-500),var(--green-600))}.date-card h3{font-size:var(--text-xs);color:var(--accent-color);margin-bottom:12px;font-weight:600;text-transform:uppercase;letter-spacing:1px}.gregorian-date{font-size:var(--text-lg);font-weight:700;color:var(--text-primary);margin-bottom:6px}.hijri-date{font-family:Cairo,sans-serif;font-size:1.1rem;color:var(--text-secondary);margin-bottom:4px;font-weight:600}.hijri-year{font-family:Cairo,sans-serif;font-size:var(--text-base);color:var(--text-tertiary)}.prayer-times{background:var(--card-bg);padding:20px 16px;border-radius:var(--radius-xl);box-shadow:var(--shadow-md);border:1px solid var(--card-border)}.prayer-times h3{text-align:center;font-size:var(--text-xs);color:var(--accent-color);margin-bottom:16px;font-weight:600;text-transform:uppercase;letter-spacing:1px}.prayers-grid{display:flex;flex-direction:column;gap:8px}.prayer-card{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--prayer-card-bg);border-radius:var(--radius-md);border-left:3px solid transparent;transition:all var(--transition-fast);position:relative}.prayer-card:hover{background:var(--prayer-card-hover)}[dir=rtl] .prayer-card{border-left:none;border-right:3px solid transparent}.prayer-card.next-prayer{background:var(--next-prayer-bg);color:#fff;border-left:3px solid var(--next-prayer-border);box-shadow:0 4px 14px #556b2f4d}[dir=rtl] .prayer-card.next-prayer{border-left:none;border-right:3px solid var(--next-prayer-border)}.prayer-name{display:flex;flex-direction:column;gap:2px}.prayer-display{font-size:var(--text-md);font-weight:600;color:var(--text-primary)}.prayer-card.next-prayer .prayer-display{color:#fff}[dir=rtl] .prayer-display{font-family:Cairo,sans-serif}.prayer-time{font-size:var(--text-md);font-weight:700;font-family:Inter,monospace;color:var(--text-primary);font-variant-numeric:tabular-nums}.prayer-card.next-prayer .prayer-time{color:#fff}.next-indicator{position:absolute;top:-8px;right:12px;background:var(--green-900);color:#fff;padding:3px 10px;border-radius:var(--radius-full);font-size:.7rem;font-weight:600;box-shadow:var(--shadow-sm)}[dir=rtl] .next-indicator{right:auto;left:12px}.location-info{text-align:center;color:var(--text-tertiary);font-size:.8rem;margin-top:8px}.notification-banner{background:var(--color-warning-light);color:var(--gray-700);padding:12px 16px;text-align:center;margin-bottom:16px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;border:1px solid var(--color-warning)}.notification-banner button{padding:6px 14px;border:none;border-radius:var(--radius-sm);background:var(--gray-700);color:#fff;cursor:pointer;font-size:.85rem;font-family:inherit;transition:background var(--transition-fast)}.notification-banner button:hover{background:var(--gray-600)}.back-button{background:var(--card-bg);color:var(--text-primary);border:1.5px solid var(--card-border);width:38px;height:38px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast);margin-inline-end:12px;font-size:1rem;flex-shrink:0;box-shadow:var(--shadow-xs)}.back-button:hover{background:var(--card-hover);border-color:var(--accent-color);color:var(--accent-color);transform:scale(1.05)}.back-button:active{transform:scale(.95)}[dir=rtl] .back-button{transform:scaleX(-1)}[dir=rtl] .back-button:hover{transform:scaleX(-1) scale(1.05)}[dir=rtl] .back-button:active{transform:scaleX(-1) scale(.95)}.page-header{display:flex;align-items:center;margin-bottom:20px;padding:4px 0}.page-header h1{font-size:var(--text-2xl);font-weight:700;color:var(--text-primary);flex:1}[dir=rtl] .page-header h1{font-family:Cairo,sans-serif;font-weight:700}.page-header-subtitle{font-size:var(--text-sm);color:var(--text-secondary);margin-top:2px}@media (max-width: 480px){.app{padding:0 12px 80px}.date-card,.prayer-times{padding:16px 12px}.prayer-card{padding:12px 14px}.bottom-nav-item{font-size:.6rem}.bottom-nav-icon{width:22px;height:22px}.countdown-timer{font-size:2.2rem}}@media (max-width: 767px),(pointer: coarse){button:not([data-allow-compact-touch-target]),[role=button]:not([data-allow-compact-touch-target]),[role=tab]:not([data-allow-compact-touch-target]){min-width:44px;min-height:44px}input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea,a[href][class]{min-height:44px}.toggle-label,.ugc-terms-confirm,.activity-report-reason,.khatmah-reminder-label,.audience-option,.audience-picker-item,.role-checkbox,.mr-declaration,.zakat-radio-label{min-width:44px;min-height:44px}}@media (min-width: 768px){.app{max-width:680px;padding:0 24px 100px}.app-layout{max-width:680px}.bottom-nav{max-width:680px;height:72px}.prayers-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}}:where(button:not([class]),button[class=""]){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;max-width:100%;padding:10px 18px;border:1px solid var(--card-border);border-radius:var(--radius-md);background:var(--card-bg);color:var(--text-primary);font:inherit;font-size:var(--text-base);font-weight:600;line-height:1.4;cursor:pointer}:is(.btn-primary,.btn-secondary,.btn-danger,.btn-gold,.btn-ghost,.pdf-button){min-height:44px;max-width:100%;line-height:1.4;text-align:center;padding-block:10px;padding-inline:20px;box-sizing:border-box}:is(.btn-primary-sm,.btn-secondary-sm,.btn-danger-sm){min-height:36px;font-family:inherit;line-height:1.35;border-radius:var(--radius-sm)}:is(.btn-primary,.btn-secondary,.btn-danger,.btn-gold,.btn-ghost,.pdf-button)>svg{width:18px;height:18px;flex-shrink:0}:is(.btn-primary,.btn-secondary,.btn-danger,.btn-gold,.btn-ghost,.btn-icon,.pdf-button,.btn-primary-sm,.btn-secondary-sm,.btn-danger-sm):disabled,:where(button:not([class]),button[class=""]):disabled{opacity:.55;cursor:not-allowed;transform:none;filter:none;box-shadow:none}button[aria-busy=true]{cursor:progress}.staff-page-controls{margin:12px 0;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.staff-page-controls small{color:var(--text-secondary);line-height:1.5}:is(.btn-primary,.btn-secondary,.btn-danger,.btn-gold,.btn-ghost,.btn-icon,.pdf-button):focus-visible{outline:3px solid var(--accent-color);outline-offset:3px}@media (prefers-reduced-motion:reduce){button{transition:none!important}}:root{--app-safe-top: var(--safe-area-inset-top, env(safe-area-inset-top, 0px));--app-safe-right: var(--safe-area-inset-right, env(safe-area-inset-right, 0px));--app-safe-bottom: var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px));--app-safe-left: var(--safe-area-inset-left, env(safe-area-inset-left, 0px))}body{min-height:100dvh;overflow-x:hidden}.app{min-height:100dvh;padding-inline-start:calc(16px + var(--app-safe-left));padding-inline-end:calc(16px + var(--app-safe-right));padding-bottom:calc(90px + var(--app-safe-bottom))}.top-bar{padding-top:calc(14px + var(--app-safe-top));padding-inline-start:calc(16px + var(--app-safe-left));padding-inline-end:calc(16px + var(--app-safe-right))}.bottom-nav{height:calc(68px + var(--app-safe-bottom));padding-bottom:var(--app-safe-bottom);padding-inline-start:var(--app-safe-left);padding-inline-end:var(--app-safe-right)}.more-menu{bottom:calc(76px + var(--app-safe-bottom))}@media (max-width: 480px){.app{padding-inline-start:calc(12px + var(--app-safe-left));padding-inline-end:calc(12px + var(--app-safe-right));padding-bottom:calc(80px + var(--app-safe-bottom))}}
