/* 23 · entregas — os três placares de L25–L27 num capítulo claro. Doca presa sob o HUD com as
   quatro cotas; o cabeçalho de cada tabela gruda logo abaixo dela. Tudo sob #entregas.
   A tabela é table-layout: fixed a 100% da faixa: nunca estoura na horizontal (tablet em pé). */

#entregas { --en-dock-h: 60px; --en-e: 37%; overflow-x: clip; }
#entregas .en-checker { opacity: .05; }

/* ---------- cabeçalho do capítulo ---------- */
#entregas .en-head { margin-bottom: clamp(30px, 5vh, 56px); }
#entregas .en-head__t { container-type: inline-size; }
#entregas .en-title { font-size: calc((clamp(52px, 11.4cqi, 112px)) * var(--ts, 1)); color: var(--acai); }
#entregas .en-lede { font-size: calc((clamp(16px, .3vw + 12px, 18px)) * var(--ts, 1)); max-width: 44ch; }
#entregas .en-key { display: flex; flex-wrap: wrap; gap: 10px 22px; font-family: var(--f-display); font-weight: 700; font-size: calc(14px * var(--ts, 1)); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-text-2); }
#entregas .en-key li { display: inline-flex; align-items: center; gap: 10px; }
#entregas .en-key .yes { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: rgba(74, 31, 96, .1); color: var(--acai); }
#entregas .en-key .yes svg { width: 15px; height: 15px; }
#entregas .en-key .no { display: inline-grid; place-items: center; width: 26px; color: rgba(29, 11, 39, .42); font-family: var(--f-body); font-size: calc(17px * var(--ts, 1)); }
#entregas .en-key .n { font-family: var(--f-display); font-style: italic; font-weight: 900; font-size: calc(20px * var(--ts, 1)); letter-spacing: 0; text-transform: none; color: var(--acai); min-width: 26px; text-align: center; }

/* ---------- doca (presa sob o HUD) ---------- */
#entregas .en-body { position: relative; }
#entregas .en-sentinel { display: block; height: 1px; margin-bottom: -1px; }
#entregas .en-dock {
  position: sticky; top: var(--hud-h); z-index: 6; height: var(--en-dock-h);
  display: flex; align-items: center; gap: clamp(10px, 1.4vw, 20px); padding: 0 8px 0 clamp(14px, 1.4vw, 20px);
  background: var(--ink); color: var(--offwhite); border-radius: var(--r) var(--r) 0 0;
  box-shadow: 0 1px 0 rgba(245, 238, 224, .08) inset; transition: box-shadow .35s, border-radius .35s;
}
#entregas .en-dock.is-stuck { border-radius: 0; box-shadow: 0 1px 0 rgba(245, 238, 224, .08) inset, 0 14px 30px -14px rgba(14, 7, 19, .55); }
/* presa, a doca vira uma faixa de transmissão de ponta a ponta sob o HUD: o que rola por baixo some */
#entregas .en-dock::before { content: ''; position: absolute; z-index: -1; left: 50%; width: 100vw; margin-left: -50vw; top: calc(-1 * var(--hud-h)); bottom: 0;
  background: linear-gradient(180deg, var(--ink) 0%, var(--ink) 100%); box-shadow: 0 14px 28px -16px rgba(14, 7, 19, .6); opacity: 0; transition: opacity .3s; pointer-events: none; }
#entregas .en-dock.is-stuck::before { opacity: 1; }
#entregas .en-dock__k { flex: none; display: inline-flex; align-items: center; gap: 8px; font-family: var(--f-display); font-weight: 700; font-size: calc(13px * var(--ts, 1)); letter-spacing: .14em; text-transform: uppercase; color: var(--honey); }
#entregas .en-dock__k svg { width: 16px; height: 16px; }
#entregas .en-dock__picks { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; height: calc(var(--en-dock-h) - 12px); }
#entregas .en-pick {
  position: relative; min-width: 0; display: grid; align-content: center; justify-items: start; gap: 2px; padding: 0 12px 0 16px; text-align: left;
  border: 1px solid rgba(245, 238, 224, .14); background: rgba(245, 238, 224, .04);
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
  transition: background .3s var(--ease-out), color .3s, border-color .3s;
}
#entregas .en-pick b { font-family: var(--f-display); font-style: italic; font-weight: 900; font-size: calc((clamp(15px, .45vw + 11px, 19px)) * var(--ts, 1)); line-height: 1.1; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; padding-top: .06em; }
#entregas .en-pick small { display: inline-flex; align-items: center; gap: 6px; font-family: var(--f-mono); font-size: calc(10.5px * var(--ts, 1)); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; color: var(--text-3); }
#entregas .en-pick small::before { content: ''; width: 6px; height: 6px; flex: none; }
#entregas .en-pick.is-sold small::before { background: var(--signal); transform: rotate(45deg); }
#entregas .en-pick.is-open small { color: var(--honey); }
#entregas .en-pick.is-open small::before { border-radius: 50%; background: var(--honey); box-shadow: 0 0 0 3px rgba(244, 178, 35, .18); }
#entregas .en-pick:hover { background: rgba(245, 238, 224, .1); border-color: rgba(245, 238, 224, .3); }
#entregas .en-pick.is-on { background: var(--honey); border-color: var(--honey); color: var(--acai-dark); }
#entregas .en-pick.is-on small { color: rgba(40, 5, 50, .78); }
#entregas .en-pick.is-on small::before { background: var(--acai-dark); box-shadow: none; }
#entregas .en-pick:focus-visible { outline-offset: -3px; outline-color: var(--offwhite); }

