/* 03 · ultima-edicao — placar da edição 2026 sobre a largada em câmera lenta, o selo World Athletics
   girando como moeda e as duas faixas que atravessam a tela. Tudo sob #ultima-edicao. */
#ultima-edicao .ue-stage { background: var(--acai-dark); --ue-ra: 17%; --ue-rb: 23%; }   /* faixa da testeira: véu leve até ra, cheio a partir de rb */
#ultima-edicao .ue-bg { position: absolute; inset: 0; background: radial-gradient(80% 70% at 72% 30%, #4a2360 0%, #1c0b26 58%, var(--ink) 100%); }
#ultima-edicao .ue-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; transform-origin: 62% 40%; filter: saturate(.92); }
#ultima-edicao .ue-film { background: transparent; }
/* tela mais alta que 16:9 (16:10 do notebook): o filme sobra dos lados; puxado para a esquerda, a coluna da
   direita do pórtico (com o selo) sai de trás do rótulo do status e a testeira se afasta do título */
@media (min-width: 1181px) and (max-aspect-ratio: 16/9) {
  #ultima-edicao .ue-film, #ultima-edicao .ue-bg img { object-position: 8% 50%; }
}
/* véu: o texto tem véu do lado dele (esquerda: título e placar), o resto da largada fica à mostra —
   a testeira com a marca, as colunas e o pelotão avançando são o espetáculo do capítulo.
   O véu da esquerda é recortado em "L" (faixa da esquerda + tudo abaixo da testeira), nunca num oval
   em volta da marca: forma fechada de véu lê como mancha. */
#ultima-edicao .ue-veil { background: linear-gradient(180deg, rgba(14, 7, 19, .08) 0%, rgba(14, 7, 19, .12) 20%, rgba(14, 7, 19, .3) 34%, rgba(14, 7, 19, .26) 72%, rgba(14, 7, 19, .34) 100%); }
#ultima-edicao .ue-veil-l { background: linear-gradient(90deg, rgba(14, 7, 19, .88) 0%, rgba(14, 7, 19, .74) 30%, rgba(40, 5, 50, .34) 54%, rgba(40, 5, 50, .1) 74%, rgba(40, 5, 50, .04) 100%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 21%, transparent 34%), linear-gradient(180deg, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .12) var(--ue-ra), #000 var(--ue-rb));
  mask-image: linear-gradient(90deg, #000 0%, #000 21%, transparent 34%), linear-gradient(180deg, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .12) var(--ue-ra), #000 var(--ue-rb));
  -webkit-mask-composite: source-over; mask-composite: add; }
