*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#101c19;color:#f3f5e9;font-family:system-ui,sans-serif}canvas{display:block;width:100vw;height:100vh;touch-action:none}#scoreboard{position:fixed;top:16px;left:20px;right:20px;z-index:4;display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #e8dfc440;border-radius:16px;background:#182b30d9;box-shadow:0 8px 32px #0003;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#f5efdf;font:13px/1.3 system-ui,sans-serif;font-variant-numeric:tabular-nums}.score{padding:6px 8px;border-left:3px solid #d52d43;white-space:nowrap}.score strong{margin-right:12px}.score strong:last-child{margin-right:0}.match-time{display:flex;align-items:center;background:#f3f5e9;color:#172333}.match-time{border-radius:8px;overflow:hidden}.match-time time{padding:6px 8px}.added-time{background:#d9e87c;padding:6px}#app-controls{margin-left:auto;display:flex;align-items:center;gap:5px;flex-wrap:wrap}#scoreboard button,#back,#graphics-panel button,#performance-notice button{display:inline-flex;align-items:center;justify-content:center;min-height:32px;border:0;border-radius:9px;background:#ffffff10;color:inherit;padding:5px 7px;cursor:pointer;font:inherit;text-decoration:none;white-space:nowrap}#scoreboard button:hover,#back:hover,#graphics-panel button:hover,#performance-notice button:hover{background:#ffffff20}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #ccebdc;outline-offset:2px}#audio[aria-pressed=true]{color:#d9e87c}[hidden]{display:none!important}#graphics-panel{position:fixed;top:var(--graphics-top, 82px);right:20px;width:min(380px,calc(100vw - 40px));max-height:calc(100dvh - var(--graphics-top, 82px) - 16px);overflow:auto;z-index:5;padding:16px;border:1px solid #e8dfc440;border-radius:16px;background:#182b30f5;color:#f5efdf;font:13px/1.5 system-ui,sans-serif}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}#quality{padding:6px;margin:0 5px;font:inherit}#graphics-device{overflow-wrap:anywhere}#performance-notice{position:fixed;left:20px;right:20px;bottom:80px;z-index:4;display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px;border-radius:12px;background:#7a5b12;color:#fff6dc;font-size:13px}#error{position:absolute;inset:20% 10%;background:#341d1ef2;padding:32px;white-space:pre-wrap;overflow:auto}#caption{position:absolute;bottom:28px;left:5%;right:5%;text-align:center;font-size:clamp(16px,2.2vw,26px);pointer-events:none;opacity:0;text-shadow:0 2px 16px #000a}#caption.show{opacity:1}#fade{position:absolute;inset:0;background:#050807;pointer-events:none;opacity:0;transition:opacity 1.6s ease}#fade.black{opacity:1;transition:none}@media(max-width:600px){#scoreboard{top:12px;left:12px;right:12px;gap:5px;padding:6px 8px;flex-wrap:wrap;font-size:12px}.score{padding:5px}.match-time time,.added-time{padding:5px}#app-controls{flex-basis:100%;justify-content:flex-end}#scoreboard button,#back,#graphics-panel button,#quality,#performance-notice button{min-height:44px}#graphics-panel{right:12px;width:calc(100vw - 24px)}}
