* { -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
        html, body { width: 100%; height: 100%; margin: 0; padding: 0; font-family: 'Plus Jakarta Sans', sans-serif; background-color: #072e3d; }
        .app-wrapper { width: 100%; min-height: 100vh; min-height: 100dvh; display: flex; justify-content: center; align-items: center; padding: 0; background-color: #072e3d; }
        #app { position: relative; width: 100%; max-width: 448px; height: 100vh; height: 100dvh; max-height: 900px; min-height: 600px; margin: 0 auto; background-color: #f8fafc; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6), 0 0 25px rgba(13, 148, 136, 0.25); border: 2px solid #0d9488; }
        @media (min-width: 640px) { .app-wrapper { padding: 1.5rem 0; } #app { height: 860px; border-radius: 1.75rem; border: 2px solid #0d9488; } }
        .app-screen { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: #f8fafc; display: flex; flex-direction: column; overflow-y: auto; z-index: 20; }
        .app-screen.hidden { display: none !important; }
        .hide-scrollbar::-webkit-scrollbar { display: none; }
        .hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
        .animate-fade-in { animation: fadeIn 0.25s ease-out forwards; }
        @keyframes pulseGlow { 0%, 100% { box-shadow: 0 0 0 0 rgba(13, 148, 136, 0.4); } 50% { box-shadow: 0 0 0 6px rgba(13, 148, 136, 0); } }
        .prayer-upcoming-active { animation: pulseGlow 2s infinite; background-color: #ccfbf1 !important; border-color: #0d9488 !important; }
        .qurban-hero { background: linear-gradient(135deg, #104a33, #218357); }
        .qurban-option-card { min-width: 0; }
        .qurban-summary { background: #edf6ee; color: #34483a; }
        .qurban-summary strong { color: #146b45; }
        .qurban-label { display: block; margin: 0.25rem 0 -0.35rem; color: #475569; font-size: 0.7rem; font-weight: 700; }
        .qurban-input { width: 100%; border: 1px solid #d3ddd5; border-radius: 0.75rem; background: #fff; padding: 0.65rem 0.75rem; color: #1e293b; font: inherit; font-size: 0.75rem; }
        .qurban-input:focus { outline: 2px solid #75b895; border-color: #146b45; }
