:root{--primary-teal: #14B8A6;--primary-blue: #3B82F6;--accent-purple: #8B5CF6;--dark-bg: #0F172A;--card-bg: #1E293B;--text-primary: #F1F5F9;--text-secondary: #94A3B8;--gradient-primary: linear-gradient(135deg, #14B8A6 0%, #3B82F6 100%);--gradient-secondary: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);--gradient-hero: linear-gradient(135deg, #14B8A6 0%, #3B82F6 50%, #8B5CF6 100%);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .12);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 25px rgba(20, 184, 166, .2)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--dark-bg);color:var(--text-primary);line-height:1.6;overflow-x:hidden}.container{max-width:1280px;margin:0 auto;padding:0 24px}.main-header{background:#0f172af2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:1rem 0;position:sticky;top:0;z-index:1000;border-bottom:1px solid rgba(20,184,166,.2);box-shadow:0 2px 10px #0000001a}.main-header .container{display:flex;justify-content:space-between;align-items:center}.logo h1{font-size:1.8rem;font-weight:800;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px}.nav-toggle{display:none;flex-direction:column;background:none;border:none;cursor:pointer;padding:.5rem}.nav-toggle span{width:28px;height:3px;background:var(--text-primary);margin:4px 0;transition:.3s;border-radius:3px}.nav-menu{display:flex;list-style:none;gap:2.5rem;align-items:center}.nav-menu a{color:var(--text-secondary);text-decoration:none;transition:all .3s;font-weight:600;font-size:.95rem;position:relative}.nav-menu a:after{content:"";position:absolute;bottom:-4px;left:0;width:0;height:3px;background:var(--gradient-primary);transition:width .3s}.nav-menu a:hover,.nav-menu a.active{color:var(--primary-teal)}.nav-menu a:hover:after,.nav-menu a.active:after{width:100%}.hero-section{padding:6rem 0 4rem;text-align:center;background:linear-gradient(180deg,#14b8a61a,#0f172a00);position:relative;overflow:hidden}.hero-section:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(20,184,166,.15) 0%,transparent 70%);animation:pulse-slow 8s ease-in-out infinite}@keyframes pulse-slow{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.1);opacity:.8}}.hero-title{font-size:3.5rem;font-weight:900;margin-bottom:1rem;color:#fff;text-shadow:2px 2px 20px rgba(0,0,0,.3);position:relative;z-index:1;letter-spacing:-1px}.hero-subtitle{font-size:1.3rem;color:#fff;opacity:.95;position:relative;z-index:1;font-weight:500}.games-section{padding:4rem 0;min-height:60vh}.section-header{text-align:center;margin-bottom:3rem}.section-header h2{font-size:2.5rem;font-weight:800;margin-bottom:2rem;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.filter-buttons{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;align-items:center}.filter-btn{padding:.75rem 1.75rem;background:var(--card-bg);color:var(--text-secondary);border:2px solid transparent;border-radius:50px;cursor:pointer;transition:all .3s;font-weight:600;font-size:.95rem;text-decoration:none;display:inline-block}.filter-btn:hover{background:linear-gradient(var(--card-bg),var(--card-bg)) padding-box,var(--gradient-primary) border-box;border-color:transparent;color:var(--primary-teal);transform:translateY(-2px)}.filter-btn.active{background:var(--gradient-primary);color:#fff;border-color:transparent;box-shadow:0 4px 15px #14b8a666}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:2rem;margin-top:2rem}.game-card{background:var(--card-bg);border-radius:12px;overflow:hidden;transition:all .3s ease;cursor:pointer;text-decoration:none;color:inherit;border:1px solid rgba(148,163,184,.1);position:relative}.game-card:before{content:"";position:absolute;inset:0;background:var(--gradient-primary);opacity:0;transition:opacity .3s;border-radius:16px;z-index:-1}.game-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--primary-teal)}.game-card:hover:before{opacity:.1}.game-image-wrapper{position:relative;padding-top:66.67%;overflow:hidden;background:linear-gradient(135deg,#2a303c,#1a1f2e)}.game-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .4s}.game-card:hover .game-image{transform:scale(1.1)}.game-category{position:absolute;top:12px;right:12px;background:var(--gradient-primary);color:#fff;padding:.4rem 1rem;border-radius:20px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 10px #0000004d}.game-info{padding:1.5rem}.game-title{font-size:1.2rem;font-weight:700;margin-bottom:.75rem;color:var(--text-primary);line-height:1.3}.game-description{font-size:.9rem;color:var(--text-secondary);line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.play-btn{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;padding:.6rem 1.5rem;background:var(--gradient-primary);color:#fff;border:none;border-radius:8px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .3s;box-shadow:0 2px 8px #14b8a64d}.play-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #14b8a680}.skeleton-card{background:var(--card-bg);border-radius:16px;overflow:hidden;animation:pulse 1.5s ease-in-out infinite}.skeleton-image{height:200px;background:linear-gradient(90deg,#2a303c 25%,#3a404c,#2a303c 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}.skeleton-content{padding:1.5rem}.skeleton-title{height:20px;background:linear-gradient(90deg,#2a303c 25%,#3a404c,#2a303c 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px;margin-bottom:1rem}.skeleton-text{height:14px;background:linear-gradient(90deg,#2a303c 25%,#3a404c,#2a303c 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px;margin-bottom:.5rem}.skeleton-text:last-child{width:60%}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.8}}.no-results{text-align:center;padding:4rem 2rem;color:var(--text-secondary)}.no-results-icon{font-size:4rem;margin-bottom:1rem}.no-results-text{font-size:1.5rem;font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.main-footer{background:var(--card-bg);padding:3rem 0 1.5rem;margin-top:4rem;border-top:1px solid rgba(20,184,166,.2)}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:3rem;margin-bottom:2rem}.footer-section h3{font-size:1.5rem;margin-bottom:1rem;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.footer-section h4{color:var(--text-primary);margin-bottom:1rem;font-size:1.1rem}.footer-section p{color:var(--text-secondary);line-height:1.8}.footer-section ul{list-style:none}.footer-section ul li{margin-bottom:.75rem}.footer-section ul li a{color:var(--text-secondary);text-decoration:none;transition:color .3s;font-weight:500}.footer-section ul li a:hover{color:var(--primary-teal)}.footer-bottom{text-align:center;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1);color:var(--text-secondary)}.fade-in{animation:fadeIn .6s ease-out forwards;opacity:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.nav-toggle{display:flex}.nav-menu{position:fixed;left:-100%;top:70px;flex-direction:column;background:#1a1f2efa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);width:100%;text-align:center;transition:.3s;box-shadow:0 10px 27px #0000004d;padding:2rem 0;gap:1.5rem;border-top:1px solid rgba(20,184,166,.2)}.nav-menu.active{left:0}.hero-title{font-size:2.5rem}.hero-subtitle{font-size:1.1rem}.section-header h2{font-size:2rem}.games-grid{grid-template-columns:repeat(2,1fr);gap:1rem}.filter-buttons{gap:.75rem}.filter-btn{padding:.6rem 1.3rem;font-size:.85rem}.game-info{padding:1rem}.game-title{font-size:1rem;margin-bottom:.5rem}.game-description{font-size:.8rem;-webkit-line-clamp:2}.game-category{font-size:.65rem;padding:.3rem .75rem}}@media(max-width:480px){.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}.games-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}.logo h1{font-size:1.5rem}.container{padding:0 16px}.game-info{padding:.75rem}.game-title{font-size:.9rem}.game-description{font-size:.75rem}.play-btn{font-size:.8rem;padding:.5rem 1rem}}.scroll-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:var(--gradient-primary);color:#fff;border:none;border-radius:12px;cursor:pointer;display:none;align-items:center;justify-content:center;font-size:1.5rem;transition:all .3s;box-shadow:0 4px 15px #14b8a666;z-index:999}.scroll-to-top:hover{transform:translateY(-5px);box-shadow:0 6px 20px #14b8a699}.scroll-to-top.show{display:flex}