@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.landing-view{background-color:var(--color-bg);color:var(--color-text);margin:0;padding:0;font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;justify-content:flex-start;min-height:100vh;position:relative;overflow-x:hidden;overflow-y:auto;background-image:radial-gradient(var(--color-border) 1px,transparent 1px);background-size:24px 24px;background-position:-12px -12px;flex-direction:column;padding-bottom:var(--space-10);scroll-behavior:smooth}.landing-nav,.landing-view{display:flex;align-items:center}.landing-nav{width:100%;max-width:1200px;justify-content:space-between;padding:var(--space-4) var(--space-6);animation:fadeIn .6s .1s var(--easing-standard) forwards;opacity:0;position:-webkit-sticky;position:sticky;top:0;background-color:rgba(31,37,43,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;border-radius:var(--radius-lg);margin:var(--space-4);border:1px solid var(--color-border)}.nav-logo-link{display:flex;align-items:center;text-decoration:none}.nav-logo{height:40px;width:auto;transition:transform var(--duration-base) var(--easing-standard)}.nav-logo:hover{transform:scale(1.05)}.nav-links{display:flex;gap:var(--space-5);align-items:center}.nav-link{font-family:var(--font-body);font-size:var(--text-md);font-weight:500;color:var(--color-text-muted);text-decoration:none;transition:color var(--duration-fast) var(--easing-standard);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md)}.nav-link-cta,.nav-link:hover{color:var(--color-text)}.nav-link-cta{background:linear-gradient(90deg,#a855f7,#6366f1);padding:var(--space-2) var(--space-5);border-radius:var(--radius-md);font-weight:600;box-shadow:0 2px 8px rgba(168,85,247,.3)}.nav-link-cta:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(168,85,247,.4);filter:brightness(1.1)}.logo-container{width:100%;display:flex;justify-content:center;margin-bottom:var(--space-6);animation:fadeIn .6s .1s var(--easing-standard) forwards;opacity:0}.site-logo{max-width:120px;height:auto;transition:transform var(--duration-base) var(--easing-standard)}.site-logo:hover{transform:scale(1.05)}.hero-container{display:flex;align-items:center;gap:var(--space-8);background-color:var(--color-surface);padding:48px;border-radius:var(--radius-lg);max-width:1200px;width:100%;margin:0 var(--space-4);box-shadow:var(--shadow-lg),0 0 80px rgba(0,0,0,.6);position:relative;z-index:1;animation:fadeIn .6s .2s var(--easing-standard) forwards;opacity:0;border:1px solid var(--color-border)}.hero-container>*,.hero-left>*{animation:fadeIn .6s var(--easing-standard) forwards;opacity:0}.hero-title{animation-delay:.2s}.hero-subtitle{animation-delay:.3s}.feature-tags{animation-delay:.4s}.cta-button{animation-delay:.5s}.hero-right{animation-delay:.4s}.hero-left{flex:1 1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-6);z-index:2}.hero-title{font-family:var(--font-display);font-size:56px;font-weight:700;line-height:1.1;margin:0;color:var(--color-text);letter-spacing:-1.5px}.title-gradient{background:linear-gradient(90deg,#a855f7,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:var(--text-lg);line-height:var(--line-height-normal)}.hero-description,.hero-subtitle{font-family:var(--font-body);color:var(--color-text-muted);max-width:450px;margin:0}.hero-description{opacity:.9}.hero-description,.section-intro{font-size:var(--text-base);line-height:var(--line-height-relaxed)}.section-intro{font-family:var(--font-body);color:var(--color-text-muted);max-width:800px;margin:0 auto var(--space-8);text-align:center}.feature-tags{display:flex;gap:var(--space-3);flex-wrap:wrap}.tag{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted);background-color:var(--color-surface-alt);border:1px solid var(--color-border);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-weight:500;text-transform:uppercase;letter-spacing:.5px}.cta-button{font-family:var(--font-display);font-size:var(--text-lg);font-weight:500;color:var(--color-text);background:linear-gradient(90deg,#a855f7,#6366f1);border:none;padding:var(--space-4) var(--space-7);border-radius:var(--radius-md);cursor:pointer;transition:all var(--duration-base) var(--easing-standard);box-shadow:0 4px 15px rgba(0,0,0,.2),0 0 0 1px rgba(168,85,247,.5)}.cta-button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 25px rgba(0,0,0,.3),0 0 0 1px #a855f7;filter:brightness(1.15)}.hero-right{flex:1.2 1;text-align:center;z-index:2}.gameplay-mockup{width:100%;height:auto;border-radius:var(--radius-md);border:1px solid var(--color-border-muted);box-shadow:0 10px 30px rgba(0,0,0,.4)}.gameplay-label{margin-top:var(--space-3);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted);letter-spacing:2px;text-transform:uppercase}.social-section{padding:var(--space-10) var(--space-6);max-width:1200px;margin:0 auto;text-align:center;animation:fadeIn .6s .6s var(--easing-standard) forwards;opacity:0}.social-links{display:flex;justify-content:center;gap:var(--space-4);margin-bottom:var(--space-10);flex-wrap:wrap}.social-btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-family:var(--font-body);font-size:var(--text-md);font-weight:500;text-decoration:none;transition:all var(--duration-base) var(--easing-standard)}.social-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.3)}.instagram-btn:hover{background:linear-gradient(45deg,#f09433,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888);border-color:#e4405f}.facebook-btn:hover{background-color:#1877f2;border-color:#1877f2}.discord-btn:hover{background-color:#5865f2;border-color:#5865f2}.social-icon{width:24px;height:24px}.share-section{margin-top:var(--space-8);padding-top:var(--space-8);border-top:1px solid var(--color-border)}.share-section h3{font-family:var(--font-heading);font-size:var(--text-xl);color:var(--color-text);margin-bottom:var(--space-4)}.share-buttons{display:flex;justify-content:center;gap:var(--space-3);flex-wrap:wrap}.share-btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-muted);font-family:var(--font-body);font-size:var(--text-sm);font-weight:500;text-decoration:none;transition:all var(--duration-fast) var(--easing-standard)}.share-btn:hover{transform:scale(1.05);color:var(--color-text)}.share-facebook:hover{background-color:#1877f2;border-color:#1877f2;color:white}.share-twitter:hover{background-color:#000000;border-color:#000000;color:white}.share-reddit:hover{background-color:#ff4500;border-color:#ff4500;color:white}.share-linkedin:hover{background-color:#0a66c2;border-color:#0a66c2;color:white}.follow-section{margin-top:var(--space-7);padding:var(--space-6);text-align:center;animation:fadeIn .6s .7s var(--easing-standard) forwards;opacity:0}.footer-text{font-size:var(--text-sm);margin:0}.footer-text,.instagram-follow-btn{font-family:var(--font-body);color:var(--color-text-muted)}.instagram-follow-btn{display:inline-flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-5);background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:var(--text-md);font-weight:500;text-decoration:none;transition:all var(--duration-base) var(--easing-standard)}.instagram-follow-btn:hover{transform:translateY(-2px);background-color:var(--color-surface-alt);color:var(--color-text);border-color:#8c4be4;box-shadow:0 0 15px rgba(140,75,228,.3)}.instagram-icon{transition:stroke var(--duration-base) var(--easing-standard)}.instagram-follow-btn:hover .instagram-icon{stroke:#e4405f}@media screen and (max-width:992px){.hero-container{flex-direction:column;padding:var(--space-7);gap:var(--space-7)}.hero-left{align-items:center;text-align:center}.hero-subtitle{max-width:100%}.nav-links{gap:var(--space-3)}.nav-link{font-size:var(--text-sm);padding:var(--space-2)}.nav-link-cta{padding:var(--space-2) var(--space-4)}}@media screen and (max-width:576px){.hero-container{padding:var(--space-6);margin:0 var(--space-2)}.hero-title{font-size:30px}.hero-subtitle{font-size:var(--text-md)}.cta-button{width:100%;padding:var(--space-4)}.feature-tags{justify-content:center}.follow-section{margin-top:var(--space-6)}.site-logo{max-width:90px}.logo-container{margin-bottom:0}.follow-section{margin-top:var(--space-3)}.follow-section a{font-size:var(--text-sm)}.landing-nav{margin:var(--space-2);padding:var(--space-3);flex-wrap:wrap;gap:var(--space-3);justify-content:center}.nav-logo{height:32px}.nav-links{width:100%;justify-content:center;flex-wrap:wrap;gap:var(--space-2)}.nav-link{font-size:var(--text-xs);padding:var(--space-1) var(--space-2)}.nav-link-cta{padding:var(--space-1) var(--space-3)}}.section-title{font-family:var(--font-display);font-size:36px;font-weight:700;text-align:center;margin:0 0 var(--space-8) 0;color:var(--color-text);letter-spacing:-.5px}.features-section{max-width:1200px;width:100%;margin-top:var(--space-10);padding:var(--space-8) var(--space-4);animation:fadeIn .6s .8s var(--easing-standard) forwards;opacity:0}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-gap:var(--space-6);gap:var(--space-6)}.feature-card{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);transition:all var(--duration-base) var(--easing-standard)}.feature-card:hover{transform:translateY(-4px);border-color:#a855f7;box-shadow:0 8px 24px rgba(0,0,0,.3)}.feature-card h3{font-family:var(--font-display);font-size:var(--text-xl);margin:0 0 var(--space-3) 0;color:var(--color-text)}.feature-card p{font-size:var(--text-md);line-height:var(--line-height-relaxed);color:var(--color-text-muted);margin:0}.text-link{color:#a855f7;text-decoration:none;border-bottom:1px solid transparent;transition:all var(--duration-fast) var(--easing-standard)}.text-link:hover{color:#c084fc;border-bottom-color:#c084fc}.how-to-play-section{max-width:1200px;width:100%;margin-top:var(--space-10);padding:var(--space-8) var(--space-4);background-color:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border);animation:fadeIn .6s .9s var(--easing-standard) forwards;opacity:0}.steps-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-gap:var(--space-6);gap:var(--space-6)}.step{text-align:center;padding:var(--space-4)}.step-number{display:inline-block;width:56px;height:56px;line-height:56px;background:linear-gradient(135deg,#a855f7,#6366f1);border-radius:50%;font-size:var(--text-2xl);font-weight:700;margin-bottom:var(--space-4);box-shadow:0 4px 12px rgba(168,85,247,.4)}.step h3,.step-number{font-family:var(--font-display);color:var(--color-text)}.step h3{font-size:var(--text-lg);margin:0 0 var(--space-3) 0}.step p{font-size:var(--text-md);line-height:var(--line-height-relaxed);color:var(--color-text-muted);margin:0}.faq-section{max-width:900px;width:100%;margin-top:var(--space-10);padding:var(--space-8) var(--space-4);animation:fadeIn .6s 1s var(--easing-standard) forwards;opacity:0}.faq-list{display:flex;flex-direction:column;gap:var(--space-5)}.faq-item{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5);transition:all var(--duration-base) var(--easing-standard)}.faq-item:hover{border-color:#a855f7;box-shadow:0 4px 16px rgba(0,0,0,.2)}.faq-item h3{font-family:var(--font-display);font-size:var(--text-lg);margin:0 0 var(--space-3) 0;color:var(--color-text)}.faq-item p{font-size:var(--text-md);line-height:var(--line-height-relaxed);color:var(--color-text-muted);margin:0}.cta-section{max-width:600px;width:100%;margin-top:var(--space-10);padding:var(--space-8) var(--space-4);text-align:center;animation:fadeIn .6s 1.1s var(--easing-standard) forwards;opacity:0}.cta-section h2{font-family:var(--font-display);font-size:40px;font-weight:700;margin:0 0 var(--space-4) 0;color:var(--color-text);letter-spacing:-.5px}.cta-section p{font-size:var(--text-lg);color:var(--color-text-muted);margin:0 0 var(--space-6) 0}.cta-button-secondary{display:inline-block;font-family:var(--font-display);font-size:var(--text-lg);font-weight:500;color:var(--color-text);background:transparent;border:2px solid #a855f7;padding:var(--space-4) var(--space-7);border-radius:var(--radius-md);text-decoration:none;transition:all var(--duration-base) var(--easing-standard);box-shadow:0 0 20px rgba(168,85,247,.3)}.cta-button-secondary:hover{background:linear-gradient(90deg,#a855f7,#6366f1);transform:translateY(-3px) scale(1.02);box-shadow:0 8px 25px rgba(0,0,0,.3),0 0 0 1px #a855f7;filter:brightness(1.15)}@media screen and (max-width:768px){.section-title{font-size:28px}.features-grid,.steps-container{grid-template-columns:1fr}.cta-section h2{font-size:32px}}