* { margin:0; padding:0; box-sizing:border-box; }
html, body { width:100%; height:100%; overflow:hidden; background:#0d1117;
  font-family:'Cinzel', Georgia, 'Times New Roman', serif; }
#app { position:fixed; inset:0; }
#game { position:absolute; inset:0; display:block; touch-action:none; cursor:pointer; }
#mute { position:fixed; top:14px; right:14px; z-index:6; width:46px; height:46px;
  border-radius:12px; border:2px solid rgba(212,175,55,0.6);
  background:rgba(10,12,16,0.55); color:#d4af37; font-size:22px;
  font-family:'MedievalSharp', Georgia, serif; cursor:pointer;
  box-shadow:0 0 16px rgba(212,175,55,0.22);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  user-select:none; -webkit-user-select:none; }
#mute:active { transform:scale(0.9); }
#boot { position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
  color:#8b8f98; font-size:18px; background:#0d1117; z-index:2; letter-spacing:3px; }
#app.ready #boot { display:none; }