*{box-sizing:border-box;margin:0;padding:0}html,body{color:#fff;background:#14100e;height:100%;font-family:system-ui,Noto Sans TC,sans-serif;overflow:hidden}#wrap{flex-direction:column;justify-content:center;align-items:center;gap:10px;width:100vw;height:100vh;display:flex}#stage{width:min(96vw,800px);position:relative}#game{background:linear-gradient(#2a3a6a,#6a5a7a 60%,#8a7a5a);border-radius:10px;width:100%;display:block}#hud{z-index:5;align-items:center;gap:12px;display:flex;position:absolute;top:10px;left:12px;right:12px}.side{flex:1}.side.right{flex-direction:column;align-items:flex-end;display:flex}.bar{background:#00000080;border:2px solid #fff;border-radius:6px;height:20px;overflow:hidden}.side.right .bar{transform:scaleX(-1)}.bar i{background:linear-gradient(#7dff8f,#29c24a);width:100%;height:100%;transition:width .15s;display:block}.who{text-shadow:0 1px 2px #000;font-size:12px;font-weight:700}#timer{text-shadow:0 2px 4px #000;text-align:center;min-width:48px;font-size:28px;font-weight:800}#rounds{z-index:5;justify-content:center;gap:40px;font-size:14px;display:flex;position:absolute;top:40px;left:0;right:0}#rounds span{opacity:.3}#rounds span.win{opacity:1}#msg{text-align:center;color:#ffd94a;text-shadow:0 3px 8px #000;pointer-events:none;font-size:42px;font-weight:900;position:absolute;top:42%;left:0;right:0}.overlay{z-index:10;background:#0a0806cc;border-radius:10px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.overlay.hidden{display:none}.panel{text-align:center;background:#241a14;border:1px solid #6a4a2a;border-radius:16px;max-width:380px;padding:26px 30px}.panel h1{color:#ffb347;margin-bottom:10px;font-size:26px}.panel p{color:#e8dccb;margin:6px 0;font-size:14px;line-height:1.6}.panel .keys{color:#b09878;font-size:12px}.panel button{color:#241a14;cursor:pointer;background:#ffb347;border:none;border-radius:999px;margin-top:14px;padding:11px 34px;font-size:17px;font-weight:700}#pad{justify-content:space-between;width:min(96vw,800px);display:none}#pad .dl,#pad .dr{gap:8px;display:flex}.b{color:#fff;-webkit-user-select:none;user-select:none;touch-action:none;background:#ffffff1a;border:2px solid #ffffff4d;border-radius:12px;width:60px;height:60px;font-size:20px;font-weight:700}.b.atk{background:#ff783c59;border-color:#ff965a99}@media (hover:none) and (pointer:coarse){#pad{display:flex}}