/* Global styles - Ultra Premium */ @import './styles/variables.css'; @import './styles/themes.css'; @import './styles/animations.css'; @import './styles/components.css'; @import './styles/responsive.css'; @import './styles/privacy.css'; *, *::before, *::after { box-sizing: border-box; } html { font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Response Base Font Size */ @media (max-width: 600px) { html { font-size: 14.5px; } } body { margin: 0; padding: 0; font-family: var(--font-sans); line-height: var(--leading-normal); background-color: var(--bg-primary); /* Ultra Premium Aurora Background - Animated */ background-image: radial-gradient(at 0% 0%, rgba(217, 119, 6, 0.18) 0px, transparent 50%), radial-gradient(at 100% 0%, rgba(59, 130, 246, 0.18) 0px, transparent 50%), radial-gradient(at 100% 100%, rgba(139, 92, 246, 0.18) 0px, transparent 50%), radial-gradient(at 0% 100%, rgba(16, 185, 129, 0.12) 0px, transparent 50%), radial-gradient(at 50% 50%, rgba(255, 255, 255, 0.5) 0px, transparent 70%); background-attachment: fixed; background-size: 120% 120%; /* Larger to allow movement */ animation: aurora-gradient 20s ease-in-out infinite alternate; color: var(--text-primary); transition: background-color var(--duration-normal) var(--ease-in-out), color var(--duration-fast) var(--ease-in-out); /* Subtle Grain Texture for reduced banding and analog feel */ position: relative; } /* Noise overlay */ body::after { content: ""; position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 9999; opacity: 0.03; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E"); } [data-theme="dark"] body { background-image: radial-gradient(at 0% 0%, rgba(217, 119, 6, 0.2) 0px, transparent 60%), radial-gradient(at 100% 0%, rgba(59, 130, 246, 0.2) 0px, transparent 60%), radial-gradient(at 100% 100%, rgba(139, 92, 246, 0.2) 0px, transparent 60%), radial-gradient(at 0% 100%, rgba(16, 185, 129, 0.15) 0px, transparent 60%); animation: aurora-gradient 25s ease-in-out infinite alternate; } [data-theme="dark"] body::after { opacity: 0.05; filter: invert(1); } /* Hidden Scrollbar (Clean UI) */ ::-webkit-scrollbar { width: 0px; height: 0px; background: transparent; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: transparent; display: none; } /* Firefox Scrollbar */ * { scrollbar-width: none; /* Hide scrollbar in Firefox */ -ms-overflow-style: none; /* Hide scrollbar in IE/Edge */ } /* Reset default styles */ h1, h2, h3, h4, h5, h6 { margin: 0; font-family: 'Outfit', sans-serif; letter-spacing: -0.02em; } p { margin: 0 0 1rem; } ul, ol { margin: 0; padding: 0; list-style: none; } a { color: inherit; text-decoration: none; transition: color 0.2s ease; } button { font-family: inherit; } /* Utility classes */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } /* Accessibility Focus Ring */ :focus-visible { outline: 2px solid var(--accent-primary); outline-offset: 2px; box-shadow: 0 0 0 4px rgba(var(--accent-rgb), 0.2); border-radius: 6px; } /* Reduced Motion */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }