@import"https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css";html,body{width:100%;height:100%;font-size:12px;color:#28282f;margin:0;padding:0;overflow:hidden;font-family:Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;background-color:#121212}p,img,div,canvas{vertical-align:top}::-moz-selection{background:#34495e;background-color:#34495e;color:#fff}::selection{background:#34495e;background-color:#34495e;color:#fff}.hide{display:none}#menu{width:50em;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;font-size:1.2em;border-radius:.9em;box-shadow:0 0 15px #0009;z-index:10}#menu #content{position:relative;overflow:visible;padding:1em 1em 5em;margin-top:0;color:#fff;border-radius:.9em;background:linear-gradient(to bottom,#90ee90,#006400)}#menu #content h1{font-size:2.5em}#menu #content p{font-size:1.2em;line-height:1.6em;margin:.5em 0}#menu #play_button{position:absolute;bottom:-2.5em;left:50%;transform:translate(-50%);display:inline-block;background-color:#343a7dcc;color:#fff;border-radius:.9em;padding:1em 2.5em;font-weight:700;transition:all .4s;z-index:99}#menu .button-container{position:absolute;bottom:-2.5em;left:50%;transform:translate(-50%);display:flex;gap:1em;align-items:center;justify-content:center;z-index:99}#menu .button-container #play_button,#menu .button-container #auto_tour_button{position:relative;bottom:auto;left:auto;transform:none;display:inline-block;background-color:#343a7dcc;color:#fff;border-radius:.9em;padding:1em 2.5em;font-weight:700;transition:all .4s;cursor:pointer}#menu .button-container #auto_tour_button{background-color:#7d343acc}#menu #play_button:hover{transform:translate(-50%) scale(1.1);background-color:#343a7d;cursor:pointer}#menu .button-container #play_button:hover{transform:scale(1.1);background-color:#343a7d}#menu .button-container #auto_tour_button:hover{transform:scale(1.1);background-color:#7d343a}canvas{width:100%;height:100%}.title{position:relative;display:inline-block;margin-bottom:1em}@keyframes panBg{0%{background-position:0% 0%}to{background-position:100% 0%}}#painting-info{position:fixed;top:20px;left:20px;background-color:#000000e6;padding:20px;border-radius:10px;font-family:Arial,sans-serif;color:#fff;width:300px;height:auto;z-index:9999;transition:all .3s ease-in-out;transform:translateY(100px);opacity:0;border:2px solid #fff}#painting-info.show{transform:translateY(0)!important;opacity:1!important}#painting-info h3{margin:0 0 10px;font-size:1.3em;font-weight:700;text-transform:uppercase}#painting-info p{margin:0;font-size:1.2em;padding:4px 0}#painting-info p .label{width:100px;display:inline-block;font-weight:700}#painting-info .btn-link{display:inline-block;padding:6px 12px;background-color:#0d6efd;color:#fff;text-decoration:none;border-radius:4px;font-size:14px;transition:background-color .2s;margin-top:12px}#painting-info .btn-link:hover{background-color:#0b5ed7}#control-wrapper{position:fixed;top:20px;right:20px;display:flex;flex-direction:column;align-items:center;z-index:1000;gap:12px;text-align:center}.control-text{margin:0 0 4px;font-size:12px;color:#fff}.control-button{color:#fff;border:none;border-radius:4px;padding:12px;font-weight:700;cursor:pointer;font-family:monospace;box-shadow:0 2px 4px #0003;cursor:none;width:60px}#exit-button{background:linear-gradient(to bottom,#e53935,#b71c1c)}#space-button,#sound-button,#refresh-button{background:linear-gradient(to bottom,#42a5f5,#1565c0)}#sound-button,#refresh-button{background:linear-gradient(to bottom,#66bb6a,#2e7d32)}#direction-wrapper{position:fixed;bottom:40px;right:20px;display:grid;place-items:center}.dpad-grid{display:grid;grid-template-columns:50px 50px 50px;grid-template-rows:50px 50px 50px;gap:8px}.dir-button{background:linear-gradient(to bottom,#ffa726,#f57c00);color:#fff;border:none;border-radius:4px;width:40px;height:40px;font-size:18px;font-weight:700;cursor:pointer;font-family:monospace;box-shadow:0 2px 4px #0003;transition:background .3s;cursor:none}.dir-button.pressed,.control-button.pressed{background-color:#ccc;transform:scale(.95);box-shadow:inset 0 0 5px #00000080}.aswd-box{width:40px;height:40px;background:#eee;border-radius:4px;display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:12px;color:#333;box-shadow:inset 0 0 4px #0000001a}#mouse-hint{position:fixed;bottom:40px;left:50%;transform:translate(-50%);width:100px;height:100px;background:linear-gradient(to bottom,#42a5f5,#1565c0);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0003;z-index:1000}#mouse-hint-text{position:fixed;bottom:150px;left:50%;transform:translate(-50%);color:#fff;font-family:sans-serif;font-size:14px}#control-wrapper,#direction-wrapper,#mouse-hint,#mouse-hint-text{display:none}#loader{position:fixed;top:0;left:0;width:100%;height:100%;background:#111;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:20;transition:opacity .5s ease}#progress-container{width:60%;height:20px;background:#333;border-radius:10px;overflow:hidden}#progress-bar{width:0%;height:100%;background:linear-gradient(90deg,#0f8,#0af);transition:width .3s ease}#progress-text{margin-top:10px;color:#fff;font-family:sans-serif}#painting-info.locked a{pointer-events:none;cursor:default;opacity:.5}#logo-wrapper{position:fixed;bottom:20px;left:20px;z-index:1000}canvas{opacity:0;transition:opacity 1s ease}canvas.loaded{opacity:1}#guided-tour-nav{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:1000;display:none}.nav-container{display:flex;align-items:center;gap:15px;background:#000c;border-radius:25px;padding:10px 20px;box-shadow:0 4px 12px #0000004d;margin-bottom:10px}.nav-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:20px;padding:10px 20px;font-size:14px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0003}.nav-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 15px #0000004d;background:linear-gradient(135deg,#764ba2,#667eea)}.nav-button:disabled{background:#555;cursor:not-allowed;opacity:.5}.nav-info{color:#fff;font-family:Arial,sans-serif;font-weight:700;font-size:16px;padding:0 15px;text-align:center;min-width:80px}@media screen and (max-width: 768px){#menu .button-container #play_button{display:none!important}#menu .button-container{justify-content:center}#menu{width:90%;font-size:1em}#menu #content h1{font-size:2em}#menu #content p{font-size:1em;line-height:1.4em}.nav-button{padding:15px 25px;font-size:16px}#painting-info{width:90%!important;max-width:350px!important;left:50%!important;right:auto!important;top:10px!important;transform:translate(-50%) translateY(50px)!important}#painting-info.show{transform:translate(-50%) translateY(0)!important}}@media screen and (max-width: 480px){#menu{width:95%;font-size:.9em}#menu #content h1{font-size:1.8em}.nav-container{flex-direction:row!important;gap:8px;padding:8px 12px;transform:scale(.9)}.nav-button{padding:8px 12px!important;font-size:12px!important;min-width:auto;white-space:nowrap}.nav-button span{font-size:11px}.nav-info{order:0!important;margin-bottom:0!important;font-size:14px!important;padding:0 8px!important;min-width:60px}#painting-info{width:95%!important;max-width:300px!important;left:50%!important;right:auto!important;top:10px!important;transform:translate(-50%) translateY(100px)!important;padding:15px!important;font-size:.9em!important}#painting-info.show{transform:translate(-50%) translateY(0)!important}}@media screen and (max-width: 320px){#painting-info{width:98%!important;max-width:280px!important;padding:12px!important;font-size:.8em!important}#painting-info h3{font-size:1.1em!important}#painting-info p{font-size:1em!important}.nav-container{transform:scale(.8)!important;gap:6px!important;padding:6px 8px!important}.nav-button{padding:6px 8px!important;font-size:10px!important}.nav-button span{font-size:9px!important}.nav-info{font-size:12px!important;padding:0 6px!important;min-width:50px!important}}@media screen and (min-width: 481px) and (max-width: 768px){#painting-info{width:85%!important;max-width:400px!important}}@media screen and (min-width: 769px) and (max-width: 1024px){#painting-info{width:350px!important;left:20px!important;transform:translateY(100px)!important}#painting-info.show{transform:translateY(0)!important}}