.trial-banner{position:absolute;z-index:22;left:5%;right:5%;top:68px;padding:7px 12px;border:2px solid #b77229;border-radius:12px;background:linear-gradient(135deg,#fff4dcef,#f6dca9f7);box-shadow:0 4px 20px #35210f55;text-align:center;pointer-events:none;color:#4c321f}
.trial-banner strong{display:block;font-size:18px;line-height:1.2;letter-spacing:.04em}.trial-banner span{display:block;font-size:11px;font-weight:700;margin-top:3px;line-height:1.3}
.trial-banner[data-kind=counter]{border-color:#398b85;background:linear-gradient(135deg,#edfff5ed,#bfe7d9f7);color:#234d45}
.trial-banner[data-result=success]{border-color:#66832e;background:#f0ffc9f2;color:#344c12}.trial-banner[data-result=fail]{border-color:#a64942;background:#fff0e6f2;color:#762d25}
.trial-action{border:3px solid #a56921!important;background:linear-gradient(145deg,#fff4be,#edb956)!important;box-shadow:0 0 0 3px #ffdda64d,0 4px 0 #845522!important;position:relative;overflow:hidden;opacity:1!important}
.trial-action[data-trial-kind=counter]{border-color:#2c7b6d!important;background:linear-gradient(145deg,#e1fff1,#8ed5be)!important;box-shadow:0 0 0 3px #b0ffde55,0 4px 0 #275b50!important}
.trial-action strong{font-size:clamp(19px,5.3vw,28px)!important;line-height:1.1}.trial-action small{font-weight:800!important;color:#4d432c!important}.trial-action .action-icon,.trial-action kbd{display:none}.trial-action:disabled{filter:saturate(.65);opacity:.85!important}
.trial-meter{position:absolute;left:7%;right:7%;height:15px;bottom:9px;border-radius:9px;overflow:hidden;background:#594237;border:1px solid #47382b;box-shadow:inset 0 2px 3px #0004}
.trial-meter i{position:absolute;top:0;bottom:0}.trial-fill{left:0;width:calc(var(--trial-progress,0)*100%);background:linear-gradient(90deg,#efad37,#fff3ae);transition:width .08s linear}
.trial-good{left:31%;width:38%;background:#77c78e}.trial-perfect{left:43%;width:14%;background:#fce582}.trial-cursor{width:5px;left:clamp(0px,calc(var(--trial-position,0)*100% - 2.5px),calc(100% - 5px));background:#fff;box-shadow:0 0 5px #000;z-index:2}
.trial-meter[data-kind=mash] .trial-good,.trial-meter[data-kind=mash] .trial-perfect,.trial-meter[data-kind=mash] .trial-cursor,.trial-meter[data-kind=counter] .trial-fill{display:none}
.trial-pressed{animation:trial-tap-pop .12s ease-out}.hero-actor.trial-bound .body{animation:trial-struggle .2s ease-in-out infinite alternate;filter:sepia(.35)}
.hero-actor.trial-bound::after{content:'';position:absolute;left:12%;right:12%;height:42%;top:29%;border:5px double #b775d2;border-radius:45%;transform:rotate(-22deg);box-shadow:0 0 12px #8145bcaa,inset 0 0 7px #64367a88;pointer-events:none;z-index:9}
.hero-actor.trial-counter-ready .ground-ring{border:3px solid #fcdf7b!important;box-shadow:0 0 15px #fff2aa;animation:trial-ring .7s ease-in-out infinite alternate}
.hero-actor.trial-escaped .body{animation:trial-escape .42s ease-out}.hero-actor.trial-slammed .body{animation:trial-slam .45s ease-out}.trial-scene .boss-actor .body{filter:drop-shadow(0 0 10px #f5b95588)}
@keyframes trial-tap-pop{50%{transform:scale(.96)}}@keyframes trial-struggle{from{transform:translateX(-3px) rotate(-3deg)}to{transform:translateX(3px) rotate(3deg)}}@keyframes trial-ring{to{box-shadow:0 0 25px #ffcb37}}
@keyframes trial-escape{35%{transform:translateY(-30px) rotate(-9deg)}70%{transform:translateY(-12px) rotate(5deg)}}@keyframes trial-slam{35%{transform:translateY(-10px) rotate(12deg)}60%{transform:translateY(13px) scaleY(.7)}80%{transform:translateY(-5px)}}
.reduce-motion .trial-pressed,.reduce-motion .trial-bound .body,.reduce-motion .trial-counter-ready .ground-ring,.reduce-motion .trial-escaped .body,.reduce-motion .trial-slammed .body{animation:none!important}
@media(max-height:700px){.trial-banner{padding:6px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px}.trial-banner strong{font-size:15px;max-width:50%}.trial-banner span{font-size:10px;margin:0;text-align:right;max-width:62%}.trial-meter{height:12px;bottom:6px}}
@media(min-width:821px){.trial-banner{left:50%;right:auto;transform:translateX(-50%);width:88%;max-width:720px;display:flex;align-items:center;justify-content:center;gap:20px}.trial-banner span{margin:0}}
@media(prefers-reduced-motion:reduce){.trial-pressed,.trial-bound .body,.trial-counter-ready .ground-ring,.trial-escaped .body,.trial-slammed .body{animation:none!important}}