.oy{max-width:520px;margin:0 auto;text-align:center}
.kb-row{display:flex;justify-content:center;gap:5px;margin:5px 0}
.kb-k{flex:1 1 0;max-width:44px;min-width:0;height:50px;border:0;border-radius:3px;background:#dfe3ea;color:#1b2430;font:700 15px/1 sans-serif;font-family:inherit;cursor:pointer;padding:0}
.kb-k.kb-w{flex:1.6 1 0;max-width:64px;font-size:13px}
.kb-k:active{transform:scale(.96)}
.kb-k.g{background:#2f9e5b;color:#fff}.kb-k.y{background:#d9a21b;color:#fff}.kb-k.x{background:#8b94a3;color:#fff}.kb-k:disabled{opacity:.45}
.gk-grid{display:grid;grid-template-rows:repeat(6,1fr);gap:5px;width:min(100%,320px);margin:14px auto}
.gk-r{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.gk-r.shake{animation:oyshake .4s}
@keyframes oyshake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.gk-c{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;border:2px solid #c9d0db;border-radius:3px;font:800 clamp(20px,6vw,28px)/1 sans-serif;font-family:inherit;text-transform:none;background:#fff;color:#1b2430}
.gk-c.f{border-color:#6b7686}.gk-c.g{background:#2f9e5b;border-color:#2f9e5b;color:#fff}.gk-c.y{background:#d9a21b;border-color:#d9a21b;color:#fff}.gk-c.x{background:#8b94a3;border-color:#8b94a3;color:#fff}
.oy-msg{min-height:1.6em;font-weight:600;margin:6px 0}
.oy-box{background:#f3f6fa;border-radius:4px;padding:14px;margin:14px 0}
.oy-stats{display:flex;justify-content:space-around;gap:6px}.oy-stats b{display:block;font-size:24px}.oy-stats span{font-size:12px;color:#5b6676}
.oy-bar{display:flex;align-items:center;gap:6px;margin:3px 0;font-size:13px}.oy-bar i{display:block;background:#2f9e5b;color:#fff;min-width:18px;padding:1px 6px;border-radius:3px;font-style:normal;text-align:right}
.oy-btn{margin:4px}
.am-word{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:14px 0;min-height:48px}
.am-word span{width:36px;height:46px;border-bottom:3px solid #6b7686;font:800 26px/46px sans-serif;font-family:inherit;color:#1b2430}
.am-word span.miss{color:#c0392b}
.am-svg{width:170px;height:190px;margin:0 auto;display:block}.am-svg *{stroke:#1b2430;stroke-width:4;fill:none;stroke-linecap:round}
.am-svg .p{display:none}.am-svg .p.s{display:inline}
.am-lvl{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:8px 0}.am-lvl button.on{background:#1b3a6b;color:#fff}
.av-top{display:flex;justify-content:space-between;align-items:center;font-weight:700;margin:8px 0}
.av-time{font-size:26px;font-variant-numeric:tabular-nums}.av-time.lo{color:#c0392b}
.av-rack{display:flex;justify-content:center;gap:6px;margin:12px 0;flex-wrap:wrap}
.av-rack button{width:44px;height:52px;border:0;border-radius:4px;background:#f2c94c;color:#3a2e00;font:800 24px/1 sans-serif;font-family:inherit;cursor:pointer;border-bottom:3px solid #c9a227}
.av-rack button:disabled{opacity:.3}
.av-cur{min-height:52px;font:800 28px/52px sans-serif;font-family:inherit;letter-spacing:3px;border-bottom:2px solid #c9d0db;margin:6px auto;max-width:340px}
.av-list{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:10px 0}.av-list span{background:#e5f4ea;border-radius:3px;padding:3px 9px;font-size:14px}.av-list span.m{background:#f4e5e5}.av-list span.b{background:#fff3c4;font-weight:700}
@media(max-width:380px){.kb-k{height:46px;font-size:14px}.kb-row{gap:3px}}
.oy [hidden],.oy-btn[hidden],#avStart[hidden]{display:none!important}
