*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;overflow:hidden;background:#0d0820;touch-action:none;overscroll-behavior:none;
  -webkit-user-select:none;user-select:none;font-family:"Trebuchet MS",system-ui,sans-serif;color:#fff}
#stage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);overflow:hidden;background:#000;border-radius:0}
#cv{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.hudbtn{position:absolute;right:2%;top:0.6%;width:9%;aspect-ratio:1;border-radius:50%;border:2px solid #ffffff55;
  background:#00000066;color:#fff;font-size:min(4vw,2.2vh);z-index:11;padding:0}
.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:10;
  background:#0d0820 url(../assets/sprites/menu-bg.jpg) center/cover no-repeat}
#over{background:#0d0820cc}
.hidden{display:none!important}
.menu-inner{width:88%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.6vh;
  background:linear-gradient(#1a103399,#0d0820dd);border:2px solid #ffd54a66;border-radius:18px;padding:3vh 4%;backdrop-filter:blur(2px)}
.title{display:flex;gap:.3em;font-size:min(13vw,7.2vh);font-weight:900;letter-spacing:.04em;
  color:#ffd54a;text-shadow:0 .06em 0 #b36b00,0 .12em .2em #000,0 0 .5em #ff9d0055;-webkit-text-stroke:2px #5a2a00}
.title span:last-child{color:#9fe8ff;text-shadow:0 .06em 0 #2a5fb3,0 .12em .2em #000,0 0 .5em #6ad5ff66;-webkit-text-stroke:2px #102a5a}
.subtitle{font-size:min(5vw,2.8vh);font-weight:800;letter-spacing:.2em;color:#fff;text-shadow:0 2px 4px #000}
.roster{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2vh 3%;width:100%}
.roster div{background:radial-gradient(circle at 50% 35%,#4b3a8a,#1d1440);border:2px solid #ffd54a88;border-radius:10px;
  aspect-ratio:.85;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:3px;position:relative}
.roster img{width:92%;height:72%;object-fit:contain;filter:drop-shadow(0 3px 3px #000a)}
.roster span{font-size:min(2.5vw,1.35vh);font-weight:700;line-height:1.1}
.roster b{position:absolute;left:-5px;top:-6px;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f7a8ff,#b02cd6 60%,#5a0c78);
  font-size:13px;line-height:22px;border:2px solid #fff}
.diff{display:flex;gap:0;border-radius:12px;overflow:hidden;border:2px solid #ffffff66}
.diff button{background:#00000066;color:#ccc;border:0;padding:1.1vh 6vw;font-size:min(4.4vw,2.4vh);font-weight:800}
.diff button.on{background:#ffd54a;color:#3a2000}
button.big{font-size:min(8vw,4.4vh);font-weight:900;color:#3a2000;padding:1.2vh 14vw;border-radius:16px;border:3px solid #fff8;
  background:linear-gradient(#ffe680,#ffb300 55%,#e08a00);box-shadow:0 .5vh 0 #8a4f00,0 1vh 2vh #0008;letter-spacing:.06em}
button.big:active{transform:translateY(.4vh);box-shadow:0 .1vh 0 #8a4f00}
button.small{font-size:min(4.5vw,2.4vh);font-weight:800;color:#fff;background:#ffffff22;border:2px solid #fff6;border-radius:12px;padding:.8vh 8vw}
.hint{font-size:min(3.4vw,1.8vh);color:#ddd;text-shadow:0 1px 2px #000}
.restitle{font-size:min(14vw,8vh);font-weight:900;letter-spacing:.05em;-webkit-text-stroke:2px #0006;text-shadow:0 .08em .2em #000}
.crowns{font-size:min(9vw,5vh);display:flex;gap:6vw;align-items:center}
.crowns .b{color:#6ab8ff}.crowns .r{color:#ff6a6a}