/* ---------- lâminas ---------- */
#entregas .en-sheet { margin-top: clamp(44px, 8vh, 96px); }
#entregas .en-sheet:first-of-type { margin-top: clamp(26px, 4vh, 40px); }
#entregas .en-sheet__h { display: flex; align-items: center; gap: 16px; margin-bottom: clamp(12px, 1.8vh, 18px); }
#entregas .en-sheet__h::before { content: ''; flex: none; width: 34px; height: 8px; background: var(--honey); transform: skewX(-24deg); }
#entregas .en-sheet__t { font-family: var(--f-display); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: calc((clamp(28px, 2.6vw, 46px)) * var(--ts, 1)); line-height: 1.12; letter-spacing: -.003em; color: var(--acai); padding-top: .06em; }

/* ---------- o placar ---------- */
#entregas .en-board { table-layout: fixed; background: #fbf8f1; box-shadow: var(--shadow-2); border-radius: 0 0 var(--r) var(--r); }
#entregas .en-col-e { width: var(--en-e); }
#entregas .board thead th { top: calc(var(--hud-h) + var(--en-dock-h)); padding: 13px 8px 12px; letter-spacing: .06em; line-height: 1.15; }
#entregas .board thead th:first-child { padding-left: 18px; }
#entregas .board thead th.is-hl { box-shadow: inset 0 4px 0 var(--honey); }
#entregas .en-sup { color: var(--honey); margin-left: .05em; }
#entregas .board tbody th { font-family: var(--f-body); font-weight: 500; color: var(--ink-text); line-height: 1.35; padding-block: 11px; text-wrap: balance; }
#entregas .board td { padding: 8px 8px; }
#entregas .en-nw { white-space: nowrap; } /* palavra com hífen não quebra no hífen ("guarda-/corpo") */
#entregas .en-ast { color: var(--violet); font-weight: 700; margin-left: .06em; }
#entregas .board tr.board__group td { padding-top: 14px; padding-bottom: 10px; font-size: .92em; letter-spacing: .08em; }
#entregas .board .no { font-size: 1.05em; }
#entregas .board .no > [aria-hidden] { color: rgba(29, 11, 39, .4); }
#entregas .board tbody tr:last-child > * { border-bottom: 0; }

/* leitura da linha: passar o mouse acende a entrega */
#entregas .board tbody tr:not(.board__group):hover > th { color: var(--acai); background: rgba(74, 31, 96, .045); }
#entregas .board tbody tr:not(.board__group):hover > td:not(.is-hl) { background: rgba(74, 31, 96, .045); }

/* a raia acesa: a coluna da cota escolhida, de cima a baixo, nas três tabelas.
   Ao trocar de cota a luz desce linha a linha (atraso pela ordem da linha, --i). */
#entregas .board .en-c { transition: background-color .4s var(--ease-out) calc(var(--i, 0) * 16ms), box-shadow .4s var(--ease-out) calc(var(--i, 0) * 16ms), color .3s; }
#entregas .board td.is-hl { background: rgba(244, 178, 35, .17); box-shadow: inset 2px 0 0 rgba(244, 178, 35, .8), inset -2px 0 0 rgba(244, 178, 35, .8); }
#entregas .board tr.board__group td.is-hl { background: rgba(244, 178, 35, .26); }
#entregas .board tbody tr:last-child td.is-hl { box-shadow: inset 2px 0 0 rgba(244, 178, 35, .8), inset -2px 0 0 rgba(244, 178, 35, .8), inset 0 -4px 0 var(--honey); }
#entregas .board .yes { transition: background-color .35s, color .35s; }
#entregas .board td.is-hl .yes { background: var(--honey); color: var(--acai-dark); }
#entregas .board td.is-hl .n { color: var(--acai-dark); }

/* rodapé de cada lâmina */
#entregas .en-note { margin-top: 14px; padding-left: 18px; max-width: 100ch; font-size: calc(13.5px * var(--ts, 1)); line-height: 1.6; color: var(--ink-text-2); }
#entregas .en-note span { display: block; }

/* ---------- tablet em pé e janelas estreitas ---------- */
@media (max-width: 1180px) {
  #entregas { --en-e: 35%; }
  #entregas .board thead th { font-size: calc(13.5px * var(--ts, 1)); letter-spacing: .04em; padding-inline: 6px; }
  #entregas .en-pick { padding: 0 8px 0 13px; }
}
@media (max-width: 980px) {
  #entregas .en-head__r { max-width: 60ch; }
}
@media (max-width: 860px) {
  #entregas { --en-e: 32%; --en-dock-h: 66px; }
  #entregas .en-dock__k { display: none; }
  #entregas .en-pick small { font-size: calc(9.5px * var(--ts, 1)); letter-spacing: .04em; }
}

/* ---------- tela grande (2560×1440 e afins): a faixa e a letra crescem juntas ---------- */
@media (min-width: 1800px) and (min-height: 1200px) {
  #entregas .en-wrap { max-width: 1600px; }
  #entregas .board { font-size: calc(19.5px * var(--ts, 1)); }
  #entregas .board thead th { font-size: calc(17px * var(--ts, 1)); padding-block: 15px 14px; }
  #entregas .board .yes { width: 32px; height: 32px; }
  #entregas .board .yes svg { width: 18px; height: 18px; }
  #entregas .en-note { font-size: calc(15px * var(--ts, 1)); }
  #entregas .en-lede { font-size: calc(20px * var(--ts, 1)); }
  #entregas { --en-dock-h: 68px; }
  #entregas .en-pick small { font-size: calc(12px * var(--ts, 1)); }
}
