/* ==========================================================================
   KTK v3 FLOATING COMBAT TEXT (presentation only). Cinzel metallic gradient
   numbers & stamps: gold = your hits, ember red = damage you take, element
   tints + glow. Punchy pop -> smooth arcing rise -> fade. Sparks on crits and
   trumps. Transform/opacity only for motion; reduced motion honored.
   ========================================================================== */
.floater,.fx-stamp{
  --c1:#fff4cc;--c2:#f2c552;--tint:#e0a63a;--c3:#8f5a16;--glow:rgba(255,190,90,.55);--fct-mag:1;
  font-family:"Cinzel",Georgia,serif!important;font-weight:900!important;letter-spacing:.03em;
}
/* side */
.floater.fct-taken{--c1:#ffd9c2;--c2:#ff6a3d;--tint:#e2381f;--c3:#7a120a;--glow:rgba(255,70,40,.55)}
.floater-heal{--c1:#eaffe0;--c2:#9fe07a;--tint:#5fb54a;--c3:#2c5a1e;--glow:rgba(140,230,110,.45)}
/* element tints (glow + mid band) */
.element-fire{--tint:#ff7a2e;--glow:rgba(255,120,40,.6)}
.element-water{--tint:#2f9ec4;--glow:rgba(40,150,200,.6)}
.element-wind{--tint:#cbc3f0;--glow:rgba(200,190,245,.55)}
.element-earth{--tint:#a8904a;--glow:rgba(150,160,80,.55)}

/* metallic numbers */
.floater:not(.floater-callout){
  background:linear-gradient(180deg,var(--c1) 0%,var(--c2) 38%,var(--tint) 64%,var(--c3) 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent;
  -webkit-text-stroke:1.2px rgba(14,6,3,.9);paint-order:stroke fill;text-shadow:none!important;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.85)) drop-shadow(0 0 10px var(--glow));
  padding:.08em .14em!important;line-height:1;will-change:transform,opacity;
}
.floater-dmg{font-size:calc(clamp(1.45rem,2.6vw,2.2rem) * var(--fct-mag))!important}
.floater-critical{font-size:calc(clamp(1.35rem,2.4vw,2rem) * var(--fct-mag))!important}
.floater-block,.floater-trump,.floater-absorb,.floater-info,.floater-heal{font-size:clamp(1.15rem,2vw,1.6rem)!important}
.floater.fct-big{-webkit-text-stroke-width:1.6px}

/* animation: punchy pop, then smooth arcing rise and fade */
.floater.show{animation:fct-rise 1.45s cubic-bezier(.2,.7,.3,1) forwards!important}
.floater.floater-park.show,.floater.floater-hp-damage.show{animation:fct-park 1.15s cubic-bezier(.2,.7,.3,1) forwards!important}
.floater.fct-taken.floater-park.show{animation-name:fct-park-l!important}
@keyframes fct-rise{
  0%{opacity:0;transform:translate(-50%,-40%) scale(.35)}
  9%{opacity:1;transform:translate(-50%,-55%) scale(1.32)}
  18%{transform:translate(-50%,-60%) scale(.94)}
  26%{transform:translate(-50%,-64%) scale(1)}
  75%{opacity:1;transform:translate(calc(-50% + 10px),-112%) scale(1)}
  100%{opacity:0;transform:translate(calc(-50% + 18px),-142%) scale(.9)}
}
@keyframes fct-park{
  0%{opacity:0;transform:translate(-50%,-30%) scale(.35)}
  11%{opacity:1;transform:translate(-50%,-62%) scale(1.34)}
  21%{transform:translate(-50%,-70%) scale(.95)}
  30%{transform:translate(-50%,-74%) scale(1)}
  74%{opacity:1;transform:translate(calc(-50% + 8px),-94%) scale(1)}
  100%{opacity:0;transform:translate(calc(-50% + 14px),-114%) scale(.92)}
}
@keyframes fct-park-l{
  0%{opacity:0;transform:translate(-50%,-30%) scale(.35)}
  11%{opacity:1;transform:translate(-50%,-62%) scale(1.34)}
  21%{transform:translate(-50%,-70%) scale(.95)}
  30%{transform:translate(-50%,-74%) scale(1)}
  74%{opacity:1;transform:translate(calc(-50% - 8px),-94%) scale(1)}
  100%{opacity:0;transform:translate(calc(-50% - 14px),-114%) scale(.92)}
}
.floater.fade{opacity:0!important;transition:opacity .3s ease!important}

/* stamps: BLOCKED / TRUMP / ABSORBED / OPEN LANE / CASTLE FALLS ... metallic text on a notched forged plate (::before) */
.fx-stamp{
  z-index:46!important;font-size:clamp(.92rem,1.5vw,1.3rem)!important;letter-spacing:.16em!important;padding:5px 16px 4px!important;border-radius:0!important;
  background:linear-gradient(180deg,rgba(30,18,10,.94),rgba(8,6,6,.95))!important;color:var(--c1)!important;text-shadow:none!important;
  border:1px solid color-mix(in srgb,var(--tint) 75%,#3a2a14);box-shadow:inset 0 1px rgba(255,230,170,.12),inset 0 0 12px color-mix(in srgb,var(--tint) 25%,transparent);
  clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,9px 100%,0 50%);will-change:transform,opacity;
}
.fct-burst{position:fixed;z-index:44;width:0;height:0;pointer-events:none;transform:translate(0,-30px)}
.fx-stamp .fct-t{display:inline-block;
  background:linear-gradient(180deg,var(--c1) 0%,var(--c2) 45%,var(--tint) 70%,var(--c3) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  -webkit-text-stroke:.8px rgba(10,5,3,.9);paint-order:stroke fill;filter:drop-shadow(0 0 6px var(--glow))}
.fx-stamp-block{--c1:#f0faff;--c2:#a9dcf5;--tint:#4aa8d8;--c3:#1d4a66;--glow:rgba(80,170,230,.55)}
.fx-stamp-trump{--c1:#fff6d0;--c2:#f6d27a;--tint:#e0a63a;--c3:#7a4e12;--glow:rgba(255,200,90,.7)}
.fx-stamp-trump.element-fire{--tint:#ff7a2e;--glow:rgba(255,120,40,.65)}
.fx-stamp-trump.element-water{--tint:#2f9ec4;--glow:rgba(40,150,200,.6)}
.fx-stamp-trump.element-wind{--tint:#cbc3f0;--glow:rgba(200,190,245,.6)}
.fx-stamp-trump.element-earth{--tint:#a8904a;--glow:rgba(150,160,80,.6)}
.fx-stamp-absorb{--c1:#f6efff;--c2:#d4c0f5;--tint:#a98ad8;--c3:#4a3170;--glow:rgba(180,140,240,.55)}
.fx-stamp-critical{--c1:#ffe6d6;--c2:#ff9a6a;--tint:#ff5a2e;--c3:#7a140a;--glow:rgba(255,90,40,.65)}
.fx-stamp-info{--c1:#fff7e4;--c2:#ecd9ae;--tint:#b89a5e;--c3:#5a4320;--glow:rgba(220,190,130,.35)}
.fx-stamp.show{animation:fct-stamp .72s cubic-bezier(.2,.7,.3,1) forwards!important}
@keyframes fct-stamp{
  0%{opacity:0;transform:translate(-50%,-80%) scale(.5)}
  14%{opacity:1;transform:translate(-50%,-128%) scale(1.22)}
  26%{transform:translate(-50%,-132%) scale(.97)}
  36%{transform:translate(-50%,-136%) scale(1)}
  78%{opacity:1}
  100%{opacity:0;transform:translate(-50%,-160%) scale(1)}
}

/* sparks */
.fct-spark{position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px;border-radius:50%;pointer-events:none;opacity:0;
  background:radial-gradient(circle,#fff6d0 0,var(--tint,#ffb050) 45%,rgba(255,90,20,0) 72%);
  animation:fct-spark .62s cubic-bezier(.15,.7,.3,1) forwards;-webkit-text-fill-color:initial}
.fct-spark:nth-child(even){width:4px;height:4px;margin:-2px}
@keyframes fct-spark{
  0%{opacity:0;transform:translate(0,0) scale(.6)}
  15%{opacity:1}
  100%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(.3)}
}

/* sentence callouts: same serif family, metallic numbers */
.floater.floater-callout{font-family:"Cinzel",Georgia,serif!important;font-weight:700!important;letter-spacing:.02em}
.floater-callout .callout-dmg{font-weight:900;font-size:1.3em;
  background:linear-gradient(180deg,#fff4cc,#f2c552 45%,var(--tint) 70%,#8f5a16);-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;text-shadow:none!important;filter:drop-shadow(0 0 6px var(--glow))}

/* phone: keep readable but compact */
@media (max-width:620px){
  .floater-dmg{font-size:calc(1.5rem * var(--fct-mag))!important}
  .floater-critical{font-size:calc(1.4rem * var(--fct-mag))!important}
  .floater:not(.floater-callout){-webkit-text-stroke-width:1px}
  .fx-stamp{font-size:.74rem!important;padding:3px 9px 2px!important}
}
@media (prefers-reduced-motion:reduce){
  .floater.show,.floater.floater-park.show,.floater.floater-hp-damage.show{animation:fct-still 1.15s linear forwards!important}
  .fx-stamp.show{animation:fct-still .72s linear forwards!important}
  .fct-spark{display:none}
  @keyframes fct-still{0%{opacity:0;transform:translate(-50%,-70%)}12%,80%{opacity:1;transform:translate(-50%,-70%)}100%{opacity:0;transform:translate(-50%,-70%)}}
}

/* ---------- clash line (power -> defense RESULT) on the killing ground ---------- */
.clash-ribbon{font-family:"Cinzel",Georgia,serif!important;gap:10px!important;padding:6px 22px 7px!important;isolation:isolate;
  -webkit-text-stroke:0!important;text-shadow:none!important;align-items:center!important}
.clash-ribbon::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(ellipse at center,rgba(8,5,4,.86) 0%,rgba(8,5,4,.6) 55%,rgba(8,5,4,0) 100%)}
.clash-ribbon .clash-pow[class]{background:linear-gradient(180deg,var(--c1) 0%,var(--c2) 40%,var(--tint) 66%,var(--c3) 100%)!important;-webkit-background-clip:text!important;background-clip:text!important}
.clash-ribbon .clash-pow{--c1:#fff4cc;--c2:#f2c552;--tint:#e0a63a;--c3:#8f5a16;--glow:rgba(255,190,90,.5);
  font-size:clamp(1.35rem,2.2vw,1.9rem)!important;font-weight:900;line-height:1;padding:0 .06em;
  background:linear-gradient(180deg,var(--c1) 0%,var(--c2) 40%,var(--tint) 66%,var(--c3) 100%);-webkit-background-clip:text;background-clip:text;
  color:transparent!important;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px rgba(12,6,3,.9);paint-order:stroke fill;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.8)) drop-shadow(0 0 8px var(--glow))}
.clash-pow.clash-element-fire{--tint:#ff7a2e;--glow:rgba(255,120,40,.6)}
.clash-pow.clash-element-water{--c2:#bfe8f5;--tint:#2f9ec4;--c3:#123e55;--glow:rgba(40,150,200,.6)}
.clash-pow.clash-element-wind{--c2:#ece6ff;--tint:#b9afe6;--c3:#4b4470;--glow:rgba(200,190,245,.55)}
.clash-pow.clash-element-earth{--c2:#e3d29a;--tint:#a8904a;--c3:#4a4a1c;--glow:rgba(150,160,80,.55)}
.clash-ribbon .clash-arrow{color:#e9c574!important;font-size:1.05rem!important;opacity:.85;text-shadow:0 0 6px rgba(233,197,116,.5)}
.clash-ribbon .clash-result{--rc:#e9c574;font:800 clamp(.72rem,1.05vw,.92rem) "Cinzel",Georgia,serif!important;letter-spacing:.2em!important;margin-left:6px!important;
  color:var(--rc)!important;text-shadow:0 1px 0 #000,0 0 10px color-mix(in srgb,var(--rc) 55%,transparent)!important;
  padding:3px 10px 2px;border-top:1px solid color-mix(in srgb,var(--rc) 55%,transparent);border-bottom:1px solid color-mix(in srgb,var(--rc) 55%,transparent)}
.clash-result.result-blocked{--rc:#9fd2ee}
.clash-result.result-absorbed{--rc:#cdb6f2}
.clash-result.result-mixed{--rc:#f6d27a}
.clash-result.result-neutral{--rc:#e6d6b0}
.clash-result .result-damage-value{color:#fff0bf!important;font-size:1.2em}
.clash-ribbon.show{animation:fct-clash 1.25s cubic-bezier(.2,.7,.3,1) forwards!important}
@keyframes fct-clash{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}
  12%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}
  22%{transform:translate(-50%,-50%) scale(.98)}
  30%{transform:translate(-50%,-50%) scale(1)}
  80%{opacity:1;transform:translate(-50%,-54%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-64%) scale(.97)}
}

/* ---------- WINS badges (battlefield + graveyard flight) ---------- */
.combat-outcome-badge,.gy-card-flight-wins{border-radius:0!important;border:1px solid #fbe3a0!important;color:#2a1606!important;
  background:linear-gradient(180deg,#fff0bf 0%,#e9c574 40%,#b08436 75%,#7a5a22 100%)!important;text-shadow:0 1px 0 rgba(255,240,200,.6)!important;
  font-family:"Cinzel",Georgia,serif!important;font-weight:900!important;letter-spacing:.16em!important;padding:4px 10px 3px!important;
  clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 50%,calc(100% - 6px) 100%,6px 100%,0 50%);box-shadow:none!important;
  filter:drop-shadow(0 0 6px rgba(255,180,70,.55))}

/* ---------- banner toasts over the board ---------- */
.combat-banner{font-family:"Cinzel",Georgia,serif!important;font-weight:800;font-size:clamp(1rem,1.7vw,1.4rem)!important;letter-spacing:.18em!important;
  padding:11px 56px 10px!important;border:0!important;color:#f6d27a!important;text-shadow:0 1px 0 #000,0 0 14px rgba(255,170,60,.45)!important;
  background:linear-gradient(90deg,transparent,rgba(26,14,9,.95) 18%,rgba(26,14,9,.95) 82%,transparent)!important;
  box-shadow:inset 0 1px 0 rgba(233,197,116,.55),inset 0 -1px 0 rgba(233,197,116,.55);max-width:calc(100vw - 24px);white-space:normal;text-align:center}
.combat-banner.show{transform:translateX(-50%) translateY(0) scale(1)}
.combat-banner:not(.show){transform:translateX(-50%) translateY(-8px) scale(.96)}

/* ---------- on-card TRUMP tag ---------- */
.slot[class*="trump-"] .card-face.v3 .v3-trump{font-family:"Cinzel",Georgia,serif!important;font-weight:900!important;letter-spacing:.14em;border-radius:0!important;
  color:#fff0bf!important;background:linear-gradient(180deg,rgba(40,24,10,.95),rgba(12,8,5,.95))!important;border:1px solid var(--el)!important;
  clip-path:polygon(4cqw 0,calc(100% - 4cqw) 0,100% 50%,calc(100% - 4cqw) 100%,4cqw 100%,0 50%);box-shadow:none!important;text-shadow:0 0 6px var(--el)}

@media (max-width:620px){
  .clash-ribbon .clash-pow{font-size:1.25rem!important}
  .clash-ribbon .clash-result{font-size:.64rem!important;letter-spacing:.14em!important;padding:2px 7px 1px}
  .clash-ribbon{padding:5px 14px 6px!important;gap:7px!important}
  .fx-stamp{font-size:.82rem!important;padding:4px 12px 3px!important}
  .combat-banner{padding:9px 28px 8px!important;font-size:.9rem!important}
}
@media (prefers-reduced-motion:reduce){
  .clash-ribbon.show{animation:none!important;opacity:1;transform:translate(-50%,-50%)}
}