/* V8.4 · Señales con el diseño aprobado (referencia 1672×941). Medidas tomadas de la imagen; todo bajo .s84 / body.s84-on (no toca otros módulos). */
body.s84-on { background: radial-gradient(1200px 500px at 30% -10%, rgba(18, 70, 120, .22), transparent 60%), #010D19; }
@media (min-width: 1024px) {
  body.s84-on .shell { grid-template-columns: 0 minmax(0, 1fr); }
  body.s84-on .shell > .nav, body.s84-on .topbar { display: none; }
  body.s84-on.s84-menu .shell > .nav { display: flex; position: fixed; left: 0; top: 0; bottom: 0; width: 248px; z-index: 60; box-shadow: 20px 0 40px rgba(0, 0, 0, .5); }
}
@media (max-width: 1023px) { body.s84-on .topbar { display: none; } }
body.s84-on .main { padding: 0; max-width: none; outline: none; }
.s84 [hidden] { display: none !important; }
.s84 { --s84-f: -apple-system, "SF Pro Text", "SF Pro Display", Inter, "Segoe UI", Roboto, system-ui, sans-serif; font-family: var(--s84-f); color: #EAF1F7; padding: 12px 20px 28px; font-size: 14.5px; letter-spacing: 0; }
.s84 button { font-family: inherit; color: inherit; cursor: pointer; }
.s84 b { font-weight: 600; }
.s84-dim { color: #93A6B8; font-size: 13px; }

/* ---- cabecera */
.s84-hdr { display: flex; align-items: center; gap: 18px; min-height: 58px; margin-bottom: 14px; }
.s84-brand { display: flex; align-items: center; gap: 12px; background: none; border: 0; padding: 0 22px 0 0; border-right: 1px solid rgba(150, 180, 210, .22); text-align: left; }
.s84-brand b { display: block; font-size: 22px; letter-spacing: .02em; font-weight: 700; line-height: 1.1; }
.s84-brand small { display: block; font-size: 11.5px; letter-spacing: .12em; color: #C9D5E0; font-weight: 600; }
.s84-eye { display: inline-flex; }
.s84-tit h1 { margin: 0; font-size: 23px; font-weight: 700; line-height: 1.15; }
.s84-sub2 { color: #A9BAC9; font-size: 15px; margin-top: 2px; }
.s84-univ { margin-left: auto; display: inline-flex; border: 1px solid rgba(110, 150, 200, .30); border-radius: 11px; overflow: hidden; background: #0B1D33; height: 42px; }
.s84-univ button { border: 0; background: none; padding: 0 22px; font-size: 15px; font-weight: 600; color: #E8EEF4; }
.s84-univ button.on { background: linear-gradient(180deg, #1E86FF, #0C66E6); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); color: #fff; }
.s84-search { display: flex; align-items: center; gap: 10px; width: 374px; height: 42px; padding: 0 14px; border: 1px solid rgba(120, 160, 205, .28); border-radius: 11px; background: #061322; }
.s84-search input { flex: 1; background: none; border: 0; outline: 0; color: #EAF1F7; font: 15px var(--s84-f); }
.s84-search input::placeholder { color: #8396A8; }
.s84-sq { width: 42px; height: 42px; border-radius: 10px; border: 1px solid rgba(120, 160, 205, .28); background: #0A1828; display: inline-flex; align-items: center; justify-content: center; position: relative; }
.s84-sq.act::after { content: ""; position: absolute; top: 6px; right: 6px; width: 8px; height: 8px; border-radius: 50%; background: #2BA4FF; }

/* ---- filtros y paneles */
.s84-filtros, .s84-pop { border: 1px solid rgba(110, 150, 200, .25); border-radius: 12px; background: #081829; padding: 12px 16px; margin: 0 0 12px; display: grid; gap: 8px; }
.s84-pop b { font-size: 14.5px; } .s84-pop p { margin: 4px 0 2px; color: #B7C6D4; font-size: 13.5px; line-height: 1.45; }
.s84-fg { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.s84-fg > span { min-width: 168px; color: #9FB2C4; font-size: 13px; }
.s84-chip { border: 1px solid rgba(120, 160, 205, .28); background: #0C1D30; border-radius: 9px; padding: 6px 11px; font-size: 13px; }
.s84-chip[aria-pressed="true"] { background: linear-gradient(180deg, #1E86FF, #0C66E6); border-color: transparent; }
.s84-fg select { background: #0C1D30; color: #EAF1F7; border: 1px solid rgba(120, 160, 205, .28); border-radius: 9px; padding: 6px 10px; font: 13px var(--s84-f); }

/* ---- barra de orden (7 criterios) y tarjetas explicativas: misma rejilla para que cada tarjeta quede bajo su botón */
.s84-orden { display: grid; grid-template-columns: 100px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid rgba(85, 135, 195, .30); border-radius: 13px; background: linear-gradient(180deg, #0A1B2E, #08172A); padding: 8px 12px 8px 16px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .35); }
.s84-olab { font-size: 15.5px; font-weight: 700; }
.s84-ogrid { display: grid; grid-template-columns: minmax(0, 185fr) minmax(0, 165fr) minmax(0, 188fr) minmax(0, 249fr) minmax(0, 201fr) minmax(0, 237fr) minmax(0, 183fr); gap: 14px; }
.s84-ob { display: flex; align-items: center; gap: 9px; min-height: 56px; padding: 6px 10px; border: 1px solid rgba(120, 160, 205, .20); border-radius: 11px; background: #0C1B2D; text-align: left; transition: border-color .15s, box-shadow .15s, background .15s; }
.s84-ob > span:last-child { min-width: 0; } .s84-ob b { display: block; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .s84-ob small { display: block; font-size: 12px; color: #A3B4C4; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.s84-ob:hover { border-color: rgba(150, 195, 240, .45); background: #0F2236; }
.s84-ob.on { border: 2px solid #34B5FF; background: linear-gradient(180deg, #0F2D4B, #0B223A); box-shadow: 0 0 14px rgba(52, 181, 255, .45), inset 0 0 12px rgba(52, 181, 255, .12); padding: 5px 9px; }
.s84-oi { display: inline-flex; flex: none; }
.s84-cards { position: relative; padding: 0 10px 0 46px; margin: 0 0 18px; }
.s84-cards .s84-ogrid { grid-template-columns: minmax(0, 228fr) minmax(0, 215fr) minmax(0, 199fr) minmax(0, 202fr) minmax(0, 189fr) minmax(0, 212fr) minmax(0, 200fr); gap: 21px; }
.s84-card { position: relative; margin-top: 30px; border: 1.5px solid; border-radius: 12px; padding: 10px 14px; font-size: 13.6px; line-height: 1.42; min-height: 100px; display: flex; align-items: center; }
.s84-card p { margin: 0; }
.s84-arr { position: absolute; left: 50%; top: -31px; height: 27px; border-left: 1.6px solid currentColor; }
.s84-arr::before { content: ""; position: absolute; left: -5.8px; top: -2px; border: 5px solid transparent; border-bottom: 7px solid currentColor; border-top: 0; }
.s84-card.on { box-shadow: 0 0 16px currentColor; }
.s84-ctog { position: absolute; right: 12px; bottom: -18px; background: none; border: 0; color: #8FA6BC; font-size: 12px; }
.s84-sincards .s84-card { display: none; } .s84-sincards .s84-cards { margin-bottom: 18px; min-height: 8px; }
.s84-c-b { color: #4BB0FF; } .s84-card.s84-c-b { border-color: #2A8BEA; background: rgba(18, 74, 150, .20); box-shadow: 0 0 10px rgba(42, 139, 234, .35); } .s84-card.s84-c-b p { color: #EEF4FA; }
.s84-c-g { color: #46DE8C; } .s84-card.s84-c-g { border-color: #35C878; background: rgba(24, 120, 70, .16); box-shadow: 0 0 10px rgba(53, 200, 120, .35); } .s84-card.s84-c-g p { color: #C8F7D9; }
.s84-c-o { color: #F39A3A; } .s84-card.s84-c-o { border-color: #E07B22; background: rgba(140, 66, 10, .22); box-shadow: 0 0 10px rgba(224, 123, 34, .35); } .s84-card.s84-c-o p { color: #FBEBDD; }
.s84-c-v { color: #9C7DFF; } .s84-card.s84-c-v { border-color: #7E5CF2; background: rgba(80, 52, 190, .20); box-shadow: 0 0 10px rgba(126, 92, 242, .35); } .s84-card.s84-c-v p { color: #EDE7FF; }
.s84-c-y { color: #F4BC35; } .s84-card.s84-c-y { border-color: #E5AA22; background: rgba(140, 100, 10, .16); box-shadow: 0 0 10px rgba(229, 170, 34, .35); } .s84-card.s84-c-y p { color: #FFF5DC; }
.s84-c-t { color: #2FD3B0; } .s84-card.s84-c-t { border-color: #1DB898; background: rgba(16, 120, 104, .17); box-shadow: 0 0 10px rgba(29, 184, 152, .35); } .s84-card.s84-c-t p { color: #C3F6EA; }
.s84-c-w { color: #B7C4D1; } .s84-card.s84-c-w { border-color: #4D6176; background: rgba(90, 110, 130, .10); box-shadow: 0 0 8px rgba(120, 140, 160, .2); } .s84-card.s84-c-w p { color: #E4EAF0; }
.s84-c-p { color: #FF5F80; }

/* ---- contador */
.s84-info { color: #A4B6C7; font-size: 13.5px; margin: 0 2px 8px; }
.s84-info b { color: #EAF1F7; }
.s84-vacio { display: inline-flex; gap: 10px; align-items: center; color: #F3D79A; }

/* ---- tabla */
.s84-tw { border: 1px solid rgba(90, 135, 190, .28); border-radius: 13px; background: linear-gradient(180deg, #081828, #061321); overflow-x: auto; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.s84-t { width: 100%; border-collapse: collapse; min-width: 1180px; table-layout: fixed; }
.s84-t th { text-align: left; font-weight: 500; font-size: 14px; color: #EAF1F7; padding: 13px 10px 11px; border-bottom: 1px solid rgba(120, 160, 205, .18); white-space: nowrap; vertical-align: middle; }
.s84-t th small { display: block; color: #9DB0C2; font-size: 13px; font-weight: 400; margin-top: 2px; }
.s84-t th:first-child { text-align: center; width: 54px; }
.s84-t td { padding: 6px 9px; border-bottom: 1px solid rgba(120, 160, 205, .10); vertical-align: middle; font-size: 14.5px; line-height: 1.3; }
.s84-t td + td, .s84-t th + th { border-left: 1px solid rgba(120, 160, 205, .07); }
.s84-r { cursor: pointer; transition: background .12s; }
.s84-r:hover { background: rgba(60, 130, 210, .09); box-shadow: inset 3px 0 0 #34B5FF; }
.s84-r:focus-visible { outline: 2px solid #34B5FF; outline-offset: -2px; }
.s84-compacta .s84-t td { padding-top: 4px; padding-bottom: 4px; }
.s84-pos { white-space: nowrap; text-align: right; color: #DCE6EF; }
.s84-pos span { display: inline-block; min-width: 18px; text-align: right; }
.s84-star { background: none; border: 0; padding: 0 3px 0 0; vertical-align: -3px; }
.s84-star svg { fill: transparent; stroke: rgba(200, 215, 230, .0); stroke-width: 1.6; }
.s84-r:hover .s84-star svg, .s84-mc .s84-star svg { stroke: rgba(200, 215, 230, .55); }
.s84-star.on svg { fill: #F6C342; stroke: #F6C342; }
.s84-tok { white-space: nowrap; } .s84-tok > * { vertical-align: middle; } .s84-tok .avatar { margin-right: 10px; display: inline-flex; }
.s84-tok > div { display: inline-block; } .s84-tok b { font-size: 15px; font-weight: 700; letter-spacing: 0; }
.s84-conv { white-space: nowrap; font-size: 14px; } .s84-bolt { display: inline-flex; vertical-align: -6px; margin-right: 6px; } .s84-bolt svg { width: 22px; height: 22px; }
.s84-c { text-align: center; white-space: nowrap; }
.s84-v { max-width: 150px; }
.s84-d07, .s84-v6 { display: inline-block; margin-top: 4px; font-size: 12px; padding: 1px 8px; border-radius: 6px; background: #1A3F73; color: #CFE1FF; }
.s84-v6 { background: #2A3440; color: #C9D3DD; }
.s84-m { font-weight: 600; font-size: 15px; } .s84-m.up { color: #3BD98A; } .s84-m.down { color: #FF5A6E; } .s84-m.neu { color: #EAF1F7; }
.s84-w { color: #F2B640; font-size: 12.5px; margin-top: 1px; white-space: normal; }
.s84-pill { display: inline-block; border: 1px solid rgba(150, 175, 200, .40); border-radius: 999px; padding: 5px 14px; font-size: 13.5px; background: #0B1A2A; white-space: nowrap; }
.s84-tra { min-width: 118px; }
.s84-sp { display: inline-flex; flex-direction: column; align-items: center; } .s84-sp small { color: #F2B640; font-size: 11px; margin-top: -2px; }
.s84-nov { color: #8EA1B3; font-size: 13px; white-space: nowrap; }
.s84-dot { display: inline-block; width: 11px; height: 11px; border-radius: 50%; margin-right: 7px; vertical-align: -1px; }
.s84-dot.g { background: #2FDC7E; box-shadow: 0 0 6px rgba(47, 220, 126, .6); } .s84-dot.a { background: #F2C230; } .s84-dot.o { background: #F28A2C; } .s84-dot.r { background: #F0475F; } .s84-dot.n, .s84-dot.x { background: #9AA8B6; }
.s84-sub { margin-top: 2px; white-space: nowrap; }
.s84-pool { white-space: nowrap; }
.s84-badge { display: inline-block; border-radius: 999px; padding: 5px 13px; font-size: 13.5px; white-space: nowrap; border: 1.5px solid; }
.s84-b-g { border-color: #2CC277; background: rgba(32, 150, 90, .22); color: #D7FBE6; }
.s84-b-a { border-color: #F0C640; background: #E8BE38; color: #1F1700; font-weight: 600; }
.s84-b-o { border-color: #F3A23C; background: #EFA034; color: #221200; font-weight: 600; }
.s84-b-r { border-color: #F0475F; background: rgba(200, 40, 60, .25); color: #FFD9DF; }
.s84-b-n { border-color: rgba(160, 180, 200, .45); background: #0B1A2A; color: #E6EDF3; }
.s84-acc { width: 40px; text-align: center; } .s84-kebab { background: none; border: 0; padding: 4px; border-radius: 6px; } .s84-kebab:hover { background: rgba(120, 160, 205, .15); }
.s84-grp td, .s84-grp.m { background: rgba(30, 70, 120, .18); color: #CFE0F0; font-size: 13.5px; padding: 8px 14px; }
.s84-grp span { display: block; color: #9DB0C2; font-size: 12.5px; margin-top: 2px; }
.s84-menu { position: absolute; z-index: 80; width: 210px; background: #0C1D30; border: 1px solid rgba(120, 160, 205, .35); border-radius: 10px; padding: 6px; box-shadow: 0 12px 30px rgba(0, 0, 0, .5); display: grid; font-family: -apple-system, "SF Pro Text", Inter, sans-serif; }
.s84-menu button { background: none; border: 0; color: #EAF1F7; text-align: left; padding: 8px 10px; border-radius: 7px; font-size: 13.5px; cursor: pointer; }
.s84-menu button:hover { background: rgba(52, 181, 255, .15); } .s84-menu .s84-dim { padding: 4px 10px; font-size: 11.5px; word-break: break-all; }
.s84-pager { display: flex; gap: 6px; justify-content: center; align-items: center; margin: 12px 0 4px; flex-wrap: wrap; }
.s84-pager button { border: 1px solid rgba(120, 160, 205, .28); background: #0C1D30; border-radius: 8px; padding: 6px 11px; font-size: 13.5px; min-width: 36px; }
.s84-pager button.on { background: linear-gradient(180deg, #1E86FF, #0C66E6); border-color: transparent; } .s84-pager button:disabled { opacity: .4; cursor: default; } .s84-pager span { color: #8FA3B8; }

/* ---- leyenda inferior */
.s84-ley { display: grid; grid-template-columns: 246fr 224fr 348fr 293fr 474fr; gap: 14px; margin-top: 12px; }
.s84-l { border: 1.5px solid currentColor; border-radius: 11px; padding: 10px 16px; background: rgba(10, 25, 42, .9); }
.s84-l > b { display: block; font-size: 15px; font-weight: 700; margin-bottom: 4px; }
.s84-l p, .s84-l li { color: #DDE6EE; font-size: 13.5px; line-height: 1.4; margin: 0; }
.s84-l ul { list-style: none; margin: 0; padding: 0; } .s84-l ul.s84-b { list-style: disc; padding-left: 16px; } .s84-l li::marker { color: #DDE6EE; }
.s84-l.s84-c-b { border-color: #2A8BEA; box-shadow: 0 0 8px rgba(42, 139, 234, .3); } .s84-l.s84-c-g { border-color: #35C878; } .s84-l.s84-c-v { border-color: #7E5CF2; background: rgba(40, 28, 90, .35); }
.s84-l.s84-c-o { border-color: #E07B22; background: rgba(70, 34, 8, .35); } .s84-l.s84-c-p { border-color: #E0506E; background: rgba(70, 14, 30, .35); }
.s84-lt { display: flex; gap: 12px; align-items: center; }

/* ---- móvil: tarjetas por episodio; la tabla de 14 columnas no se fuerza a 390 px */
.s84-movil { display: none; }
@media (max-width: 1023px) {
  .s84 { padding: 10px 12px 90px; }
  .s84-hdr { flex-wrap: wrap; gap: 10px 12px; }
  .s84-brand { padding-right: 12px; } .s84-brand b { font-size: 19px; }
  .s84-univ { margin-left: 0; order: 3; } .s84-univ button { padding: 0 14px; font-size: 14px; }
  .s84-search { order: 4; width: auto; flex: 1 1 220px; } .s84-sq { order: 5; }
  .s84-orden { grid-template-columns: 1fr; padding: 10px; } .s84-olab { font-size: 14px; }
  .s84-orden .s84-ogrid { display: flex; overflow-x: auto; gap: 10px; scroll-snap-type: x mandatory; padding-bottom: 4px; }
  .s84-ob { flex: 0 0 auto; scroll-snap-align: start; min-height: 52px; }
  .s84-cards { padding: 0; margin-bottom: 26px; } .s84-cards .s84-ogrid { display: block; }
  .s84-card { display: none; margin-top: 10px; min-height: 0; } .s84-card.on { display: flex; } .s84-arr { display: none; } .s84-sincards .s84-card.on { display: none; }
  .s84-ctog { bottom: -20px; }
  .s84-tw { display: none; } .s84-movil { display: grid; gap: 10px; }
  .s84-mc { border: 1px solid rgba(90, 135, 190, .28); border-radius: 13px; background: #081828; padding: 12px; }
  .s84-mh { display: flex; align-items: center; gap: 10px; } .s84-mt { flex: 1; min-width: 0; display: grid; } .s84-mt b { font-size: 16px; }
  .s84-mg { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; margin-top: 10px; font-size: 14px; }
  .s84-mg small { display: block; color: #8FA3B8; font-size: 12px; margin-bottom: 2px; }
  .s84-mg .s84-w, .s84-mg .s84-v, .s84-mg .s84-sub, .s84-mg .s84-conv, .s84-mg .s84-pool { white-space: normal; }
  .s84-mtr { margin-top: 8px; }
  .s84-ley { grid-template-columns: 1fr; }
}

.s84-t td:nth-child(8), .s84-t td.s84-c { white-space: nowrap; }
.s84-nw { white-space: nowrap; }
/* anchos de columna medidos en la referencia (proporción sobre 1640 px) */
.s84-h-pos { width: 3.58%; } .s84-h-tok { width: 10.88%; } .s84-h-t0 { width: 6.80%; } .s84-h-conv { width: 7.91%; } .s84-h-wal { width: 5.69%; } .s84-h-val { width: 9.15%; }
.s84-h-max { width: 9.77%; } .s84-h-tmx { width: 6.30%; } .s84-h-ven { width: 5.56%; } .s84-h-tra { width: 7.42%; } .s84-h-cal { width: 8.28%; } .s84-h-pool { width: 7.91%; } .s84-h-est { width: 8.16%; } .s84-h-acc { width: 44px; }
.s84-t td { overflow: hidden; }
.s84-utc { color: #8FA3B8; font-size: 11.5px; }
.s84-mas { color: #C9D6E2; border: 1px solid rgba(201, 214, 226, .4); border-radius: 6px; padding: 0 4px; font-size: 11px; }
.s84-v .s84-d07 { margin-top: 0; margin-left: 4px; vertical-align: 1px; }
.s84-t td.s84-pos { overflow: visible; padding-left: 4px; padding-right: 8px; }
.s84-t td.s84-pool { font-size: 13.5px; } .s84-t td.s84-pool .s84-dim { font-size: 12.5px; }
.s84-badge { font-size: 13px; padding: 4px 11px; }
.s84-t td.s84-acc { padding: 4px 2px; }

.s84-tok > div { max-width: calc(100% - 50px); } .s84-tok b { display: block; overflow: hidden; text-overflow: ellipsis; }
.s84-nov { white-space: normal !important; display: inline-block; max-width: 100px; line-height: 1.2; }

.s84-t td:nth-child(3) { white-space: nowrap; }

.s84-t td { line-height: 1.24; } .s84-t td .s84-dim, .s84-t td .s84-w { line-height: 1.22; font-size: 12.5px; } .s84-t td .s84-d07 { line-height: 1.3; }

/* ventanas de escritorio más estrechas que la referencia (1672): misma composición, controles algo más compactos */
@media (min-width: 1024px) and (max-width: 1599px) {
  .s84-orden { grid-template-columns: 86px minmax(0, 1fr); gap: 8px; padding: 7px 10px 7px 12px; } .s84-olab { font-size: 14px; }
  .s84-orden .s84-ogrid { gap: 9px; } .s84-ob { gap: 7px; padding: 6px 8px; } .s84-ob.on { padding: 5px 7px; } .s84-oi svg { width: 21px; height: 21px; }
  .s84-ob b { font-size: 13.4px; } .s84-ob small { font-size: 11.5px; }
  .s84-cards { padding-left: 30px; } .s84-cards .s84-ogrid { gap: 14px; } .s84-card { font-size: 13px; padding: 9px 12px; }
  .s84-t td { font-size: 13.6px; padding: 6px 7px; } .s84-t th { font-size: 13px; padding: 11px 7px 9px; } .s84-t th small { font-size: 12px; }
  .s84-tok .avatar { width: 32px !important; height: 32px !important; margin-right: 7px; } .s84-tok b { font-size: 14px; } .s84-m { font-size: 14px; }
  .s84-badge { font-size: 12.5px; padding: 4px 9px; } .s84-t td.s84-pool { font-size: 12.8px; }
}

@media (min-width: 1024px) and (max-width: 1599px) {
  .s84-t td, .s84-t td.s84-conv, .s84-t td.s84-pool, .s84-t td:nth-child(3), .s84-t td:nth-child(8) { white-space: normal; }
  .s84-pp { display: none; } .s84-sp, .s84-sp svg { width: 100%; max-width: 98px; }
  .s84-badge { font-size: 12px; padding: 3px 8px; white-space: nowrap; }
  .s84-orden .s84-ogrid { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1.1fr) minmax(0, 1.12fr) minmax(0, 1.42fr) minmax(0, 1.18fr) minmax(0, 1.3fr) minmax(0, 1.05fr); }
}
@media (min-width: 1024px) and (max-width: 1359px) { .s84-ob small { display: none; } .s84-ob { min-height: 46px; } .s84-bolt { display: none; } }
@media (min-width: 1024px) and (max-width: 1599px) { .s84-t td .s84-sub, .s84-t td .s84-nw { white-space: normal; } }
@media (min-width: 1024px) and (max-width: 1359px) { .s84-badge { white-space: normal; border-radius: 10px; font-size: 11.5px; line-height: 1.15; text-align: center; } }
@media (min-width: 1024px) and (max-width: 1199px) {
  .s84-orden { grid-template-columns: 1fr; } .s84-orden .s84-ogrid { display: flex; overflow-x: auto; } .s84-ob { flex: 0 0 auto; }
  .s84-ob b, .s84-ob small { overflow: visible; }
  .s84-cards .s84-ogrid { display: block; } .s84-card { display: none; margin-top: 10px; min-height: 0; } .s84-card.on { display: flex; } .s84-arr { display: none; }
}
@media (min-width: 1200px) and (max-width: 1359px) { .s84-ob b { font-size: 12.6px; } .s84-oi svg { width: 19px; height: 19px; } .s84-ob { padding: 6px 7px; gap: 6px; } }
.s84-olab { white-space: nowrap; }
.s84-tok .s84-dim { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 1024px) and (max-width: 1599px) { .s84-t td:nth-child(3) { white-space: nowrap; font-size: 13px; } .s84-utc { font-size: 10.5px; } .s84-olab { font-size: 13px; } }
@media (min-width: 1024px) and (max-width: 1599px) { .s84-t td.s84-conv { white-space: nowrap; font-size: 12.8px; } .s84-bolt { margin-right: 3px; } .s84-bolt svg { width: 15px; height: 15px; } }
.s84-aprox { color: #9DB0C2; } .s84-ds { font-size: 9.5px; color: #9DB0C2; margin-left: 2px; } .s84-lnota { color: #A9BAC9 !important; font-size: 12px !important; margin-top: 3px !important; }