html,body{
 margin:0;
 height:100%;
 overflow:hidden;
 font-family:Verdana,sans-serif;
 background:#111;
}
:root{
 --room-width:1535px;
 --room-height:1024px;
 --room-scale:1;
}
#scene{
 position:fixed;
 left:50%;
 top:50%;
 width:var(--room-width);
 height:var(--room-height);
 transform:translate(-50%,-50%) scale(var(--room-scale));
 transform-origin:center;
 background:url('datencenter.webp') center center / 100% 100% no-repeat;
 image-rendering:pixelated;
}
#ui{
 position:fixed;
 left:50%;
 top:50%;
 width:var(--room-width);
 height:var(--room-height);
 transform:translate(-50%,-50%) scale(var(--room-scale));
 transform-origin:center;
}
#backBtn{
 position:absolute;
 left:2%;
 top:2%;
 padding:10px 15px;
 z-index:100;
}
#monitor{
 position:absolute;
 left:28%;
 top:14%;
 width:39%;
 height:50%;
 color:#dbe7df;
 font-size:16px;
 line-height:1.35;
 text-shadow:1px 1px 2px black;
 overflow:auto;
 padding:24px;
 box-sizing:border-box;
}
#monitor h1{
 margin:0 0 12px;
 font-size:32px;
 color:white;
}
#monitor p{
 margin:0 0 12px;
}
#monitor a{
 color:#f7e4a3;
 font-weight:bold;
}
#dragonSpeech{
 position:absolute;
 left:2%;
 top:25%;
 width:280px;
 padding:12px;
 background:rgba(255,255,255,0.9);
 border-radius:10px;
 color:black;
 font-size:14px;
 box-shadow:2px 2px 8px rgba(0,0,0,0.4);
 display:grid;
 grid-template-columns:64px 1fr;
 gap:10px;
 align-items:start;
}
#steinerPrivacy{
 width:64px;
 image-rendering:pixelated;
}
.speechText{
 line-height:1.35;
}
#languageBtn{
 position:absolute;
 right:2%;
 top:2%;
 min-width:96px;
 padding:8px 10px;
 z-index:160;
 background:rgba(255,248,232,.94);
 color:#151515;
 border:1px solid rgba(142,107,58,.7);
 border-radius:8px;
 font-weight:bold;
 cursor:pointer;
 box-shadow:2px 2px 8px rgba(0,0,0,.35);
}