#story-feedback-pointer,#story-feedback-banner,.story-feedback-particles{position:fixed;pointer-events:none;user-select:none;letter-spacing:0}
#story-feedback-pointer[hidden],#story-feedback-banner[hidden]{display:none!important}
#story-feedback-pointer{z-index:47;width:42px;height:42px;filter:drop-shadow(0 2px 2px #402b2a44);--pointer-angle:90deg;--pointer-x:0px;--pointer-y:5px}
#story-feedback-pointer img{display:block;width:100%;height:100%;object-fit:contain;transform:rotate(var(--pointer-angle));animation:story-feedback-point 1.15s ease-in-out infinite}
#story-feedback-pointer[data-direction=up]{--pointer-angle:-90deg;--pointer-y:-5px}
#story-feedback-pointer[data-direction=right]{--pointer-angle:0deg;--pointer-x:5px;--pointer-y:0px}
#story-feedback-pointer[data-direction=left]{--pointer-angle:180deg;--pointer-x:-5px;--pointer-y:0px}
#story-feedback-banner{z-index:48;display:flex;align-items:center;gap:12px;min-height:80px;width:max-content;max-width:calc(100vw - 24px);padding:14px 30px 14px 20px;color:#345b37;background:url('../assets/ui/hud-pill.png') center/100% 100% no-repeat;filter:drop-shadow(0 5px 8px #213c3c2e);font-family:"Microsoft YaHei",system-ui,sans-serif;transform-origin:center;box-sizing:border-box}
.story-feedback-seal{display:grid;place-items:center;flex:none;width:48px;height:48px;background:url('../assets/ui-user/goal-icon-bg.png') center/contain no-repeat}
.story-feedback-seal>.crop-icon{display:block;width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 2px 1px #5a463520)}
.story-feedback-content{min-width:0;text-align:left}
#story-feedback-banner strong{display:block;font-size:18px;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
.story-feedback-rewards{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.story-feedback-rewards:empty{display:none}
.story-feedback-reward{display:flex;align-items:center;gap:3px;min-height:28px}
.story-feedback-reward>.crop-icon{width:27px;height:27px;object-fit:contain;flex:none}
.story-feedback-reward>b{font-size:15px;line-height:1.2;color:#8e5527;font-variant-numeric:tabular-nums;white-space:nowrap}
#story-feedback-banner[data-kind=claim]{min-height:106px;min-width:270px;padding:17px 38px 17px 22px;gap:15px}
#story-feedback-banner[data-kind=claim] .story-feedback-seal{width:64px;height:64px}
#story-feedback-banner[data-kind=claim] .story-feedback-seal>.crop-icon{width:72px;height:72px}
#story-feedback-banner[data-kind=claim] strong{font-size:25px;color:#416a37}
#story-feedback-banner[data-kind=claim] .story-feedback-rewards{margin-top:4px}
.story-feedback-enter{animation:story-feedback-arrive var(--feedback-life) cubic-bezier(.22,.72,.24,1) both}
.story-feedback-particles{inset:0;z-index:47;overflow:hidden;contain:strict}
.story-feedback-particle{position:absolute;width:23px;height:23px;object-fit:contain;opacity:0;filter:drop-shadow(0 2px 2px #183b2526);animation:story-feedback-burst var(--fx-duration) cubic-bezier(.1,.6,.3,1) var(--fx-delay) both}
.story-feedback-step{animation:story-feedback-step 440ms ease-out!important}
.story-target{animation:story-target-beacon 1.45s ease-in-out infinite!important}
@keyframes story-target-beacon{0%,100%{outline-color:#ffe99a;outline-offset:4px;box-shadow:0 0 0 4px #ffd64f33,0 0 9px #f9c44766}50%{outline-color:#ffca35;outline-offset:7px;box-shadow:0 0 0 10px #ffd64f11,0 0 22px #ffdd7199}}
@keyframes story-feedback-point{0%,100%{translate:0 0}50%{translate:var(--pointer-x) var(--pointer-y)}}
@keyframes story-feedback-arrive{0%{opacity:0;translate:0 10px;scale:.9}14%{opacity:1;translate:0 -2px;scale:1.035}25%,82%{opacity:1;translate:0 0;scale:1}100%{opacity:0;translate:0 -9px;scale:.98}}
@keyframes story-feedback-burst{0%{opacity:0;transform:translate(-50%,-50%) scale(.45)}16%{opacity:1}72%{opacity:.95}100%{opacity:0;transform:translate(calc(-50% + var(--fx-x)),calc(-50% + var(--fx-y))) rotate(var(--fx-rotation)) scale(.6)}}
@keyframes story-feedback-step{0%{opacity:.6;translate:0 7px;filter:brightness(1.18)}42%{opacity:1;translate:0 -1px;filter:brightness(1.08)}100%{opacity:1;translate:0 0;filter:none}}
#story-feedback-pointer[data-reduced=true] img,#story-feedback-banner[data-reduced=true]{animation:none}
body[data-reduced-motion=true] :is(#story-feedback-pointer img,.story-feedback-enter,.story-feedback-step,.story-target){animation:none!important}
body[data-reduced-motion=true] .story-feedback-particles{display:none}
@media(max-width:600px){
 #story-feedback-pointer{width:34px;height:34px}
 #story-feedback-banner{min-height:64px;gap:8px;padding:12px 22px 12px 15px}
 #story-feedback-banner strong{font-size:16px}.story-feedback-seal{width:38px;height:38px}.story-feedback-seal>.crop-icon{width:42px;height:42px}
 #story-feedback-banner[data-kind=claim]{min-width:248px;min-height:92px;padding:14px 27px 14px 17px;gap:10px}
 #story-feedback-banner[data-kind=claim] .story-feedback-seal{width:50px;height:50px}#story-feedback-banner[data-kind=claim] .story-feedback-seal>.crop-icon{width:58px;height:58px}
 #story-feedback-banner[data-kind=claim] strong{font-size:22px}.story-feedback-rewards{gap:3px 8px}.story-feedback-reward>b{font-size:14px}
 .story-feedback-particle{width:19px;height:19px}
}
@media(prefers-reduced-motion:reduce){#story-feedback-pointer img,.story-feedback-enter,.story-feedback-step,.story-target{animation:none!important}.story-feedback-particles{display:none}}
