/* TETRIS ARENA — effets visuels arcade V1 (nouveau fichier, chargé après game.css).
   Contenu : calque non interactif .arena-fx-layer (particules, flashs, bandes,
   liserés), badge texte aria-live, voile de résultat, acting de conteneur des
   poses data-motion existantes, micro-interactions menus/sélection/READY.
   Règle absolue : AUCUN changement de layout — uniquement transform, opacity,
   filter, box-shadow, outline, background et clip-path. Aucune taille de bouton,
   de grille ou de texte n'est modifiée ici. Les effets transitoires ne bouclent pas :
   chaque effet joue une fois puis s'arrête (pas de clignotement répété).
   Mouvement réduit : le module ne crée rien ; ces garde-fous neutralisent en
   plus tout reste visuel si la préférence change en cours de partie. */

/* ── 1. Calque de jeu (positionné par JS sur la grille réelle) ───────────── */
.arena-fx-layer {
  position: fixed;
  pointer-events: none;
  z-index: 2; /* au-dessus du canvas, sous .board-state (z-index 3) */
  overflow: hidden;
  border-radius: 3px;
  background: transparent;
}

/* ── 2. Particules (capées à 120 par le module) ──────────────────────────── */
.arena-fx-p {
  position: absolute;
  left: var(--x, 0);
  top: var(--y, 0);
  width: var(--s, 10px);
  height: var(--s, 10px);
  background: var(--c, #ffe071);
  opacity: 0;
  pointer-events: none;
  will-change: transform, opacity;
  animation: arena-fx-burst var(--d, 560ms) cubic-bezier(.18, .72, .24, 1) forwards;
}
.arena-fx-p[data-shape="tri"] { clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.arena-fx-p[data-shape="box"] { border-radius: 1px; }
.arena-fx-p[data-shape="orb"] { border-radius: 50%; }
.arena-fx-p[data-kind="levelup"] { mix-blend-mode: screen; }
@keyframes arena-fx-burst {
  0%   { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
  70%  { opacity: .85; }
  100% { opacity: 0; transform: translate3d(var(--dx, 0), var(--dy, -18px), 0) scale(.22); }
}

/* ── 3. Flash de grille (clear 4 lignes, pouvoir, résultat) ──────────────── */
.arena-fx-flash {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  background: rgba(255, 224, 113, .28);
  background: radial-gradient(closest-side at 50% 55%, color-mix(in srgb, var(--c) 52%, transparent), transparent 78%);
  animation: arena-fx-flash 380ms ease-out forwards;
}
.arena-fx-flash[data-kind="tetris"] {
  background: linear-gradient(180deg, color-mix(in srgb, var(--c) 44%, transparent), transparent 72%);
}
.arena-fx-flash[data-kind="power"] {
  background: radial-gradient(closest-side at 50% 50%, color-mix(in srgb, var(--c) 40%, transparent), transparent 84%);
}
@keyframes arena-fx-flash {
  0%   { opacity: 0; }
  18%  { opacity: 1; }
  100% { opacity: 0; }
}

/* ── 4. Bandes contextuelles (lignes effacées, garbage, niveau) ──────────── */
.arena-fx-band {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  pointer-events: none;
  animation: arena-fx-band 420ms ease-out forwards;
}
.arena-fx-band[data-kind="clear"] {
  background: linear-gradient(180deg, color-mix(in srgb, var(--c) 66%, transparent), color-mix(in srgb, var(--c) 16%, transparent));
}
.arena-fx-band[data-kind="garbage"] {
  top: 0;
  bottom: auto;
  background: linear-gradient(180deg, color-mix(in srgb, var(--c) 72%, transparent), transparent);
}
.arena-fx-band[data-kind="levelup"] {
  height: 4px !important;
  background: var(--c);
  box-shadow: 0 0 10px var(--c);
}
@keyframes arena-fx-band {
  0%   { opacity: 0; transform: translateY(6px); }
  22%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(0); }
}

/* ── 5. Liseré d'impact (combo, pouvoir, dégâts, résultat) ───────────────── */
.arena-fx-edge {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  border: 3px solid var(--c, #ffe071);
  border-radius: 3px;
  box-shadow: inset 0 0 18px color-mix(in srgb, var(--c) 55%, transparent);
  animation: arena-fx-edge 480ms ease-out forwards;
}
.arena-fx-edge[data-kind="combo"] { border-style: dashed; }
.arena-fx-edge[data-kind="power"] { border-width: 4px; }
.arena-fx-edge[data-kind="hurt"] {
  box-shadow: inset 0 -14px 26px color-mix(in srgb, var(--c) 50%, transparent);
}
@keyframes arena-fx-edge {
  0%   { opacity: 0; }
  15%  { opacity: 1; }
  100% { opacity: 0; }
}

/* ── 6. Badge texte stable (mouvement réduit) — un seul élément aria-live ── */
.arena-fx-live {
  position: fixed;
  left: 50%;
  top: 6px;
  transform: translateX(-50%);
  z-index: 6;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  font: 700 11px/1.2 var(--font-data, Consolas, monospace);
  letter-spacing: .08em;
  white-space: nowrap;
  max-width: min(320px, 80vw);
  overflow: hidden;
  text-overflow: ellipsis;
  color: #10121d;
  background: var(--gold, #ffe071);
  border: 2px solid #10121d;
  border-radius: 999px;
  padding: 5px 11px;
  transition: opacity 120ms ease-out;
}
.arena-fx-live[data-visible="true"] {
  opacity: 1;
  visibility: visible;
}

/* ── 7. Voile de résultat (court, une seule lecture) ─────────────────────── */
.arena-fx-veil {
  position: fixed;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(120% 90% at 50% 60%, color-mix(in srgb, var(--c, #ffe071) 26%, transparent), transparent 70%);
  animation: arena-fx-veil 640ms ease-out forwards;
}
.arena-fx-veil[data-kind="win"],
.arena-fx-veil[data-kind="forfeit"] {
  background: radial-gradient(120% 90% at 50% 60%, color-mix(in srgb, var(--gold) 30%, transparent), transparent 72%);
}
.arena-fx-veil[data-kind="loss"],
.arena-fx-veil[data-kind="quit"] {
  background: radial-gradient(140% 110% at 50% 62%, transparent 38%, rgba(8, 10, 18, .55));
}
@keyframes arena-fx-veil {
  0%   { opacity: 0; }
  20%  { opacity: 1; }
  100% { opacity: 0; }
}

/* ── 8. Acting de conteneur sur les poses data-motion EXISTANTES ─────────── */
/* ArenaMotion.pose() pose data-motion (attack 520 ms, hurt 620 ms, win 600 ms,
   ko) ; game.css anime déjà .fighter-svg. Ici, le conteneur .journey-art
   ajoute anticipation → extension → retour, sans changer la pose elle-même. */
.journey-art[data-motion="attack"] { animation: arena-fx-anticipate 520ms cubic-bezier(.3, .8, .3, 1); }
.journey-art[data-motion="hurt"]   { animation: arena-fx-recoil 620ms cubic-bezier(.3, .7, .3, 1); }
.journey-art[data-motion="win"]    { animation: arena-fx-rise 600ms ease-out; }
.journey-art[data-motion="ko"]     { animation: arena-fx-slump 640ms ease-out; }

@keyframes arena-fx-anticipate {
  0%   { transform: translate3d(0, 0, 0) scale(1); }
  18%  { transform: translate3d(-3px, 1px, 0) scale(.985); }
  46%  { transform: translate3d(4px, -2px, 0) scale(1.02); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}
@keyframes arena-fx-recoil {
  0%   { transform: translate3d(0, 0, 0) rotate(0); }
  22%  { transform: translate3d(-6px, 2px, 0) rotate(-1.4deg); }
  60%  { transform: translate3d(-2px, 1px, 0) rotate(-.5deg); }
  100% { transform: translate3d(0, 0, 0) rotate(0); }
}
@keyframes arena-fx-rise {
  0%   { transform: translate3d(0, 0, 0); }
  30%  { transform: translate3d(0, -7px, 0) scale(1.015); }
  70%  { transform: translate3d(0, -2px, 0); }
  100% { transform: translate3d(0, 0, 0); }
}
@keyframes arena-fx-slump {
  0%   { transform: translate3d(0, 0, 0); }
  30%  { transform: translate3d(0, 4px, 0) scale(.99); }
  100% { transform: translate3d(0, 2px, 0) scale(.995); }
}

/* Impulsion unique de signature pour « niveau » (aucune pose data-motion) */
.journey-art.arena-fx-levelup { animation: arena-fx-levelup 560ms ease-out; }
@keyframes arena-fx-levelup {
  0%   { transform: translate3d(0, 0, 0); filter: none; }
  25%  { transform: translate3d(0, -5px, 0); filter: drop-shadow(0 0 10px rgba(255, 224, 113, .8)); }
  100% { transform: translate3d(0, 0, 0); filter: none; }
}

/* ── 9. Micro-interactions menus (survol / focus / tactile) ──────────────── */
/* Uniquement des retours de pression, jamais de redimensionnement. */
.action-button:focus-visible,
.icon-button:focus-visible,
.back-icon:focus-visible,
.character-choice:focus-visible,
.skill-choice:focus-visible,
.journey-touch button:focus-visible,
[data-action^="ready-"]:focus-visible {
  outline: 2px solid var(--gold, #ffe071);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: no-preference) {
  .action-button { transition: transform 120ms ease-out, box-shadow 120ms ease-out; }
  .action-button:not(:disabled):hover { transform: translateY(-1px); }
  .action-button.primary:not(:disabled):hover { box-shadow: 0 5px 0 #897335; }
  .action-button.quiet:not(:disabled):hover { box-shadow: 0 4px 0 #080e19; }
  .icon-button { transition: transform 120ms ease-out; }
  .icon-button:hover { transform: translateY(-1px); }
  .character-choice { transition: transform 140ms ease-out; }
  .character-choice:hover { transform: translateY(-2px); }
  .character-choice[aria-pressed="true"],
  .character-choice.chosen { animation: arena-fx-pop 200ms ease-out; }
  .skill-choice { transition: transform 140ms ease-out; }
  .skill-choice:hover { transform: translateY(-1px); }
  .skill-choice[aria-pressed="true"] { animation: arena-fx-pop 200ms ease-out; }
  .journey-touch button { transition: transform 90ms ease-out, filter 90ms ease-out; }
  .journey-touch button:active { transform: translateY(1px) scale(.97); filter: brightness(1.12); }
  /* Double PRÊT : une seule impulsion à l'apparition, puis anneau stable. */
  [data-action^="ready-"]:not(:disabled) { animation: arena-fx-ready 900ms ease-out both; }
}
@keyframes arena-fx-pop {
  0%   { transform: scale(.985); }
  55%  { transform: scale(1.015); }
  100% { transform: scale(1); }
}
@keyframes arena-fx-ready {
  0%   { outline: 2px solid transparent; outline-offset: 2px; }
  35%  { outline: 2px solid color-mix(in srgb, var(--gold) 85%, transparent); outline-offset: 5px; }
  100% { outline: 2px solid color-mix(in srgb, var(--gold) 30%, transparent); outline-offset: 2px; }
}

/* ── 10. Garde-fous mouvement réduit (dynamiques) ────────────────────────── */
/* body.motion-reduced est posé par arena-app sur render() ; le module vérifie
   aussi ArenaMotion.reduced() à chaque événement. Ceinture et bretelles. */
body.motion-reduced .arena-fx-layer { display: none !important; }
body.motion-reduced .arena-fx-live { transition: none; }
body.motion-reduced .journey-art[data-motion],
body.motion-reduced .journey-art.arena-fx-levelup,
body.motion-reduced .character-choice[aria-pressed="true"],
body.motion-reduced .character-choice.chosen,
body.motion-reduced .skill-choice[aria-pressed="true"],
body.motion-reduced [data-action^="ready-"] { animation: none !important; }
body.motion-reduced .action-button,
body.motion-reduced .icon-button,
body.motion-reduced .character-choice,
body.motion-reduced .skill-choice,
body.motion-reduced .journey-touch button { transition: none; }
body.motion-reduced .action-button:not(:disabled):hover,
body.motion-reduced .character-choice:hover,
body.motion-reduced .skill-choice:hover,
body.motion-reduced .journey-touch button:active { transform: none; }

@media (prefers-reduced-motion: reduce) {
  .arena-fx-layer { display: none !important; }
  .arena-fx-live { transition: none; }
  .arena-fx-p, .arena-fx-flash, .arena-fx-band, .arena-fx-edge, .arena-fx-veil { animation: none !important; }
  .journey-art[data-motion],
  .journey-art.arena-fx-levelup,
  .character-choice[aria-pressed="true"],
  .character-choice.chosen,
  .skill-choice[aria-pressed="true"],
  [data-action^="ready-"] { animation: none !important; }
  .action-button, .icon-button, .character-choice, .skill-choice, .journey-touch button { transition: none; }
  .action-button:not(:disabled):hover,
  .character-choice:hover,
  .skill-choice:hover,
  .journey-touch button:active { transform: none; }
}

/* V2 : trajectoires dans le couloir entre grilles ; aucune hitbox interactive. */
.arena-fx-flight{position:fixed;z-index:4;width:var(--s,12px);height:var(--s,12px);pointer-events:none;background:var(--c);box-shadow:0 0 5px var(--c);will-change:transform,left,top,opacity}
.arena-fx-flight[data-character=volt]{clip-path:polygon(0 28%,58% 28%,50% 0,100% 50%,50% 100%,58% 72%,0 72%)}
.arena-fx-flight[data-character=titan]{border:2px solid #22332a;border-radius:2px;box-shadow:0 0 0 1px var(--c),0 0 5px var(--c)}
.arena-fx-flight[data-character=spectre]{border-radius:50%;border:1px solid #e7d4ff;box-shadow:0 0 7px var(--c)}
.arena-fx-flight[data-part=trail]{border:0;border-radius:50%;clip-path:none}
.result-art .arena-fx-victory{animation:arena-fx-victory 760ms cubic-bezier(.2,.8,.2,1)}
.result-art .arena-fx-defeat{animation:arena-fx-defeat 760ms ease-out}
.arena-fx-result-accent{position:fixed;z-index:4;width:7px;height:12px;pointer-events:none;background:var(--c);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);animation:arena-fx-result-accent 760ms ease-out forwards}
@keyframes arena-fx-victory{0%{transform:translateY(12px) scale(.94);filter:none}35%{transform:translateY(-9px) scale(1.035);filter:drop-shadow(0 0 12px #ffe07188)}70%{transform:translateY(1px) scale(.995)}100%{transform:none;filter:none}}
@keyframes arena-fx-defeat{0%{transform:translateY(-7px) rotate(-2deg);filter:brightness(1.15)}40%{transform:translateY(5px) rotate(1deg);filter:brightness(.85)}100%{transform:none;filter:none}}
@keyframes arena-fx-result-accent{0%{opacity:0;transform:translate(0,0) scale(.3)}20%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.5)}}
body.motion-reduced .arena-fx-flight,body.motion-reduced .arena-fx-result-accent{display:none!important}
body.motion-reduced .result-art .arena-fx-victory,body.motion-reduced .result-art .arena-fx-defeat{animation:none!important}
@media(prefers-reduced-motion:reduce){.arena-fx-flight,.arena-fx-result-accent{display:none!important}.result-art .arena-fx-victory,.result-art .arena-fx-defeat{animation:none!important}}

/* Combat vivant : articulations dans le SVG original. Le miroir englobe toute
   la chorégraphie, donc chaque camp frappe vers son adversaire. Les contours et
   les poses stables restent ceux de la direction retenue. Aucun déplacement de
   grille, de score ou de commande ; aucune boucle décorative supplémentaire. */
.journey-art[data-motion]:not(.arena-fx-levelup) { animation: none; }
.journey-art[data-motion] .fighter-svg { animation: none; }
.fighter-body { transform-box: view-box; transform-origin: 120px 195px; }
.fighter-arm { transform-box: view-box; transform-origin: 162px 150px; }
.fighter-signature {
  pointer-events: none;
  transform-box: view-box;
  transform-origin: 120px 150px;
  opacity: 0;
}
.journey-art[data-motion] .fighter-svg[data-pose="attack"] .fighter-body {
  animation: combat-volt-body 520ms cubic-bezier(.2,.75,.25,1) both;
}
.journey-art[data-motion] .fighter-svg[data-pose="attack"] .fighter-arm {
  animation: combat-volt-arm 520ms cubic-bezier(.2,.75,.25,1) both;
}
.journey-art[data-motion] .fighter-svg[data-fighter="titan"][data-pose="attack"] .fighter-body { animation-name: combat-titan-body; }
.journey-art[data-motion] .fighter-svg[data-fighter="titan"][data-pose="attack"] .fighter-arm { animation-name: combat-titan-arm; }
.journey-art[data-motion] .fighter-svg[data-fighter="spectre"][data-pose="attack"] .fighter-body { animation-name: combat-spectre-body; }
.journey-art[data-motion] .fighter-svg[data-fighter="spectre"][data-pose="attack"] .fighter-arm { animation-name: combat-spectre-arm; }
.journey-art[data-motion] .fighter-svg[data-pose="attack"] .fighter-signature { animation: combat-signature 520ms ease-out both; }
.fighter-signature-volt { stroke-dasharray: 110; animation-timing-function: steps(2,end) !important; }
.fighter-signature-titan { stroke-width: 7px; }
.fighter-signature-spectre { stroke-width: 3px; }
.journey-art[data-motion] .fighter-svg[data-pose="hurt"] .fighter-body { animation: combat-recoil 620ms ease-out both; }
.journey-art[data-motion] .fighter-svg[data-pose="hurt"] .fighter-arm { animation: combat-recoil-arm 620ms ease-out both; }
.journey-art[data-motion] .fighter-svg[data-pose="win"] .fighter-body { animation: combat-celebrate 760ms cubic-bezier(.2,.7,.3,1) both; }
.journey-art[data-motion] .fighter-svg[data-pose="win"] .fighter-arm { animation: combat-cheer 760ms ease-out both; }
.journey-art[data-motion] .fighter-signature-win { animation: combat-crown 760ms ease-out both; }
.journey-art[data-motion] .fighter-svg[data-pose="ko"] .fighter-body { animation: combat-settle 640ms ease-out both; }

@keyframes combat-volt-body {
  0% { transform: none; }
  22% { transform: translate(-9px,5px) rotate(-7deg) scale(.97,1.02); }
  38% { transform: translate(12px,-3px) rotate(7deg) scale(1.04,.97); }
  62% { transform: translate(5px,1px) rotate(3deg); }
  100% { transform: none; }
}
@keyframes combat-volt-arm {
  0%,100% { transform: none; }
  22% { transform: translate(-6px,7px) rotate(28deg); }
  38% { transform: translate(12px,-4px) rotate(-17deg) scale(1.1,.95); }
  64% { transform: translate(4px,0) rotate(-6deg); }
}
@keyframes combat-titan-body {
  0%,100% { transform: none; }
  34% { transform: translate(-5px,9px) scale(1.04,.94) rotate(-3deg); }
  48% { transform: translate(9px,-2px) scale(1.04,1.02) rotate(5deg); }
  73% { transform: translate(3px,4px) scale(1.02,.98); }
}
@keyframes combat-titan-arm {
  0%,100% { transform: none; }
  34% { transform: translate(-8px,12px) rotate(27deg); }
  48% { transform: translate(10px,-9px) rotate(-16deg) scale(1.1); }
  73% { transform: translate(5px,-1px) rotate(-5deg); }
}
@keyframes combat-spectre-body {
  0%,100% { transform: none; }
  27% { transform: translate(-5px,-8px) rotate(-7deg) scale(.98,1.02); }
  54% { transform: translate(8px,-3px) rotate(8deg); }
  78% { transform: translate(3px,3px) rotate(2deg); }
}
@keyframes combat-spectre-arm {
  0%,100% { transform: none; }
  27% { transform: translate(-4px,-8px) rotate(32deg); }
  54% { transform: translate(10px,2px) rotate(-20deg); }
  78% { transform: rotate(-6deg); }
}
@keyframes combat-signature {
  0%,22% { opacity: 0; transform: scale(.7) rotate(-12deg); stroke-dashoffset: 110; }
  40% { opacity: .9; transform: scale(.94) rotate(-3deg); stroke-dashoffset: 0; }
  75% { opacity: .45; transform: scale(1.02) rotate(3deg); }
  100% { opacity: 0; transform: scale(1.05) rotate(6deg); }
}
@keyframes combat-recoil {
  0%,100% { transform: none; }
  20% { transform: translate(-9px,5px) rotate(-6deg) scale(.97,1.02); }
  56% { transform: translate(-4px,2px) rotate(-2deg); }
}
@keyframes combat-recoil-arm {
  0%,100% { transform: none; }
  20% { transform: rotate(24deg); }
  56% { transform: rotate(8deg); }
}
@keyframes combat-celebrate {
  0%,100% { transform: none; }
  19% { transform: translate(0,5px) scale(1.03,.96); }
  43% { transform: translate(0,-9px) rotate(-3deg) scale(.98,1.03); }
  72% { transform: translate(0,2px) rotate(1deg); }
}
@keyframes combat-cheer {
  0%,100% { transform: none; }
  43% { transform: rotate(-16deg); }
  72% { transform: rotate(5deg); }
}
@keyframes combat-crown {
  0%,18% { opacity: 0; transform: translate(0,10px) scale(.8); }
  43% { opacity: 1; transform: translate(0,-3px) scale(1.02); }
  78% { opacity: .6; }
  100% { opacity: 0; transform: translate(0,-9px) scale(1.06); }
}
@keyframes combat-settle {
  0% { transform: translate(0,-8px) rotate(-4deg); }
  55% { transform: translate(0,2px) rotate(1deg); }
  100% { transform: none; }
}

/* Arrêt dynamique via la boucle existante, et arrêt CSS immédiat côté système.
   La pose essentielle reste entière ; aucun bob, secousse ou flash résiduel. */
.combat-still, .combat-still *, .motion-reduced .fighter-svg * { animation: none !important; }
.combat-still .fighter-signature, .motion-reduced .fighter-signature { display: none; }
@media (prefers-reduced-motion: reduce) {
  .fighter-svg * { animation: none !important; }
  .fighter-signature { display: none; }
}


/* Arène réactive : décor derrière l'interface (shell z=1), jamais sur les pièces. */
.arena-combat-stage { position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none; }
.arena-combat-stage[hidden] { display:none; }

/* Acting articulé : visage/tête, garde, bras de frappe et appuis indépendants. */
.fighter-head,.fighter-expression { transform-box:view-box;transform-origin:125px 116px; }
.fighter-guard { transform-box:view-box;transform-origin:78px 145px; }
.fighter-base { transform-box:view-box;transform-origin:120px 214px; }
.battle-wing .journey-art[data-motion=hurt] .figure { transform-box:view-box;transform-origin:120px 190px;transform:translate(5px,2px) rotate(-5deg); }
.journey-art[data-motion=attack] .fighter-head,
.journey-art[data-motion=attack] .fighter-expression { animation:combat-head 520ms ease-out both; }
.journey-art[data-motion=attack] .fighter-guard { animation:combat-guard 520ms ease-out both; }
.journey-art[data-motion=attack] .fighter-base { animation:combat-footwork 520ms ease-out both; }
.journey-art[data-motion=hurt] .fighter-head,
.journey-art[data-motion=hurt] .fighter-expression { animation:combat-head-hit 620ms ease-out both; }
.journey-art[data-motion=win] .fighter-head,
.journey-art[data-motion=win] .fighter-expression { animation:combat-head-cheer 760ms ease-out both; }
.journey-art[data-motion=win] .fighter-guard { animation:combat-guard-cheer 760ms ease-out both; }
.journey-art[data-combat-move=power] .fighter-svg[data-fighter=volt] .fighter-arm { animation:combat-volt-cast 520ms ease-out both; }
.journey-art[data-combat-move=power] .fighter-svg[data-fighter=titan] .fighter-arm { animation:combat-titan-cast 520ms ease-out both; }
.journey-art[data-combat-move=power] .fighter-svg[data-fighter=spectre] .fighter-arm { animation:combat-spectre-cast 520ms ease-out both; }
.journey-art[data-combat-move=power] .fighter-guard { animation:combat-guard-cast 520ms ease-out both; }
.journey-art[data-motion=ko] .fighter-svg[data-pose=ko] .fighter-body { animation:combat-knockout 1050ms cubic-bezier(.3,.05,.7,1) both; }
.journey-art[data-motion=ko] .fighter-svg[data-fighter=titan] .fighter-body { animation-name:combat-titan-knockout; }
.journey-art[data-motion=ko] .fighter-svg[data-fighter=spectre] .fighter-body { animation-name:combat-spectre-knockout; }

/* Respiration des deux acteurs actifs seulement. Aucun ordonnanceur JS ajouté. */
.game-screen .battle-wing .fighter-svg[data-pose=idle] .fighter-body { animation:combat-breathe 3000ms ease-in-out infinite; }
.game-screen .battle-wing .fighter-svg[data-fighter=spectre][data-pose=idle] .fighter-body { animation-name:combat-hover; }
@keyframes combat-breathe { 0%,100%{transform:none}50%{transform:translateY(-1.5px) scale(1.006,1.012)} }
@keyframes combat-hover { 0%,100%{transform:translateY(1px) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)} }
@keyframes combat-head { 0%,100%{transform:none}22%{transform:translate(-3px,3px) rotate(-6deg)}42%{transform:translate(3px,-3px) rotate(7deg)}72%{transform:rotate(2deg)} }
@keyframes combat-guard { 0%,100%{transform:none}24%{transform:translate(2px,-7px) rotate(15deg)}44%{transform:translate(-4px,3px) rotate(-13deg)} }
@keyframes combat-footwork { 0%,100%{transform:none}24%{transform:translate(0,4px) scale(1.02,.96)}44%{transform:translate(-3px,1px) rotate(-5deg)}70%{transform:translate(1px,0) rotate(2deg)} }
@keyframes combat-head-hit { 0%,100%{transform:none}18%{transform:translate(-4px,-4px) rotate(-12deg)}55%{transform:rotate(-4deg)} }
@keyframes combat-head-cheer { 0%,100%{transform:none}40%{transform:translateY(-4px) rotate(-6deg)}70%{transform:rotate(3deg)} }
@keyframes combat-guard-cheer { 0%,100%{transform:none}40%{transform:rotate(24deg) translateY(-3px)}70%{transform:rotate(-5deg)} }
@keyframes combat-volt-cast { 0%,100%{transform:none}25%{transform:rotate(-42deg) translate(-5px,-10px)}45%{transform:rotate(12deg) translate(12px,-2px) scale(1.12)} }
@keyframes combat-titan-cast { 0%,100%{transform:none}32%{transform:translate(-13px,8px) rotate(36deg)}55%{transform:translate(-3px,-17px) rotate(-28deg)} }
@keyframes combat-spectre-cast { 0%,100%{transform:none}25%{transform:translate(-8px,-13px) rotate(43deg)}58%{transform:translate(12px,8px) rotate(-38deg)} }
@keyframes combat-guard-cast { 0%,100%{transform:none}30%{transform:rotate(28deg) translate(0,-9px)}55%{transform:rotate(-18deg) translate(-4px,-2px)} }
@keyframes combat-knockout { 0%{transform:none}18%{transform:translate(-6px,-12px) rotate(-10deg)}65%{transform:translate(-10px,15px) rotate(65deg) scale(.68)}82%{transform:translate(-10px,9px) rotate(59deg) scale(.68)}100%{transform:translate(-10px,15px) rotate(63deg) scale(.68)} }
@keyframes combat-titan-knockout { 0%{transform:none}28%{transform:translateY(14px) scale(1.02,.92)}68%{transform:translate(-10px,20px) rotate(49deg) scale(.72)}85%{transform:translate(-10px,14px) rotate(45deg) scale(.72)}100%{transform:translate(-10px,20px) rotate(48deg) scale(.72)} }
@keyframes combat-spectre-knockout { 0%{transform:none;opacity:1}25%{transform:translateY(-14px) rotate(-8deg)}65%{transform:translateY(30px) rotate(20deg) scale(.84);opacity:.68}100%{transform:translateY(42px) rotate(27deg) scale(.78);opacity:.65} }

/* La scène de fin utilise la retenue existante : aucune action ajoutée ni délai
   de jeu. Forfait et solo conservent leur résultat propre, sans faux K.O. */
.arena-finisher { position:fixed;inset:0;z-index:7;pointer-events:none;display:grid;place-items:center;overflow:hidden;background:linear-gradient(160deg,#0a1024ed,#16283cf0);animation:combat-finale 2150ms ease both;--finisher-color:#4ce7e4; }
.arena-finisher[data-character=titan] { --finisher-color:#a8ed70; }
.arena-finisher[data-character=spectre] { --finisher-color:#bc9aff; }
.finisher-streaks { position:absolute;inset:0;background:repeating-linear-gradient(-14deg,transparent 0 48px,color-mix(in srgb,var(--finisher-color) 12%,transparent) 49px 52px,transparent 53px 95px);transform:scale(1.2);animation:combat-speedlines 1000ms ease-out both; }
.finisher-scene { position:relative;width:min(1050px,96vw);display:grid;grid-template-columns:1fr 1.1fr 1fr;align-items:center; }
.arena-finisher .journey-art { width:100%;height:auto;min-width:0; }
.arena-finisher .fighter-svg { display:block;width:100%;height:auto;max-height:350px; }
.finisher-word { text-align:center;white-space:nowrap;font:900 clamp(62px,14vw,170px)/.9 Impact,'Arial Narrow',sans-serif;color:#ffe071;text-shadow:5px 6px 0 #0a1020,-2px -2px 0 #fff5b4;transform:rotate(-7deg); }
.finisher-word>span { display:inline-block;animation:combat-ko-letter 850ms cubic-bezier(.2,.9,.3,1) both; }
.finisher-word>span:nth-child(2) { animation-delay:100ms; }
.finisher-word small { display:block;white-space:normal;margin-top:22px;color:var(--finisher-color);font:900 clamp(10px,1.4vw,17px)/1.4 system-ui,sans-serif;letter-spacing:.1em;text-shadow:1px 2px 0 #0a1020; }
@keyframes combat-finale { 0%{opacity:0}10%,82%{opacity:1}100%{opacity:0} }
@keyframes combat-speedlines { from{transform:translateX(-5%) scale(1.2)}to{transform:translateX(5%) scale(1.2)} }
@keyframes combat-ko-letter { 0%,12%{opacity:0;transform:translateY(-34px) scale(1.8) rotate(-12deg)}42%{opacity:1;transform:translateY(4px) scale(.94) rotate(2deg)}64%,100%{opacity:1;transform:none} }
@media(max-width:600px) { .finisher-scene{grid-template-columns:1fr 1.05fr 1fr}.finisher-word small{margin-top:14px;letter-spacing:.02em}.finisher-word{text-shadow:3px 4px 0 #0a1020,-1px -1px 0 #fff5b4} }
.motion-reduced .arena-combat-stage,.motion-reduced .arena-finisher { display:none!important; }
.combat-still * { animation:none!important; }
@media(prefers-reduced-motion:reduce) { .arena-combat-stage,.arena-finisher{display:none!important}.fighter-svg *{animation:none!important} }

/* K.O. dessiné : douze vraies poses par personnage, un seul canvas de 400×300px.
   Aucun zoom, rotation ou réduction du dessin entier. Le plateau est déjà terminé. */
.arena-finisher .finisher-loser { display:grid;place-items:center;transform:translateX(-15%); }
.arena-finisher .finisher-sprite { display:block;width:min(460px,140%);height:auto;aspect-ratio:4/3;pointer-events:none; }
.arena-finisher .finisher-sprite[hidden],.arena-finisher .finisher-fallback[hidden] { display:none; }
.arena-finisher .finisher-fallback { width:100%; }
.arena-finisher .finisher-fallback .figure { transform:none; }
.arena-finisher .finisher-fallback .fighter-svg * { animation:none!important; }

/* Sur téléphone, le combattant projeté dispose de toute la largeur : même
   taille de tête pendant la chute, sans empiéter sur le vainqueur et K.O. */
@media(max-width:600px) and (min-height:540px) {
 .arena-finisher .finisher-scene { grid-template-columns:.8fr 1.2fr;row-gap:4px; }
 .arena-finisher .finisher-winner { grid-column:1;grid-row:1;width:min(132px,100%);justify-self:center; }
 .arena-finisher .finisher-word { grid-column:2;grid-row:1; }
 .arena-finisher .finisher-loser { grid-column:1/-1;grid-row:2;transform:none; }
 .arena-finisher .finisher-sprite { width:100%;max-width:460px; }
}
/* Réaction cosmétique, limitée à deux acteurs ; aucune cible d'entrée masquée. */
.reaction-active>.fighter-svg { visibility:hidden; }
.hit-reaction { position:fixed;z-index:4;pointer-events:none; }
.hit-reaction canvas { display:block;width:100%;height:100%; }
.hit-reaction canvas[hidden] { display:none; }
.reaction-label { position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);white-space:nowrap;font:900 10px/1.3 system-ui;color:#ffe071;text-shadow:1px 1px #081322,-1px -1px #081322; }
.motion-reduced .hit-reaction { display:none!important; }
@media(prefers-reduced-motion:reduce) { .hit-reaction{display:none!important} }

.arena-finisher-active .arena-ended-boards .battle-wing .journey-art { visibility:hidden; }

.arena-ended-boards .journey-art .figure { transform:none; }

@media(min-width:601px) { .arena-finisher-in-place[data-local-loss] .finisher-loser { transform:translateX(15%); } }

/* Les commandes du round terminé disparaissent ; seule la sortie finale reste. */
.arena-ended .game-actions { visibility:hidden; }
.reaction-label { bottom:8px; }
@media(max-width:1050px) {
 .battle-wing:has(.reaction-active)>h2,.battle-wing:has(.reaction-active)>p { visibility:hidden; }
}

/* Résultat arcade unique : personnages, verdict et décisions occupent la même scène.
   Aucun panneau flottant, aucun compte à rebours après la dernière pose. */
.arena-ended-boards { pointer-events:none;filter:brightness(.2) saturate(.65); }
.arena-ended-boards .fighter-svg * { animation:none!important; }
.arena-ended-boards .journey-touch,.arena-ended-boards .battle-power,.arena-ended-boards .foe-power { visibility:hidden; }
.arena-ko-screen.result-scene {
 position:fixed;inset:0;z-index:8;isolation:isolate;display:grid;
 grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;align-content:stretch;
 width:100%;height:100dvh;min-height:0;max-width:none;margin:0;
 padding:max(18px,env(safe-area-inset-top)) 24px max(22px,env(safe-area-inset-bottom));
 overflow:auto;background:radial-gradient(ellipse at 50% 35%,#263c5366,transparent 65%),linear-gradient(155deg,#0a1125df,#142237bf 55%,#070d20f5);
 --ko-color:#4ce7e4;
}
/* Scène terminale modale : le document ne défile pas dessous. Sur mobile, un
   scroll résiduel sous l'overlay fixe décalait l'aire tactile des actions. */
html.arena-terminal,html.arena-terminal body { overflow:hidden;overscroll-behavior:none; }
html.arena-terminal body { position:fixed;inset:0;width:100%; }
html.arena-terminal .arena-ko-screen { overscroll-behavior:contain; }
.arena-ko-screen[data-character=titan] { --ko-color:#a8ed70; }
.arena-ko-screen[data-character=spectre] { --ko-color:#bc9aff; }
.arena-ko-screen::before { content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(-14deg,transparent 0 70px,color-mix(in srgb,var(--ko-color) 9%,transparent) 72px 74px,transparent 76px 130px); }
.ko-heading { text-align:center;position:relative;z-index:1; }
.ko-round { margin:0;color:#b8c7e1;letter-spacing:.3em;font:800 12px/1.4 system-ui; }
.arena-ko-screen h1 { display:block;margin:5px 0 9px;font:900 clamp(90px,14vw,164px)/.9 Impact,'Arial Narrow',sans-serif;letter-spacing:-.025em;color:#ffe071;text-shadow:4px 6px 0 #0a1020,-2px -2px 0 #fff5b4;transform:rotate(-5deg); }
.arena-ko-screen h1 span { display:inline-block; }
.arena-ko-screen[data-held=true] h1 span { animation:combat-ko-letter 850ms cubic-bezier(.2,.9,.3,1) both; }
.arena-ko-screen h1 span:nth-child(2) { animation-delay:100ms; }
.ko-verdict { margin:0;color:var(--ko-color);font:900 clamp(14px,2vw,20px)/1.4 system-ui;letter-spacing:.09em; }
.arena-ko-cast { min-height:0;display:grid;place-items:center;position:relative;width:min(940px,100%);justify-self:center; }
.arena-ko-screen .arena-finisher { position:relative;inset:auto;z-index:auto;width:100%;height:100%;overflow:visible;display:grid;grid-template-rows:minmax(0,1fr) auto;background:none;animation:none; }
.arena-ko-screen .finisher-streaks { display:none; }
.arena-ko-screen .finisher-scene { display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr;align-items:end;justify-items:center;gap:60px;width:100%;height:100%;max-height:none;min-height:0; }
.arena-ko-screen .finisher-scene .journey-art { grid-column:auto;grid-row:1;width:min(360px,100%);max-height:100%;height:100%;display:grid;place-items:center;transform:none; }
.arena-ko-screen .finisher-scene .finisher-loser { width:min(460px,120%); }
.arena-ko-screen .finisher-sprite { width:100%;height:auto;max-height:min(310px,34dvh);max-width:460px;object-fit:contain; }
.arena-ko-screen .fighter-svg { width:100%;height:auto;max-height:min(330px,36dvh); }
.arena-ko-screen .finisher-fallback { width:100%; }
.arena-ko-screen .finisher-fallback .fighter-svg * { animation:none!important; }
.ko-fighter-names { display:grid;grid-template-columns:1fr 1fr;gap:60px;text-align:center;color:#e6edf8;font:900 clamp(20px,3vw,30px)/1.1 Impact,'Arial Narrow',sans-serif;letter-spacing:.05em;margin:0 0 12px; }
.ko-fighter-names small { display:block;color:#9db2d2;font:800 10px/1.5 system-ui;letter-spacing:.16em;margin-top:4px; }
.ko-menu { width:min(540px,100%);justify-self:center;text-align:center;min-height:154px; }
.ko-menu .result-actions { display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:0; }
.ko-menu .result-actions[hidden] { display:none!important; }
.ko-menu .result-actions .action-button { flex:1;min-width:140px;min-height:52px;font-size:15px;box-shadow:0 5px 0 #070d20; }
.ko-menu .result-actions .quiet { background:#182942b3;border:2px solid #a3b9d4;color:#e6edf8; }
.ko-menu .result-actions>p,.ko-menu .result-actions>.status-tag { flex-basis:100%;margin:0;color:var(--ko-color); }
.ko-menu .result-live,.ko-menu>p[role=status] { color:#b9c9e1;font:700 12px/1.5 system-ui;margin:12px 0 0; }
.ko-menu .result-live { position:static;width:auto;height:auto;padding:10px 12px;overflow:visible;clip:auto;white-space:normal;text-align:left; }
.ko-menu .result-stats.ko-score { display:flex;justify-content:center;gap:24px;margin:20px 0 0;padding:0;background:none;border:0; }
.ko-menu .ko-score>div { display:flex;gap:6px;align-items:baseline; }
.ko-menu .ko-score span { color:#94a8c8;font-size:10px; }
.ko-menu .ko-score b { color:#c1cfe4;font:800 13px/1.4 system-ui; }
.ko-menu .ko-merit { display:flex;justify-content:center;flex-wrap:wrap;gap:8px 16px;border:0;background:none;padding:0;margin:9px 0 0;font-size:11px; }
.ko-menu .ko-merit small { flex-basis:100%;color:#9db2d2; }
.ko-forfeit { max-width:560px;font:600 12px/1.5 system-ui;color:#c1cfe4; }
.arena-ko-screen[data-held=true] .ko-score,.arena-ko-screen[data-held=true] .ko-merit { visibility:hidden; }
.arena-ko-screen .arena-finisher[data-settled=true] * { animation:none!important; }
.motion-reduced .arena-ko-screen .arena-finisher { display:grid!important; }
.motion-reduced .arena-ko-screen * { animation:none!important; }
@media(max-width:600px) and (min-height:540px) {
 .arena-ko-screen.result-scene { padding:30px 18px max(26px,env(safe-area-inset-bottom));grid-template-rows:auto minmax(0,1fr) auto; }
 .arena-ko-screen h1 { font-size:112px;margin:16px 0 14px; }
 .ko-verdict { font-size:13px;letter-spacing:.04em; }
 .arena-ko-screen .finisher-scene { gap:6px; }
 .arena-ko-screen .finisher-scene .journey-art { width:100%;height:100%; }
 .arena-ko-screen .finisher-scene .finisher-loser { width:135%; }
 .arena-ko-screen .finisher-sprite { max-height:250px;max-width:none; }
 .arena-ko-screen .fighter-svg { max-height:260px; }
 .ko-fighter-names { gap:6px;margin-bottom:30px;font-size:26px; }
 .ko-menu { min-height:156px;align-self:start; }
 .ko-menu .result-actions { gap:10px; }
 .ko-menu .result-actions .action-button { min-width:125px;font-size:13px; }
 .ko-menu .result-stats.ko-score { gap:16px; }
}
@media(max-height:539px) {
 .arena-ko-screen.result-scene { padding:12px 18px;grid-template-rows:auto minmax(0,1fr) auto; }
 .ko-round { font-size:9px; }
 .arena-ko-screen h1 { font-size:62px;margin:0; }
 .ko-verdict { font-size:11px; }
 .arena-ko-cast { position:absolute;inset:30px 0 54px;width:100%;padding:0 14px;pointer-events:none; }
 .arena-ko-screen .finisher-scene { gap:40%; }
 .arena-ko-screen .finisher-scene .journey-art { width:100%; }
 .arena-ko-screen .finisher-sprite { max-height:150px; }
 .arena-ko-screen .fighter-svg { max-height:165px; }
 .ko-fighter-names { gap:40%;margin:0 0 3px;font-size:18px; }
 .ko-menu { width:min(360px,55vw);min-height:60px;grid-row:3;z-index:1; }
 .ko-menu .result-actions { gap:8px; }
 .ko-menu .result-actions .action-button { min-height:44px;min-width:110px;font-size:11px; }
 .ko-menu .result-live,.ko-menu>p[role=status] { margin:6px 0 0;font-size:10px; }
 .ko-menu .result-stats.ko-score,.ko-menu .ko-merit { display:none; }
}
@media(prefers-reduced-motion:reduce) {
 .arena-ko-screen .arena-finisher { display:grid!important; }
 .arena-ko-screen * { animation:none!important; }
}

/* Précision utilisateur : combattants de part et d'autre du K.O. sur tous formats.
   Même cadre et même échelle de tête ; un corps couché garde sa longueur. */
.arena-ko-screen.result-scene { grid-template-rows:auto auto;align-content:center;gap:22px; }
.arena-ko-cast { width:min(1120px,100%);height:clamp(240px,44dvh,400px); }
.arena-ko-cast .ko-heading { position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:32%; }
.arena-ko-screen .finisher-scene { grid-template-columns:1fr 1.1fr 1fr;gap:0;align-items:center; }
.arena-ko-screen .finisher-scene .journey-art { width:100%;height:100%;max-height:100%; }
.arena-ko-screen .finisher-scene .journey-art:first-child { grid-column:1; }
.arena-ko-screen .finisher-scene .journey-art:last-child { grid-column:3; }
.arena-ko-screen .finisher-scene .finisher-loser { width:100%; }
.arena-ko-screen .finisher-sprite { width:100%;height:auto;max-width:none;max-height:none; }
.arena-ko-screen .fighter-svg { width:70%;height:auto;max-height:100%; }
.arena-ko-screen .finisher-fallback { display:grid;place-items:center; }
.ko-fighter-names { grid-template-columns:1fr 1.1fr 1fr;gap:0;margin:0;font-size:26px; }
.ko-fighter-names span:first-child { grid-column:1; }
.ko-fighter-names span:last-child { grid-column:3; }
.ko-menu { min-height:146px; }
.ko-menu .result-actions>p,.ko-menu .result-actions>.status-tag { font-size:12px;line-height:1.4; }
@media(max-width:600px) and (min-height:540px) {
 .arena-ko-screen.result-scene { gap:25px;padding:24px 12px; }
 .arena-ko-cast { height:260px; }
 .arena-ko-screen .finisher-scene { gap:0; }
 .arena-ko-screen h1 { font-size:clamp(60px,20vw,86px);margin:10px 0; }
 .ko-round { font-size:9px;letter-spacing:.12em; }
 .ko-verdict { font-size:10px;letter-spacing:.02em; }
 .ko-fighter-names { margin:0;font-size:22px; }
 .ko-menu { min-height:156px;width:min(430px,100%); }
}
@media(max-height:539px) {
 .arena-ko-screen.result-scene { gap:8px;padding:10px 14px; }
 .arena-ko-cast { position:relative;inset:auto;width:min(850px,100%);padding:0;height:clamp(130px,52dvh,220px); }
 .arena-ko-screen .finisher-scene { gap:0; }
 .arena-ko-screen h1 { font-size:68px; }
 .ko-fighter-names { gap:0;font-size:18px; }
 .ko-menu { width:min(480px,100%);grid-row:auto;min-height:55px; }
 .ko-menu .result-actions>p { font-size:10px; }
}

.arena-ko-screen .ko-fighter-names { width:100%; }
.arena-ended-boards .battle-wing,.arena-ended .journey-header { visibility:hidden; }
.arena-ended #journey-toast { display:none; }

.ko-menu>p[role=status]:empty { display:none; }
@media(max-height:539px) { .arena-ko-screen h1 { margin-bottom:10px; } }
@media(max-height:320px) {
 .arena-ko-screen.result-scene { gap:12px; }
 .arena-ko-screen .ko-fighter-names { font-size:16px;line-height:1; }
 .arena-ko-screen .ko-fighter-names small { display:none; }
 .arena-ko-cast { height:clamp(128px,50dvh,160px); }
 .ko-menu { min-height:44px; }
}

.arena-ko-screen h1 { margin-bottom:22px; }
@media(max-width:600px) and (min-height:540px) { .arena-ko-screen h1 { margin-bottom:12px; } }
@media(max-height:539px) { .arena-ko-screen h1 { margin-bottom:14px; } }

/* Les noms restent dans le cadre de scène, même si un SVG a une hauteur intrinsèque. */
.arena-ko-screen .arena-finisher { display:block;min-height:0;min-width:0; }
.arena-ko-screen .finisher-scene { position:absolute;inset:0 0 50px;height:auto; }
.arena-ko-screen .ko-fighter-names { position:absolute;left:0;bottom:0;margin:0; }
.arena-ko-screen .finisher-sprite { max-height:100%;object-fit:contain; }
@media(max-height:320px) { .arena-ko-screen .finisher-scene { bottom:24px; } }

.arena-ko-screen .finisher-scene { grid-template-rows:minmax(0,1fr); }
.arena-ko-screen .finisher-scene .journey-art { display:flex;align-items:center;justify-content:center;min-height:0;min-width:0; }
.arena-ko-screen .finisher-fallback { height:100%;max-height:100%;display:flex;align-items:center;justify-content:center; }

.arena-ko-screen[data-forfeit=true] h1 { font-size:clamp(20px,3.8vw,46px);letter-spacing:0; }
@media(max-height:539px) { .ko-forfeit { font-size:10px;line-height:1.3;margin:4px 0 0; } }

/* Après reprise, les anciens menus ne sont ni le décor ni la hauteur du K.O. */
.arena-ended #journey-view>section:not(.arena-ko-screen):not(.arena-ended-boards) { display:none; }

/* MOBILE-002b — paysage très bas : le titre K.O. et le verdict restent au-dessus
   des noms des combattants, sans les recouvrir. Les personnages et les actions
   gardent leur place. */
@media(orientation:landscape) and (max-height:539px) and (max-width:700px){
 .arena-ko-cast .ko-heading { top:45%; }
 .arena-ko-screen h1 { font-size:56px;margin:2px 0 14px; }
 .ko-round { font-size:9px;line-height:1.15; }
 .ko-verdict { font-size:11px;line-height:1.2;letter-spacing:.03em; }
}