/* Presales por partes (2026-11-08, revisión «Blockboard 5.4»). Prefijo
 * `ps6-`. Lo carga `presales/_ps.html` (la cabecera de cada parte y de la
 * ficha). Lo de las cajas de `_hero.html`, que también son piezas del
 * terminal, está en `presales-hero.css`.
 *
 * Pedido: «exceso de información y falta de jerarquía»; «tabla
 * excesivamente comprimida: tipografía pequeña, demasiadas columnas, filtros
 * apretados y filas difíciles de recorrer»; avisos «diferenciados por
 * gravedad y tipo»; «diferenciar datos desconocidos de los que no
 * corresponden». Sólo tokens de color; probado en claro y oscuro, de 390 a
 * 1440 px; con «menos movimiento» no se mueve nada.
 */

/* --- La gravedad de un aviso: un color por nivel ------------------------ */
:root {
  --ps6-high: var(--danger);
  --ps6-medium: var(--warn);
  --ps6-note: var(--text-faint);
  --ps6-good: var(--ok);
}

/* --- Cabecera y pestañas de las partes ---------------------------------- */
.ps6-head { margin-bottom: var(--s3); }
.ps6-crumb { display: inline-block; font-size: var(--size-xs); color: var(--text-faint);
  text-transform: uppercase; letter-spacing: .08em; margin-bottom: 2px; }
.ps6-crumb:hover { color: var(--accent); text-decoration: none; }
.ps6-lede { color: var(--text-muted); font-size: var(--size-base); max-width: 70ch; margin: var(--s2) 0 0; }
.ps6-tabs { display: flex; gap: 2px; margin: 0 0 var(--s5); padding: 3px; border: 1px solid var(--line);
  border-radius: var(--radius); background: var(--surface-sunken); overflow-x: auto;
  scrollbar-width: none; }
.ps6-tabs::-webkit-scrollbar { display: none; }
.ps6-tabs a { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: var(--radius-sm);
  color: var(--text-muted); font-size: var(--size-sm); font-weight: 550; white-space: nowrap; flex: 0 0 auto;
  transition: background-color .15s, color .15s; }
.ps6-tabs a svg { width: 16px; height: 16px; flex: 0 0 auto; opacity: .75; }
.ps6-tabs a:hover { color: var(--text); background: var(--surface); text-decoration: none; }
.ps6-tabs a.on { color: var(--text); background: var(--surface); box-shadow: var(--sheen); }
.ps6-tabs a.on svg { color: var(--accent); opacity: 1; }

/* --- El submenú de la izquierda (`presales/_nav.html`, `base.html`) ----- */
.side nav .ps6-side { display: flex; flex-direction: column; gap: 1px; margin: 1px 0 4px 14px;
  padding-left: 8px; border-left: 1px solid var(--line); }
.side nav .ps6-side a { padding: 5px var(--s2); font-size: var(--size-xs); gap: var(--s2); }
.side nav .ps6-side a .ico svg { width: 14px; height: 14px; }
.side nav .ps6-side a.on { box-shadow: none; background: color-mix(in srgb, var(--accent) 10%, transparent); }
.side nav a[aria-expanded="true"] { position: relative; }
.side nav a[aria-expanded="true"]::before { content: ''; position: absolute; right: 10px; top: 50%; width: 6px; height: 6px;
  border-right: 1.5px solid var(--text-faint); border-bottom: 1.5px solid var(--text-faint);
  transform: translateY(-70%) rotate(45deg); }
.shell.side-closed .side nav .ps6-side, .shell.side-closed .side nav a[aria-expanded="true"]::before { display: none; }
@media (max-width: 860px) { .side nav .ps6-side { display: none; } }

/* --- La frase de hoy y las conclusiones --------------------------------- */
.ps6-say { padding: var(--s4) var(--s5); margin-bottom: var(--s5);
  border-left: 3px solid var(--accent); }
.ps6-say p { margin: 0; font-size: var(--size-md); line-height: 1.55; max-width: 92ch; }
.ps6-say p + p { margin-top: var(--s2); }
.ps6-say b { font-variant-numeric: tabular-nums; }
.ps6-say a.link { color: inherit; text-decoration: underline; text-decoration-color: var(--line-strong);
  text-underline-offset: 3px; }
