/* A fighting-game flourish at the river's edge. No panel, touch target,
   backdrop blur, screen flash or perpetual animation competes with combat. */
.hit-combo{--combo-accent:#b1f3ff;--combo-edge:#3f98b0;--combo-number-size:58px;--combo-aura:0;--combo-flare:0;position:absolute;top:180px;left:22px;z-index:3;width:156px;pointer-events:none;user-select:none;contain:layout style;isolation:isolate;color:var(--combo-accent);text-align:left}
.hit-combo[data-tone=mint]{--combo-accent:#baffdb;--combo-edge:#379876}
.hit-combo[data-tone=gold]{--combo-accent:#ffe2a0;--combo-edge:#b67832}
.hit-combo[data-tone=coral]{--combo-accent:#ffbea5;--combo-edge:#bc584d}
.hit-combo[data-tone=violet]{--combo-accent:#e3c7ff;--combo-edge:#965ab9}
.hit-combo[data-tone=crown]{--combo-accent:#fff2bf;--combo-edge:#bb799d}
.hit-combo[data-tone=ion]{--combo-accent:#bdefff;--combo-edge:#3686d7}
.hit-combo[data-tone=solar]{--combo-accent:#fff0b4;--combo-edge:#d28b38}
.hit-combo[data-tone=astral]{--combo-accent:#edd4ff;--combo-edge:#9966e5}
.hit-combo[data-tone=eternal]{--combo-accent:#fffbdc;--combo-edge:#b68fef}
.hit-combo:before{content:'';position:absolute;z-index:-1;left:-5px;top:13px;width:calc(100% + 5px);height:64px;pointer-events:none;background:radial-gradient(ellipse at 40% 45%,var(--combo-accent),transparent 68%);clip-path:polygon(0 42%,16% 34%,5% 13%,29% 23%,33% 0,47% 24%,65% 5%,65% 28%,98% 21%,77% 46%,100% 63%,70% 69%,80% 100%,53% 79%,27% 98%,24% 73%,0 80%,12% 56%);opacity:var(--combo-aura)}
.hit-combo:after{content:'';position:absolute;z-index:-1;left:-4px;top:12px;width:100%;height:62px;pointer-events:none;background:linear-gradient(105deg,transparent 8%,var(--combo-accent) 10% 16%,transparent 18%) 0 6px/34px 18px no-repeat,linear-gradient(16deg,transparent 38%,var(--combo-accent) 42% 46%,transparent 50%) right 10px/27px 14px no-repeat,linear-gradient(165deg,transparent 44%,var(--combo-accent) 48% 53%,transparent 57%) right bottom/35px 16px no-repeat,linear-gradient(95deg,transparent 40%,var(--combo-accent) 45% 51%,transparent 56%) 5px bottom/23px 14px no-repeat;opacity:var(--combo-flare)}
.hit-combo[data-energy="0"]:before,.hit-combo[data-energy="0"]:after{display:none}
.hit-combo[data-energy="3"] .hit-combo-number strong,.hit-combo[data-energy="4"] .hit-combo-number strong{color:#fffee9;text-shadow:2px 3px 0 var(--combo-edge),0 0 8px var(--combo-edge),0 3px 9px #032434b3}
.hit-combo-label{display:block;font:600 7px/1 var(--mono);letter-spacing:1.5px;color:#c9e8eb;text-shadow:0 1px 3px #001e30}
.hit-combo-number{display:flex;align-items:baseline;gap:6px;width:max-content;transform-origin:18% 70%;margin:4px 0 6px}
.hit-combo-number strong{font:900 italic var(--combo-number-size)/.86 var(--display);letter-spacing:-1px;color:#f0fbff;text-shadow:2px 3px 0 var(--combo-edge),0 3px 9px #032434b3;font-variant-numeric:tabular-nums}
.hit-combo-number small{font:800 italic 13px/1 var(--display);letter-spacing:.5px;text-shadow:0 2px 4px #032434}
.hit-combo-meter{position:relative;width:72px;height:2px;background:#b2d8e133;transform:skewX(-19deg);overflow:hidden}
.hit-combo-meter i{display:block;width:100%;height:100%;transform-origin:left center;background:var(--combo-accent);box-shadow:0 0 7px var(--combo-accent)}
.hit-combo.expiring .hit-combo-meter i{background:#ffbe94}
.hit-combo.in-transit .hit-combo-label{color:var(--combo-accent);letter-spacing:1px}
.hit-combo.in-transit .hit-combo-meter{background:#b7d7ff40}
.hit-combo-word{position:relative;margin-top:8px;max-width:100%;white-space:normal;overflow-wrap:anywhere;font:900 italic 19px/1.05 var(--display);letter-spacing:-.15px;color:var(--combo-accent);text-shadow:1px 2px 0 #08283deb,0 2px 9px #061c38a6}
.hit-combo-word:after{content:'';display:block;margin-top:4px;width:32px;height:2px;background:linear-gradient(90deg,var(--combo-accent),transparent);transform:skewX(-30deg)}
body:not(.in-flight) .hit-combo{display:none}
@media(max-width:720px),(pointer:coarse) and (max-width:1024px),(max-height:540px) and (max-width:1024px){
 .in-flight .hit-combo{--combo-number-size:47px;left:max(16px,env(safe-area-inset-left));top:max(145px,calc((100% - var(--fitted-flight-height,100%)) / 2 + 72px));width:132px}
 .hit-combo-label{font-size:6px;letter-spacing:1.1px}
 .hit-combo-number{gap:5px;margin-top:4px;margin-bottom:6px}
 .hit-combo-number strong{letter-spacing:-.5px}
 .hit-combo-number small{font-size:11px}
 .hit-combo-meter{width:62px}
 .hit-combo-word{font-size:16px}
}
@media(max-height:540px) and (max-width:1024px) and (orientation:landscape){
 .in-flight .hit-combo{--combo-number-size:42px;position:fixed;top:190px;left:max(16px,env(safe-area-inset-left));width:calc(50vw - 100dvh * 5 / 14 - 26px);max-width:138px}
 .hit-combo-number small{font-size:10px}
 .hit-combo-word{font-size:14px}
}
@media(max-width:599px) and (max-height:540px) and (orientation:landscape){
 .in-flight .hit-combo{--combo-number-size:36px;top:196px}
 .hit-combo-number{gap:3px}
 .hit-combo-number small{font-size:8px}
 .hit-combo-word{font-size:12px}
}
