.btls{--navy:#030b23;--blue:#156bdd;--gold:#f5c944;--red:#d82436;box-sizing:border-box;width:100%;max-width:1040px;margin:20px auto;color:#fff;font-family:Arial,Helvetica,sans-serif}
.btls *{box-sizing:border-box}
.btls-stage{position:relative;overflow:hidden;border:5px solid var(--gold);border-radius:18px;background:#020717;box-shadow:0 24px 70px #000b,0 0 0 1px #fff2 inset}
.btls-canvas{display:block;width:100%;height:auto;aspect-ratio:48/31;touch-action:none}
.btls-topbar{position:absolute;inset:10px 13px auto;z-index:4;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;pointer-events:none}
.btls-brand{justify-self:start;padding:8px 12px;border:2px solid var(--gold);border-radius:9px;background:#030713e8;box-shadow:0 4px 14px #000a}
.btls-brand b{display:block;color:var(--gold);font:16px/1 Impact,"Arial Black",sans-serif;letter-spacing:1px}
.btls-brand span{display:block;margin-top:3px;color:#fff;font-size:7px;font-weight:900;letter-spacing:2.2px}
.btls-era{padding:9px 17px;border:2px solid var(--gold);border-radius:9px;background:#030713e8;color:#fff;font-size:10px;font-weight:900;letter-spacing:1.7px}
.btls-sound{justify-self:end;pointer-events:auto;padding:8px 10px;border:2px solid var(--gold);border-radius:9px;background:#030713e8;color:#fff;cursor:pointer}
.btls-card{position:absolute;left:50%;top:51%;z-index:5;width:min(590px,91%);padding:29px 35px;text-align:center;transform:translate(-50%,-50%);border:3px solid var(--gold);border-radius:17px;background:linear-gradient(145deg,#050b22f2,#0b2f66f2);backdrop-filter:blur(12px);box-shadow:0 26px 85px #000e,0 0 44px #1c6edf33 inset}
.btls [hidden]{display:none!important}
.btls-stars{color:var(--gold);font-size:20px;letter-spacing:12px}
.btls-card h2{margin:10px 0;color:#fff;font:44px/.92 Impact,"Arial Black",sans-serif;letter-spacing:1px;text-shadow:3px 3px 0 #1755ad}
.btls-card h2 span{display:block;margin-top:10px;color:var(--gold);font-size:21px;letter-spacing:4px;text-shadow:none}
.btls-card p{margin:17px auto;max-width:470px;color:#dce9ff;font:15px/1.5 Georgia,serif}
.btls-card button{display:block;width:min(330px,100%);margin:11px auto;padding:14px 17px;border:0;border-radius:9px;color:#fff;font-size:12px;font-weight:900;letter-spacing:1.3px;cursor:pointer}
.btls-primary{background:linear-gradient(145deg,#e13947,#9c111f);box-shadow:4px 4px 0 var(--gold)}
.btls-secondary{background:linear-gradient(145deg,#2677ca,#0c3e79);box-shadow:4px 4px 0 #dceaff}
.btls-card small{display:block;margin-top:18px;color:#97afd0;font-size:8px;letter-spacing:1px}
.btls-final-score{margin:8px auto 18px;color:var(--gold);font:68px/.9 Impact,"Arial Black",sans-serif;text-shadow:3px 3px 0 #174b9c}
.btls-controls{display:grid;grid-template-columns:1.55fr 1fr;gap:12px;margin-top:12px}
.btls-moves,.btls-powers{display:grid;gap:7px;padding:10px;border:3px solid #315997;border-radius:12px;background:linear-gradient(145deg,#081b3f,#030916);box-shadow:0 12px 30px #0008,0 0 22px #1b6ada22 inset}
.btls-moves{grid-template-columns:repeat(6,1fr)}
.btls-powers{grid-template-columns:repeat(3,1fr);border-color:#b78d26}
.btls-controls button{min-height:52px;border:0;border-radius:8px;background:linear-gradient(#f6f9ff,#bcc9db);color:#071735;font-size:18px;font-weight:900;cursor:pointer;box-shadow:inset 0 -5px 0 #8c9caf;touch-action:manipulation}
.btls-controls button span{display:block;margin-top:3px;font-size:7px;letter-spacing:.8px}
.btls-controls button b{display:block;color:#725707;font-size:11px}
.btls-controls button:active{transform:translateY(2px);box-shadow:inset 0 -2px 0 #7e8b9c}
.btls-drop{background:linear-gradient(#ffe978,#dca520)!important}
.btls-powers button{background:linear-gradient(#fff4b4,#d9b13f)}
.btls-powers .btls-gold{background:linear-gradient(#fff7bf,#edbd27);box-shadow:inset 0 -5px 0 #9f7505,0 0 12px #ffd94866}
.btls-keyboard,.btls-disclaimer{text-align:center;color:#7185a4;font-size:8px;line-height:1.4;letter-spacing:.45px}
.btls-keyboard{margin:9px auto 0}
.btls-disclaimer{margin:5px auto 0}
@media(max-width:760px){
  .btls{margin:10px 0}
  .btls-stage{border-width:3px;border-radius:11px}
  .btls-topbar{inset:5px 6px auto}
  .btls-brand{padding:5px 7px}
  .btls-brand b{font-size:10px}
  .btls-brand span{font-size:5px;letter-spacing:1px}
  .btls-era{padding:6px 8px;font-size:7px}
  .btls-sound{padding:5px 7px}
  .btls-card{padding:20px 15px}
  .btls-card h2{font-size:31px}
  .btls-card h2 span{font-size:15px}
  .btls-card p{font-size:12px;margin:12px auto}
  .btls-controls{grid-template-columns:1fr}
  .btls-moves{grid-template-columns:repeat(6,1fr)}
  .btls-controls button{min-height:48px;font-size:15px}
  .btls-keyboard{display:none}
  .btls-disclaimer{padding:0 8px}
}