.ps6-say a.link:hover { text-decoration-color: var(--accent); }
.ps6-say .ps6-howto, .ps6-howto { font-size: var(--size-sm); }

.ps6-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5); margin-bottom: var(--s4); }
.ps6-col > .sec-head:first-child { margin-top: 0; }
.ps6-picks { display: grid; gap: var(--s3); }
.ps6-empty { color: var(--text-muted); font-size: var(--size-sm); }

.ps6-pick { display: grid; gap: var(--s3); padding: var(--s4); cursor: pointer;
  transition: border-color .15s, transform .15s; }
.ps6-pick:hover { border-color: var(--line-strong); }
.ps6-pick.risk { border-left: 3px solid var(--ps6-high); }
.ps6-pick:not(.risk) { border-left: 3px solid color-mix(in srgb, var(--ps6-good) 70%, transparent); }
.ps6-pick-hd { display: flex; align-items: center; gap: var(--s3); min-width: 0; }
.ps6-pick-id { display: grid; min-width: 0; flex: 1 1 auto; font-size: var(--size-base); }
.ps6-pick-id a { color: var(--text); }
.ps6-pick-id small { font-size: var(--size-xs); color: var(--text-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps6-when { font-size: var(--size-xs); font-weight: 600; color: var(--accent); white-space: nowrap; padding: 3px 9px;
  border-radius: 999px; background: color-mix(in srgb, var(--accent) 11%, transparent); flex: 0 0 auto; }
.ps6-when.soon { color: var(--warn); background: color-mix(in srgb, var(--warn) 13%, transparent); }
.ps6-when.up-next { color: var(--info); background: color-mix(in srgb, var(--info) 12%, transparent); }
.ps6-why { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--size-sm); color: var(--text-muted); }
.ps6-why li { display: flex; gap: 8px; align-items: baseline; line-height: 1.45; }
.ps6-why li > span { min-width: 0; overflow-wrap: anywhere; }
.ps6-why .ps6-ty { flex: 0 0 auto; }
.ps6-why.bad li { flex-wrap: wrap; gap: 4px 8px; }
.ps6-also { margin: 0; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; font-size: var(--size-xs); }
.ps6-pick-ft { display: flex; align-items: center; justify-content: space-between; gap: var(--s2) var(--s3); flex-wrap: wrap;
  padding-top: var(--s3); border-top: 1px solid var(--line); font-size: var(--size-sm); }
.ps6-money { font-variant-numeric: tabular-nums; display: inline-flex; align-items: baseline; gap: 4px; flex-wrap: wrap; }
.ps6-money .ps-mini { width: 64px; display: inline-block; vertical-align: middle; margin: 0 0 0 4px; }
.ps6-pick-go { display: inline-flex; align-items: center; gap: var(--s3); }

.ps6-lines { padding: var(--s1) 0; display: grid; }
.ps6-lines > p { padding: var(--s3) var(--s4); margin: 0; }
.ps6-line { display: flex; align-items: center; gap: var(--s3); padding: 9px var(--s4); color: var(--text);
  border-bottom: 1px solid var(--line); min-width: 0; transition: background-color .12s; }
.ps6-line:last-child { border-bottom: 0; }
.ps6-line:hover { background: var(--surface-hover); text-decoration: none; }
.ps6-line-id { display: grid; min-width: 0; flex: 1 1 auto; }
.ps6-line-id b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps6-line-id small { font-size: var(--size-xs); color: var(--text-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps6-line-m { flex: 0 1 auto; min-width: 0; display: flex; justify-content: flex-end; }

.ps6-deeper { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s3); margin-bottom: var(--s6); }
.ps6-morecard { display: grid; gap: 4px; align-content: start; color: var(--text); padding: var(--s4);
  transition: border-color .15s, transform .15s; }
.ps6-morecard:hover { border-color: var(--accent); text-decoration: none; transform: translateY(-2px); }
.ps6-more-i svg { width: 22px; height: 22px; color: var(--accent); }
.ps6-morecard b { font-size: var(--size-md); }
.ps6-more-q { font-size: var(--size-sm); color: var(--text-muted); font-weight: 550; }
.ps6-morecard small { font-size: var(--size-xs); color: var(--text-faint); line-height: 1.45; }

/* --- Avisos: gravedad (color) y tipo (rótulo) ---------------------------- */
.ps6-flags { display: inline-flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.ps6-chip { display: inline-flex; align-items: center; gap: 6px; font-size: var(--size-xs); line-height: 1.2;
  padding: 3px 9px 3px 4px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--text-muted);
  white-space: nowrap; background: transparent; }
.ps6-chip .ps6-ty { margin: 0; }
.ps6-chip.t-high { color: var(--ps6-high); border-color: color-mix(in srgb, var(--ps6-high) 45%, transparent);
  background: color-mix(in srgb, var(--ps6-high) 10%, transparent); font-weight: 600; }
.ps6-chip.t-medium { color: var(--ps6-medium); border-color: color-mix(in srgb, var(--ps6-medium) 45%, transparent); }
.ps6-chip.t-note { color: var(--text-faint); border-style: dashed; }
.ps6-chip.t-good { color: var(--ps6-good); border-color: color-mix(in srgb, var(--ps6-good) 40%, transparent); }
.ps6-ty { white-space: nowrap; font-style: normal; font-size: var(--size-2xs); font-weight: 600; letter-spacing: .02em; text-transform: uppercase;
  padding: 1px 6px; border-radius: 999px; background: var(--surface-sunken); color: var(--text-faint); }
.ps6-chip.t-high .ps6-ty { background: color-mix(in srgb, var(--ps6-high) 16%, transparent); color: inherit; }
.ps6-chip.t-medium .ps6-ty { background: color-mix(in srgb, var(--ps6-medium) 14%, transparent); color: inherit; }
.ps6-more { font-size: var(--size-xs); color: var(--text-faint); }
.ps6-none { font-size: var(--size-xs); color: var(--text-faint); }
.ps6-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--ps6-note); }
.ps6-dot.t-high { background: var(--ps6-high); }
.ps6-dot.t-medium { background: var(--ps6-medium); }
.ps6-dot.t-note { background: transparent; border: 1.5px dashed var(--ps6-note); }

