#ping-scene{width:min(1040px,calc(100% - 24px));max-height:calc(100svh - 24px);overflow:auto;background:#f4e8cd;color:#27493c;border:1px solid #baa371;border-radius:20px}#ping-scene::backdrop{background:#142e2bdf;backdrop-filter:blur(5px)}.ping-nav{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:6px 12px;background:#f4e8cd;border-bottom:1px solid #c8b78c;font:13px system-ui}.ping-nav button{background:none;border:0;padding:8px;color:#315941;min-height:42px;cursor:pointer}.ping-content{text-align:center;padding:8px 16px}.ping-content h1{font:600 clamp(21px,2.8vw,28px)/1.1 Georgia;margin:5px 0 9px}.ping-stage{position:relative;width:min(100%,calc(max(180px,100svh - 300px)*1.53846));aspect-ratio:20/13;margin:auto;overflow:hidden;border-radius:14px;background:#cdbb98;isolation:isolate;touch-action:none}.ping-world{width:100%;height:100%;display:block}.ping-stage [hidden]{display:none}.ping-name{position:absolute;top:22%;background:#fff0c5e8;border:1px solid #ac8d5d;border-radius:5px;padding:2px 5px;font:600 clamp(9px,1.3vw,13px) system-ui;transform:translateX(-50%);white-space:nowrap}.ping-name-left{left:14.5%}.ping-name-right{left:85.5%;top:20%}.ping-name-watch{left:50%;top:18%}.ping-score{position:absolute;left:50%;bottom:2%;transform:translateX(-50%);padding:5px 9px;background:#fff1cee8;border-radius:9px;font:700 clamp(12px,1.6vw,18px) system-ui;white-space:nowrap;margin:0}.ping-bubble{position:absolute;left:3%;top:3%;max-width:68%;margin:0;padding:6px 9px;border:2px solid #b3966d;border-radius:13px;background:#fff1ce;font:600 clamp(12px,1.7vw,19px)/1.2 Georgia}.ping-guide{height:48px;margin:8px 0 4px;font:13px/1.3 system-ui}.ping-controls{min-height:44px;display:flex;gap:8px;justify-content:center}.ping-controls button{min-height:44px;padding:9px 13px;border:1px solid #a5946d;border-radius:10px;background:#315941;color:#fff5df;font:600 14px system-ui;cursor:pointer;touch-action:none}.ping-stop svg{width:54%;height:54%;filter:drop-shadow(0 3px 3px #353d3655)}.ping-content.is-loading .ping-stage,.ping-content.is-loading .ping-guide,.ping-content.is-loading .ping-controls{visibility:hidden;pointer-events:none}@media(max-width:600px){.ping-content{padding:8px 12px}.ping-nav{padding:5px 7px}.ping-guide{font-size:12px}.ping-name{font-size:10px;padding:1px 3px}.ping-name-right{max-width:30%;white-space:normal;font-size:9px}.ping-controls button{font-size:12px;padding:8px 10px}.ping-bubble{padding:5px;font-size:12px}.ping-score{font-size:12px;padding:4px 6px}}
.ping-content.is-loading{position:relative}.ping-content.is-loading::after{content:'Loading players…';position:absolute;top:50%;left:0;right:0;font:14px system-ui;color:#315941}