@import url(https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap);*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color:#667eea;--secondary-color:#764ba2;--success-color:#10b981;--warning-color:#f59e0b;--error-color:#ef4444;--text-primary:#1f2937;--text-secondary:#6b7280;--border-color:#e5e7eb;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.1),0 2px 4px -1px rgba(0, 0, 0, 0.06);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);--shadow-xl:0 20px 25px -5px rgba(0, 0, 0, 0.1),0 10px 10px -5px rgba(0, 0, 0, 0.04)}body{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.6;color:var(--text-primary);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{scroll-behavior:smooth}.navbar{transition:.3s}.nav-link{position:relative;padding:.5rem 1rem;border-radius:var(--radius-md);transition:.3s;text-decoration:none}.nav-link:hover{background-color:rgba(102,126,234,.1);transform:translateY(-1px)}.nav-link::after{content:'';position:absolute;bottom:0;left:50%;width:0;height:2px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));transition:.3s;transform:translateX(-50%)}.nav-link:hover::after{width:80%}.language-toggle{display:flex;align-items:center;background:#f3f4f6;border-radius:.5rem;padding:.25rem;gap:.125rem;box-shadow:var(--shadow-sm)}.language-toggle button{padding:.5rem .75rem;font-size:.875rem;font-weight:500;border:none;border-radius:.375rem;background:0 0;color:#6b7280;cursor:pointer;transition:.2s;position:relative;overflow:hidden}.language-toggle button:hover{color:var(--primary-color);background:rgba(102,126,234,.1)}.language-toggle button.active{background:var(--primary-color);color:#fff;box-shadow:var(--shadow-sm);transform:scale(1.02)}.language-toggle button:active{transform:scale(.98)}@media (max-width:768px){.language-toggle{width:100%;margin:.5rem 0}.language-toggle button{flex:1;text-align:center;padding:.75rem}}.btn-primary{background:linear-gradient(135deg,var(--primary-color) 0,var(--secondary-color) 100%);color:#fff;padding:.75rem 1.5rem;border-radius:var(--radius-lg);font-weight:600;font-size:.875rem;border:none;cursor:pointer;transition:.3s;box-shadow:0 4px 15px rgba(102,126,234,.4);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(102,126,234,.6)}.btn-primary:active{transform:translateY(0)}.btn-primary-large{background:linear-gradient(135deg,var(--primary-color) 0,var(--secondary-color) 100%);color:#fff;padding:1rem 2rem;border-radius:var(--radius-xl);font-weight:700;font-size:1.125rem;border:none;cursor:pointer;transition:.3s;box-shadow:0 8px 25px rgba(102,126,234,.4);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.btn-primary-large:hover{transform:translateY(-3px);box-shadow:0 12px 35px rgba(102,126,234,.6)}.btn-secondary{background:rgba(255,255,255,.9);color:var(--text-primary);padding:.75rem 1.5rem;border-radius:var(--radius-lg);font-weight:600;font-size:.875rem;border:1px solid rgba(255,255,255,.3);cursor:pointer;transition:.3s;backdrop-filter:blur(10px);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.btn-secondary:hover{background:#fff;transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-secondary-large{background:rgba(255,255,255,.9);color:var(--text-primary);padding:1rem 2rem;border-radius:var(--radius-xl);font-weight:600;font-size:1.125rem;border:1px solid rgba(255,255,255,.3);cursor:pointer;transition:.3s;backdrop-filter:blur(10px);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.btn-secondary-large:hover{background:#fff;transform:translateY(-2px);box-shadow:var(--shadow-xl)}.value-card{background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-lg);padding:1.5rem 1rem;text-align:center;color:#fff;transition:.3s}.value-card:hover{background:rgba(255,255,255,.15);transform:translateY(-5px)}.game-preview-container{perspective:1000px;display:flex;justify-content:center;margin-top:2rem}.game-preview{background:rgba(255,255,255,.1);backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-xl);padding:2rem;transform-style:preserve-3d;transition:.3s;animation:6s ease-in-out infinite float}.game-preview:hover{transform:rotateX(5deg) rotateY(5deg) translateZ(20px)}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}.constraint-preview{background:rgba(255,255,255,.8);border-radius:var(--radius-sm);padding:.25rem;font-size:.75rem;font-weight:600;color:var(--text-primary);display:flex;align-items:center;justify-content:center;min-height:2rem}.cell-preview{background:rgba(255,255,255,.3);border:1px solid rgba(255,255,255,.4);border-radius:var(--radius-sm);aspect-ratio:1;transition:.3s}.cell-preview.cell-active{background:linear-gradient(135deg,var(--success-color),#059669);border-color:var(--success-color);box-shadow:0 0 15px rgba(16,185,129,.5);animation:2s ease-in-out infinite cellPulse}@keyframes cellPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.difficulty-card{background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border-radius:1.5rem;padding:2rem;text-align:center;transition:.3s;border:2px solid transparent;position:relative;overflow:hidden}.difficulty-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,0,0,.15);border-color:var(--primary-color)}.difficulty-card.featured{border-color:var(--primary-color);background:linear-gradient(135deg,rgba(102,126,234,.05),rgba(118,75,162,.05))}.difficulty-card::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s;pointer-events:none}.difficulty-card:hover::before{left:100%}.difficulty-icon{font-size:3rem;margin-bottom:1rem;display:block}.difficulty-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;border-radius:20px;font-size:.875rem;font-weight:600;margin-bottom:1rem}.difficulty-easy{background:rgba(34,197,94,.2);color:#16a34a}.difficulty-medium{background:rgba(245,158,11,.2);color:#d97706}.difficulty-hard{background:rgba(239,68,68,.2);color:#dc2626}.featured-badge{position:absolute;top:1rem;right:1rem;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;padding:.25rem .75rem;border-radius:20px;font-size:.75rem;font-weight:600}.btn-difficulty{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;padding:.75rem 1.5rem;border-radius:var(--radius-lg);font-weight:600;border:none;cursor:pointer;transition:.3s;width:100%}.btn-difficulty:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(102,126,234,.4)}.btn-featured{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 4px 15px rgba(245,158,11,.4)}.btn-featured:hover{box-shadow:0 8px 25px rgba(245,158,11,.6)}.feature-card{background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border-radius:var(--radius-xl);padding:2rem;text-align:center;transition:.3s;border:1px solid rgba(255,255,255,.3)}.feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-xl);background:#fff}.feature-icon{font-size:3rem;margin-bottom:1rem;display:block}.app-download-card{background:rgba(255,255,255,.95);backdrop-filter:blur(15px);border-radius:2rem;padding:3rem 2rem;border:1px solid rgba(255,255,255,.3);box-shadow:var(--shadow-xl)}.app-icon{font-size:4rem;margin-bottom:1rem;display:block}.app-feature{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--text-secondary)}.social-link{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:var(--primary-color);color:#fff;border-radius:50%;text-decoration:none;transition:.3s;font-size:.875rem;font-weight:600}.social-link:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(102,126,234,.4)}.loading-spinner{border-top:.25rem solid var(--primary-color)}#installPrompt{animation:.5s slideInUp}@keyframes slideInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.value-card{padding:1rem .5rem}.difficulty-card,.feature-card{padding:1.5rem}.app-download-card{padding:2rem 1.5rem}.game-preview{padding:1rem}}@media (min-width:769px) and (max-width:1024px){.difficulty-card{padding:1.75rem}}@media (prefers-reduced-motion:reduce){*{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}}a:focus,button:focus,input:focus{outline:2px solid var(--primary-color);outline-offset:2px}@media (prefers-contrast:high){.app-download-card,.difficulty-card,.feature-card{border:2px solid var(--text-primary)}.btn-primary,.btn-primary-large{border:2px solid #fff}}.animate-fade-in{animation:.6s ease-out forwards fadeIn;opacity:0}@keyframes fadeIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.difficulty-card.selected{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(102,126,234,.2),var(--shadow-xl);transform:scale(1.02)}.loading-spinner{width:40px;height:40px;border:4px solid #e5e7eb;border-top:4px solid var(--primary-color);border-radius:50%;animation:1s linear infinite spin;margin:0 auto}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.standalone-mode{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.message-slide-in{animation:.3s ease-out slideInRight}.message-slide-out{animation:.3s ease-in slideOutRight}@keyframes slideInRight{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes slideOutRight{from{transform:translateX(0);opacity:1}to{transform:translateX(100%);opacity:0}}.block-active{background-color:var(--success-color)!important;color:#fff;border-color:var(--success-color)}.block-marked{background-color:rgba(255,193,7,.35)!important;border-color:#f57f17;border-width:2px;position:relative}.mark-symbol{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:1.5em;color:#f57f17;font-weight:900;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.2)}.piano-effect{animation:.3s ease-out pianoPress}@keyframes pianoPress{0%,100%{transform:scale(1)}50%{transform:scale(.95)}}.shimmer-effect{animation:.5s ease-in-out shimmer}@keyframes shimmer{0%,100%{background-color:var(--success-color)}50%{background-color:#34d399}}.col-complete,.row-complete{box-shadow:0 0 10px rgba(16,185,129,.5)}.completed{background-color:var(--success-color);color:#fff}