/* o status mora do lado direito, sobre a coluna, o mar e o céu: véu ancorado na borda direita, só abaixo da testeira */
#ultima-edicao .ue-veil::after { content: ''; position: absolute; inset: 0; background: linear-gradient(270deg, rgba(14, 7, 19, .44) 0%, rgba(14, 7, 19, .36) 26%, rgba(14, 7, 19, .14) 44%, rgba(14, 7, 19, 0) 56%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent var(--ue-ra), #000 var(--ue-rb));
  mask-image: linear-gradient(180deg, transparent 0%, transparent var(--ue-ra), #000 var(--ue-rb)); }
#ultima-edicao .ue-veil-b { background: linear-gradient(0deg, rgba(14, 7, 19, .82) 0%, rgba(14, 7, 19, .42) 16%, rgba(14, 7, 19, 0) 38%); }
/* o texto do status mora sobre a lona da coluna e o mar: aura colada na letra em vez de mais véu */
#ultima-edicao .ue-status__t, #ultima-edicao .ue-status__d, #ultima-edicao .ue-title { text-shadow: 0 0 2px rgba(14, 7, 19, .6), 0 2px 12px rgba(14, 7, 19, .55), 0 6px 34px rgba(14, 7, 19, .5); }
/* letra pequena (rótulo mel, "câmera"): aura mais fechada, colada no traço */
#ultima-edicao .ue-status__k, #ultima-edicao .ue-cam { text-shadow: 0 0 1px rgba(14, 7, 19, .95), 0 0 3px rgba(14, 7, 19, .85), 0 1px 8px rgba(14, 7, 19, .7), 0 4px 22px rgba(14, 7, 19, .5); }

#ultima-edicao .ue-frame { position: relative; z-index: 3; height: 100%; container-type: inline-size; display: grid; grid-template-rows: minmax(0, 1fr) auto; padding-top: calc(var(--hud-h) + clamp(14px, 2.6vh, 28px)); padding-bottom: clamp(22px, 5vh, 60px); row-gap: clamp(14px, 2.6vh, 30px); }
#ultima-edicao .ue-wrap { display: grid; grid-template-rows: auto minmax(0, 1fr); row-gap: clamp(10px, 2vh, 22px); min-height: 0; }
#ultima-edicao .ue-lay { align-self: center; }

/* ---------- placar ---------- */
#ultima-edicao .ue-main { container-type: inline-size; display: grid; gap: clamp(12px, 2.2vh, 24px); justify-items: start; }
#ultima-edicao .ue-title { font-size: calc((clamp(40px, 9.2cqi, 76px)) * var(--ts, 1)); }
#ultima-edicao .ue-board { width: 100%; padding: 0; overflow: hidden; background: rgba(14, 7, 19, .8); }
#ultima-edicao .ue-board__head { display: flex; align-items: center; gap: 14px; padding: 11px clamp(16px, 1.8vw, 26px) 10px; background: linear-gradient(90deg, var(--acai) 0%, var(--acai-dark) 100%); border-bottom: 2px solid var(--honey); font-family: var(--f-display); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; font-size: calc((clamp(14px, .5vw + 9px, 18px)) * var(--ts, 1)); line-height: 1.2; color: var(--offwhite); }
#ultima-edicao .ue-board__head b { font-style: italic; font-weight: 900; letter-spacing: .04em; }
#ultima-edicao .ue-board__date { color: var(--honey); }
#ultima-edicao .ue-board__date::before { content: '·'; color: var(--text-3); margin-right: 14px; }
#ultima-edicao .ue-board__rec { display: inline-flex; align-items: center; gap: 7px; padding: 4px 8px 3px; font-family: var(--f-mono); font-weight: 700; font-size: calc(11px * var(--ts, 1)); letter-spacing: .16em; color: var(--offwhite); background: rgba(14, 7, 19, .55); border: 1px solid var(--line-2); }
#ultima-edicao .ue-board__rec i { width: 7px; height: 7px; border-radius: 50%; background: var(--signal); animation: live 1.6s ease-in-out infinite; }

#ultima-edicao .ue-board__grid { display: grid; grid-template-columns: 1fr 1fr; }
#ultima-edicao .ue-hl { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: clamp(12px, 1.2vw, 18px); padding: clamp(16px, 2.6vh, 28px) clamp(16px, 1.8vw, 28px); min-height: clamp(96px, 15vh, 150px); }
#ultima-edicao .ue-hl:nth-child(odd) { border-right: 1px solid var(--line); }
#ultima-edicao .ue-hl:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
/* as barras "//" do deck */
#ultima-edicao .ue-slash { align-self: start; width: .9em; height: 1.02em; margin-top: .14em; font-size: calc((clamp(26px, 5cqi, 42px)) * var(--ts, 1)); background: linear-gradient(90deg, var(--honey) 0 34%, transparent 34% 62%, var(--honey) 62% 96%, transparent 96%); transform: skewX(-20deg); transform-origin: 0 100%; }
#ultima-edicao .ue-hl__t { font-family: var(--f-display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: calc((clamp(22px, 4.85cqi, 40px)) * var(--ts, 1)); line-height: 1.12; letter-spacing: -.003em; color: var(--offwhite); padding-top: .06em; text-wrap: balance; }
#ultima-edicao .ue-hl--n .ue-hl__t { display: flex; align-items: center; gap: .22em; }
#ultima-edicao .ue-hl__n { font-weight: 900; font-size: 3.1em; line-height: .86; letter-spacing: -.02em; color: var(--offwhite); font-variant-numeric: tabular-nums; padding: .08em .04em 0 0; }
#ultima-edicao .ue-hl--n span { display: block; max-width: 6.2em; }
/* duas colunas: "dias de / prova" e "dias de / expo" sempre em duas linhas iguais (em 1280 uma quebrava e a
   outra não, e as duas casas da mesma fileira ficavam desencontradas) */
@media (min-width: 1181px) { #ultima-edicao .ue-hl--n span { max-width: 4.6em; } }

/* ---------- status + moeda ---------- */
#ultima-edicao .ue-status { container-type: inline-size; display: grid; align-content: center; row-gap: clamp(14px, 2.4vh, 26px); padding-left: clamp(0px, 2.4vw, 40px); border-left: 1px solid var(--line); min-height: 64%; }
#ultima-edicao .ue-status__row { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: clamp(18px, 2vw, 30px); }
#ultima-edicao .ue-coin { --d: min(clamp(128px, 44cqi, 230px), 27vh); --t: calc(var(--d) * .085); position: relative; width: var(--d); aspect-ratio: 1; perspective: calc(var(--d) * 4.2); }
#ultima-edicao .ue-coin__halo { position: absolute; inset: -34%; border-radius: 50%; background: radial-gradient(closest-side, rgba(244, 178, 35, .34), rgba(244, 178, 35, .1) 55%, transparent 100%); pointer-events: none; }
#ultima-edicao .ue-coin__spin { position: absolute; inset: 0; transform-style: preserve-3d; will-change: transform; }
#ultima-edicao .ue-coin__face, #ultima-edicao .ue-coin__edge { position: absolute; inset: 0; border-radius: 50%; }
#ultima-edicao .ue-coin__face { overflow: hidden; backface-visibility: hidden; -webkit-backface-visibility: hidden;
  /* aro de metal em volta do selo */
  background: conic-gradient(from 210deg, #8a6417, #ffe3a1 12%, #c08a22 24%, #fff0c8 38%, #a57718 52%, #f4b223 66%, #7d5a14 80%, #ffd66b 92%, #8a6417);
  box-shadow: inset 0 0 0 1px rgba(255, 240, 200, .5), inset 0 -6px 14px rgba(60, 30, 0, .35); }
#ultima-edicao .ue-coin__face--front { transform: translateZ(calc(var(--t) / 2)); }
#ultima-edicao .ue-coin__face--back { transform: rotateY(180deg) translateZ(calc(var(--t) / 2)); }
#ultima-edicao .ue-coin__img, #ultima-edicao .ue-coin__fb { position: absolute; inset: 5.5%; width: 89%; height: 89%; border-radius: 50%; }
#ultima-edicao .ue-coin__img { object-fit: cover; }
#ultima-edicao .ue-coin__img.is-missing { display: none; }
/* reserva tipográfica quando o recorte ainda não chegou (não é o selo redesenhado) */
#ultima-edicao .ue-coin__fb { display: grid; place-content: center; text-align: center; gap: .1em; background: radial-gradient(circle at 50% 35%, #3b1650 0%, var(--acai-dark) 70%); box-shadow: inset 0 0 0 2px rgba(244, 178, 35, .55); font-family: var(--f-display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: calc((calc(var(--d) * .13)) * var(--ts, 1)); line-height: 1; color: var(--offwhite); }
#ultima-edicao .ue-coin__fb small { font-size: .62em; letter-spacing: .06em; color: var(--honey); }
#ultima-edicao .ue-coin__shade { position: absolute; inset: 0; border-radius: 50%; background: #0e0713; opacity: var(--shade, 0); pointer-events: none; }
#ultima-edicao .ue-coin__glint { position: absolute; inset: -30%; pointer-events: none; mix-blend-mode: screen; opacity: var(--glint-o, 0);
  background: linear-gradient(105deg, transparent 36%, rgba(255, 250, 235, .08) 44%, rgba(255, 252, 240, .72) 50%, rgba(255, 250, 235, .08) 56%, transparent 64%);
  transform: translateX(var(--gx, -60%)); }
#ultima-edicao .ue-coin__edge { background: linear-gradient(180deg, #ffe3a1 0%, #c79a2e 30%, #8a6417 62%, #5e430e 100%); }

#ultima-edicao .ue-status__head { display: grid; gap: 8px; justify-items: start; }
#ultima-edicao .ue-status__t { font-family: var(--f-display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: calc((clamp(30px, 10cqi, 54px)) * var(--ts, 1)); line-height: 1.12; padding-top: .06em; color: var(--offwhite); text-wrap: balance; }
/* rótulo mel pequeno sobre o filme: plaqueta própria (media ~3:1 só com a aura; com a placa passa de 5:1
   mesmo sobre o céu claro). A margem negativa mantém a letra alinhada ao título. */
#ultima-edicao .ue-status__k { font-size: calc((clamp(14px, 3.6cqi, 19px)) * var(--ts, 1)); line-height: 1.3; padding: .3em .55em .24em; margin-left: -.55em; background: rgba(14, 7, 19, .78); text-shadow: none; }
#ultima-edicao .ue-status__d { font-size: calc((clamp(17px, 4.6cqi, 22px)) * var(--ts, 1)); line-height: 1.42; color: var(--offwhite); max-width: 16ch; text-wrap: balance; }

/* ---------- faixas ----------
   --in = borda de dentro da grade, medida pela largura da tela (100cqw do .ue-frame). Com 100% ela era
   calculada contra a própria faixa, que se ajusta ao conteúdo: o percentual caía a zero na medida
   intrínseca, a faixa B saía mais curta que o texto e, com a letra maior, "(Etapa Regional Sul)" quebrava
   para uma linha própria colada na borda esquerda (e meio fora dela) em 1920 e 2560.
   A faixa sangra à esquerda (margem negativa) e o texto começa na grade — menos quando a linha da faixa B
   com a tarja (~81,8% da tela até 1255 px, vezes --ts) não caberia com respiro à direita (1440–1700 px):
   aí o texto recua para a esquerda o que for preciso. Se ainda assim a tarja quebrar de linha, cai alinhada
   ao texto, não na borda. */
#ultima-edicao .ue-bands { --in: max(var(--gutter), min(calc((100cqw - var(--maxw)) / 2 + var(--gutter)), calc(100cqw - min(1255px, 81.8cqw) * var(--ts, 1) - 56px))); display: grid; justify-items: start; row-gap: clamp(8px, 1.3vh, 14px); overflow: clip; padding-block: 1.6vw 4px; transform: rotate(-1.6deg); transform-origin: 0 100%; }
#ultima-edicao .ue-band { display: flex; flex-wrap: wrap; align-items: center; row-gap: 6px; max-width: 100%; padding-left: var(--in); }
#ultima-edicao .ue-band__t, #ultima-edicao .ue-band__sub { flex: none; }
#ultima-edicao .ue-band__t { position: relative; display: block; padding: .3em 1.1em .24em calc(var(--in) + 1em); margin-left: calc(-1 * var(--in) - 1em); font-family: var(--f-display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: calc((clamp(24px, 3.1vw, 48px)) * var(--ts, 1)); line-height: 1.12; letter-spacing: .005em; color: var(--offwhite); background: var(--violet); clip-path: polygon(0 0, 100% 0, calc(100% - .62em) 100%, 0 100%); box-shadow: 0 10px 30px rgba(14, 7, 19, .35); white-space: nowrap; overflow: hidden; }
/* fio de luz passando na faixa quando ela trava */
#ultima-edicao .ue-band__t::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .28) 48%, transparent 66%); transform: translateX(var(--sheen, -110%)); pointer-events: none; }
#ultima-edicao .ue-band--b .ue-band__t { background: var(--acai); box-shadow: inset 0 0 0 1px rgba(245, 238, 224, .08), 0 10px 30px rgba(14, 7, 19, .35); }
#ultima-edicao .ue-band__sub { margin-left: -.3em; font-size: calc((clamp(16px, 1vw + 8px, 26px)) * var(--ts, 1)); align-self: center; }

/* telas baixas no desenho de duas colunas (1280×720, 1366×768, 1280×800): com a letra maior o placar
   ficava mais alto que a sua faixa e, centrado nela, subia sobre o "Replay" e descia até encostar nas
   faixas. Respiro vertical menor nas células e nas juntas; letra do mesmo tamanho. */
@media (min-width: 1181px) and (max-height: 820px) {
  #ultima-edicao .ue-frame { padding-bottom: clamp(14px, 2.4vh, 24px); row-gap: clamp(8px, 1.4vh, 14px); }
  #ultima-edicao .ue-main { gap: clamp(8px, 1.4vh, 14px); }
  #ultima-edicao .ue-hl { padding-block: clamp(10px, 1.5vh, 14px); min-height: 0; }
}

@media (max-width: 1180px) {
  #ultima-edicao .ue-main { --span: 1 / 13 !important; }
  #ultima-edicao .ue-status { --span: 1 / 13 !important; }
}
@media (max-width: 1180px) {
  #ultima-edicao .ue-lay { row-gap: clamp(18px, 2.6vh, 32px); }
  #ultima-edicao .ue-status { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); padding-top: clamp(16px, 2.4vh, 26px); min-height: 0; }
  #ultima-edicao .ue-status__row { justify-content: start; }
  #ultima-edicao .ue-coin { --d: clamp(120px, 22cqi, 210px); }
  #ultima-edicao .ue-status__t { font-size: calc((clamp(30px, 5.4cqi, 52px)) * var(--ts, 1)); }
  #ultima-edicao .ue-status__k, #ultima-edicao .ue-status__d { font-size: calc(18px * var(--ts, 1)); }
  #ultima-edicao .ue-band__t { white-space: normal; }
  #ultima-edicao .ue-title { font-size: calc((clamp(44px, 6.4cqi, 76px)) * var(--ts, 1)); }
  #ultima-edicao .ue-hl__t { font-size: calc((clamp(26px, 3.6cqi, 42px)) * var(--ts, 1)); }
  #ultima-edicao .ue-slash { font-size: calc((clamp(28px, 3.6cqi, 44px)) * var(--ts, 1)); }
  #ultima-edicao .ue-hl { min-height: clamp(110px, 10vh, 170px); }
}
/* retrato (iPad em pé): o filme é um recorte do centro e a testeira com a marca ocupa o alto da tela —
   o título e o placar descem para baixo dela (o selo "Replay" fica em cima, na treliça) e o véu abre mais largo */
@media (max-width: 1180px) and (orientation: portrait) {
  #ultima-edicao .ue-lay { margin-top: clamp(0px, 10.5vh - 24px, 150px); }
  /* em pé a testeira ocupa a largura toda: o véu da esquerda só começa abaixo dela */
  #ultima-edicao .ue-stage { --ue-ra: 17.5%; --ue-rb: 21.5%; }
  #ultima-edicao .ue-veil-l { -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .12) var(--ue-ra), #000 var(--ue-rb));
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .12) var(--ue-ra), #000 var(--ue-rb)); }
  /* em pé o "Replay · Largada" cai sobre a testeira salmão, sem véu: plaqueta própria */
  #ultima-edicao .ue-cam { justify-self: start; padding: 5px 10px 4px; background: rgba(14, 7, 19, .74); text-shadow: none; }
}
.reduced #ultima-edicao .ue-board__rec i { animation: none; }
/* projetor 2560 (≥ 2400 × 1300): a grade de 1320 px deixava o placar e o selo miúdos no meio do pórtico (o
   pórtico cresce com a tela, a grade não). A grade abre para 1760 (4/3 de 1320) e os tetos dos tamanhos sobem
   4/3 — é a composição de 1920×1080, ampliada. (Com `zoom: 1.3333` o Chrome fazia igual, mas o WebKit de mesa
   aplica o zoom antigo e desmontava o placar; ficou assim.) */
