*{margin:0;padding:0;box-sizing:border-box}body{overflow:hidden;font-family:Arial,sans-serif;background-color:#000;color:#fff}#app{position:relative;width:100vw;height:100vh}canvas#scene{position:absolute;top:0;left:0;width:100%;height:100%;display:none}#instructions{display:block}#scene{display:none}#loading{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000e6;color:#fff;font-size:2em;font-family:sans-serif;display:none;justify-content:center;align-items:center;z-index:2000;overflow:hidden;text-align:center;white-space:nowrap}#loading.wrap-text{white-space:normal;padding:20px}#startup-container{position:relative;width:100%;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden}#initial-image-landscape{max-width:100%;max-height:70vh;object-fit:contain;display:none}#initial-image-portrait{max-width:100%;max-height:70vh;object-fit:contain}@media (orientation: landscape){#initial-image-landscape{display:block}#initial-image-portrait{display:none}}@media (orientation: portrait){#initial-image-landscape{display:none}#initial-image-portrait{display:block}}#controls-container{width:100%;max-width:500px;display:flex;flex-direction:column;gap:15px;padding:20px;margin-top:20px}#enter-button{position:absolute;bottom:10%;left:50%;transform:translate(-50%);padding:15px 30px;font-size:1.1em;background-color:#007bff;color:#fff;border:none;border-radius:5px;cursor:pointer;display:block;z-index:3;transition:background-color .3s}#enter-button:hover{background-color:#0056b3}#browse-rooms-button{position:fixed;top:20px;left:20px;padding:10px 18px;font-size:.9em;background-color:#007bffcc;color:#fff;border:none;border-radius:5px;cursor:pointer;z-index:1001;transition:background-color .3s;display:none}#browse-rooms-button:hover{background-color:#0064dce6}#room-selection-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0a0a0aeb;z-index:1500;justify-content:center;align-items:center;flex-direction:column;padding:20px;box-sizing:border-box;color:#fff}#room-selection-overlay .overlay-content{background-color:#1e1e1ed9;padding:30px;border-radius:10px;box-shadow:0 0 25px #00000080;width:90%;max-width:1800px;max-height:85vh;display:flex;flex-direction:column}#room-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:30px;padding:20px;width:100%;overflow-y:auto;flex-grow:1;border-radius:6px;background-color:#0003}#room-grid::-webkit-scrollbar{width:10px}#room-grid::-webkit-scrollbar-track{background:#ffffff1a;border-radius:10px}#room-grid::-webkit-scrollbar-thumb{background:#007bff;border-radius:10px}#room-grid::-webkit-scrollbar-thumb:hover{background:#0056b3}.room-card{background-color:#2a2a2e;border:1px solid #484848;border-radius:8px;padding:0;text-align:left;cursor:pointer;transition:transform .25s ease-out,box-shadow .25s ease-out,border-color .25s;overflow:hidden;display:flex;flex-direction:column;width:250px;height:250px;flex-shrink:0;margin:10px}.room-card:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 8px 20px #007bff4d;border-color:#007bff}.room-card img{width:100%;height:100%;object-fit:contain;margin-bottom:0;border-bottom:1px solid #404040}.room-card-content{padding:15px;display:flex;flex-direction:column;flex-grow:1}.room-card h3{margin:0 0 8px;font-size:1.15em;color:#e0e0e0;text-align:center}.room-card p{font-size:.85em;color:#b0b0b0;line-height:1.4;margin-top:0;flex-grow:1;margin-bottom:10px}#close-room-selection-button{padding:12px 25px;font-size:1em;background-color:#6c757d;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;margin-top:25px;align-self:center}#close-room-selection-button:hover{background-color:#545b62}.instructions-panel,.stats-panel{position:fixed;background:#000000b3;color:#fff;padding:10px;border-radius:5px;font-size:14px;pointer-events:none;z-index:1000}.instructions-panel{top:70px;left:20px}.stats-panel{bottom:20px;left:20px}#fullscreen-button{display:flex;align-items:center;justify-content:center;gap:5px;background-color:#000000b3;color:#fff;border:2px solid white;border-radius:20px;padding:8px 12px;cursor:pointer;position:fixed;top:20px;right:20px;z-index:1000;transition:background-color .3s}#fullscreen-button:hover{background-color:#000000b3}#fullscreen-button svg{fill:#fff}#fullscreen-button.exit-fullscreen svg{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='white' d='M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z'/%3E%3Csvg%3E")}#fullscreen-button .button-text{display:none}@media (max-width: 768px){#fullscreen-button{bottom:10px;right:10px;width:50px;height:50px;opacity:.8;top:unset;border-radius:50%;padding:0}#fullscreen-button svg{width:30px;height:30px}#fullscreen-button .button-text{display:inline;font-size:14px;font-weight:700}}