/* --- Desconocido o no corresponde --------------------------------------- */
.ps6-na { color: var(--text-faint); }
.ps6-unk { font-size: var(--size-xs); font-style: italic; color: var(--text-faint); }
.ps6-na[tabindex], .ps6-unk[tabindex] { cursor: help; }

/* --- El enlace a la venta ----------------------------------------------- */
.ps6-go { display: inline-flex; align-items: center; gap: 5px; max-width: 170px; padding: 4px 10px; border-radius: 999px;
  font-size: var(--size-xs); font-weight: 600; color: var(--accent);
  border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent);
  background: color-mix(in srgb, var(--accent) 7%, transparent); transition: background-color .15s; }
.ps6-go:hover { background: color-mix(in srgb, var(--accent) 16%, transparent); text-decoration: none; }
.ps6-go-w { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ps6-go-i { flex: 0 0 auto; }
.ps6-go.k-listing, .ps6-go.k-contract, .ps6-go.k-announcement { color: var(--text-muted); border-color: var(--line-strong); background: transparent; }

/* --- El múltiplo con su contexto ---------------------------------------- */
.ps6-x { display: inline-grid; justify-items: end; line-height: 1.2; }
.ps6-x b { font-size: var(--size-base); }
.ps6-x small { font-size: var(--size-xs); opacity: .85; }
.ps6-x.faint { color: var(--text-faint); }

/* --- La tabla: letra más grande, filas más altas, menos columnas -------- */
.ps6-table { font-size: var(--size-sm); }
.ps6-table thead th { font-size: var(--size-xs); }
.ps6-table td { padding-top: 12px; padding-bottom: 12px; line-height: 1.35; }
.ps6-table td:first-child { font-size: var(--size-base); }
.ps6-table .ps2-sub { font-size: var(--size-xs); }
.ps6-table .ps6-kind { font-weight: 600; }
.ps6-tr { text-decoration: underline dotted; text-decoration-color: var(--line-strong); text-underline-offset: 3px; cursor: help; }
.ps6-table td.num b { font-size: var(--size-base); }
.ps6-table tbody tr { transition: background-color .12s; }
.ps6-table tbody tr:hover { background: var(--surface-hover); }
.ps6-table .ps-onchain { margin-top: 2px; }
.ps6-oc-seen { color: var(--text-muted); }

/* --- Filtros: los esenciales y «Advanced filters» ----------------------- */
.ps6-filters { display: grid; gap: var(--s2); margin-bottom: var(--s3); }
.ps6-frow { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; }
.ps6-filters select, .ps6-filters input[type=search] { min-height: 36px; font-size: var(--size-sm); }
.ps6-filters input[name=q], .ps6-filters input[name=cq] { flex: 1 1 220px; width: auto; max-width: 320px; }
.ps6-adv { border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-sunken); }
.ps6-adv > summary { cursor: pointer; list-style: none; padding: 8px 12px; font-size: var(--size-sm); color: var(--text-muted);
  display: flex; align-items: center; gap: 8px; user-select: none; }
