* {margin: 0;padding: 0;box-sizing: border-box;font-family: 'Arial', sans-serif;}html {scroll-behavior: smooth;overflow-y: auto;scroll-snap-type: y mandatory;}body {overflow: hidden;background: #0a0612;color: #fff;line-height: 1.6;}.section {width: 100%;height: 100vh;padding: 4rem;position: relative;overflow: hidden;transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);}.hero {background: linear-gradient(45deg, #1a0a2e 0%, #0a0612 100%);display: flex;flex-direction: column;justify-content: center;align-items: flex-start;}.hero::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.05;pointer-events: none;}.hero {position: relative;height: 100vh;background: #0a0612;overflow: hidden;display: flex;align-items: center;justify-content: center;}.hero-canvas {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;}.particles-canvas {position: absolute;width: 100%;height: 100%;}.gradient-overlay {position: absolute;width: 100%;height: 100%;background: radial-gradient(circle at 50% 50%,rgba(108, 61, 255, 0.15) 0%,rgba(10, 6, 18, 0.9) 70%);mix-blend-mode: screen;}.glitch-wrapper {position: relative;margin: 0 auto;text-align: center;}.hero-title {font-family: 'Orbitron', sans-serif;font-size: 6rem;color: #fff;text-transform: uppercase;position: relative;z-index: 3;text-shadow: 0 0 30px rgba(108, 61, 255, 0.5);margin: 0;}.hero-title::before {content: attr(data-text);position: absolute;left: -2px;text-shadow: 2px 0 #6c3dff;clip: rect(0, 900px, 0, 0);animation: glitch-1 2s infinite linear alternate-reverse;}@keyframes glitch-1 {0% { clip: rect(32px, 9999px, 34px, 0) }100% { clip: rect(12px, 9999px, 46px, 0) }}.glitch-layers {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}.glitch-layer {position: absolute;width: 100%;height: 100%;background-repeat: repeat;opacity: 0.15;}@keyframes noise {0% { transform: translate(0,0) }10% { transform: translate(-5%,-5%) }20% { transform: translate(-10%,5%) }30% { transform: translate(5%,-10%) }40% { transform: translate(-5%,15%) }50% { transform: translate(-10%,5%) }60% { transform: translate(15%,0) }70% { transform: translate(0,10%) }80% { transform: translate(-15%,0) }90% { transform: translate(10%,5%) }100% { transform: translate(5%,0) }}.color-shift {background: linear-gradient( 45deg,#6c3dff 0%,#ff4da6 30%,#6c3dff 70%,#ff4da6 100%);mix-blend-mode: color-dodge;animation: color-pulse 4s infinite;}@keyframes color-pulse {0% { opacity: 0.1; }50% { opacity: 0.3; }100% { opacity: 0.1; }}.tagline-wrapper {position: relative;margin: 2rem 0;overflow: hidden;}.hero-tagline {font-size: 1.8rem;color: rgba(255,255,255,0.9);text-align: center;margin: 0;opacity: 0;transform: translateY(20px);animation: tagline-reveal 1s forwards cubic-bezier(0.19, 1, 0.22, 1);animation-delay: 0.8s;}.tagline-part {display: inline-block;margin: 0 0.5rem;}@keyframes tagline-reveal {to {opacity: 1;transform: translateY(0);}}.scroller-container {position: relative;width: 100%;height: 120px;margin: 4rem 0;overflow: hidden;mask-image: linear-gradient( 90deg,transparent 0%,#000 15%,#000 85%,transparent 100%);}.scroller-track {display: flex;width: max-content;animation: scrollLR 3s linear infinite;}@keyframes scrollLR {0%   { transform: translateX(5%); }50%  { transform: translateX(-1%); }100% { transform: translateX(5%); }}.scroller-content {display: flex;gap: 2rem;padding: 1.5rem 0;}.scroller-item {position: relative;padding: 1rem 3rem;font-family: 'Orbitron', sans-serif;font-size: 1.4rem;text-transform: uppercase;border-radius: 12px;background: rgba(16, 10, 32, 0.7);border: 1px solid rgba(108, 61, 255, 0.3);transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);backdrop-filter: blur(8px);}.neon-pulse {text-shadow: 0 0 15px rgba(108, 61, 255, 0.7);animation: neon-pulse 1.5s ease-in-out infinite;}.glitch-border {border: 1px solid #6c3dff;box-shadow:0 0 15px rgba(108, 61, 255, 0.3),inset 0 0 10px rgba(108, 61, 255, 0.2);}.gradient-flow {background: linear-gradient(45deg,rgba(108, 61, 255, 0.3),rgba(168, 77, 255, 0.2));border: none;}@keyframes scroll {from { transform: translateX(0); }to { transform: translateX(calc(-100% - 4rem)); }}@keyframes neon-pulse {0%, 100% { opacity: 0.8; }50% { opacity: 1; }}.scroller-aura {position: absolute;width: 100%;height: 100%;background: radial-gradient( circle at 50% 50%,rgba(108, 61, 255, 0.1),transparent 60%);pointer-events: none;}@media (max-width: 768px) {.scroller-container {height: 100px;margin: 3rem 0;}.scroller-item {padding: 0.8rem 2rem;font-size: 1.1rem;}.scroller-content {gap: 1.5rem;}}.scroll-indicator {position: absolute;bottom: 2rem;left: 50%;transform: translateX(-50%);z-index: 10;}.chevron {width: 20px;height: 20px;border-left: 2px solid #fff;border-bottom: 2px solid #fff;transform: rotate(-45deg);margin: 0.5rem 0;opacity: 0;animation: scroll-pulse 2s infinite;}.chevron:nth-child(2) { animation-delay: 0.2s }.chevron:nth-child(3) { animation-delay: 0.4s }@keyframes scroll-pulse {0% {opacity: 0;transform: rotate(-45deg) translate(0, -10px);}50% {opacity: 1;transform: rotate(-45deg) translate(0, 0);}100% {opacity: 0;transform: rotate(-45deg) translate(0, 10px);}}@media (max-width: 768px) {.hero-title {font-size: 3.5rem;}.hero-tagline {font-size: 1.2rem;}.scroller-content {font-size: 0.9rem;gap: 2rem;}}.nav-dots {position: fixed;right: 2rem;top: 50%;transform: translateY(-50%);z-index: 1000;}.dot {width: 12px;height: 12px;background: rgba(255,255,255,0.3);border-radius: 50%;margin: 1rem 0;cursor: pointer;transition: all 0.3s ease;}.dot.active {background: #b13dff;box-shadow: 0 0 15px #b13dff;}.project-section {position: relative;height: 100vh;overflow: hidden;display: flex;align-items: center;justify-content: center;isolation: isolate;}.video-matrix {position: absolute;top: 50%;left: 50%;width: 100%;height: 100%;transform: translate(-50%, -50%);z-index: -1;pointer-events: none;}.matrix-fallback {width: 100%;height: 100%;object-fit: cover;filter: brightness(0.4) contrast(1.2);}.digital-overlay {position: absolute;width: 100%;height: 100%;background:linear-gradient(45deg,rgba(108, 61, 255, 0.05) 0%,rgba(10, 6, 18, 0.9) 100%),repeating-linear-gradient( 0deg,rgba(0, 255, 136, 0.03) 0px,rgba(0, 255, 136, 0.03) 1px,transparent 1px,transparent 3px);}.scanline-effect {position: absolute;width: 100%;height: 100%;background: repeating-linear-gradient( 180deg,transparent 0%,rgba(0, 0, 0, 0.2) 50%,transparent 100%);animation: scan 6s linear infinite;}@keyframes scan {0% { transform: translateY(-100%); }100% { transform: translateY(100%); }}.project-core {position: relative;height: 100%;width: 100% ;display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 2rem;z-index: 2;}.title-hologram {position: relative;align-self: center;}.project-title {font-family: 'Orbitron', sans-serif;font-size: 4rem;color: #6c3dff;text-shadow:0 0 15px rgba(108, 61, 255, 0.5),0 0 30px rgba(108, 61, 255, 0.3);position: relative;}.hologram-effect {position: absolute;width: 120%;height: 150%;background: linear-gradient( 45deg,#6c3dff 0%,#00ff88 50%,#6c3dff 100%);mix-blend-mode: screen;opacity: 0.3;left: -10%;top: -25%;z-index: -1;animation: hologram 6s infinite linear;}@keyframes scan {0% { background-position: 0 0; }100% { background-position: 0 100vh; }}@keyframes hologram {0% { transform: translateY(0) skew(0deg); }25% { transform: translateY(-5%) skew(2deg); }50% { transform: translateY(5%) skew(-2deg); }75% { transform: translateY(-3%) skew(1deg); }100% { transform: translateY(0) skew(0deg); }}@media (max-width: 768px) {.project-core {grid-template-columns: 1fr;padding: 1rem;}.project-title {font-size: 2.5rem;}}.main-nav {position: fixed;top: 0;width: 100%;z-index: 1000;background: rgba(16, 10, 32, 0.98);backdrop-filter: blur(12px);border-bottom: 1px solid rgba(132, 52, 235, 0.15);}.nav-container {max-width: 1440px;margin: 0 auto;padding: 1rem 2rem;display: flex;justify-content: space-between;align-items: center;position: relative;}.nav-logo {display: flex;align-items: center;gap: 0.8rem;text-decoration: none;position: relative;z-index: 1001;}.logo-icon {width: 40px;height: 40px;fill: none;stroke: #6c3dff;stroke-width: 2;filter: drop-shadow(0 0 12px rgba(108, 61, 255, 0.4));}.logo-text {font-family: 'Orbitron', sans-serif;font-size: 1.6rem;color: #fff;position: relative;}.logo-text::before {content: attr(data-text);position: absolute;left: -2px;text-shadow: 2px 0 #6c3dff;clip: rect(0, 900px, 0, 0);animation: glitch-1 2s infinite linear alternate-reverse;}@keyframes glitch-1 {0% { clip: rect(32px, 9999px, 34px, 0) }100% { clip: rect(12px, 9999px, 46px, 0) }}.nav-menu {display: flex;align-items: center;gap: 3rem;}.nav-links {display: flex;gap: 2.5rem;}.nav-link {position: relative;padding: 0.5rem 0;text-decoration: none;color: rgba(255,255,255,0.9);font-size: 1.1rem;transition: color 0.3s ease;}.link-underline {position: absolute;bottom: 0;left: 0;width: 0;height: 2px;background: linear-gradient(90deg, #6c3dff 0%, #a84dff 100%);transition: width 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);}.nav-link:hover .link-underline {width: 100%;}.btn-hover {position: absolute;width: 150%;height: 200%;background: linear-gradient( 90deg,transparent 25%,rgba(255,255,255,0.1) 50%,transparent 75%);transform: translateX(-100%) rotate(25deg);transition: transform 0.6s ease;}.nav-trace-line {position: absolute;bottom: -1px;left: 0;width: 100%;height: 2px;background: linear-gradient(90deg,transparent 0%,#6c3dff 30%,#a84dff 70%,transparent 100%);opacity: 0.8;animation: line-flow 3s linear infinite;}@keyframes line-flow {0% { background-position: -100% 0 }100% { background-position: 200% 0 }}.nav-toggle-label {display: none;cursor: pointer;z-index: 1001;}.hamburger-line {display: block;width: 28px;height: 2px;background: #fff;margin: 6px 0;transition: all 0.3s ease;}@media (max-width: 768px) {.nav-menu {position: fixed;top: 0;right: -100%;height: 100vh;width: 280px;background: rgba(16, 10, 32, 0.98);flex-direction: column;padding: 6rem 2rem 2rem;transition: right 0.4s ease;}.nav-links {flex-direction: column;gap: 1.5rem;}.nav-toggle:checked ~ .nav-menu {right: 0;}.nav-toggle-label {display: block;}.nav-toggle:checked ~ .nav-toggle-label .top {transform: translateY(8px) rotate(45deg);}.nav-toggle:checked ~ .nav-toggle-label .middle {opacity: 0;}.nav-toggle:checked ~ .nav-toggle-label .bottom {transform: translateY(-8px) rotate(-45deg);}}.servers-section {position: relative;padding: 4rem 1rem;background: #0a0612;overflow: hidden;}.cyber-grid {position: relative;max-width: 1400px;margin: 0 auto;padding: 2rem;display: flex;flex-wrap: wrap;justify-content: center;gap: 2rem;transform-style: preserve-3d;transition: transform 0.3s ease;}.hex-card {position: relative;width: calc(20% - 2rem);min-width: 240px;max-width: 280px;aspect-ratio: 0.866;margin: 1rem;flex-grow: 1;will-change: transform;transform-style: preserve-3d;transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);cursor: pointer;}.hex-card:hover {cursor: pointer;transform: translateY(-10px) scale(1.05) translateZ(0);}.hex-border {position: absolute;width: 100%;height: 100%;clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);background: linear-gradient( 45deg,rgba(108, 61, 255, 0.3),rgba(16, 10, 32, 0.7));padding: 2px;box-sizing: border-box;}.hex-inner {clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);background: #110a22;height: 100%;position: relative;}.hex-content {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 80%;text-align: center;padding: 1.5rem;}.hex-card:hover {transform: translateY(-10px) scale(1.05);.hex-border {background: linear-gradient( 45deg,#6c3dff,#a84dff);}.hex-glow {opacity: 0.4;}}.hex-glow {position: absolute;width: 110%;height: 110%;background: radial-gradient( circle at 50% 50%,rgba(108, 61, 255, 0.4),transparent 70%);opacity: 0;transition: opacity 0.3s ease;}@media (max-width: 1200px) {.hex-card {width: calc(25% - 2rem);}}@media (max-width: 992px) {.hex-card {width: calc(33.333% - 2rem);}}@media (max-width: 768px) {.hex-card {width: calc(50% - 2rem);min-width: 200px;}}@media (max-width: 480px) {.hex-card {width: 90%;max-width: none;}}@media (max-width: 1200px) {.cyber-grid {max-width: 900px;}}@media (max-width: 768px) {.servers-section {padding: 4rem 1rem;}.hex-card {width: 240px;height: 276px;margin: 10px;}.cyber-grid {gap: 1rem;padding: 1rem 0;}}@media (max-width: 480px) {.hex-card {width: 90%;height: 300px;margin: 10px auto;}.game-title {font-size: 1.8rem;}}.server-status {display: flex;align-items: center;justify-content: center;gap: 0.8rem;margin-bottom: 1.5rem;}.pulse-dot {width: 12px;height: 12px;background: #00ff88;border-radius: 50%;box-shadow: 0 0 15px #00ff88;animation: pulse 1.5s infinite;}.online-count {font-family: 'Orbitron', sans-serif;font-size: 1.4rem;color: #00ff88;}.game-title {font-family: 'Orbitron', sans-serif;font-size: 2rem;color: #fff;margin: 1rem 0;text-shadow: 0 0 15px rgba(108, 61, 255, 0.5);}.grid-background {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;pointer-events: none;}.circuit-pattern {position: absolute;width: 100%;height: 100%;background-image:linear-gradient(rgba(108, 61, 255, 0.05) 1px, transparent 1px),linear-gradient(90deg, rgba(108, 61, 255, 0.05) 1px, transparent 1px);background-size: 40px 40px;opacity: 0.3;}.energy-wave {position: absolute;width: 150%;height: 300px;background: linear-gradient( 90deg,transparent,rgba(108, 61, 255, 0.1),transparent);transform: rotate(-5deg);animation: wave-flow 20s linear infinite;}@keyframes pulse {0% { opacity: 0.6; transform: scale(0.95); }50% { opacity: 1; transform: scale(1.1); }100% { opacity: 0.6; transform: scale(0.95); }}@keyframes wave-flow {0% { left: -100%; }100% { left: 100%; }}@media (max-width: 768px) {.servers-section {padding: 4rem 1rem;}.cyber-grid {transform: scale(0.85);}.hex-card {width: 240px;height: 276px;margin: 0 10px;}.game-title {font-size: 1.6rem;}.online-count {font-size: 1.1rem;}}.feature-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));gap: 2rem;margin: 3rem 0;position: relative;}.feature-item {background: rgba(16, 10, 32, 0.7);border: 1px solid rgba(108, 61, 255, 0.3);border-radius: 12px;padding: 1.5rem;position: relative;overflow: hidden;transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);}.feature-item::before {content: '';position: absolute;top: -50%;left: -50%;width: 200%;height: 200%;background: linear-gradient( 45deg,transparent 0%,rgba(108, 61, 255, 0.1) 50%,transparent 100%);transform: rotate(45deg);animation: grid-shine 6s infinite linear;}.feature-item:hover {transform: translateY(-5px);border-color: #6c3dff;box-shadow: 0 0 30px rgba(108, 61, 255, 0.2);}.feature-icon {font-family: 'Orbitron', sans-serif;font-size: 2.5rem;color: #6c3dff;text-shadow: 0 0 15px rgba(108, 61, 255, 0.5);margin-bottom: 1rem;position: relative;display: inline-block;transition: transform 0.3s ease;}.feature-item:hover .feature-icon {transform: rotate(15deg) scale(1.1);}.feature-content h3 {font-family: 'Orbitron', sans-serif;color: #fff;margin-bottom: 0.8rem;font-size: 1.4rem;position: relative;}.feature-content h3::after {content: '';position: absolute;bottom: -5px;left: 0;width: 40px;height: 2px;background: #6c3dff;box-shadow: 0 0 10px #6c3dff;}.feature-content p {color: #aaa;font-size: 0.95rem;line-height: 1.6;margin: 0;}@keyframes grid-shine {0% { transform: rotate(45deg) translateX(-100%); }100% { transform: rotate(45deg) translateX(100%); }}@media (max-width: 768px) {.feature-grid {grid-template-columns: 1fr;}.feature-item {padding: 1rem;}.feature-icon {font-size: 2rem;}}.title-hologram,.project-dossier {position: relative;max-width: 1200px;width: 100%;}@media (max-width: 768px) {.matrix-fallback {object-position: 65% center;}.project-core {padding: 1rem;justify-content: flex-start;padding-top: 20vh;}}.action-panel {display: flex;justify-content: center;margin-top: 3rem;position: relative;}.cyber-button {position: relative;padding: 1.2rem 2.5rem;background: linear-gradient( 45deg,rgba(108, 61, 255, 0.8),rgba(168, 77, 255, 0.6));border: none;border-radius: 50px;color: #fff;font-family: 'Orbitron', sans-serif;font-size: 1.2rem;cursor: pointer;overflow: hidden;transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);text-decoration: none;display: inline-flex;align-items: center;}.button-content {position: relative;z-index: 2;transition: transform 0.3s ease;}.button-glow {position: absolute;width: 150%;height: 300%;background: linear-gradient( 90deg,rgba(255,255,255,0.1) 0%,rgba(108, 61, 255, 0.4) 50%,rgba(255,255,255,0.1) 100%);transform: rotate(-25deg) translateX(-150%);animation: button-glow 3s infinite;}.cyber-button:hover {transform: translateY(-2px);box-shadow:0 0 25px rgba(108, 61, 255, 0.4),0 4px 15px rgba(0,0,0,0.2);}.cyber-button:hover .button-content {transform: scale(1.05);}@keyframes button-glow {0% { transform: rotate(-25deg) translateX(-150%); }100% { transform: rotate(-25deg) translateX(200%); }}.cyber-button[href] {text-decoration: none;}@media (max-width: 768px) {.cyber-button {padding: 1rem 2rem;font-size: 1rem;}}.auth-btn-wrapper {position: relative;min-width: 120px;min-height: 40px;}.loading-check {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 24px;height: 24px;border: 3px solid rgba(108, 61, 255, 0.3);border-radius: 50%;border-top-color: #6c3dff;animation: spin 1s linear infinite;display: none;}.loading-check.visible {display: block;}@keyframes spin {from { transform: translate(-50%, -50%) rotate(0deg); }to { transform: translate(-50%, -50%) rotate(360deg); }}.steam-btn {display: flex;align-items: center;gap: 0.8rem;padding: 0.8rem 1.8rem;background: linear-gradient(135deg, #1B2838 0%, #2A4365 100%);border-radius: 50px;text-decoration: none;position: relative;overflow: hidden;transition: transform 0.3s ease;}.steam-btn img {width: 24px;height: 24px;}.steam-btn span {color: #fff;font-family: 'Orbitron', sans-serif;font-size: 0.95rem;}.steam-btn:hover .btn-hover {transform: translateX(100%) rotate(25deg);}.main-footer {background: rgba(16, 10, 32, 0.98);border-top: 1px solid rgba(108, 61, 255, 0.2);padding: 2rem 1rem;position: relative;z-index: 1000;}.footer-content {max-width: 1200px;margin: 0 auto;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;gap: 1rem;}.footer-copyright {color: rgba(255,255,255,0.6);font-size: 0.9rem;}.footer-links {display: flex;gap: 2rem;}.footer-link {color: rgba(255,255,255,0.7);text-decoration: none;font-size: 0.9rem;transition: color 0.3s ease;position: relative;}.footer-link::after {content: '';position: absolute;bottom: -2px;left: 0;width: 0;height: 1px;background: #6c3dff;transition: width 0.3s ease;}.footer-link:hover {color: #fff;}.footer-link:hover::after {width: 100%;}@media (max-width: 768px) {.about-section {padding: 4rem 1rem;}.about-content {padding: 2rem;}.section-title.neon-text {font-size: 2rem;}.about-description {font-size: 1rem;}.footer-content {flex-direction: column;text-align: center;}.footer-links {flex-direction: column;gap: 0.5rem;}}.scroller-spacer {width: 2rem;}@keyframes scroll {from { transform: translateX(0); }to { transform: translateX(calc(-100% - 4rem)); }}.title-hologram {position: relative;text-align: center;margin: 4rem 0;perspective: 1000px;}.project-title {position: relative;display: inline-block;font-size: 4.5rem;text-transform: uppercase;background: linear-gradient(45deg, #6c3dff 30%, #00ff88 70%);background-clip: text;-webkit-text-fill-color: transparent;filter: drop-shadow(0 0 25px rgba(108, 61, 255, 0.4));animation: title-float 4s ease-in-out infinite;}@keyframes title-float {0%, 100% { transform: translateY(0) rotateZ(-1deg); }50% { transform: translateY(-10px) rotateZ(1deg); }}.hologram-effect {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 110%;height: 120%;background: linear-gradient( 45deg,#6c3dff 0%,#00ff88 50%,#6c3dff 100%);mix-blend-mode: overlay;opacity: 0.3;z-index: -1;animation: hologram 6s infinite linear;}.total-online {text-align: center;margin: 3rem 0;position: relative;z-index: 5;}#total-online-count {font-size: 2.2rem;color: #00ff88;text-shadow: 0 0 25px rgba(0, 255, 136, 0.4);position: relative;display: inline-block;padding: 1rem 2rem;background: rgba(16, 10, 32, 0.6);border-radius: 50px;border: 2px solid #6c3dff;box-shadow:0 0 30px rgba(108, 61, 255, 0.3),inset 0 0 15px rgba(108, 61, 255, 0.2);animation: online-pulse 2s ease-in-out infinite;}@keyframes online-pulse {0%, 100% { transform: scale(1); }50% { transform: scale(1.05); }}.total-online::before {content: '';position: absolute;top: -10px;left: -10px;right: -10px;bottom: -10px;opacity: 0.15;z-index: -1;animation: noise 0.2s infinite linear;}@media (max-width: 768px) {.project-title {font-size: 3rem;padding: 0 1rem;}#total-online-count {font-size: 1.8rem;padding: 0.8rem 1.5rem;}.title-hologram {margin: 2rem 0;}}@media (max-width: 480px) {.project-title {font-size: 2.2rem;}#total-online-count {font-size: 1.4rem;}}.about-section {position: relative;padding: 8rem 1rem;background: radial-gradient(circle at 50% 50%, #0d051f 0%, #060213 100%);overflow: hidden;border-top: 1px solid rgba(108, 61, 255, 0.2);}.hologram-wrapper {position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 1;}.hologram-grid {position: absolute;width: 100%;height: 100%;background-image:linear-gradient(rgba(108, 61, 255, 0.05) 1px, transparent 1px),linear-gradient(90deg, rgba(108, 61, 255, 0.05) 1px, transparent 1px);background-size: 40px 40px;animation: grid-scroll 20s linear infinite;}.energy-core {position: absolute;width: 400px;height: 400px;background: radial-gradient(circle, #6c3dff 0%, transparent 70%);filter: blur(80px);opacity: 0.15;animation: core-pulse 4s ease-in-out infinite;}.cyber-frame {position: relative;padding: 2rem;border: 2px solid #6c3dff;clip-path: polygon( 20px 0,calc(100% - 20px) 0,100% 20px,100% calc(100% - 20px),calc(100% - 20px) 100%,20px 100%,0 calc(100% - 20px),0 20px);background: rgba(16, 10, 32, 0.95);backdrop-filter: blur(12px);box-shadow:0 0 35px rgba(108, 61, 255, 0.3),inset 0 0 15px rgba(108, 61, 255, 0.2);}@keyframes frame-glow {0%, 100% { opacity: 0.3; }50% { opacity: 0.8; }}.glitch-text {position: relative;font-size: 3.5rem;text-align: center;text-shadow: 0 0 30px rgba(108, 61, 255, 0.5);}.glitch-text::before,.glitch-text::after {content: attr(data-text);position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.8;}.glitch-text::before {color: #00ff88;animation: glitch-1 2s infinite linear;clip-path: polygon(0 20%, 100% 20%, 100% 30%, 0 30%);}.glitch-text::after {color: #ff4da6;animation: glitch-2 3s infinite linear;clip-path: polygon(0 60%, 100% 60%, 100% 70%, 0 70%);}.matrix-text {position: relative;padding: 2rem;margin: 3rem auto;max-width: 800px;border-left: 3px solid #6c3dff;}.digital-line {display: block;font-family: 'Courier New', monospace;font-size: 1.4rem;color: #00ff88;margin: 1.5rem 0;padding-left: 1rem;position: relative;opacity: 0;animation: text-reveal 0.5s forwards;}@keyframes text-reveal {from {opacity: 0;transform: translateX(-20px);}to {opacity: 1;transform: translateX(0);}}.binary-flow {position: absolute;bottom: -30px;left: 0;width: 100%;color: rgba(108, 61, 255, 0.3);font-size: 0.8rem;white-space: nowrap;animation: binary-scroll 20s linear infinite;}.particles-3d {position: absolute;width: 100%;height: 100%;top: 0;left: 0;pointer-events: none;background-image: url('data:image/svg+xml,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="1" fill="%236c3dff"/></svg>');animation: particles-float 20s infinite linear;}@keyframes core-pulse {0% { transform: scale(1); opacity: 0.1; }50% { transform: scale(1.2); opacity: 0.2; }100% { transform: scale(1); opacity: 0.1; }}@keyframes grid-scroll {from { background-position: 0 0; }to { background-position: 0 100%; }}@keyframes binary-scroll {from { transform: translateX(100%); }to { transform: translateX(-100%); }}@keyframes particles-float {0% { transform: translateY(0) translateX(0); }25% { transform: translateY(-20px) translateX(10px); }50% { transform: translateY(0) translateX(-10px); }75% { transform: translateY(20px) translateX(10px); }100% { transform: translateY(0) translateX(0); }}@media (max-width: 768px) {.glitch-text {font-size: 2.5rem;}.digital-line {font-size: 1.1rem;}.cyber-frame {padding: 1.5rem;}}.pulse-dot.red {background: #ff3b3b;box-shadow: 0 0 15px #ff3b3b;animation: none;}.pulse-dot.orange {background: #ffa500;box-shadow: 0 0 15px #ffa500;animation: none;}.pulse-dot.green {background: #00ff88;box-shadow: 0 0 15px #00ff88;}@media (max-width: 768px) {.nav-container {padding: 1rem;}.logo-text {font-size: 1.3rem;}.nav-menu {width: 100%;padding-top: 4rem;}.nav-links {width: 100%;align-items: flex-start;}.nav-link {font-size: 1.2rem;padding: 1rem 0;}}@media (max-width: 480px) {.hero {padding: 1rem;}.hero-title {font-size: 2.5rem;line-height: 1.2;}.hero-tagline {font-size: 1rem;flex-wrap: wrap;}.scroller-item {padding: 0.6rem 1.2rem;font-size: 0.9rem;}}@media (max-width: 480px) {.cyber-grid {padding: 0.5rem;}.hex-card {width: 100%;margin: 0.5rem 0;height: auto;min-width: unset;}.hex-content {padding: 1rem;}.game-title {font-size: 1.4rem;}.online-count {font-size: 1rem;}}@media (max-width: 480px) {.main-footer {padding: 1.5rem 0.5rem;}.footer-links {flex-direction: column;gap: 0.5rem;text-align: center;}.footer-copyright {text-align: center;margin-bottom: 1rem;}}@media (max-width: 480px) {.about-section {padding: 4rem 0.5rem;}.cyber-frame {padding: 1rem;}.glitch-text {font-size: 2rem;}.digital-line {font-size: 1rem;padding: 1rem;}}@media (prefers-reduced-motion: reduce) {* {animation: none !important;transition: none !important;}}@media (max-width: 768px) {.hex-card {touch-action: manipulation;}.nav-link {min-width: 44px;min-height: 44px;}.scroller-track {display: flex;width: max-content;animation: scrollLR 15s linear infinite;}@keyframes scrollLR {0%   { transform: translateX(-29%); }50%  { transform: translateX(29%); }100% { transform: translateX(-29%); }}}