@media (min-width: 2400px) and (min-height: 1300px) and (orientation: landscape) {
  #ultima-edicao .ue-frame { --maxw: 1760px; padding-top: calc(var(--hud-h) + 37px); padding-bottom: 72px; row-gap: 37px; }
  #ultima-edicao .ue-wrap { row-gap: 29px; }
  #ultima-edicao .ue-cam { font-size: calc(14.5px * var(--ts, 1)); }
  #ultima-edicao .ue-main { gap: 32px; }
  #ultima-edicao .ue-title { font-size: calc((clamp(40px, 9.2cqi, 101px)) * var(--ts, 1)); }
  #ultima-edicao .ue-board__head { padding: 14px 35px 13px; gap: 18px; font-size: calc(24px * var(--ts, 1)); }
  #ultima-edicao .ue-board__rec { padding: 5px 11px 4px; gap: 9px; font-size: calc(14.5px * var(--ts, 1)); }
  #ultima-edicao .ue-board__rec i { width: 9px; height: 9px; }
  #ultima-edicao .ue-hl { padding: 37px; column-gap: 24px; min-height: 200px; }
  #ultima-edicao .ue-slash { font-size: calc((clamp(26px, 5cqi, 56px)) * var(--ts, 1)); }
  #ultima-edicao .ue-hl__t { font-size: calc((clamp(22px, 4.85cqi, 53px)) * var(--ts, 1)); }
  #ultima-edicao .ue-status { row-gap: 35px; padding-left: 53px; }
  #ultima-edicao .ue-status__head { gap: 11px; }
  #ultima-edicao .ue-status__row { column-gap: 40px; }
  #ultima-edicao .ue-coin { --d: min(clamp(128px, 44cqi, 307px), 27vh); }
  #ultima-edicao .ue-status__t { font-size: calc((clamp(30px, 10cqi, 72px)) * var(--ts, 1)); }
  #ultima-edicao .ue-status__k { font-size: calc((clamp(14px, 3.6cqi, 25px)) * var(--ts, 1)); }
  #ultima-edicao .ue-status__d { font-size: calc((clamp(17px, 4.6cqi, 29px)) * var(--ts, 1)); }
  #ultima-edicao .ue-bands { row-gap: 19px; }
  #ultima-edicao .ue-band__t { font-size: calc((clamp(24px, 3.1vw, 64px)) * var(--ts, 1)); }
  #ultima-edicao .ue-band__sub { font-size: calc((clamp(16px, 1vw + 8px, 35px)) * var(--ts, 1)); }
}