:root{--primary:#ff6b9d;--primary-light:#ffb3d0;--primary-dark:#e84a7b;--secondary:#6c5ce7;--secondary-light:#a29bfe;--accent:#00d2d3;--accent-dark:#00a8a9;--gradient-primary:linear-gradient(135deg,#667eea 0%,#764ba2 100%);--gradient-secondary:linear-gradient(135deg,#f093fb 0%,#f5576c 100%);--gradient-accent:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%);--gradient-sunset:linear-gradient(135deg,#fa709a 0%,#fee140 100%);--gradient-ocean:linear-gradient(135deg,#a8edea 0%,#fed6e3 100%);--white:#fff;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--spacing-xs:.5rem;--spacing-sm:1rem;--spacing-md:1.5rem;--spacing-lg:2rem;--spacing-xl:3rem;--spacing-2xl:4rem;--radius-sm:.5rem;--radius-md:1rem;--radius-lg:1.5rem;--radius-xl:2rem;--radius-full:9999px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a;--shadow-xl:0 20px 25px -5px #0000001a;--shadow-2xl:0 25px 50px -12px #00000040;--font-primary:"Poppins",sans-serif;--font-secondary:"Inter",sans-serif;--transition-fast:.15s ease;--transition-base:.3s ease;--transition-slow:.5s ease}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-secondary);color:var(--gray-800);background:var(--gray-50);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;line-height:1.6;overflow-x:hidden}#root{width:100%;min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:var(--font-primary);color:var(--gray-900);font-weight:700;line-height:1.2}h1{font-size:3.5rem;font-weight:800}h2{font-size:2.5rem}h3{font-size:2rem}h4{font-size:1.5rem}p{color:var(--gray-600);font-size:1rem;line-height:1.7}a{color:var(--primary);transition:color var(--transition-base);text-decoration:none}a:hover{color:var(--primary-dark)}button{font-family:var(--font-primary);cursor:pointer;transition:all var(--transition-base);border:none;outline:none;font-weight:600}button:disabled{opacity:.6;cursor:not-allowed}.container{width:100%;max-width:1200px;padding:0 var(--spacing-md);margin:0 auto}.glass{-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow-xl);background:#ffffff40;border:1px solid #ffffff2e}.glass-dark{-webkit-backdrop-filter:blur(10px);background:#00000040;border:1px solid #ffffff1a}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fadeIn{animation:.6s ease-out fadeIn}.animate-slideInUp{animation:.8s ease-out slideInUp}.animate-float{animation:3s ease-in-out infinite float}@media (max-width:768px){html{font-size:14px}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}.container{padding:0 var(--spacing-sm)}}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--gray-100)}::-webkit-scrollbar-thumb{background:var(--primary);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--primary-dark)}@media (max-width:1024px){.camera-page .content{grid-template-columns:1fr!important}.camera-page .preview-section{max-height:none!important}.edit-download-page .content{grid-template-columns:1fr!important}}@media (max-width:768px){.landing-page .hero-title{font-size:2.5rem!important}.landing-page .floating-card,.landing-page .nav-links{display:none!important}.layout-selection .layout-grid{grid-template-columns:1fr!important;padding:0 .5rem!important}.camera-page{padding:1rem!important}.camera-page .content{gap:1rem!important}.camera-page .preview-section{order:-1}.edit-download-page{padding:1rem!important}.edit-download-page .content{gap:1rem!important}.edit-download-page .color-grid{grid-template-columns:repeat(4,1fr)!important}}@media (max-width:480px){.landing-page .hero-title{font-size:2rem!important}.landing-page .hero-buttons{flex-direction:column!important;width:100%!important}.landing-page .hero-buttons button{width:100%!important}}