.howtoplay-section{max-width:1200px;margin:0 auto;padding:4rem 0 6rem}.howtoplay-hero{text-align:center;margin-bottom:4rem}.howtoplay-title{font-family:Orbitron,sans-serif;font-size:2.5rem;font-weight:700;color:#fff;margin:0 0 3rem;background:linear-gradient(135deg,#fff,var(--primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-badges{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.hero-badges .badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:rgba(157,78,221,.15);border:1px solid rgba(157,78,221,.3);border-radius:4px;font-size:.9rem;color:var(--primary-light)}.hero-badges .badge i{font-size:1rem}.section-title{font-family:Orbitron,sans-serif;font-size:1.5rem;font-weight:600;color:#fff;margin:0 0 2rem}.quickstart-section{margin-bottom:5rem}.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}.step-card{position:relative;background:rgba(20,20,25,.6);border:1px solid rgba(157,78,221,.2);border-radius:4px;padding:2rem 1.5rem;text-align:center;transition:.3s}.step-card:hover{border-color:rgba(157,78,221,.5);transform:translateY(-4px)}.step-icon{width:60px;height:60px;margin:0 auto 1rem;background:rgba(157,78,221,.15);border-radius:50%;display:flex;align-items:center;justify-content:center}.step-icon i{font-size:1.5rem;color:var(--primary-light);line-height:1}.step-card h3{font-family:Orbitron,sans-serif;font-size:1rem;font-weight:600;color:#fff;margin:0 0 .75rem}.step-card p{color:var(--text-secondary);font-size:.9rem;line-height:1.6;margin:0}.mechanics-section{margin-bottom:5rem}.mechanic-block{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}.mechanic-block.reverse{direction:rtl}.mechanic-block.reverse>*{direction:ltr}.mechanic-content h3{font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:600;color:#fff;margin:0 0 1rem}.mechanic-content p{color:var(--text-secondary);line-height:1.7;margin:0 0 1.5rem}.mechanic-list{list-style:none;padding:0;margin:0}.mechanic-list li{display:flex;align-items:center;gap:.75rem;padding:.5rem 0;color:var(--text-secondary);font-size:.95rem}.mechanic-list li i{color:var(--primary-light);font-size:1rem;width:20px;text-align:center}.mechanic-visual{display:flex;justify-content:end}.mechanic-block.reverse .mechanic-visual{justify-content:start}.screenshot-img{width:100%;max-width:400px;border-radius:4px;border:1px solid rgba(157,78,221,.3);cursor:pointer;transition:transform .3s,border-color .3s}.screenshot-img:hover{transform:scale(1.02);border-color:rgba(157,78,221,.6)}.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.95);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;overscroll-behavior:contain}.lightbox.open{opacity:1;visibility:visible}.lightbox-close{position:absolute;top:1.5rem;right:1.5rem;background:rgba(255,255,255,.1);border:none;color:#fff;width:44px;height:44px;border-radius:50%;cursor:pointer;font-size:1.25rem;display:flex;align-items:center;justify-content:center;transition:background .3s}.lightbox-close:hover{background:rgba(255,255,255,.2)}#lightbox-img{max-width:90vw;max-height:90vh;border-radius:2px;object-fit:contain;touch-action:none}.planet-types{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}.planet-type{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .8rem;background:rgba(0,0,0,.3);border-radius:4px;font-size:.85rem;color:var(--text-secondary)}.planet-type.legendary{background:rgba(255,215,0,.1);border:1px solid rgba(255,215,0,.3)}.planet-type.legendary span:last-child{color:gold}.planet-dot{width:10px;height:10px;border-radius:50%}.planet-dot.terrestrial{background:#22c55e}.planet-dot.gas{background:#f97316}.planet-dot.ice{background:#06b6d4}.planet-dot.lava{background:#ef4444}.planet-dot.exotic{background:#a855f7}.planet-dot.legendary{background:linear-gradient(135deg,gold,#ff6b00)}.combat-note{display:flex;align-items:flex-start;gap:.5rem;padding:1rem;background:rgba(255,193,7,.1);border:1px solid rgba(255,193,7,.3);border-radius:2px;font-size:.9rem;color:var(--text-secondary)}.combat-note i{color:#ffc107;flex-shrink:0;margin-top:2px}.resources-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.resource-card{background:rgba(20,20,25,.6);border:1px solid rgba(157,78,221,.2);border-radius:4px;padding:2rem;transition:.3s}.resource-card:hover{border-color:rgba(157,78,221,.4);transform:translateY(-4px)}.resource-card.quantium{border-color:rgba(138,43,226,.3)}.resource-card.quantium:hover{border-color:rgba(138,43,226,.5)}.resource-card.fuel{border-color:rgba(59,130,246,.3)}.resource-card.fuel:hover{border-color:rgba(59,130,246,.5)}.resource-icon{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem}.resource-card.quantium .resource-icon{background:rgba(138,43,226,.2)}.resource-card.quantium .resource-icon i{font-size:1.5rem;color:#a855f7;line-height:1}.resource-card.fuel .resource-icon{background:rgba(59,130,246,.2)}.resource-card.fuel .resource-icon i{font-size:1.5rem;color:#3b82f6;line-height:1}.resource-card h3{font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:600;color:#fff;margin:0 0 .75rem}.resource-card p{color:var(--text-secondary);line-height:1.7;margin:0 0 1rem;font-size:.95rem}.resource-card ul{list-style:none;padding:0;margin:0}.resource-card ul li{position:relative;padding-left:1.25rem;margin-bottom:.5rem;color:var(--text-secondary);font-size:.9rem}.resource-card ul li::before{content:'•';position:absolute;left:0;color:var(--primary-light)}.resource-card.quantium ul li::before{color:#a855f7}.resource-card.fuel ul li::before{color:#3b82f6}.tips-section{margin-bottom:4rem}.tips-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}.tip-card{background:rgba(20,20,25,.6);border:1px solid rgba(157,78,221,.15);border-radius:4px;padding:1.5rem;text-align:center;transition:.3s}.tip-card:hover{border-color:rgba(157,78,221,.4);transform:translateY(-2px)}.tip-card i{font-size:1.5rem;color:var(--primary-light);margin-bottom:.75rem;display:block}.tip-card h4{font-family:Orbitron,sans-serif;font-size:.95rem;font-weight:600;color:#fff;margin:0 0 .5rem}.tip-card p{color:var(--text-secondary);font-size:.85rem;line-height:1.5;margin:0}.howtoplay-cta{padding:2.5rem;background:linear-gradient(135deg,rgba(157,78,221,.15) 0,rgba(157,78,221,.05) 100%);border:1px solid rgba(157,78,221,.3);border-radius:4px;text-align:center}.howtoplay-cta h3{font-family:var(--font-display);font-size:1.5rem;font-weight:600;color:var(--text-primary);margin:0 0 .5rem}.howtoplay-cta p{color:var(--text-secondary);margin-bottom:1.5rem}.howtoplay-cta-buttons{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.howtoplay-cta .btn-primary,.howtoplay-cta .btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:14px 24px;font-family:var(--font-title);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.5px;border-radius:0;text-decoration:none;transition:.25s;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}.howtoplay-cta .btn-secondary{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25);box-shadow:none}.howtoplay-cta .btn-secondary:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.4);color:#fff;box-shadow:0 0 15px rgba(255,255,255,.1);text-shadow:none}@media (max-width:1200px){.howtoplay-section{padding-left:1.5rem;padding-right:1.5rem}}@media (max-width:1024px){.steps-grid,.tips-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.howtoplay-section{padding:3rem 1.5rem 4rem}.howtoplay-title{font-size:2rem}.hero-badges{gap:.75rem}.hero-badges .badge{padding:.4rem .8rem;font-size:.85rem}.section-title{font-size:1.3rem;text-align:left}.mechanic-block{grid-template-columns:1fr;gap:2rem}.screenshot-img{max-width:100%}.resources-grid{grid-template-columns:1fr}.howtoplay-cta{padding:1.5rem}.howtoplay-cta h3{font-size:1.25rem}.howtoplay-cta-buttons{flex-direction:column;align-items:center}.howtoplay-cta .btn-primary,.howtoplay-cta .btn-secondary{width:100%;max-width:280px;justify-content:center}}@media (max-width:480px){.howtoplay-section{padding:4rem 1rem 3rem}.howtoplay-title{font-size:1.6rem}.steps-grid,.tips-grid{grid-template-columns:1fr}.step-card{padding:1.5rem 1rem}.resource-card{padding:1.5rem}.planet-types{gap:.5rem}.planet-type{padding:.3rem .6rem;font-size:.8rem}}