:root { --quran-font-size: 32px; }
        body { transition: background-color 0.3s, color 0.3s; scroll-behavior: smooth; }
        .quran-font { font-size: var(--quran-font-size); line-height: 2.2; transition: all 0.2s ease; }
        
        .loading-spinner { border: 4px solid rgba(16, 185, 129, 0.1); width: 40px; height: 40px; border-radius: 50%; border-top-color: #10b981; animation: spin 1s linear infinite; }
        @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

        .tab-btn.active { border-bottom: 4px solid #10b981; color: #10b981; opacity: 1; font-weight: 800; background: linear-gradient(180deg, rgba(16,185,129,0.08), transparent); }
        
        #splash-screen {
            position: fixed; inset: 0; z-index: 9999; background: #020617;
            display: flex; flex-direction: column; align-items: center; justify-content: center;
            transition: opacity 0.6s ease, visibility 0.6s ease;
        }

        .floating-controls { position: fixed; bottom: 2rem; right: 1.5rem; display: flex; flex-direction: column; gap: 0.75rem; z-index: 100; }
        .stagger-item { opacity: 0; animation: pop 0.5s ease forwards; }
        
        .reset-btn { transition: transform 0.4s ease; }
        .reset-btn:active { transform: rotate(-180deg); }
        .hide-scrollbar::-webkit-scrollbar { display: none; }
        .hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

        .ambient-blob { position: fixed; border-radius: 9999px; filter: blur(90px); opacity: 0.25; z-index: -1; pointer-events: none; }

        .accordion-body { max-height: 0; overflow: hidden; transition: max-height 0.35s ease; }
        .accordion-body.open { max-height: 800px; }