*{box-sizing:border-box}html,body{background:#05040f;height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#stage{transform-origin:50%;width:720px;height:1280px;transform:translate(-50%, -50%) scale(var(--scale,1));position:absolute;top:50%;left:50%;overflow:hidden}#game{width:720px;height:1280px;display:block;position:absolute;inset:0}#hud{pointer-events:none;color:#fff;position:absolute;inset:0}.banner{text-align:center;background:#0c0a28b8;border:2px solid #ffffff1f;border-radius:22px;padding:14px 18px;position:absolute;top:28px;left:24px;right:24px}.banner .title{letter-spacing:1px;text-shadow:0 3px #00000080;font-size:40px;font-weight:900}.banner .sub{opacity:.9;margin-top:4px;font-size:24px;font-weight:700}.banner .count{color:#ffd34d}.ranking{background:#0c0a288c;border-radius:16px;width:210px;padding:8px;position:absolute;top:160px;right:12px}.ranking h3{text-align:center;color:#ffd34d;margin:0 0 6px;font-size:20px;font-weight:900}.row{text-shadow:0 2px 2px #0009;align-items:center;gap:6px;padding:3px 2px;font-size:19px;font-weight:800;display:flex}.row .pos{text-align:right;color:#ffd34d;width:28px}.row canvas{border-radius:50%;flex:none;width:30px;height:30px}.row .name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.row.done .name:after{content:" 🏁"}.cards{flex-direction:column;gap:10px;width:320px;display:flex;position:absolute;top:160px;left:12px}.card{background:linear-gradient(90deg,#ff3d8beb,#8338ece0);border-radius:18px;align-items:center;gap:10px;padding:10px 12px;animation:.35s ease-out card-in;display:flex;box-shadow:0 6px 18px #00000059}.card canvas{border:3px solid #fff;border-radius:50%;flex:none;width:56px;height:56px}.card .who{white-space:nowrap;text-overflow:ellipsis;max-width:230px;font-size:22px;font-weight:900;overflow:hidden}.card .what{font-size:20px;font-weight:700}.card.out{animation:.4s ease-in forwards card-out}@keyframes card-in{0%{opacity:0;transform:translate(-120%)}to{opacity:1;transform:none}}@keyframes card-out{to{opacity:0;transform:translate(-120%)}}.podium{background:#05040fb8;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.podium h1{color:#ffd34d;text-shadow:0 4px #0009;margin:0 0 40px;font-size:64px;font-weight:900}.podium .steps{align-items:flex-end;gap:18px;display:flex}.podium .step{flex-direction:column;align-items:center;width:200px;display:flex}.podium .step canvas{border:5px solid #fff;border-radius:50%;width:140px;height:140px;margin-bottom:12px}.podium .step .n{text-overflow:ellipsis;white-space:nowrap;max-width:200px;font-size:26px;font-weight:900;overflow:hidden}.podium .block{border-radius:16px 16px 0 0;justify-content:center;align-items:flex-start;width:100%;margin-top:10px;padding-top:10px;font-size:64px;font-weight:900;display:flex}.podium .p1 .block{color:#3a2a00;background:#ffc400;height:260px}.podium .p2 .block{color:#263040;background:#c9d1e0;height:190px}.podium .p3 .block{color:#3d1f05;background:#d58a4a;height:140px}.footer{text-align:center;opacity:.85;font-size:20px;font-weight:700;position:absolute;bottom:18px;left:0;right:0}.footer .gifts{background:#0c0a28b3;border-radius:12px;margin-top:6px;padding:6px 12px;font-size:18px;display:inline-block}.fps{background:#0009;border-radius:6px;padding:2px 6px;font:700 16px monospace;position:absolute;bottom:70px;left:12px}.flash{opacity:0;background:#fff;transition:opacity .4s;position:absolute;inset:0}.flash.on{opacity:.35;transition:none}
