/* ---------- MERCADO · café verde, suscripciones y vistas de la guía (Scoffee Global 4) ----------
   Las reglas son las FINALES de la cascada de la guía (volcadas del navegador), con el prefijo
   `.mk5` delante para no tocar nada del resto de la página. Se quitaron las del mapa de Origen que
   la guía reutiliza con los mismos nombres (`.om-g`, `.om-st`): en la guía chocan con el filtro. */
.mk5 .seg{ display: inline-flex; padding: 4px; border-radius: var(--pill); background: rgb(255, 255, 255); border: 1px solid var(--line); gap: 2px; }
.mk5 .seg button{ border-radius: var(--pill); min-height: 34px; padding: 0px 13px; font-weight: 600; font-size: 13px; color: var(--ink-3); display: inline-flex; align-items: center; gap: 6px; }
.mk5 .seg button svg{ width: 15px; height: 15px; }
.mk5 .seg button[aria-pressed="true"]{ background: var(--ink); color: rgb(255, 255, 255); }
.mk5 .chipsel{ display: flex; gap: 6px; flex-wrap: wrap; margin: -4px 0px 14px; }
.mk5 .chipsel button{ display: inline-flex; align-items: center; gap: 6px; border-radius: var(--pill); background: var(--lima-wash); color: var(--lima-ink); font-size: 12px; font-weight: 700; padding: 5px 10px; }
.mk5 .chipsel button svg{ width: 12px; height: 12px; }
.mk5 .note2{ font-size: 12px; color: var(--ink-3); line-height: 1.5; }
.mk5 .empty2{ padding: 40px 20px; text-align: center; border: 1px dashed var(--line-h); border-radius: 20px; color: var(--ink-2); background: rgb(255, 255, 255); display: grid; gap: 10px; justify-items: center; }
.mk5 .empty2 > svg{ width: 28px; height: 28px; color: var(--ink-3); }
.mk5 .seg button{ white-space: nowrap; flex: 0 0 auto; }
@media (max-width: 640px){.mk5 .seg{ max-width: 100%; overflow-x: auto; scrollbar-width: none; }}
@media (max-width: 640px){.mk5 .seg::-webkit-scrollbar{ display: none; }}
.mk5 .pf-empty{ display: grid; justify-items: center; gap: 8px; text-align: center; padding: 44px 20px; border: 1px dashed var(--line-h); border-radius: 20px; background: rgb(255, 255, 255); color: var(--ink-2); }
.mk5 .pf-empty > svg{ width: 30px; height: 30px; color: var(--ink-3); }
.mk5 .pf-empty b{ font-family: var(--f-head); font-weight: 600; font-size: 17px; color: var(--ink); }
.mk5 .pf-empty p{ margin: 0px; max-width: 52ch; font-size: 14px; }
.mk5 .tbl .note2{ font-size: 12px; }
.mk5 .cu-h .note2{ margin: 0px; }
.mk5 .og-cgrid{ display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: clamp(14px, 1.6vw, 22px); }
@media (max-width: 1180px){.mk5 .og-cgrid,.mk5 .og-fgrid{ grid-template-columns: repeat(3, minmax(0px, 1fr)); }}
@media (max-width: 760px){.mk5 .og-cgrid,.mk5 .og-fgrid{ grid-template-columns: repeat(2, minmax(0px, 1fr)); }}
@media (max-width: 640px){.mk5 .og-fgrid,.mk5 .og-fgrid.og-feat,.mk5 .og-cgrid{ grid-template-columns: 1fr; }}
@media (max-width: 640px){.mk5 .og-cgrid.og-two{ grid-template-columns: repeat(2, minmax(0px, 1fr)); }}
.mk5 .og-prod-b > p:not(.og-prod-r):not(.note2){ font-size: 15px; line-height: 1.7; color: var(--ink-2); margin: 0px 0px 16px; }
.mk5 .og-cgrid.og-c3{ grid-template-columns: repeat(3, minmax(0px, 1fr)); }
.mk5 .og-mtabs{ display: flex; gap: 4px; padding: 5px; border-radius: 999px; background: rgb(255, 255, 255); border: 1px solid var(--line-2); box-shadow: var(--og-sh2); width: max-content; max-width: 100%; overflow-x: auto; scrollbar-width: none; margin: 4px 0px 16px; }
.mk5 .og-mtabs::-webkit-scrollbar{ display: none; }
.mk5 .og-mtabs button{ flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0px 18px; border-radius: 999px; border: 0px; background: transparent; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14.5px; font-weight: 700; color: var(--ink-3); cursor: pointer; white-space: nowrap; }
.mk5 .og-mtabs button svg{ width: 17px; height: 17px; }
.mk5 .og-mtabs button small{ font-family: var(--f-mono); font-size: 11.5px; font-weight: 600; color: var(--ink-3); background: var(--cream); border-radius: 999px; padding: 2px 7px; }
.mk5 .og-mtabs button[aria-selected="true"]{ background: var(--ink); color: rgb(255, 255, 255); }
.mk5 .og-mtabs button[aria-selected="true"] small{ background: rgba(255, 255, 255, 0.16); color: rgb(255, 255, 255); }
.mk5 .og-mtabs .live-dot{ width: 8px; height: 8px; }
.mk5 .og-mhead{ display: flex; align-items: center; justify-content: space-between; gap: 10px 18px; flex-wrap: wrap; margin: 4px 0px 12px; }
.mk5 .og-mhead .og-mtabs{ margin: 0px; }
.mk5 .og-mtools{ display: flex; align-items: center; gap: 8px; }
.mk5 .og-mtable td.r,.mk5 .og-mtable td.mono{ white-space: nowrap; }
.mk5 .og-fbtn{ display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0px 14px; border-radius: 999px; border: 1px solid var(--line); background: rgb(255, 255, 255); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13.5px; font-weight: 700; color: var(--ink); cursor: pointer; }
.mk5 .og-fbtn svg{ width: 16px; height: 16px; }
.mk5 .og-mview button{ min-height: 30px; padding: 0px 10px; }
.mk5 .chipsel.og-act{ margin: 2px 0px 12px; }
.mk5 .chipsel .og-clr{ background: transparent; color: var(--ink-2); text-decoration: underline; }
.mk5 .og-mtable-w{ overflow-x: auto; border: 1px solid var(--line-2); border-radius: 20px; background: rgb(255, 255, 255); box-shadow: var(--og-sh2); }
.mk5 .og-mtable{ width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 1100px; }
.mk5 .og-mtable th{ background: var(--cream); text-align: left; font-size: 10.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-3); padding: 12px 14px; border-bottom: 1px solid var(--line-2); white-space: nowrap; }
.mk5 .og-mtable td{ padding: 12px 14px; border-bottom: 1px solid var(--line-2); vertical-align: middle; color: var(--ink-2); }
.mk5 .og-mtable tr:last-child td{ border-bottom: 0px; }
.mk5 .og-mtable .r{ text-align: right; }
.mk5 .og-mtable td small{ display: block; font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.mk5 .og-mtable td .og-tr9 + small{ display: inline; margin: 0px; }
.mk5 .og-tl1 b{ display: block; font-weight: 700; color: var(--ink); }
.mk5 .og-tf{ display: flex; align-items: center; gap: 10px; min-width: 190px; }
.mk5 .og-tfm{ position: relative; width: 40px; height: 40px; border-radius: 10px; overflow: hidden; flex: 0 0 auto; background: rgb(35, 48, 18); }
.mk5 .og-tfm img,.mk5 .og-tfm canvas{ position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; }
.mk5 .og-tf b{ display: block; font-weight: 700; font-size: 13.5px; color: var(--ink); }
.mk5 .og-tsc{ font-family: var(--f-mono); font-size: 14px; color: var(--ink); }
.mk5 .og-tsc.og-gold{ color: rgb(107, 79, 18); background: var(--gold-wash); padding: 3px 7px; border-radius: 8px; }
.mk5 .og-tpre{ font-size: 11.5px; color: var(--ink-3); }
.mk5 .og-tp{ font-size: 14px; color: var(--ink); }
.mk5 .og-cgrid.og-c3l{ grid-template-columns: repeat(4, minmax(0px, 1fr)); }
@media (max-width: 1180px){.mk5 .og-cgrid.og-c3l{ grid-template-columns: repeat(3, minmax(0px, 1fr)); }}
@media (max-width: 980px){.mk5 .og-cgrid.og-c3l{ grid-template-columns: repeat(2, minmax(0px, 1fr)); }}
@media (max-width: 760px){.mk5 .og-mtools{ width: 100%; }}
@media (max-width: 760px){.mk5 .og-mtools .og-sel{ flex: 1 1 0%; min-width: 0px; }}
@media (max-width: 640px){.mk5 .og-mtabs{ width: 100%; }}
@media (max-width: 640px){.mk5 .og-mtabs button{ padding: 0px 14px; font-size: 13.5px; height: 40px; }}
@media (max-width: 640px){.mk5 .og-cgrid.og-c3l{ grid-template-columns: 1fr; }}
@media (max-width: 640px){.mk5 .og-cgrid.og-c3l{ grid-auto-flow: column; grid-auto-columns: 86%; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 6px; }}
@media (max-width: 640px){.mk5 .og-cgrid.og-c3l > *{ scroll-snap-align: start; }}
.mk5 .note2 > svg,.mk5 .og-count > svg{ width: 15px; height: 15px; vertical-align: -3px; display: inline-block; }
.mk5 .og-rec .note2{ color: rgba(255, 255, 255, 0.62); margin: 0px; }
.mk5 .ox-mrows .note2{ margin: 0px; padding: 12px; }
.mk5 .om-deliv{ display: flex; align-items: center; gap: 6px; margin: 4px 0px 0px; font-size: 13px; color: var(--ink-2); }
.mk5 .om-deliv svg{ width: 16px; height: 16px; color: var(--lima-d); }
.mk5 .oh-search{ position: relative; display: flex; align-items: center; gap: 6px; height: 56px; padding: 0px 6px 0px 18px; border-radius: 999px; background: rgb(255, 255, 255); border: 1px solid var(--line); box-shadow: rgba(38, 46, 16, 0.45) 0px 16px 36px -26px, rgba(38, 46, 16, 0.04) 0px 1px 0px; transition: border-color 0.2s, box-shadow 0.2s; }
.mk5 .oh-search:focus-within{ border-color: var(--ink); box-shadow: rgba(38, 46, 16, 0.5) 0px 18px 44px -24px, rgba(153, 195, 65, 0.18) 0px 0px 0px 4px; }
.mk5 .oh-si{ display: grid; place-items: center; color: var(--ink-2); }
.mk5 .oh-si svg{ width: 21px; height: 21px; }
.mk5 .oh-search input{ flex: 1 1 auto; min-width: 0px; height: 100%; border: 0px; background: none; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16.5px; font-weight: 500; color: var(--ink); outline: 0px; }
.mk5 .oh-search input::placeholder{ color: var(--ink-3); font-weight: 500; }
.mk5 .oh-search input::-webkit-search-cancel-button{ display: none; }
.mk5 .oh-clear{ display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; border: 0px; background: var(--cream); color: var(--ink-2); cursor: pointer; flex: 0 0 auto; }
.mk5 .oh-clear svg{ width: 15px; height: 15px; }
.mk5 .oh-go{ height: 44px; padding: 0px 20px; flex: 0 0 auto; }
.mk5 .oh-go svg{ width: 17px; height: 17px; }
.mk5 .oh-vab .oh-tagdemo{ height: 22px; }
@media (max-width: 760px){.mk5 .oh-vab > span:not(.oh-tagdemo){ display: none; }}
.mk5 .oh-rai{ display: flex; align-items: center; gap: 8px; justify-self: start; height: 36px; padding: 0px 14px; border-radius: 999px; border: 1px solid var(--line); background: rgb(255, 255, 255); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; font-weight: 700; color: var(--ink); cursor: pointer; max-width: 100%; }
.mk5 .oh-rai > svg,.mk5 .oh-rai > span > svg{ width: 15px; height: 15px; color: var(--lima-d); flex: 0 0 auto; }
.mk5 .oh-rai span{ min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk5 .oh-raif{ flex: 0 1 460px; height: 42px; padding: 0px 4px 0px 14px; cursor: default; }
.mk5 .oh-raif > span{ display: grid; place-items: center; }
.mk5 .oh-raif input{ flex: 1 1 auto; min-width: 0px; height: 100%; border: 0px; background: none; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; font-weight: 600; color: var(--ink); outline: 0px; }
.mk5 .oh-raif:focus-within{ border-color: var(--ink); }
.mk5 .oh-raif .btn{ height: 34px; padding: 0px 14px; }
@media (max-width: 760px){.mk5 .oh-raif,.mk5 .oh-rbh .oh-rai{ flex: 1 1 100%; order: 3; }}
.mk5 .oh-tagdemo{ display: inline-flex; align-items: center; height: 20px; padding: 0px 7px; border-radius: 6px; background: var(--noche); color: var(--og-gold-l); font-family: var(--f-mono); font-size: 10.5px; font-weight: 700; letter-spacing: 0.1em; vertical-align: middle; }
.mk5 .oh-moreb{ display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; margin-top: 14px; }
.mk5 .oh-shown{ font-size: 13px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.mk5 .oh-shown b{ color: var(--ink); }
.mk5 .oh-moreb .btn svg{ width: 16px; height: 16px; }
.mk5 .og-mtable th button{ display: inline-flex; align-items: center; gap: 4px; border: 0px; background: none; padding: 0px; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; cursor: pointer; }
.mk5 .og-mtable th button svg{ width: 12px; height: 12px; opacity: 0.45; }
.mk5 .og-mtable th[aria-sort="descending"] button,.mk5 .og-mtable th[aria-sort="ascending"] button{ color: var(--ink); }
.mk5 .og-mtable th[aria-sort="descending"] button svg,.mk5 .og-mtable th[aria-sort="ascending"] button svg{ opacity: 1; }
.mk5 .og-mtable .og-cd{ color: var(--gold-ink); }
.mk5 .oh-ra{ display: inline-flex; gap: 6px; }
.mk5 a.oh-trl{ display: inline-flex; flex-direction: column; gap: 4px; color: var(--ink-3); }
.mk5 a.oh-trl small{ font-size: 11px; }
.mk5 .oh-ra .btn svg{ width: 14px; height: 14px; }
@media (max-width: 640px){.mk5 .oh-search{ height: 50px; padding: 0px 4px 0px 14px; gap: 4px; }}
@media (max-width: 640px){.mk5 .oh-search input{ font-size: 16px; }}
@media (max-width: 640px){.mk5 .oh-go{ height: 40px; padding: 0px 13px; }}
@media (max-width: 640px){.mk5 .oh-go span{ display: none; }}
.mk5 .og-fmain h3.h3s .oh-tagdemo{ margin-left: 8px; }
.mk5 .og-mtabs a{ flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0px 18px; border-radius: 999px; font-size: 14.5px; font-weight: 700; color: var(--ink-3); white-space: nowrap; }
.mk5 .og-mtabs a svg{ width: 17px; height: 17px; }
.mk5 .og-mtabs a small{ font-family: var(--f-mono); font-size: 11.5px; font-weight: 600; color: var(--ink-3); background: var(--cream); border-radius: 999px; padding: 2px 7px; }
.mk5 .og-mtabs a[aria-selected="true"]{ background: var(--ink); color: rgb(255, 255, 255); }
.mk5 .og-mtabs a[aria-selected="true"] small{ background: rgba(255, 255, 255, 0.16); color: rgb(255, 255, 255); }
.mk5 .om-lay{ display: grid; grid-template-columns: 260px minmax(0px, 1fr); gap: 24px; align-items: start; }
.mk5 .om-side{ position: sticky; top: calc(env(safe-area-inset-top,0px) + var(--barra, 150px) + 16px); max-height: calc(100vh - var(--barra, 150px) - 32px); overflow: auto; scrollbar-width: thin; padding: 14px; border-radius: 20px; background: rgb(255, 255, 255); border: 1px solid var(--line-2); box-shadow: var(--og-sh2); }
.mk5 .om-sh{ display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 2px 4px 10px; border-bottom: 1px solid var(--line-2); }
.mk5 .om-sh b{ display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; color: var(--ink); }
.mk5 .om-sh b svg{ width: 17px; height: 17px; color: var(--lima-d); }
.mk5 .om-sh .lnk{ font-size: 12.5px; }
.mk5 .om-g{ border-bottom: 1px solid var(--line-2); }
.mk5 .om-g:last-child{ border-bottom: 0px; }
.mk5 .om-g summary{ display: flex; align-items: center; gap: 8px; padding: 12px 4px; font-size: 13px; font-weight: 800; letter-spacing: 0.02em; color: var(--ink); cursor: pointer; list-style: none; }
.mk5 .om-g summary::-webkit-details-marker{ display: none; }
.mk5 .om-g summary svg{ width: 15px; height: 15px; margin-left: auto; color: var(--ink-3); transition: transform 0.2s; }
.mk5 .om-g[open] summary svg{ transform: rotate(180deg); }
.mk5 .om-g summary em{ font-style: normal; font-size: 10.5px; font-weight: 800; background: var(--lima); color: rgb(30, 42, 11); border-radius: 999px; padding: 1px 7px; }
.mk5 .om-opts{ display: grid; gap: 2px; padding: 0px 0px 10px; }
.mk5 .om-opt{ display: grid; grid-template-columns: 18px minmax(0px, 1fr) auto; gap: 9px; align-items: center; width: 100%; padding: 7px 6px; border: 0px; border-radius: 10px; background: none; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13.5px; color: var(--ink-2); text-align: left; cursor: pointer; }
.mk5 .om-opt i{ width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--line-h); background: rgb(255, 255, 255); position: relative; }
.mk5 .om-opt[aria-pressed="true"]{ color: var(--ink); font-weight: 700; }
.mk5 .om-opt[aria-pressed="true"] i{ border-color: var(--ink); background: var(--ink); box-shadow: rgb(255, 255, 255) 0px 0px 0px 3.5px inset; }
.mk5 .om-opt small{ font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.mk5 .om-main{ min-width: 0px; }
.mk5 .om-main > .og-count{ margin-top: 0px; }
.mk5 .om-grid{ grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: clamp(12px, 1.2vw, 18px); }
.mk5 .om-table{ min-width: 1200px; }
.mk5 .om-pager{ display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; margin-top: 16px; }
.mk5 .om-pager button{ min-width: 38px; height: 38px; padding: 0px 10px; border-radius: 12px; border: 1px solid var(--line); background: rgb(255, 255, 255); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13.5px; font-weight: 700; color: var(--ink-2); cursor: pointer; display: inline-grid; place-items: center; }
.mk5 .om-pager button svg{ width: 16px; height: 16px; }
.mk5 .om-pager button[aria-current="page"]{ background: var(--ink); border-color: var(--ink); color: rgb(255, 255, 255); }
.mk5 .om-pager button:disabled{ opacity: 0.4; cursor: default; }
.mk5 .om-pager span{ margin-left: 8px; font-size: 13px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.mk5 .om-fbtn{ display: none; }
.mk5 .om-sheet{ position: static; max-height: none; box-shadow: none; border: 0px; padding: 0px; }
@media (max-width: 1320px){.mk5 .om-grid{ grid-template-columns: repeat(3, minmax(0px, 1fr)); }}
@media (max-width: 1100px){.mk5 .om-lay{ grid-template-columns: minmax(0px, 1fr); }}
@media (max-width: 1100px){.mk5 .om-lay > .om-side{ display: none; }}
@media (max-width: 1100px){.mk5 .om-fbtn{ display: inline-flex; }}
@media (max-width: 1100px){.mk5 .om-grid{ grid-template-columns: repeat(3, minmax(0px, 1fr)); }}
@media (max-width: 860px){.mk5 .om-grid{ grid-template-columns: repeat(2, minmax(0px, 1fr)); }}
@media (max-width: 560px){.mk5 .om-grid{ grid-template-columns: minmax(0px, 1fr); }}
.mk5 .og-ntable .og-mtable-w{ box-shadow: none; border-radius: 14px; }
.mk5 .oi-cg .seg{ width: max-content; max-width: 100%; }
.mk5 .oi-cg .seg svg{ width: 15px; height: 15px; }
.mk5 .vz .note2{ margin: 0px; }
.mk5 .ai-gate .oh-ra{ flex-wrap: wrap; }
.mk5 .ai-cmp .oh-ra{ flex-wrap: wrap; }
.mk5 .om-page{ padding-top: clamp(16px, 2vw, 24px); }
.mk5 .om-top{ display: grid; gap: 10px; margin-bottom: 14px; }
.mk5 .om-tt{ display: flex; align-items: baseline; gap: 8px 16px; flex-wrap: wrap; }
.mk5 .om-tt h1{ margin: 0px; font-family: var(--f-head); font-size: clamp(1.5rem, 2.2vw, 1.9rem); font-weight: 700; letter-spacing: -0.04em; line-height: 1.1; color: var(--ink); }
.mk5 .om-tt p{ margin: 0px; font-size: 13.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.mk5 .om-tt p b{ color: var(--ink); }
.mk5 .oh-search.om-search{ height: 54px; }
.mk5 .om-und{ flex: 0 0 auto; }
.mk5 .om-try{ display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mk5 .om-try > span{ font-size: 11px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); margin-right: 2px; }
.mk5 .om-try button{ height: 30px; padding: 0px 12px; border-radius: 999px; border: 1px solid var(--line); background: rgb(255, 255, 255); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.mk5 .om-bar{ display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin: 0px 0px 14px; }
.mk5 .om-bar .chipsel.og-act{ margin: 0px; }
.mk5 .om-bar .ai-strip{ margin-left: auto; }
.mk5 .og-mview button{ display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; }
.mk5 .og-mview button svg{ width: 15px; height: 15px; }
.mk5 .om-st{ display: block; font-family: var(--f-body); font-size: 11px; font-weight: 600; color: var(--ink-3); white-space: nowrap; }
.mk5 .om-st-ok{ color: var(--lima-ink); }
.mk5 .om-st-neg{ color: rgb(107, 79, 18); }
.mk5 .om-table{ min-width: 1180px; }
.mk5 .om-table th,.mk5 .om-table td{ padding: 10px; }
.mk5 .om-table th:first-child,.mk5 .om-table td:first-child{ padding-left: 16px; }
.mk5 .om-table th{ white-space: normal; line-height: 1.3; vertical-align: bottom; }
.mk5 .om-table td:first-child{ min-width: 150px; }
.mk5 .om-table .oh-ra .btn.sm{ padding: 8px 12px; font-size: 13px; }
.mk5 .om-table td small{ display: block; font-size: 11.5px; color: var(--ink-3); }
.mk5 .om-table .og-tl1 b{ font-size: 13.5px; }
.mk5 .om-table .og-tf{ min-width: 172px; }
.mk5 .om-table .og-tf b,.mk5 .om-table .og-tf small{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 150px; }
.mk5 .om-table .om-st{ white-space: normal; }
.mk5 .om-table .og-tf b{ font-size: 13px; }
.mk5 .om-table .og-tfm{ width: 34px; height: 34px; }
.mk5 .om-note{ margin-top: 14px; }
.mk5 .om-vol{ display: grid; grid-template-columns: 44px minmax(0px, 1fr) auto; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 20px; background: rgb(255, 255, 255); border: 1px solid var(--line-2); box-shadow: var(--og-sh2); }
.mk5 .om-vol > span{ display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--lima-wash); color: var(--lima-ink); }
.mk5 .om-vol > span svg{ width: 22px; height: 22px; }
.mk5 .om-vol b{ display: block; font-size: 15px; font-weight: 700; color: var(--ink); }
.mk5 .om-vol small{ display: block; font-size: 13px; color: var(--ink-3); line-height: 1.45; max-width: 80ch; }
.mk5 .om-vol .og-cta{ margin: 0px; }
@media (max-width: 1100px){.mk5 .om-bar .ai-strip{ margin-left: 0px; }}
@media (max-width: 760px){.mk5 .om-vol{ grid-template-columns: 44px minmax(0px, 1fr); }}
@media (max-width: 760px){.mk5 .om-vol .og-cta{ grid-column: 1 / -1; }}
@media (max-width: 760px){.mk5 .og-mview button span{ display: none; }}
@media (max-width: 640px){.mk5 .oh-search.om-search{ height: 50px; }}
@media (max-width: 640px){.mk5 .om-search .oh-go span{ display: none; }}
@media (max-width: 640px){.mk5 .om-search .oh-go{ padding: 0px 13px; }}
@media (max-width: 640px){.mk5 .om-try{ flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * clamp(16px, 2.6vw, 48px)); padding-inline: clamp(16px, 2.6vw, 48px); }}
@media (max-width: 640px){.mk5 .om-try::-webkit-scrollbar{ display: none; }}
@media (max-width: 640px){.mk5 .om-try button{ flex: 0 0 auto; }}
.mk5 .om-lay.om-lay-t{ grid-template-columns: minmax(0px, 1fr); }
.mk5 .om-lay.om-lay-t .om-side{ display: none; }
.mk5 .om-page.om-t .om-fbtn{ display: inline-flex; }
.mk5 .np-bar .seg button{ display: inline-flex; align-items: center; gap: 6px; }
.mk5 .np-bar .seg button svg{ width: 15px; height: 15px; }
.mk5 .oi-cg .seg.oi-pseg{ display: flex; flex-wrap: wrap; width: auto; max-width: 100%; border-radius: 18px; }
.mk5 .pf-aibar .oh-raif{ flex: 1 1 380px; max-width: 560px; }
.mk5 .sx-f,.mk5 .sx-l{ position: relative; min-width: 0px; isolation: isolate; --sx-ease: cubic-bezier(.2,.7,.2,1); }
.mk5 .sx-hit{ color: inherit; text-decoration: none; }
.mk5 .sx-hit::after{ content: ""; position: absolute; inset: 0px; z-index: 3; border-radius: inherit; }
.mk5 .sx-hit:focus-visible{ outline: none; }
.mk5 .sx-f:has(.sx-hit:focus-visible) .sx-fm,.mk5 .sx-l:has(.sx-hit:focus-visible){ outline: 3px solid var(--lima); outline-offset: 3px; }
.mk5 .sx-tags{ position: absolute; left: 12px; top: 12px; right: 58px; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px; pointer-events: none; }
.mk5 .sx-tag{ display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0px 10px; border-radius: 999px; background: rgba(17, 21, 9, 0.44); color: rgb(255, 255, 255); border: 1px solid rgba(255, 255, 255, 0.16); backdrop-filter: blur(10px) saturate(1.4); font-size: 11.5px; font-weight: 600; letter-spacing: 0.01em; white-space: nowrap; line-height: 1; }
.mk5 .sx-tag svg{ width: 13px; height: 13px; flex: 0 0 auto; }
.mk5 .sx-tag .live-dot{ width: 7px; height: 7px; }
.mk5 .sx-t-real{ background: rgba(222, 255, 154, 0.95); color: rgb(38, 51, 12); border-color: rgba(38, 51, 12, 0.06); }
.mk5 .sx-t-demo{ background: rgba(255, 255, 255, 0.18); color: rgba(255, 255, 255, 0.92); font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; padding: 0px 8px; }
.mk5 .sx-l .sx-tags > .sx-tag:first-child{ font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.mk5 .sx-peek{ position: absolute; left: 10px; right: 10px; bottom: 10px; z-index: 2; display: grid; gap: 6px; padding: 12px 14px 13px; border-radius: 14px; background: rgba(16, 20, 8, 0.52); color: rgb(255, 255, 255); border: 1px solid rgba(255, 255, 255, 0.14); backdrop-filter: blur(16px) saturate(1.35); opacity: 0; transform: translateY(16px); transition: opacity .35s ease,transform .5s var(--sx-ease); pointer-events: none; }
.mk5 .sx-pk-h{ display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 10px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255, 255, 255, 0.72); }
.mk5 .sx-pk-h svg{ width: 18px; height: 18px; color: rgb(255, 255, 255); transition: transform .5s var(--sx-ease); }
.mk5 .sx-pk-r{ display: flex; align-items: baseline; justify-content: space-between; gap: 12px; min-width: 0px; font-size: 13.5px; line-height: 1.3; }
.mk5 .sx-pk-r b{ font-weight: 600; min-width: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk5 .sx-pk-r em{ font-style: normal; font-size: 12.5px; font-weight: 600; color: rgb(233, 207, 138); white-space: nowrap; flex: 0 0 auto; }
.mk5 .sx-pk-r em.sx-pk-p{ font-size: 12px; font-weight: 500; color: rgba(255, 255, 255, 0.7); }
.mk5 .sx-pk-n{ font-family: var(--f-head); font-size: 14.5px; font-weight: 600; line-height: 1.3; letter-spacing: -0.01em; }
.mk5 .sx-pk-f{ font-size: 12px; color: rgba(255, 255, 255, 0.74); line-height: 1.35; }
.mk5 .sx-f{ display: flex; flex-direction: column; gap: 12px; }
.mk5 .sx-fm{ position: relative; aspect-ratio: 5 / 4; border-radius: 22px; overflow: hidden; background: rgb(220, 225, 207); transform: translateZ(0px); }
.mk5 .sx-fm > img,.mk5 .sx-fm > canvas{ position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--sx-ease),opacity .8s ease; }
.mk5 .sx-fm > .sx-fm2{ opacity: 0; }
.mk5 .sx-fm::before{ content: ""; position: absolute; inset: 0px; z-index: 1; pointer-events: none; background: linear-gradient(rgba(16, 20, 8, 0.3), rgba(16, 20, 8, 0) 28%); }
.mk5 .sx-fm::after{ content: ""; position: absolute; inset: 0px; z-index: 1; pointer-events: none; background: linear-gradient(rgba(16, 20, 8, 0) 38%, rgba(16, 20, 8, 0.5)); opacity: 0; transition: opacity 0.5s; }
.mk5 .sx-fb{ display: grid; gap: 2px; padding: 0px 2px; min-width: 0px; }
.mk5 .sx-fh{ display: flex; align-items: baseline; justify-content: space-between; gap: 10px; min-width: 0px; }
.mk5 .sx-fh h3{ margin: 0px; min-width: 0px; font-family: var(--f-head); font-size: 16.5px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.3; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk5 .sx-top{ display: inline-flex; align-items: baseline; gap: 4px; flex: 0 0 auto; color: var(--ink); }
.mk5 .sx-top b{ font-size: 13.5px; font-weight: 600; letter-spacing: -0.01em; }
.mk5 .sx-top small{ font-size: 9px; font-weight: 800; letter-spacing: 0.14em; color: var(--ink-3); }
.mk5 .sx-fl{ margin: 0px; font-size: 13.5px; line-height: 1.45; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk5 .sx-fo{ margin: 7px 0px 0px; display: flex; flex-wrap: wrap; gap: 5px 13px; font-size: 12.5px; font-weight: 500; color: var(--ink-2); }
.mk5 .sx-fo span{ display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.mk5 .sx-fo svg{ width: 14px; height: 14px; color: var(--ink-3); }
.mk5 .sx-l{ display: flex; flex-direction: column; background: rgb(255, 255, 255); color: var(--ink); border: 1px solid var(--line-2); border-radius: 20px; overflow: hidden; box-shadow: rgba(38, 46, 16, 0.04) 0px 1px 2px, rgba(38, 46, 16, 0.5) 0px 22px 40px -34px; transition: transform .45s var(--sx-ease),box-shadow .45s var(--sx-ease),border-color .3s; }
.mk5 .sx-l.sx-l-ex{ border-color: rgba(201, 161, 74, 0.4); }
.mk5 .sx-l .sx-tags{ right: 64px; }
.mk5 .sx-lno{ position: absolute; right: 12px; top: 12px; z-index: 2; display: inline-flex; align-items: center; height: 26px; padding: 0px 9px; border-radius: 999px; background: rgba(17, 21, 9, 0.44); color: rgba(255, 255, 255, 0.94); border: 1px solid rgba(255, 255, 255, 0.16); backdrop-filter: blur(10px) saturate(1.4); font-size: 11px; font-weight: 600; letter-spacing: 0.02em; pointer-events: none; }
.mk5 .sx-lf{ display: grid; grid-template-columns: minmax(0px, 1fr) auto; align-items: end; gap: 4px 12px; padding-top: 12px; border-top: 1px solid var(--line-2); }
.mk5 .sx-pr{ display: contents; }
.mk5 .sx-pr b{ grid-area: 1 / 1; align-self: end; font-size: 16px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink); white-space: nowrap; }
.mk5 .sx-pr small{ grid-area: 2 / 1 / auto / -1; display: block; min-width: 0px; font-size: 11.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk5 .sx-pr .og-cd{ color: var(--gold-ink); }
.mk5 .sx-live .live-dot{ width: 7px; height: 7px; margin-right: 6px; vertical-align: 1px; }
.mk5 .sx-kg{ display: grid; justify-items: end; gap: 3px; flex: 0 0 auto; }
.mk5 .sx-kg b{ font-size: 13.5px; font-weight: 700; color: var(--ink); white-space: nowrap; }
.mk5 .sx-kg small{ font-size: 11px; color: var(--ink-3); }
.mk5 .sx-f:focus-within .sx-peek,.mk5 .sx-l:focus-within .sx-peek{ opacity: 1; transform: none; }
@media (max-width: 560px){.mk5 .sx-fm{ border-radius: 18px; }}
.mk5 .sx-pend > svg{ width: 22px; height: 22px; flex: 0 0 auto; color: var(--ink-4); }
.mk5 .sx-pend > span{ display: grid; gap: 3px; line-height: 1.1; min-width: 0px; }
.mk5 .sx-pend em{ font-style: normal; font-size: 12px; font-weight: 600; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk5 .sx-kg > b:not(.mono){ font-size: 13px; }
.mk5 .sx-lot .sx-tags{ right: 64px; }
.mk5 .sx-t-mod{ font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.mk5 .sx-lau{ position: absolute; left: 12px; bottom: 12px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; max-width: calc(100% - 24px); height: 28px; padding: 0px 11px; border-radius: 999px; background: rgba(17, 21, 9, 0.5); color: rgb(255, 255, 255); border: 1px solid rgba(255, 255, 255, 0.16); backdrop-filter: blur(10px) saturate(1.4); font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; pointer-events: none; transition: opacity .3s ease,transform .45s var(--sx-ease); }
.mk5 .sx-lau svg{ width: 14px; height: 14px; flex: 0 0 auto; }
.mk5 .sx-lau .live-dot{ width: 7px; height: 7px; }
.mk5 .sx-lau b{ font-family: var(--f-mono); font-weight: 600; color: rgb(243, 219, 156); }
.mk5 .sx-lau-best{ background: rgba(255, 248, 230, 0.94); color: rgb(91, 67, 15); border-color: rgba(183, 138, 46, 0.25); }
.mk5 .sx-lau-best svg{ color: var(--gold-ink); }
.mk5 .sx-lfarm2{ display: flex; align-items: center; gap: 7px; color: var(--ink-2); }
.mk5 .sx-lfarm2 .sav{ width: 20px; height: 20px; font-size: 8.5px; background: var(--lima-wash); color: var(--lima-ink); }
.mk5 .sx-lfarm2 > span:last-child{ min-width: 0px; overflow: hidden; text-overflow: ellipsis; }
.mk5 .sx-q{ font-weight: 600; }
.mk5 .sx-q-ex{ color: var(--gold-ink); }
.mk5 .sx-q-ex svg{ color: var(--gold); }
.mk5 .sx-q-hi{ color: var(--lima-ink); }
.mk5 .sx-q-hi svg{ color: var(--lima-d); }
.mk5 .sx-lpr{ margin-top: 9px; display: grid; gap: 2px; }
.mk5 .sx-lpr p{ margin: 0px; display: flex; align-items: baseline; gap: 1px; min-width: 0px; }
.mk5 .sx-lpr p > small{ font-size: 13px; font-weight: 600; color: var(--ink-3); }
.mk5 .sx-pv .pr{ font-size: 24px; }
.mk5 .sx-pv .pr sup:last-child{ margin-right: 1px; }
.mk5 .sx-pv-na{ font-family: var(--f-head); font-size: 16px; font-weight: 600; color: var(--ink); }
.mk5 .sx-lpr > small{ font-size: 12.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk5 .sx-lot .sx-fh h3{ font-size: 16.5px; }
.mk5 .sx-lot:focus-within .sx-lau{ opacity: 0; }
.mk5 .og-cgrid{ row-gap: clamp(26px, 2.6vw, 38px); }
.mk5 .pf-empty .pz-ic{ width: 52px; height: 52px; margin: 0px auto; }
.mk5 .pf-empty .pz-ic svg{ width: 28px; height: 28px; }
.mk5 .pf-empty .pz-ic img{ width: 34px; height: 34px; }
.mk5 .sx-fh3{ display: flex; align-items: center; gap: 8px; min-width: 0px; }
.mk5 .sx-fh3 .fflag{ width: 20px; height: 20px; flex: 0 0 auto; border-radius: 50%; box-shadow: rgba(26, 26, 23, 0.12) 0px 0px 0px 1px; }
.mk5 .sx-fh3 svg.fflag[stroke]{ box-shadow: none; color: var(--ink-3); }
.mk5 .sx-fli{ display: flex; align-items: center; gap: 7px; min-width: 0px; }
.mk5 .sx-fli svg{ width: 15px; height: 15px; flex: 0 0 auto; color: var(--ink-3); }
.mk5 .sx-fli span{ min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk5 .sx-flm{ padding-left: 22px; }
.mk5 .sx-fh3 .sx-hit{ min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk5 .sx-fh{ min-width: 0px; }
.mk5 .sx-fh3{ gap: 6px; }
.mk5 .sx-fh3 .fflag{ width: 14px; height: 14px; box-shadow: rgba(26, 26, 23, 0.18) 0px 0px 0px 0.5px; }
.mk5 .sx-top{ display: inline-flex; align-items: baseline; gap: 4px; flex: 0 0 auto; padding: 3px 9px; border-radius: 999px; background: linear-gradient(135deg, rgb(251, 241, 212), rgb(243, 223, 162)); box-shadow: rgba(183, 138, 46, 0.35) 0px 0px 0px 1px inset; }
.mk5 .sx-top b{ font-family: "Plus Jakarta Sans", system-ui, sans-serif; font-variant-numeric: tabular-nums; font-weight: 800; font-size: 14px; color: rgb(138, 100, 18); }
.mk5 .sx-top small{ font-size: 10.5px; font-weight: 800; letter-spacing: 0.04em; color: rgb(166, 124, 30); }
.mk5 .sx-nosca{ flex: 0 0 auto; padding: 3px 9px; border-radius: 999px; background: rgb(241, 240, 234); color: var(--ink-3); font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.mk5 .sx-top{ padding: 0px; background: none; box-shadow: none; border: 0px; border-radius: 0px; gap: 3px; align-items: baseline; }
.mk5 .sx-top b{ font-size: 19px; font-weight: 800; color: rgb(111, 154, 34); letter-spacing: -0.01em; }
.mk5 .sx-top small{ font-size: 11px; font-weight: 800; color: rgb(111, 154, 34); }
.mk5 .sx-top{ gap: 3px; }
.mk5 .sx-top b{ font-size: 14.5px; font-weight: 700; color: rgb(82, 122, 21); letter-spacing: 0px; }
.mk5 .sx-top small{ font-size: 10px; font-weight: 700; letter-spacing: 0.06em; color: rgb(82, 122, 21); opacity: 0.85; }
.mk5 .sx-top b,.mk5 .sx-top small{ color: rgb(217, 168, 51); }
.mk5 .sx-top b{ font-weight: 800; }
.mk5 .sx-top small{ opacity: 1; }
.mk5 .sx-top b,.mk5 .sx-top small{ color: rgb(98, 103, 89); }
.mk5 .sx-top b{ font-size: 13px; font-weight: 800; }
.mk5 .sx-top small{ font-size: 9px; font-weight: 800; letter-spacing: 0.06em; }
.mk5 .sx-fo.sx-fo-t{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-3); }
.mk5 .sx-fo.sx-fo-t > span:not(.rv-mini){ display: inline; }
.mk5 .sx-lfarm2 span{ min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk5 .sx-f,.mk5 .rc,.mk5 .vt-c{ transition: transform 0.25s, box-shadow 0.25s; }
@media (prefers-reduced-motion: reduce){.mk5 .btn,.mk5 .sx-f,.mk5 .rc,.mk5 .vt-c{ transition: none; }}
@media (prefers-reduced-motion: reduce){.mk5 .sx-f:hover,.mk5 .rc:hover{ transform: none; }}
.mk5 .sx-live{ position: absolute; left: 12px; bottom: 12px; z-index: 2; display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0px 12px 0px 10px; border-radius: 999px; background: rgba(18, 21, 13, 0.55); backdrop-filter: blur(8px) saturate(1.2); color: rgb(255, 255, 255); font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; box-shadow: rgba(255, 255, 255, 0.18) 0px 0px 0px 1px inset; }
.mk5 .sx-live i{ position: relative; width: 8px; height: 8px; border-radius: 50%; background: rgb(255, 75, 62); }
.mk5 .sx-live i::after{ content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid rgb(255, 75, 62); animation: 1.6s ease-out 0s infinite normal none running sxPulse; }
@media (prefers-reduced-motion: reduce){.mk5 .sx-live i::after{ animation: auto ease 0s 1 normal none running none; opacity: 0; }}
.mk5 .sx-top,.mk5 .sx-top b,.mk5 .sx-top small{ background: none !important; border: 0px !important; box-shadow: none !important; }
.mk5 .sx-top b,.mk5 .sx-top small{ color: rgb(176, 138, 30) !important; }
.mk5 .om-bar{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
/* ---------- movimiento de la tarjeta de lote (solo con ratón), G:7238-7252, G:7309 ---------- */
@media (hover:hover) and (pointer:fine){
  .mk5 .sx-f:hover .sx-fm>img,.mk5 .sx-f:hover .sx-fm>canvas{transform:scale(1.07)}
  .mk5 .sx-f:hover .sx-fm::after{opacity:1}
  .mk5 .sx-f:hover .sx-peek{opacity:1;transform:none}
  .mk5 .sx-f:hover .sx-pk-h svg{transform:translateX(4px)}
  .mk5 .sx-f:hover .sx-fh h3{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px;text-decoration-color:var(--lima)}
  .mk5 .sx-f:hover{transform:translateY(-3px)}
  .mk5 .sx-lot:hover .sx-lau{opacity:0;transform:translateY(8px)}
}

/* ---------- la tarjeta de café verde, con lo que el sitio sí tiene ---------- */
.mk5 .sx-f.sx-lot{background:none;border:0;border-radius:0;gap:12px}
.mk5 .sx-fm{background:linear-gradient(160deg,#DCE1CF,#C9D3B4)}
.mk5 .sx-fm>.m5-ph{position:absolute;inset:0;display:grid;place-items:center;font:700 44px var(--f-head);color:rgba(30,42,11,.35)}
.mk5 .sx-fh h3 .sx-hit{display:inline}
.mk5 .sx-f .sx-hit{font:inherit;background:none;border:0;padding:0;margin:0;text-align:left;cursor:pointer;text-decoration:none;color:inherit}
.mk5 .sx-fo-t{margin:3px 0 0;font-size:13px;color:var(--ink-3)}
.mk5 .sx-pv .pr{font-family:var(--f-head);font-weight:700;font-size:24px;letter-spacing:-.025em;line-height:1.1;color:var(--ink)}
.mk5 .pr sup{font-size:11.5px;font-weight:600;letter-spacing:0;vertical-align:12px;margin-right:2px}
.mk5 .pr sub{font-size:11.5px;font-weight:600;vertical-align:12px;letter-spacing:0}
.mk5 .sx-pv .pr sup:last-child{margin-right:1px}
.mk5 .sx-lpr p{align-items:baseline;gap:3px}
.mk5 .sx-lau-best{background:rgba(255,248,230,.94);color:#5B430F;border-color:rgba(183,138,46,.25)}

/* ---------- cabecera, buscador y herramientas ---------- */
.mk5 .om-page{padding-top:clamp(4px,1vw,10px)}
.mk5 .om-und{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3)}
.mk5 .om-und>span{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-right:2px}
.mk5 .om-und em{font-style:normal;font-weight:600;color:var(--ink-2);height:28px;padding:0 11px;border-radius:999px;background:var(--lima-wash,#F1F5E3);display:inline-flex;align-items:center}
.mk5 .og-fbtn svg,.mk5 .om-sh b svg,.mk5 .om-g summary svg{fill:none;stroke:currentColor}
.mk5 .om-side{top:calc(var(--barra,150px) + 16px)}
.mk5 .om-opt{cursor:pointer;text-align:left}
.mk5 .om-opt:hover{background:#F6F9EE}
.mk5 .om-sh .lnk{background:none;border:0;padding:0;font:inherit;font-size:12.5px;font-weight:700;color:var(--lima-ink,#4F6B16);text-decoration:underline;cursor:pointer}
.mk5 .chipsel button{cursor:pointer;border:0}
.mk5 .om-bar:empty{display:none}
.mk5 .pf-empty span{max-width:52ch;font-size:14px;line-height:1.5}
.mk5 .pf-empty .btn{margin-top:4px}
.mk5 a.btn{text-decoration:none}
.mk5 .om-table .og-tl1{color:inherit;text-decoration:none}
.mk5 .om-table tr[data-lot]{cursor:pointer}
.mk5 .om-table tr[data-lot]:hover td{background:#F8FBF1}
.mk5 .om-table .og-tfm{display:grid;place-items:center;font:700 14px var(--f-head);color:#fff}
.mk5 .om-table .r{white-space:nowrap}
.mk5 .og-mtable-w{margin-bottom:0}
.mk5 .om-vol .btn{white-space:nowrap}
.mk5 .og-sec{padding:34px 0 10px}
.mk5 .om-vol .og-cta{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:1100px){.mk5 .om-lay{gap:12px}}

/* ---------- vistas de la guía: cereza, pergamino, blends de finca ---------- */
.mk5 .m5-cz{margin:6px 0 16px;max-width:76ch;font-size:15px;line-height:1.55;color:var(--ink-2)}
.mk5 .m5-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.mk5 .m5-bf{margin-top:12px;padding:18px 20px 20px;border-radius:22px;background:#F1F6E4}
.mk5 .m5-bf h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font:700 1.3rem var(--f-head);letter-spacing:-.03em;color:var(--ink)}
.mk5 .m5-bf h3 small{font:600 12.5px var(--f-body,inherit);color:var(--ink-3);letter-spacing:0}
.mk5 .m5-bf h3 svg{width:18px;height:18px;color:var(--lima-d,#6F9A22)}
.mk5 .m5-bf>p{margin:0 0 14px;color:var(--ink-3);font-size:13.5px;max-width:78ch}
.mk5 .m5-bf .og-mtable{min-width:760px}
.mk5 .m5-bf .og-mtable th{font-size:11.5px;letter-spacing:.02em;text-transform:none}

/* ---------- suscripciones: «Arme su cajita» y «Mis suscripciones» ---------- */
.m5s .scx-ph h1{font-size:clamp(2rem,4vw,3rem)}
.m5s .m5-eye{display:block;margin:0 0 8px;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.m5s .ct-grp h2{font-size:1.08rem}
.m5s .m5-l{display:grid;grid-template-columns:64px minmax(0,1fr) auto auto auto auto;gap:10px 12px;align-items:center;padding:12px 0;border-top:1px solid var(--line-2)}
.m5s .m5-l .sel{min-height:40px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:0 10px;font:inherit;font-size:13.5px;font-weight:600;max-width:190px}
.m5s .m5-add{margin-top:10px;border-top:1px solid var(--line-2);padding-top:10px}
.m5s .m5-add summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:700;font-size:14.5px;padding:6px 0;list-style:none}
.m5s .m5-add summary::-webkit-details-marker{display:none}
.m5s .m5-add summary svg{width:16px;height:16px;fill:none;stroke:currentColor}
.m5s .m5-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-top:10px}
.m5s .m5-pick button{display:grid;grid-template-columns:52px minmax(0,1fr) 18px;gap:10px;align-items:center;text-align:left;padding:10px;border:1px solid var(--line-2);border-radius:14px;background:#fff;font:inherit;cursor:pointer}
.m5s .m5-pick button:hover{border-color:var(--ink)}
.m5s .m5-pick b{display:block;font-size:14px}.m5s .m5-pick small{display:block;font-size:12.5px;color:var(--ink-3)}
.m5s .m5-pick em{display:block;font-style:normal;font-size:12px;color:var(--ink-2);margin-top:2px}
.m5s .m5-pick svg{width:16px;height:16px;fill:none;stroke:currentColor}
.m5s .m5-f2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.m5s .fld{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}
.m5s .fld .lab{font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.m5s .fld .sel,.m5s .fld input.sel{width:100%;min-height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;padding:0 12px;font:inherit;font-weight:600;font-size:14px;box-sizing:border-box}
.m5s .m5-ok{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.m5s .m5-ok input{margin-top:3px;width:18px;height:18px;flex:0 0 auto}
.m5s .m5-sum{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.m5s .m5-sum li{display:flex;justify-content:space-between;gap:10px;font-size:14px}
.m5s .m5-sum small{display:block;font-size:12px;color:var(--ink-3)}
.m5s .m5-err{margin:0;padding:10px 12px;border-radius:10px;background:#FBE3DF;color:#8A2518;font-size:13.5px;font-weight:600}
.m5s .m5-err[hidden]{display:none}
.m5s .m5-list{display:grid;gap:14px}
.m5s .m5-c{border:1px solid var(--line-2);border-radius:18px;background:#fff;padding:16px 18px;display:grid;gap:10px}
.m5s .m5-ch{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.m5s .m5-ch h2{margin:0;font-size:1.1rem}.m5s .m5-ch small{color:var(--ink-3);font-size:13px}
.m5s .m5-st{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;background:#F6E7C4;color:#5A3F0C;font-size:12px;font-weight:800;white-space:nowrap}
.m5s .m5-a{display:flex;gap:8px;flex-wrap:wrap}
.m5s .m5-note{display:flex;gap:8px;align-items:flex-start;margin:18px 0 0;font-size:13px;line-height:1.45;color:var(--ink-3)}
.m5s .m5-note svg{width:16px;height:16px;flex:0 0 auto;margin-top:1px;fill:none;stroke:currentColor}
@media(max-width:720px){
  .m5s .m5-l{grid-template-columns:56px minmax(0,1fr) auto;row-gap:8px}
  .m5s .m5-l .sel{grid-column:2/-1;max-width:none}
  .m5s .m5-f2{grid-template-columns:1fr}
}

/* ---------- barra Volver: la píldora es el botón, no el contenedor ---------- */
.mk5 .gback{display:block;border:0;background:none;box-shadow:none;border-radius:0;height:auto;padding:12px 0 0}
.m5s .m5-pick .ct-m{width:52px;height:44px}
.m5s .m5-l .sel,.m5s .fld .sel{color:var(--ink)}

/* ---------- Suscripciones: estados, calendario estimado, destino ---------- */
.m5s .m5-list{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));align-items:start}
.m5s .m5-st{height:auto;padding:4px 9px;font-size:11.5px;white-space:normal;text-align:center}
.m5s .m5-st.ok{background:#E7F2D4;color:#2F4A0E}
.m5s .m5-st.hold{background:#F6E7C4;color:#6A4A10}
.m5s .m5-st.bad{background:#FBE3DF;color:#8A2518}
.m5s .m5-per{margin:0;font-size:13.5px;color:var(--ink-2)}
.m5s .m5-cy{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.m5s .m5-cy li{display:grid;gap:2px;padding:8px;border-radius:10px;background:var(--cream,#F5F3EC);font-size:12.5px}
.m5s .m5-cy li span{color:var(--ink-3)}
.m5s .m5-cy li.sk{opacity:.6;text-decoration:line-through}
.m5s .m5-x{color:#8A2518}
.m5s .m5-rad{border:0;margin:0 0 12px;padding:0;display:grid;gap:6px;font-size:13.5px}
.m5s .m5-rad label{display:flex;gap:8px;align-items:center}
.m5s .m5-rad legend{padding:0;margin-bottom:6px}
.m5s .ct-t dd{text-align:right}
@media(max-width:720px){.m5s .m5-list{grid-template-columns:minmax(0,1fr)}.m5s .m5-cy{grid-template-columns:1fr}.m5s .m5-cy li{grid-template-columns:1fr auto;align-items:center}}
.m5s .m5-nw{white-space:nowrap}
.m5s .m5-sum b{white-space:nowrap}.m5s .m5-rad{min-width:0}.m5s .m5-rad legend{display:block;width:100%;float:none}

/* Aviso de sesion en suscripciones: guardado en la cuenta o solo en este navegador */
.m5s .m5-login{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 14px;padding:12px 14px;border-radius:14px;background:var(--cream,#F6F5EF);font-size:13.5px;line-height:1.45;color:var(--ink-2)}
.m5s .m5-login svg{width:17px;height:17px;flex:0 0 auto;fill:none;stroke:currentColor}
.m5s .m5-login span{flex:1 1 220px;min-width:0}
.m5s .ct-grp .m5-login{margin:14px 0 0}
.m5s .m5-ok + .m5-ok{margin-top:10px}
.m5s .m5-ch small{overflow-wrap:anywhere}