.ps6-adv > summary::-webkit-details-marker { display: none; }
.ps6-adv > summary::before { content: ''; width: 6px; height: 6px; border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transition: transform .15s; }
.ps6-adv[open] > summary::before { transform: rotate(45deg); }
.ps6-adv > summary b { font-size: var(--size-2xs); color: var(--bg); background: var(--accent); border-radius: 999px;
  padding: 1px 7px; }
.ps6-adv > summary:hover { color: var(--text); }
.ps6-adv > .ps6-frow { padding: 0 12px 12px; }
.ps6-key { margin-top: var(--s1); }

/* --- Red flags: tarjetas por gravedad ------------------------------------ */
.ps6-type.t-high { --c: var(--ps6-high); }
.ps6-type.t-medium { --c: var(--ps6-medium); }
.ps6-type.t-note { --c: var(--ps6-note); }
.ps6-type.t-good { --c: var(--ps6-good); }
.ps6-type-k { font-size: var(--size-2xs); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text-faint); }
.ps6-wtab tr.note td:first-child { box-shadow: inset 3px 0 0 var(--ps6-note); }

/* --- Pasado: la frase y la regla de lectura ------------------------------ */
.ps6-say .ps6-howto b { font-weight: 650; }

/* --- Ficha: el botón de la venta ------------------------------------------ */
.ps6-sale-cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); margin-top: var(--s2); }
.ps6-sale-cta .ps6-go { max-width: none; font-size: var(--size-sm); padding: 7px 14px; }
.ps6-sale-cta small { font-size: var(--size-xs); color: var(--text-faint); }

/* --- Pantallas --------------------------------------------------------- */
@media (max-width: 1180px) { .ps6-deeper { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 980px) { .ps6-cols { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 720px) {
  .ps6-say { padding: var(--s3) var(--s4); }
  .ps6-say p { font-size: var(--size-base); }
  .ps6-deeper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ps6-tabs { margin-bottom: var(--s4); }
  .ps6-tabs a { padding: 7px 10px; }
  .ps6-pick { padding: var(--s3); }
  .ps6-pick-hd { flex-wrap: wrap; }
  .ps6-line-m { display: none; }
  .ps6-filters input[name=q], .ps6-filters input[name=cq] { max-width: none; flex-basis: 100%; }
  .ps6-filters select { flex: 1 1 140px; }
  .ps6-table td { padding-top: 10px; padding-bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .ps6-morecard, .ps6-pick, .ps6-tabs a, .ps6-line, .ps6-go, .ps6-adv > summary::before { transition: none; }
  .ps6-morecard:hover { transform: none; }
}

/* «Upcoming»: el aviso de una semana, ámbar si lo peor es algo que mirar. */
.ps-lw-warn.ps6-warn-mid { color: var(--warn); }