:root{--mint-green: #3EB489;--mint-light: #7DCEA0;--mint-dark: #2E8B67;--teal: #20B2AA;--white: #FFFFFF;--off-white: #F5F5F5;--light-gray: #E0E0E0;--dark-gray: #1A1A1A;--charcoal: #2D2D2D;--glass-bg: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .2);--glass-shadow: rgba(0, 0, 0, .3);--font-primary: "Outfit", -apple-system, BlinkMacSystemFont, sans-serif;--transition-fast: .2s ease;--transition-smooth: .4s cubic-bezier(.4, 0, .2, 1);--transition-slow: .8s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;font-family:var(--font-primary);background:var(--charcoal);color:var(--white)}#canvas-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1}#canvas-container canvas{width:100%;height:100%;display:block}#loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,var(--charcoal) 0%,#1a2a1a 50%,var(--charcoal) 100%);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity var(--transition-slow),visibility var(--transition-slow)}#loading-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}.loader-content{text-align:center;padding:3rem}.loader-title{font-size:clamp(2.5rem,8vw,5rem);font-weight:700;background:linear-gradient(135deg,var(--mint-green),var(--teal),var(--mint-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem;animation:shimmer 3s ease-in-out infinite;background-size:200% 200%}@keyframes shimmer{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.loader-subtitle{font-size:1.2rem;font-weight:300;color:var(--light-gray);letter-spacing:.3em;text-transform:uppercase;margin-bottom:3rem}.progress-container{width:300px;max-width:80vw;height:4px;background:#ffffff1a;border-radius:2px;margin:0 auto 1rem;overflow:hidden}.progress-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--mint-green),var(--teal));border-radius:2px;transition:width var(--transition-fast);box-shadow:0 0 20px var(--mint-green)}.progress-text{font-size:.9rem;color:var(--light-gray);font-weight:300}.click-to-enter{margin-top:2rem;font-size:1.1rem;color:var(--mint-green);opacity:0;animation:pulse 2s ease-in-out infinite;cursor:pointer;transition:opacity var(--transition-smooth)}.click-to-enter.visible{opacity:1}@keyframes pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.02)}}#instructions{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:100;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:opacity var(--transition-smooth),visibility var(--transition-smooth)}#instructions.hidden{opacity:0;visibility:hidden;pointer-events:none}.instructions-content{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:24px;padding:3rem;text-align:center;max-width:400px;box-shadow:0 25px 50px var(--glass-shadow)}.instructions-content h2{font-size:1.8rem;font-weight:600;margin-bottom:2rem;color:var(--mint-green)}.control-item{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.1)}.control-item:last-of-type{border-bottom:none}.keys{background:linear-gradient(135deg,var(--mint-dark),var(--mint-green));padding:.5rem 1rem;border-radius:8px;font-weight:600;font-size:.85rem;letter-spacing:.1em}.action{color:var(--light-gray);font-weight:300}.hint{margin-top:2rem;font-size:.9rem;color:var(--light-gray)}.hint .key{background:#ffffff26;padding:.2rem .6rem;border-radius:4px;font-weight:500}#crosshair{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:50;pointer-events:none;opacity:0;transition:opacity var(--transition-fast)}#crosshair.visible{opacity:1}.crosshair-dot{width:8px;height:8px;background:var(--white);border-radius:50%;box-shadow:0 0 10px #ffffff80;transition:all var(--transition-fast)}#crosshair.hovering .crosshair-dot{width:16px;height:16px;background:var(--mint-green);box-shadow:0 0 20px var(--mint-green)}#artwork-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:200;display:flex;align-items:center;justify-content:center;transition:opacity var(--transition-smooth),visibility var(--transition-smooth)}#artwork-modal.hidden{opacity:0;visibility:hidden;pointer-events:none}.modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000e6;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.modal-content{position:relative;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;align-items:center;animation:modalIn .4s cubic-bezier(.34,1.56,.64,1)}@keyframes modalIn{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.close-btn{position:absolute;top:-40px;right:-40px;width:40px;height:40px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:50%;color:var(--white);font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.close-btn:hover{background:var(--mint-green);transform:rotate(90deg)}#modal-image{max-width:100%;max-height:60vh;object-fit:contain;border-radius:12px;box-shadow:0 25px 100px #00000080}.modal-info{text-align:center;padding:2rem;max-width:600px}#modal-title{font-size:1.8rem;font-weight:600;margin-bottom:.5rem;color:var(--white)}#modal-artist{font-size:1.1rem;color:var(--mint-green);margin-bottom:1rem;font-weight:300}#modal-description{font-size:1rem;color:var(--light-gray);line-height:1.6;font-weight:300}@media(max-width:768px){.instructions-content{padding:2rem;margin:1rem}.close-btn{top:-50px;right:0}.modal-info{padding:1.5rem}#modal-title{font-size:1.4rem}#modal-description{font-size:.9rem}.loader-subtitle{font-size:1rem;letter-spacing:.2em}}#joystick-container{position:fixed;bottom:30px;left:30px;width:120px;height:120px;z-index:60;opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--transition-fast),visibility var(--transition-fast)}#joystick-container.visible{opacity:1;visibility:visible;pointer-events:auto}.joystick-base{width:100%;height:100%;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.joystick-thumb{width:50px;height:50px;background:linear-gradient(135deg,var(--mint-green),var(--teal));border-radius:50%;box-shadow:0 4px 20px #3eb48966;transition:transform .05s ease-out}#look-area{position:fixed;top:0;right:0;width:50%;height:100%;z-index:55;opacity:0;visibility:hidden;pointer-events:none}#look-area.visible{opacity:1;visibility:visible;pointer-events:auto}#fullscreen-btn{position:fixed;top:20px;right:20px;width:50px;height:50px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;color:var(--white);font-size:1.5rem;cursor:pointer;z-index:80;display:none;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-fast)}#fullscreen-btn:active{background:var(--mint-green);transform:scale(.95)}#fullscreen-btn.visible{display:flex}#interact-btn{position:fixed;bottom:30px;right:30px;width:80px;height:80px;background:linear-gradient(135deg,var(--mint-green),var(--teal));border:none;border-radius:50%;color:var(--white);font-size:1.5rem;cursor:pointer;z-index:60;opacity:0;visibility:hidden;pointer-events:none;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 30px #3eb48966;transition:all var(--transition-fast)}#interact-btn.visible{opacity:1;visibility:visible;pointer-events:auto}#interact-btn.highlight{animation:interactPulse 1s ease-in-out infinite}@keyframes interactPulse{0%,to{transform:scale(1);box-shadow:0 8px 30px #3eb48966}50%{transform:scale(1.1);box-shadow:0 8px 40px #3eb48999}}.mobile-instructions{display:none}.desktop-instructions{display:block}@media(max-width:768px),(pointer:coarse){.mobile-instructions{display:block}.desktop-instructions,#crosshair{display:none}.instructions-content{max-width:90vw}.control-item .keys{font-size:.75rem;padding:.4rem .8rem}.control-item .action{font-size:.9rem}}@media(max-height:400px)and (orientation:landscape){#landscape-warning{display:flex!important}}#landscape-warning{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--charcoal);z-index:2000;display:none;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:2rem}#landscape-warning svg{width:60px;height:60px;margin-bottom:1rem;fill:var(--mint-green)}#landscape-warning p{color:var(--light-gray);font-size:1rem}.hidden{display:none!important}@media(pointer:coarse){*{-webkit-tap-highlight-color:transparent}html,body{touch-action:none;overscroll-behavior:none}}