html.echo-boxing body #boxingApp #guardButton{display:none!important}
html.echo-boxing body #boxingApp #boxingTrack{height:125px!important;min-height:110px!important;flex-basis:125px!important;background:#f8fbffef!important;overflow:visible!important}
#echoCue{display:flex;align-items:center;justify-content:center;gap:24px;height:100%;padding:12px 20px;text-align:center;color:#183b50}
#echoCue>div{display:flex;flex-direction:column;gap:5px;min-width:0}#echoCue small{font:800 10px/1.2 system-ui;letter-spacing:2px;color:#32798c}#echoEnglish{font:900 clamp(21px,3vw,33px)/1.2 system-ui;overflow-wrap:anywhere}#echoCopy{font:800 18px/1.25 system-ui;color:#157265;min-height:23px}
#echoReplay{flex:none;min-height:44px;padding:10px 16px;border:1px solid #bdd5e1;border-radius:12px;background:#fff;color:#234f64;font:800 15px/1.2 system-ui;cursor:pointer}#echoReplay:disabled{opacity:.45}
#echoCue[data-state=ready]{box-shadow:inset 0 -4px #48a8b8}#echoCue[data-state=hit]{background:#ecfff8}
html.echo-boxing body #boxingApp .fight-arena .boxing-glove{touch-action:manipulation;transition:filter .15s;outline:none}
html.echo-boxing body #boxingApp .fight-arena .boxing-glove>b{position:absolute!important;top:25%!important;left:10%!important;bottom:auto!important;width:80%!important;height:auto!important;min-height:45px!important;padding:8px 9px!important;display:flex!important;align-items:center!important;justify-content:center!important;border:2px solid #a9c5d0!important;background:#ffffffed!important;color:#133a52!important;border-radius:13px!important;box-shadow:0 3px 5px #143a4f22!important;font:900 clamp(16px,2.5vw,26px)/1.15 system-ui!important;overflow-wrap:anywhere;white-space:normal!important;text-shadow:none!important;pointer-events:none}
html.echo-boxing body #boxingApp .fight-arena .boxing-glove>small{display:none!important}
html.echo-boxing body #boxingApp .fight-arena .boxing-glove[aria-disabled=false]{filter:drop-shadow(0 0 8px #a4e5f7)!important}
html.echo-boxing body #boxingApp .fight-arena .boxing-glove:focus-visible{outline:3px solid #168cb4!important;outline-offset:3px!important}
html.echo-boxing body #boxingApp .fight-arena .boxing-glove.echo-strike{animation:echo-strike .39s ease-in-out!important;z-index:25!important}
html.echo-boxing body #boxingApp #monster.echo-block{animation:echo-block .46s ease-out!important}
.echo-combo{position:absolute;top:12px;right:18px;z-index:15;border-radius:12px;padding:9px 14px;background:#123e56e8;color:#fff;font:900 18px/1.1 system-ui;pointer-events:none}
#echoImpact{position:absolute;top:35%;left:50%;z-index:30;transform:translate(-50%,-50%);padding:12px 18px;background:#fff;color:#c82e53;border:4px solid #c82e53;border-radius:20px;font:950 clamp(30px,5vw,60px)/1 system-ui;pointer-events:none;opacity:0}#echoImpact.show{animation:echo-impact .65s both}
html.echo-boxing body #boxingApp #fightResult .learning-summary{display:none!important}
@keyframes echo-strike{0%,100%{transform:translate(0,0) scale(1)}40%,58%{transform:translate(var(--echo-x),var(--echo-y)) scale(.85)}}
@keyframes echo-block{0%,100%{transform:translateX(-50%)}45%{transform:translateX(-50%) scale(1.08)}}
@keyframes echo-impact{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}25%,65%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-70%) scale(1.18)}}
@media(max-width:600px){#echoCue{gap:9px;padding:10px}#echoReplay{font-size:12px;padding:9px;max-width:105px}#echoEnglish{font-size:20px}#echoCopy{font-size:16px}.echo-combo{right:8px;top:8px;font-size:14px;padding:7px 9px}html.echo-boxing body #boxingApp .fight-arena .boxing-glove>b{font-size:17px!important;min-height:40px!important;padding:6px!important;left:0!important;width:100%!important}html.echo-boxing body #boxingApp .fight-arena .boxing-glove{width:34vw!important;max-width:36%!important}}
@media(prefers-reduced-motion:reduce){html.echo-boxing body #boxingApp .fight-arena .boxing-glove.echo-strike,html.echo-boxing body #boxingApp #monster.echo-block,#echoImpact.show{animation:none!important}#echoImpact.show{opacity:1}}

#echoTimer{min-width:105px;text-align:center;font:900 25px/1.2 system-ui;color:#b32a49}#echoTimer>i{display:block;width:100%;height:7px;background:#d8e7ee;border-radius:5px;overflow:hidden;margin-top:5px}#echoTimeBar{display:block;height:100%;background:#c73b59;transform-origin:left}
html.echo-boxing body #boxingApp #monster.echo-attack{animation:echo-counter .52s ease-out!important;z-index:30!important}
html.echo-boxing body #boxingApp #boxingStage.echo-player-hit:after{content:'';position:absolute;inset:0;background:#df244c33;box-shadow:inset 0 0 70px #c7164c77;pointer-events:none;z-index:40;animation:echo-red .52s both}
#echoCue[data-state=miss]{background:#ffedf2}#echoReview{color:#fff;font:700 15px/1.6 system-ui;max-height:120px;overflow:auto;margin:0}
@keyframes echo-counter{0%,100%{transform:translateX(-50%) scale(1)}45%{transform:translate(-50%,24px) scale(1.35)}}@keyframes echo-red{0%,100%{opacity:0}40%{opacity:1}}
@media(max-width:600px){#echoTimer{min-width:66px;font-size:21px}#echoReplay{max-width:75px}#echoCue{gap:7px}#echoEnglish{font-size:18px}}
@media(prefers-reduced-motion:reduce){html.echo-boxing body #boxingApp #monster.echo-attack{animation:none!important}}

html.echo-boxing body #boxingApp .fight-arena .boxing-glove>b{transform:none!important}
html.echo-boxing body #boxingApp #fightResult #echoReview{display:block!important}

html.echo-boxing body #boxingApp #boxingStage{background:#c4d1df url("./assets/monster-punch-ring-v1.png") center/cover no-repeat!important}
html.echo-boxing body #boxingApp #monsterSprite{filter:drop-shadow(0 10px 5px #19304455)!important}
