*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
html,body{margin:0;min-height:100%;font-family:"Comic Sans MS","Trebuchet MS",sans-serif;color:#fff;background:radial-gradient(ellipse at top,#1b2a6b,#070b24 70%) fixed;overflow-x:hidden}
body{min-height:100vh}
#stars{position:fixed;inset:0;pointer-events:none;z-index:-1}
.s{position:absolute;background:#fff;border-radius:50%;animation:tw 2s infinite alternate}@keyframes tw{to{opacity:.2}}
#mgTop{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:6px 8px;font-size:clamp(18px,4.5vw,30px);flex-wrap:wrap}
.ibtn{font-size:clamp(22px,5.5vw,36px);background:#ffffff22;border:none;border-radius:16px;padding:6px 12px;color:#fff;cursor:pointer;text-decoration:none;font-family:inherit}
#mgSW{font-variant-numeric:tabular-nums;background:#0006;border-radius:12px;padding:2px 10px}
#game{display:flex;flex-direction:column;align-items:center;padding:4px 8px 70px}
.q{font-size:clamp(28px,7vw,48px);font-weight:bold;margin:6px;text-align:center}
.frame{display:inline-grid;grid-template-columns:repeat(5,1fr);gap:5px;background:#0008;padding:7px;border-radius:14px;border:3px solid #9cf;margin:6px 0}
.c{width:clamp(30px,8vw,52px);height:clamp(30px,8vw,52px);border-radius:9px;background:#fff1;border:2px solid #9cf6;display:flex;align-items:center;justify-content:center;font-size:clamp(20px,5.5vw,36px)}
.c.hint{animation:hint .6s infinite alternate;background:#ffe14d55;border-color:#ffe14d}
@keyframes hint{to{transform:scale(1.12)}}
.pop{animation:pop .4s}@keyframes pop{from{transform:scale(0)}}
.row{display:flex;gap:clamp(10px,3vw,24px);justify-content:center;flex-wrap:wrap;margin:8px 0}
.p{width:clamp(80px,20vw,130px);height:clamp(80px,20vw,130px);border-radius:50%;border:none;font-size:clamp(40px,10vw,66px);font-weight:bold;color:#fff;text-shadow:3px 3px 0 #0006;cursor:pointer;box-shadow:inset -10px -10px 0 #0003,0 0 18px #fff5;position:relative;transition:transform .15s;font-family:inherit}
.p:active{transform:scale(.92)}
.wob{animation:wob .5s}@keyframes wob{25%{transform:translateX(-12px) rotate(-8deg)}75%{transform:translateX(12px) rotate(8deg)}}
.conf{position:fixed;font-size:30px;pointer-events:none;animation:fall 1.6s ease-out forwards;z-index:20}
@keyframes fall{to{transform:translate(var(--x),var(--y)) rotate(540deg);opacity:0}}
.msg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-size:clamp(44px,12vw,96px);font-weight:bold;color:#ffe14d;text-shadow:0 0 20px #f80,4px 4px 0 #000;pointer-events:none;opacity:0;transform:scale(.3);transition:.3s;z-index:5}
.msg.show{opacity:1;transform:scale(1)}
.scr{position:fixed;inset:0;background:#070b24f4;display:none;flex-direction:column;align-items:center;justify-content:flex-start;gap:14px;padding:16px;overflow-y:auto;text-align:center;z-index:10}
.scr h1{font-size:clamp(24px,6vw,40px);margin:4px}
#mgTeams{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(130px,28vw,180px),1fr));gap:12px;width:min(96vw,800px)}
.tb{border:4px solid transparent;border-radius:20px;padding:10px;font-size:clamp(18px,4.5vw,24px);font-weight:bold;cursor:pointer;color:#fff;text-shadow:2px 2px 0 #0008;display:flex;flex-direction:column;align-items:center;gap:4px;box-shadow:0 5px 0 #0006;font-family:inherit}
.tb .f{font-size:clamp(44px,11vw,64px);line-height:1}.tb .n{background:#0009;border-radius:10px;padding:2px 10px}
.tb.feat{grid-column:1/-1;font-size:clamp(24px,6vw,34px)}.tb.feat .f{font-size:clamp(60px,15vw,90px)}
.tb.sel{border-color:#ffe14d;box-shadow:0 0 20px #ffe14d}
.lv{font-size:clamp(28px,7vw,44px);padding:18px 30px;width:min(90vw,460px);border-radius:30px;border:none;font-weight:bold;cursor:pointer;color:#1b2a6b;box-shadow:0 6px 0 #0006;font-family:inherit}
.big{font-size:clamp(28px,7vw,46px);padding:16px 36px;border-radius:40px;border:none;background:#ffb300;color:#1b2a6b;font-weight:bold;cursor:pointer;box-shadow:0 6px 0 #a60;font-family:inherit;text-decoration:none}
#mgEnd{justify-content:center;font-size:clamp(24px,6vw,40px)}
#mgEnd .t{font-size:clamp(80px,22vw,150px);animation:hint .8s infinite alternate}
#mgTime{font-size:clamp(50px,14vw,100px);font-weight:bold;color:#7df;font-variant-numeric:tabular-nums}
#mgNB{font-size:clamp(30px,8vw,54px);color:#ffe14d;font-weight:bold;animation:hint .5s infinite alternate}
.sm{font-size:clamp(20px,5vw,30px)!important;padding:10px 20px!important}
.hl{box-shadow:0 0 0 6px #ffe14d,0 0 30px #ffe14d!important}
.hintglow{animation:hint .6s infinite alternate;box-shadow:0 0 0 6px #7df,0 0 30px #7df!important}
