:root{--tron-blue-darkest: #001a33;--tron-blue-dark: #003d66;--tron-blue: #0080ff;--tron-blue-light: #33adff;--tron-blue-lightest: #66c2ff;--tron-cyan: #00d9ff;--bg-dark: #000814;--bg-darker: #000408;--text-primary: #ffffff;--text-secondary: #b3d9ff;--grid-color: rgba(0, 128, 255, .15)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,var(--bg-darker) 0%,var(--bg-dark) 50%,var(--tron-blue-darkest) 100%);color:var(--text-primary);overflow:hidden;min-height:100vh;position:relative}.background-grid{position:fixed;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(var(--grid-color) 1px,transparent 1px),linear-gradient(90deg,var(--grid-color) 1px,transparent 1px);background-size:50px 50px;animation:gridMove 20s linear infinite;pointer-events:none;z-index:0}@keyframes gridMove{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.header{position:relative;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:clamp(.8rem,2vh,1.5rem) clamp(1rem,4vw,3rem);background:#000814cc;backdrop-filter:blur(10px);border-bottom:2px solid var(--tron-blue);box-shadow:0 0 30px #0080ff4d}.logo{font-size:clamp(1.2rem,3.5vw,1.8rem);font-weight:700;letter-spacing:.2em;text-transform:uppercase;background:linear-gradient(135deg,var(--tron-blue-light),var(--tron-cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 20px rgba(0,217,255,.5)}.status-badge{padding:clamp(.4rem,1vh,.5rem) clamp(.8rem,2vw,1.5rem);background:#0080ff33;border:2px solid var(--tron-blue);border-radius:50px;font-size:clamp(.7rem,1.5vw,.85rem);text-transform:uppercase;letter-spacing:.1em;box-shadow:0 0 20px #0080ff66}.viewport-container{position:relative;z-index:5;width:100%;height:calc(100vh - 140px);overflow:hidden}@media (max-width: 768px){.viewport-container{height:calc(100vh - 100px)}}.viewport-slider{display:flex;width:200%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1)}.viewport-slider.show-blog{transform:translate(-50%)}.game-view{position:relative;width:50%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}#gameContainer{width:100%;height:100%;position:relative;max-width:100vw;overflow:hidden}#gameContainer canvas{display:block;width:100%!important;height:100%!important;max-width:100%;object-fit:contain;cursor:pointer}.controls-hint{position:absolute;bottom:4rem;left:50%;transform:translate(-50%);padding:clamp(.6rem,1.5vh,1rem) clamp(1rem,3vw,2rem);background:#0080ff26;border:1px solid var(--tron-blue);border-radius:clamp(10px,2vw,15px);font-size:clamp(.7rem,1.8vw,.95rem);letter-spacing:.05em;color:var(--tron-blue-light);backdrop-filter:blur(10px);box-shadow:0 0 20px #0080ff4d;max-width:90vw;text-align:center}@media (pointer: coarse){.controls-hint{bottom:clamp(14rem,25vh,18rem)}}.controls-hint .mobile-hint{display:none}.controls-hint .desktop-hint{display:inline}.discovery-counter{position:absolute;top:clamp(.8rem,2vh,2rem);right:clamp(.8rem,2vw,2rem);padding:clamp(.5rem,1.5vh,.8rem) clamp(.8rem,2vw,1.5rem);background:#0080ff26;border:1px solid var(--tron-blue);border-radius:clamp(10px,2vw,15px);font-size:clamp(.7rem,1.8vw,.9rem);letter-spacing:.05em;color:var(--tron-cyan);backdrop-filter:blur(10px);box-shadow:0 0 20px #0080ff4d;font-weight:600}#discoveryCount{color:var(--tron-cyan);font-size:clamp(1rem,2.2vw,1.2rem);font-weight:700}.blog-review-button{position:absolute;bottom:clamp(1rem,2vh,2rem);right:clamp(1rem,2vw,2rem);width:clamp(40px,8vw,50px);height:clamp(40px,8vw,50px);border-radius:50%;background:#0080ff33;border:2px solid var(--tron-blue);color:var(--tron-cyan);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;backdrop-filter:blur(10px);box-shadow:0 0 20px #0080ff4d}.blog-review-button:hover{background:#0080ff66;box-shadow:0 0 30px #0080ff99;transform:scale(1.1)}.blog-review-button.hidden{opacity:0;pointer-events:none;transform:scale(0)}.blog-review-button svg{width:24px;height:24px}.mobile-controls{display:none;position:fixed;bottom:clamp(1.5rem,3vh,3rem);left:50%;transform:translate(-50%);width:clamp(160px,35vw,200px);height:clamp(160px,35vw,200px);z-index:50}.direction-btn{position:absolute;width:clamp(50px,10vw,60px);height:clamp(50px,10vw,60px);border-radius:50%;background:#0080ff4d;border:2px solid var(--tron-blue);color:var(--tron-cyan);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;backdrop-filter:blur(10px);box-shadow:0 0 25px #0080ff66;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none}.direction-btn:active,.direction-btn.active{background:#0080ff99;box-shadow:0 0 35px #0080ffcc;transform:scale(.9);border-color:var(--tron-cyan)}.direction-btn svg{width:clamp(18px,4vw,24px);height:clamp(18px,4vw,24px);pointer-events:none}#btnUp{top:0;left:50%;transform:translate(-50%)}#btnDown{bottom:0;left:50%;transform:translate(-50%)}#btnLeft{left:0;top:50%;transform:translateY(-50%)}#btnRight{right:0;top:50%;transform:translateY(-50%)}.blog-panel{width:50%;height:100%;display:flex;align-items:center;justify-content:center;padding:clamp(1rem,4vw,3rem);background:#00081480}.blog-content{position:relative;background:linear-gradient(135deg,var(--bg-dark),var(--tron-blue-darkest));border:2px solid var(--tron-blue);border-radius:clamp(15px,3vw,25px);padding:clamp(1.5rem,4vw,3rem);max-width:min(700px,95vw);width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 0 60px #0080ff99;animation:blogSlideIn .6s ease}@keyframes blogSlideIn{0%{opacity:0;transform:translate(50px)}to{opacity:1;transform:translate(0)}}.blog-close{position:absolute;top:1.5rem;right:1.5rem;background:none;border:none;color:var(--tron-blue-light);font-size:2.5rem;cursor:pointer;width:45px;height:45px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s ease;line-height:1}.blog-close:hover{background:#0080ff4d;color:var(--tron-cyan);transform:rotate(90deg)}.blog-header{margin-bottom:2rem}.blog-title{font-size:clamp(1.5rem,4vw,2.2rem);color:var(--tron-cyan);margin-bottom:clamp(.3rem,1vh,.5rem);line-height:1.3}.blog-date{font-size:clamp(.8rem,1.8vw,.95rem);color:var(--text-secondary);font-style:italic}.blog-body{line-height:1.7;color:var(--text-secondary);margin-bottom:clamp(1.5rem,3vh,2.5rem);font-size:clamp(.9rem,2vw,1.05rem)}.blog-body p{margin-top:1.5rem}.video-container{position:relative;width:100%;padding-bottom:56.25%;margin-bottom:1.5rem;border-radius:10px;overflow:hidden;border:2px solid var(--tron-blue);box-shadow:0 0 20px #0080ff66}.video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.blog-footer{display:flex;justify-content:space-between;gap:1rem;padding-top:2rem;border-top:1px solid rgba(0,128,255,.3)}.blog-nav-button{flex:1;padding:1rem 1.5rem;background:#0080ff33;border:1px solid var(--tron-blue);border-radius:12px;color:var(--tron-blue-light);font-size:1rem;cursor:pointer;transition:all .3s ease;font-weight:600}.blog-nav-button:hover:not(:disabled){background:#0080ff66;box-shadow:0 0 25px #0080ff80;transform:translateY(-2px)}.blog-nav-button:disabled{opacity:.3;cursor:not-allowed}.welcome-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000f2;backdrop-filter:blur(15px);z-index:100;display:flex;align-items:center;justify-content:center;padding:clamp(1rem,3vh,2rem);opacity:1;transition:opacity .5s ease;overflow-y:auto;overflow-x:hidden}.welcome-overlay.hidden{opacity:0;pointer-events:none}.welcome-content{max-width:min(800px,95vw);width:100%;text-align:center;animation:welcomeFadeIn .8s ease;margin:auto}@keyframes welcomeFadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.title{font-size:clamp(2rem,8vw,4rem);font-weight:700;background:linear-gradient(135deg,var(--tron-blue),var(--tron-cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.2;margin-bottom:clamp(.5rem,2vh,1rem)}.tagline{font-size:clamp(1rem,4vw,2rem);color:var(--tron-blue-light);font-weight:300;letter-spacing:.15em;margin-bottom:clamp(1rem,3vh,2rem)}.description{font-size:clamp(.9rem,2.5vw,1.2rem);line-height:1.6;color:var(--text-secondary);margin-bottom:clamp(1.5rem,4vh,3rem);padding:0 1rem}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:clamp(1rem,3vw,2rem);margin:clamp(1rem,4vh,3rem) 0;padding:0 1rem}.feature{display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(1rem,3vw,2rem);background:#0080ff14;border:1px solid var(--tron-blue);border-radius:clamp(12px,3vw,20px);transition:all .3s ease}.feature:hover{background:#0080ff2e;box-shadow:0 0 35px #0080ff80;transform:translateY(-5px)}.feature-icon{font-size:clamp(2rem,5vw,3rem);margin-bottom:clamp(.5rem,2vh,1rem);width:clamp(48px,10vw,64px);height:clamp(48px,10vw,64px);object-fit:contain}.feature-text{font-size:clamp(.85rem,2vw,1rem);color:var(--text-secondary);letter-spacing:.05em}.start-button{padding:clamp(.8rem,2vh,1.2rem) clamp(2rem,8vw,4rem);font-size:clamp(1rem,3vw,1.3rem);font-weight:700;text-transform:uppercase;letter-spacing:.12em;background:linear-gradient(135deg,var(--tron-blue),var(--tron-cyan));color:#fff;border:none;border-radius:50px;cursor:pointer;box-shadow:0 0 40px #0080ff99;transition:all .3s ease;margin-top:clamp(1rem,3vh,2rem);-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;max-width:90vw}.start-button:hover{box-shadow:0 0 60px #00d9ffe6;transform:translateY(-3px) scale(1.05)}.start-button:active{transform:translateY(0) scale(.98)}.footer{position:fixed;bottom:0;left:0;right:0;z-index:10;text-align:center;padding:clamp(.7rem,1.5vh,1rem);background:#000814cc;backdrop-filter:blur(10px);border-top:2px solid var(--tron-blue);color:var(--text-secondary);font-size:clamp(.7rem,1.5vw,.85rem)}#loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000f2;backdrop-filter:blur(10px);z-index:200;display:flex;align-items:center;justify-content:center;transition:opacity .5s ease}#loading-screen.hidden{opacity:0;pointer-events:none}.loading-content{text-align:center}.loading-spinner{width:60px;height:60px;margin:0 auto 2rem;border:4px solid rgba(0,128,255,.2);border-top-color:var(--tron-cyan);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-size:clamp(1rem,2.5vw,1.2rem);color:var(--tron-blue-light);letter-spacing:.1em}@media (pointer: coarse){.mobile-controls{display:block}.controls-hint .desktop-hint{display:none}.controls-hint .mobile-hint{display:inline}}@media (pointer: fine){.mobile-controls{display:none}.controls-hint .desktop-hint{display:inline}.controls-hint .mobile-hint{display:none}}@media (max-width: 768px){.header{flex-direction:column;gap:clamp(.5rem,2vw,1rem)}.viewport-slider{width:100%!important;transform:none!important}.viewport-slider.show-blog{transform:none!important}.game-view,.blog-panel{width:100%;position:absolute;top:0;left:0}.blog-panel{display:none;z-index:100}.viewport-slider.show-blog .blog-panel{display:flex}.viewport-slider.show-blog .game-view{display:none}.blog-content{max-height:85vh;padding:clamp(1rem,3vw,1.5rem);max-width:100vw;margin:0}.blog-panel{padding:clamp(.5rem,2vw,1rem)}.quest-sections{max-height:calc(100% - 80px)}.quest-journal-header{margin-bottom:1rem;padding-bottom:.75rem}}.quest-detail-view,.quest-list-view{width:100%;height:100%}.quest-list-view.hidden,.quest-detail-view.hidden{display:none}.quest-journal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid rgba(0,128,255,.3)}.quest-journal-header h2{font-size:1.8rem;color:#0080ff;margin:0}.view-toggle{background:#0080ff33;border:1px solid rgba(0,128,255,.4);border-radius:8px;padding:.5rem;cursor:pointer;transition:all .3s ease;color:#0080ff;display:flex;align-items:center;justify-content:center}.view-toggle:hover{background:#0080ff4d;transform:scale(1.05)}.quest-sections{max-height:calc(100% - 100px);overflow-y:auto;padding-right:.5rem}.quest-section{margin-bottom:2rem}.quest-section.hidden{display:none}.section-title{font-size:1.2rem;color:#66b3ff;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid rgba(0,128,255,.2)}.quest-list{display:flex;flex-direction:column;gap:.75rem}.quest-item{background:#00142899;border:1px solid rgba(0,128,255,.3);border-radius:8px;padding:1rem;transition:all .3s ease}.quest-item.unlocked{cursor:pointer}.quest-item.unlocked:hover{background:#002850cc;border-color:#0080ff99;transform:translate(5px);box-shadow:0 0 15px #0080ff4d}.quest-item.locked{opacity:.5;cursor:not-allowed}.quest-item-header{display:flex;align-items:flex-start;gap:.75rem}.quest-status{font-size:1.2rem;flex-shrink:0;margin-top:.2rem}.quest-info{flex:1}.quest-item-title{font-size:1rem;color:#fff;margin:0 0 .3rem;font-weight:500}.quest-item-meta{font-size:.85rem;color:#66b3ff;margin:0}.archive-years{display:flex;flex-direction:column;gap:.5rem}.quest-sections::-webkit-scrollbar{width:8px}.quest-sections::-webkit-scrollbar-track{background:#00142880;border-radius:4px}.quest-sections::-webkit-scrollbar-thumb{background:#0080ff66;border-radius:4px}.quest-sections::-webkit-scrollbar-thumb:hover{background:#0080ff99}@media (max-width: 768px){.quest-journal-header h2{font-size:1.4rem}.quest-item{padding:.8rem}.quest-item-title{font-size:.95rem}.quest-item-meta{font-size:.8rem}}