@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/3578a2b6.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/12b53b2e.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/e51539db.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/3578a2b6.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/12b53b2e.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/e51539db.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/570a2bdd.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/71e69e06.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/3644d51c.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/c010f9b7.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/9ea68c62.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/530d036b.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/570a2bdd.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/71e69e06.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/3644d51c.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/c010f9b7.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/9ea68c62.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/530d036b.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/c4fcfea4.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/2ee17598.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/c4fcfea4.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/2ee17598.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/c4fcfea4.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/2ee17598.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  color-scheme: dark;
  --ink:        #DAD7CF;
  --paper:      #121211;
  --cobalt:     #FFFFFF;
  --vermillion: #F4F2EC;
  --graphite:   #918E86;
  --ash:        #35332E;
  --hueso:      #1D1C1A;
  --ocre:       #A9A59B;
  
  --trama: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M-1 5 5-1M2 8 8 2' stroke='rgba(218,215,207,.04)' stroke-width='.5' fill='none'/%3E%3C/svg%3E");
  --mono:  "Commit Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --serif: "Newsreader", "Source Serif 4", Georgia, "Times New Roman", serif;
  --grot:  "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  
  --apretado: -0.032em;
  --gap: clamp(1.5rem, 4vw, 4rem);
  --rail: clamp(3.25rem, 5vw, 4.75rem);
  
  --z-campo: 0;
  --z-contenido: 2;
  --z-columna-app: 3;
  --z-rail: 4;
  --rule: 0.5px;
  
  --puntero:        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='19'%3E%3Cpath d='M2 2 2 15 5.1 12.2 7.3 17.1 9.5 16.1 7.4 11.3 11.4 11.3Z' fill='%23121211' stroke='%23DAD7CF' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E") 2 2, auto;
  --puntero-activo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='19'%3E%3Cpath d='M2 2 2 15 5.1 12.2 7.3 17.1 9.5 16.1 7.4 11.3 11.4 11.3Z' fill='%23FFFFFF' stroke='%23DAD7CF' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E") 2 2, auto;
}
:root[data-theme="light"] {
  color-scheme: light;
  --ink:        #24231F;
  --paper:      #E9E7E2;
  --cobalt:     #000000;
  --vermillion: #100F0D;
  --graphite:   #5D5B55;
  --ash:        #C0BDB6;
  --hueso:      #F2F1ED;
  --ocre:       #6E6B64;
  --trama: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M-1 5 5-1M2 8 8 2' stroke='rgba(36,35,31,.04)' stroke-width='.5' fill='none'/%3E%3C/svg%3E");
  --puntero:        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='19'%3E%3Cpath d='M2 2 2 15 5.1 12.2 7.3 17.1 9.5 16.1 7.4 11.3 11.4 11.3Z' fill='%23E9E7E2' stroke='%2324231F' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E") 2 2, auto;
  --puntero-activo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='19'%3E%3Cpath d='M2 2 2 15 5.1 12.2 7.3 17.1 9.5 16.1 7.4 11.3 11.4 11.3Z' fill='%23000000' stroke='%2324231F' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E") 2 2, auto;
}
:root[data-app] { --trama: none; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  background-color: var(--paper);
  background-image: var(--trama);
  color: var(--ink);
  font-family: var(--grot);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.rail {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--rail);
  background-color: var(--paper);
  background-image: var(--trama);
  border-right: var(--rule) solid var(--ash);
  z-index: var(--z-rail);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem 0 1.35rem;
}
.rail__tools {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.35rem;
  margin-top: auto;
}
.rail__mark {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .7rem;
  color: var(--ink);
  text-decoration: none;
  transition: color 180ms ease-out;
}
.rail__mark svg { width: 2.45rem; height: 2.45rem; display: block; }
.rail__mark:hover, .rail__mark:focus-visible { color: var(--cobalt); }
.rail__mark:hover .rail__word, .rail__mark:focus-visible .rail__word { color: var(--cobalt); }
.rail__mark:focus-visible { outline: 1.5px solid var(--cobalt); outline-offset: 6px; border-radius: 4px; }
.rail__mark .rail__tip {
  top: 1.2rem;
  transform: translate(-.25rem, -50%);
}
.rail__mark:hover .rail__tip,
.rail__mark:focus-visible .rail__tip { opacity: 1; transform: translate(0, -50%); }
.rail__word {
  font-family: var(--mono);
  font-size: .74rem;
  letter-spacing: .2em;
  color: var(--graphite);
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  transition: color 180ms ease-out;
}
.rail__tool {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  min-height: 2.75rem;
  color: var(--graphite);
  text-decoration: none;
  transition: color 180ms ease-out;
}
.rail__ico svg { width: 1.75rem; height: 1.75rem; display: block; }
.rail__tool:hover, .rail__tool:focus-visible { color: var(--cobalt); }
.rail__tool:focus-visible { outline: none; }
.rail__anillo {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2.6rem;
  height: 2.6rem;
  transform: translate(-50%, -50%) rotate(-90deg);
  fill: none;
  stroke: currentColor;
  pointer-events: none;
  overflow: visible;
}
.rail__anillo circle {
  stroke-width: .5;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  transition: stroke-dashoffset 220ms ease-out;
}
.rail__tool:hover .rail__anillo circle,
.rail__tool:focus-visible .rail__anillo circle,
.rail__app:hover .rail__anillo circle,
.rail__app:focus-visible .rail__anillo circle { stroke-dashoffset: 0; }
.rail__tool[aria-current="page"] { color: var(--ink); }
.rail__tool[aria-current="page"] .rail__anillo circle,
.rail__app[aria-current="page"] .rail__anillo circle { stroke-dashoffset: 0; }
.rail__tip {
  position: absolute;
  left: calc(100% + .85rem);
  white-space: nowrap;
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--ink);
  background: var(--paper);
  padding: .3rem .5rem;
  border: var(--rule) solid var(--ash);
  opacity: 0;
  transform: translateX(-.25rem);
  pointer-events: none;
  transition: opacity 160ms ease-out, transform 160ms ease-out;
}
.rail__tool:hover .rail__tip,
.rail__tool:focus-visible .rail__tip { opacity: 1; transform: none; }
.rail__rotulo--dentro { display: none; }
:root[data-sesion] .rail__rotulo--fuera { display: none; }
:root[data-sesion] .rail__rotulo--dentro { display: inline; }
.rail__apps {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .7rem;
  margin-top: 1.9rem;
}
.rail__apps:empty { display: none; }
.rail__servicios {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .95rem;
  margin-top: 1.9rem;
}
:root[data-sesion] .rail__servicios { display: none; }
 
:root[data-servicio="sitios-web"] .rail__tool--sitios-web,
:root[data-servicio="agentes"]    .rail__tool--agentes,
:root[data-servicio="crm"]        .rail__tool--crm,
:root[data-servicio="publicidad"] .rail__tool--publicidad,
:root[data-servicio="software"]   .rail__tool--software { color: var(--ink); }
.rail__tool--sitios-web[aria-current="page"],
.rail__tool--agentes[aria-current="page"],
.rail__tool--crm[aria-current="page"],
.rail__tool--publicidad[aria-current="page"],
.rail__tool--software[aria-current="page"] { color: var(--ink); }
:root[data-servicio="sitios-web"] .rail__tool--sitios-web .rail__anillo circle,
:root[data-servicio="agentes"]    .rail__tool--agentes    .rail__anillo circle,
:root[data-servicio="crm"]        .rail__tool--crm        .rail__anillo circle,
:root[data-servicio="publicidad"] .rail__tool--publicidad .rail__anillo circle,
:root[data-servicio="software"]   .rail__tool--software   .rail__anillo circle { stroke-dashoffset: 0; }
.rail__tool--sitios-web[aria-current="page"] .rail__anillo circle,
.rail__tool--agentes[aria-current="page"]    .rail__anillo circle,
.rail__tool--crm[aria-current="page"]        .rail__anillo circle,
.rail__tool--publicidad[aria-current="page"] .rail__anillo circle,
.rail__tool--software[aria-current="page"]   .rail__anillo circle { stroke-dashoffset: 0; }
:root[data-servicio] .rail__mark { color: var(--graphite); }
:root[data-servicio] .rail__mark .mark__sym { color: inherit; }
:root[data-servicio="inicio"] .rail__mark,
:root[data-servicio="inicio"] .rail__word { color: var(--ink); }
@media (max-width: 34rem) {
  :root { --rail: 2.5rem; }
  .rail { padding: .85rem 0 1.1rem; }
  .rail__mark svg { width: 1.7rem; height: 1.7rem; }
  .rail__word { font-size: .64rem; letter-spacing: .14em; }
  .rail__ico svg { width: 1.5rem; height: 1.5rem; }
  .rail__anillo { width: 2.2rem; height: 2.2rem; }
  .rail__app-ico { width: 1.7rem; height: 1.7rem; }
  .rail__app-ico svg { width: 1rem; height: 1rem; }
}
@media (max-height: 46rem) {
  .rail__apps, .rail__servicios { margin-top: 1.35rem; gap: .7rem; }
  .rail__tool--servicio .rail__ico svg { width: 1.45rem; height: 1.45rem; }
}
@media (max-height: 34rem) {
  .rail__word { display: none; }
  .rail__mark svg { width: 1.7rem; height: 1.7rem; }
  .rail__servicios { gap: .5rem; }
  .rail__tool--servicio .rail__ico svg { width: 1.15rem; height: 1.15rem; }
  .rail__tools { gap: .9rem; }
  .rail__tool--servicio .rail__anillo { width: 1.65rem; height: 1.65rem; }
}
@media (max-height: 16rem) {
  .rail { padding: .5rem 0 .6rem; }
  .rail__mark svg { width: 1.35rem; height: 1.35rem; }
  .rail__servicios { margin-top: .6rem; gap: .25rem; }
  .rail__tool { min-width: 0; min-height: 0; }
  .rail__tool--servicio .rail__ico svg { width: 1rem; height: 1rem; }
  .rail__tools { gap: .6rem; }
  .rail__tools .rail__ico svg { width: 1.35rem; height: 1.35rem; }
}
.rail__app {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.rail__app-ico {
  display: grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 50%;
  background: var(--ink);
  color: var(--paper);
  transition: background 180ms ease-out;
}
.rail__app-ico svg { width: 1.2rem; height: 1.2rem; display: block; }
.rail__app-ico--letra {
  font-family: var(--mono);
  font-size: .95rem;
  line-height: 1;
}
.rail__app:hover .rail__app-ico,
.rail__app:focus-visible .rail__app-ico { background: var(--cobalt); }
.rail__app:focus-visible { outline: none; }
.rail__app .rail__tip { opacity: 0; transform: translateX(-.25rem); }
.rail__app:hover .rail__tip,
.rail__app:focus-visible .rail__tip { opacity: 1; transform: none; }
@media (max-width: 60rem) {
  .rail__app-ico { width: 1.95rem; height: 1.95rem; }
  .rail__app-ico svg { width: 1.1rem; height: 1.1rem; }
}
.head {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 1rem;
  margin-left: var(--rail);
  padding: var(--gap) var(--gap) 0 var(--gap);
  position: relative;
  z-index: var(--z-rail);
}
.mark {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  text-decoration: none;
  color: inherit;
}
.mark__sym { width: 1.35rem; height: 1.35rem; color: var(--ink); flex: none; }
.mark__word {
  font-family: var(--mono);
  font-size: .95rem;
  letter-spacing: .01em;
  transform: translateY(.04em);
}
.tools { display: flex; align-items: center; gap: .9rem; }
.theme {
  display: inline-flex;
  position: relative;
  padding: .6rem .5rem;
  border: 0;
  background: none;
  color: var(--graphite);
  cursor: pointer;
  transition: color 180ms ease-out, transform 320ms ease-out;
}
.theme svg { width: .82rem; height: .82rem; display: block; }
.theme:hover { color: var(--ink); }
.theme:focus-visible { outline: 1.5px solid var(--cobalt); outline-offset: 4px; }
:root:not([data-theme="light"]) .theme { transform: rotate(180deg); }
.bandera {
  width: 1.15rem;
  height: auto;
  display: block;
  border-radius: 1.5px;
  flex: none;
}
.lang { display: flex; align-items: center; gap: 0; }
.lang button {
  background: none;
  border: 0;
  padding: .6rem .2rem;
  line-height: 0;
  border-radius: 2px;
  cursor: pointer;
  opacity: .4;
  filter: saturate(.45);
  transition: opacity 160ms ease-out, filter 160ms ease-out;
}
.lang button[aria-pressed="true"] { opacity: 1; filter: none; }
.lang button:hover { opacity: 1; filter: none; }
.lang button:focus-visible { outline: 1.5px solid var(--cobalt); outline-offset: 3px; }
.sheet {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
  gap: var(--gap);
  padding: var(--gap) var(--gap) var(--gap) calc(var(--rail) + var(--gap));
  min-height: 0;
}
.field {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}
.say { max-width: 36ch; display: grid; gap: 1rem; }
.say__lead {
  margin: 0;
  position: relative;
  font-weight: 500;
  font-size: clamp(1.75rem, 3.6vw, 2.8rem);
  line-height: 1.08;
  letter-spacing: var(--apretado);
  text-wrap: balance;
}
.say__sub { margin: 0; font-size: 1rem; line-height: 1.6; color: var(--graphite); max-width: 42ch; }
.say__go { margin: .9rem 0 0; }
.foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: .45rem .9rem;
  margin-left: var(--rail);
  margin-top: calc(var(--gap) * 2.4);
  padding: var(--gap);
  border-top: var(--rule) solid var(--ash);
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--graphite);
}
.foot__marca { font-weight: 600; color: var(--ink); }
.foot__donde { color: var(--graphite); }
.foot__mail { color: var(--graphite); text-decoration: none; border-bottom: var(--rule) solid var(--ash); }
.foot__mail:hover { color: var(--cobalt); border-color: var(--cobalt); }
.foot__redes { display: inline-flex; align-items: center; gap: .35rem; }
.foot__red {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px;
  color: var(--graphite);
}
.foot__red:hover, .foot__red:focus-visible { color: var(--cobalt); }
@media (min-width: 60rem) {
  .sheet {
    grid-template-columns: minmax(0, 1.4fr) minmax(20rem, .8fr);
    align-items: center;
    gap: calc(var(--gap) * 1.15);
  }
  .say { align-self: center; grid-column: 2; }
  .sheet--page { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 48rem) {
  .field { opacity: .42; }
}
@media (max-width: 60rem) {
  :root:has(.baraja) .field { opacity: .42; }
}
.sheet--page {
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  padding-top: calc(var(--gap) * 1.6);
  gap: calc(var(--gap) * .9);
}
.page__head { display: grid; gap: .55rem; max-width: 42ch; }
.page__eyebrow {
  margin: 0;
  font-family: var(--mono);
  font-size: .72rem;
  letter-spacing: .04em;
  color: var(--graphite);
}
.page__title {
  margin: 0;
  font-weight: 500;
  overflow-wrap: anywhere;
  font-size: clamp(2.3rem, 5.6vw, 4rem);
  line-height: 1.03;
  letter-spacing: var(--apretado);
  text-wrap: balance;
}
.prose {
  max-width: 62ch;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.15rem;
  font-size: 1.02rem;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.prose p { margin: 0; }
.prose h2 {
  margin: 1.5rem 0 0;
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 1.25;
  letter-spacing: -0.018em;
}
.prose h3 {
  margin: 1rem 0 0;
  font-family: var(--mono);
  font-weight: 400;
  font-size: .8rem;
  letter-spacing: .05em;
  color: var(--graphite);
}
.prose a { color: var(--cobalt); text-decoration: none; border-bottom: var(--rule) solid currentColor; }
.prose ul { margin: 0; padding-left: 1.1rem; display: grid; gap: .4rem; }
.prose table { border-collapse: collapse; font-variant-numeric: tabular-nums; width: 100%; }
.prose th, .prose td { text-align: left; padding: .45rem .6rem .45rem 0; border-bottom: var(--rule) solid var(--ash); }
.prose th { font-family: var(--mono); font-weight: 400; font-size: .74rem; color: var(--graphite); }
.prose > * { min-width: 0; }
.prose__ancho { overflow-x: auto; }
.prose__ancho table { width: auto; min-width: 100%; }
.prose__ancho td, .prose__ancho th { overflow-wrap: normal; }
.nb { white-space: nowrap; }
.prose td code, .prose th code { overflow-wrap: anywhere; }
.prose ol {
  margin: 0;
  padding-left: 1.4rem;
  display: grid;
  gap: .4rem;
  font-variant-numeric: tabular-nums;
}
.prose blockquote {
  margin: .6rem 0;
  padding: 0;
  font-family: var(--serif);
  font-size: 1.22rem;
  line-height: 1.4;
  color: var(--ink);
  max-width: 30ch;
}
.prose figure { margin: .6rem 0; display: grid; gap: .5rem; }
.prose figure img, .prose img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-top: var(--rule) solid var(--ash);
  border-bottom: var(--rule) solid var(--ash);
}
.prose figcaption {
  font-family: var(--mono);
  font-size: .74rem;
  line-height: 1.5;
  color: var(--graphite);
}
.prose code {
  font-family: var(--mono);
  font-size: .88em;
  color: var(--ink);
}
.prose pre {
  margin: 0;
  padding: .9rem 1rem;
  overflow-x: auto;
  border-top: var(--rule) solid var(--ash);
  border-bottom: var(--rule) solid var(--ash);
  font-family: var(--mono);
  font-size: .82rem;
  line-height: 1.6;
  tab-size: 2;
}
.prose pre code { font-size: inherit; }
.prose hr {
  margin: .8rem 0;
  border: 0;
  border-top: var(--rule) solid var(--ash);
}
.prose h2[id], .prose h3[id], .conn__sec > h2[id] { scroll-margin-top: 5rem; }
.prose sup {
  font-family: var(--mono);
  font-size: .68em;
  color: var(--cobalt);
}
.page__note { color: var(--graphite); }
.auth { display: grid; gap: 1.1rem; max-width: 26rem; margin-top: .6rem; }
.field-row { display: grid; gap: .4rem; }
.field-row__label {
  font-family: var(--mono);
  font-size: .72rem;
  letter-spacing: .04em;
  color: var(--graphite);
}
.input {
  font: inherit;
  font-size: 1rem;
  color: var(--ink);
  background: var(--paper);
  border: var(--rule) solid var(--ash);
  border-radius: 8px;
  padding: .68rem .8rem;
  transition: border-color 160ms ease-out;
}
.input:hover { border-color: var(--graphite); }
.input:focus { outline: none; border-color: var(--cobalt); box-shadow: none; }
.btn {
  justify-self: start;
  font-family: var(--grot);
  font-weight: 500;
  font-size: .92rem;
  letter-spacing: -0.008em;
  color: var(--paper);
  background: var(--ink);
  border: 0;
  border-radius: 8px;
  padding: .68rem 1.3rem;
  cursor: pointer;
  transition: background-color 170ms ease-out;
}
.btn:hover { background: var(--cobalt); }
.btn:focus-visible { outline: 1.5px solid var(--ink); outline-offset: 3px; }
.auth__note { margin: 0; font-size: .88rem; color: var(--graphite); }
.page__lead {
  margin: .5rem 0 0;
  max-width: 44ch;
  overflow-wrap: anywhere;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--graphite);
}
.page__back { margin: calc(var(--gap) * .8) 0 0; font-family: var(--mono); font-size: .78rem; }
.page__back a { color: var(--graphite); text-decoration: none; display: inline-block; padding: .45rem .2rem; margin: -.45rem -.2rem; }
.page__back a:hover { color: var(--cobalt); }
.conn {
  gap: 0;
  max-width: 74rem;
  --margen: clamp(0px, 7vw, 5.5rem);
  --canal: clamp(0px, 2.5vw, 2rem);
  --medida: 34rem;
}
.conn__sec,
.conn .page__head {
  display: grid;
  grid-template-columns: var(--margen) minmax(0, var(--medida));
  column-gap: var(--canal);
  max-width: none;
}
.conn__fig {
  display: grid;
  grid-template-columns: var(--margen) minmax(0, 1fr);
  column-gap: var(--canal);
  max-width: none;
}
.conn__sec > *,
.conn .page__head > *,
.conn__fig > * { grid-column: 2; }
.conn__num {
  grid-column: 1;
  grid-row: 1 / 3;
  margin: .35rem 0 0;
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--ash);
  font-variant-numeric: tabular-nums;
  align-self: start;
}
.conn__title { max-width: 17ch; }
.conn .page__lead { max-width: 46ch; font-size: 1.12rem; }
.conn__nota {
  margin: 1.5rem 0 0;
  font-family: var(--mono);
  font-size: .74rem;
  line-height: 1.75;
  letter-spacing: .01em;
  color: var(--graphite);
  max-width: 46ch;
}
.conn__fig { margin: calc(var(--gap) * 1.5) 0 0; }
.conn__fig > .conn__canvas {
  grid-column: 1 / -1;
  display: block;
  width: 100%;
  height: clamp(190px, 30vw, 360px);
  border-top: var(--rule) solid var(--ash);
  border-bottom: var(--rule) solid var(--ash);
}
.conn__fignum {
  grid-column: 1;
  margin: .6rem 0 0;
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--ash);
}
.conn__figcap {
  margin: .6rem 0 0;
  font-size: .88rem;
  line-height: 1.6;
  color: var(--graphite);
  max-width: 56ch;
}
.tinta { font-weight: 400; }
.tinta--viva { color: var(--cobalt); }
.tinta--apagada { color: var(--graphite); }
.conn__sec { margin-top: calc(var(--gap) * 2.1); }
.conn__sec > h2 {
  margin: 0 0 1.15rem;
  font-weight: 500;
  font-size: clamp(1.6rem, 3vw, 2.35rem);
  line-height: 1.1;
  max-width: 24ch;
  letter-spacing: -0.026em;
}
.conn .prose { max-width: 58ch; }
.conn__punch {
  font-family: var(--serif);
  font-size: 1.3rem;
  line-height: 1.45;
  color: var(--ink);
  border-left: 1.5px solid var(--cobalt);
  padding-left: 1.05rem;
}
.conn__sec > .tres {
  grid-column: 1 / -1;
  list-style: none;
  margin: 0;
  padding: 0;
}
.tres li {
  display: grid;
  grid-template-columns: var(--margen) minmax(0, var(--medida));
  column-gap: var(--canal);
  padding: 1.5rem 0;
  border-top: var(--rule) solid var(--ash);
}
.tres li:last-child { border-bottom: var(--rule) solid var(--ash); }
.tres__n {
  grid-column: 1;
  grid-row: 1 / 3;
  margin: .3rem 0 0;
  font-family: var(--mono);
  font-size: .72rem;
  color: var(--ash);
  font-variant-numeric: tabular-nums;
  align-self: start;
}
.tres h2 {
  grid-column: 2;
  margin: 0;
  font-weight: 500;
  font-size: clamp(1.15rem, 1.9vw, 1.42rem);
  line-height: 1.22;
  letter-spacing: -0.016em;
}
.tres li > p:not(.tres__n) {
  grid-column: 2;
  margin: .45rem 0 0;
  color: var(--graphite);
  font-size: .95rem;
}
.conn__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .9rem;
  margin: 1.6rem 0 0;
}
.btn--link { display: inline-block; text-decoration: none; }
.conn__cta-note { font-size: .88rem; color: var(--graphite); }
.conn__close {
  margin-top: calc(var(--gap) * 2.4);
  border-top: var(--rule) solid var(--ash);
  padding-top: calc(var(--gap) * 1.1);
}
.figures {
  list-style: none;
  margin: 1.6rem 0 0;
  padding: 0;
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  background: var(--ash);
  border: var(--rule) solid var(--ash);
}
.figures li { background: var(--paper); padding: 1.15rem 1.2rem; display: grid; gap: .35rem; }
.figures b {
  font-family: var(--mono);
  font-weight: 400;
  font-size: 1.75rem;
  font-variant-numeric: tabular-nums;
  color: var(--cobalt);
  line-height: 1;
}
.figures span { font-size: .88rem; color: var(--graphite); }
@media (max-width: 48rem) {
  .conn { --margen: 0px; --canal: 0px; --medida: 1fr; }
  .conn__num,
  .conn__fignum { grid-column: 2; grid-row: auto; margin: 0 0 .3rem; }
  .conn__fignum { margin: .6rem 0 .2rem; }
  .conn__sec > h2 { max-width: none; }
  .tres__n { grid-row: auto; margin: 0 0 .35rem; }
  .tres li { grid-template-columns: minmax(0, 1fr); }
  .tres__n, .tres h2, .tres li > p:not(.tres__n) { grid-column: 1; }
}
.baraja {
  position: fixed;
  inset: 0 0 0 var(--rail);
  z-index: var(--z-contenido);
  display: grid;
  align-content: center;
  padding: calc(var(--gap) + 3rem) var(--gap) calc(var(--gap) + 2.6rem);
  touch-action: pan-x pinch-zoom;
  overscroll-behavior: none;
  pointer-events: none;
}
.baraja__hoja {
  grid-area: 1 / 1;
  align-self: center;
  max-width: 38ch;
  max-height: 100%;
  display: grid;
  gap: 1rem;
  pointer-events: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity 170ms ease-out, transform 170ms ease-out, visibility 0s linear 170ms;
}
.baraja__hoja:focus,
.baraja__hoja:focus-visible { outline: none; }
.baraja__hoja[data-activa] {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition-delay: 0s;
}
.baraja__hoja[data-lado="izq"] { justify-self: start; }
.baraja__hoja[data-lado="der"] { justify-self: end; }
@media (max-width: 60rem) {
  .baraja__hoja[data-lado] { justify-self: stretch; max-width: none; }
}
.baraja__cuenta {
  margin: 0;
  font-family: var(--mono);
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  color: var(--graphite);
  display: flex;
  align-items: center;
  gap: .85rem;
}
.baraja__cuenta::after {
  content: "";
  flex: 1 1 0;
  min-width: 0;
  height: 0;
  border-top: var(--rule) solid var(--ash);
}
.baraja__titulo {
  margin: 0;
  font-weight: 500;
  font-size: clamp(1.6rem, min(4.2vw, 6.4vh), 2.9rem);
  line-height: 1.06;
  letter-spacing: var(--apretado);
  text-wrap: balance;
  white-space: pre-line;
}
.baraja__titulo:last-child { padding-bottom: 0.15em; }
.baraja__lead {
  margin: 0;
  max-width: 42ch;
  font-size: clamp(.95rem, min(1.5vw, 2.3vh), 1.05rem);
  line-height: 1.6;
  color: var(--graphite);
}
.baraja__lead__fuerte {
  display: block;
  color: var(--ink);
  font-weight: 500;
}
.baraja__lead__apagado {
  color: color-mix(in srgb, var(--graphite) 78%, var(--ash));
}
h1.baraja__lead {
  color: var(--ink);
  font-weight: 500;
  font-size: clamp(1.6rem, min(4.2vw, 6.4vh), 2.9rem);
  line-height: 1.06;
  letter-spacing: var(--apretado);
  text-wrap: balance;
}
h1.baraja__lead > span:first-child {
  display: block;
  color: var(--graphite);
  font-size: .72em;
  margin-bottom: .2em;
}
@media (min-width: 60rem) {
  h1.baraja__lead > span:first-child { font-size: .65em; }
}
.baraja__lead__corte { display: block; }
h1.baraja__lead .baraja__lead__fuerte {
  display: block;
  color: var(--ink);
  font-weight: inherit;
}
.baraja__cierre {
  margin: .35rem 0 0;
  font-family: var(--mono);
  font-size: .82rem;
  line-height: 1.5;
  color: color-mix(in srgb, var(--ink) 70%, var(--graphite));
}
.baraja__cierre a {
  display: inline-block;
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--graphite);
  padding-bottom: .15rem;
}
.baraja__cierre a:hover,
.baraja__cierre a:focus-visible { color: var(--cobalt); border-bottom-color: var(--cobalt); }
.canales-flotan {
  display: flex;
  gap: clamp(.9rem, 2vw, 1.35rem);
  margin: 1.6rem 0 0;
  padding: 0;
  list-style: none;
  color: var(--graphite);
}
.canales-flotan li {
  display: block;
  animation: flota calc(5.2s + var(--i) * .7s) ease-in-out infinite;
  animation-delay: calc(var(--i) * -1.3s);
}
.canales-flotan li:nth-child(2) { margin-top: 5px; }
.canales-flotan li:nth-child(3) { margin-top: 2px; }
.canales-flotan li:nth-child(4) { margin-top: 7px; }
.canales-flotan li:nth-child(5) { margin-top: 3px; }
.canales-flotan li:nth-child(6) { margin-top: 6px; }
.canales-flotan svg {
  display: block;
  width: 1.2rem;
  height: 1.2rem;
  opacity: .55;
  animation: turno 6s ease-in-out infinite;
  animation-delay: calc(var(--i) * 1s);
}
@keyframes flota {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-4px); }
}
@keyframes turno {
  0%, 22%, 100% { opacity: .55; color: var(--graphite); }
  8%            { opacity: 1;   color: var(--ink); }
}
@media (prefers-reduced-motion: reduce) {
  .canales-flotan li, .canales-flotan svg { animation: none; }
}
.baraja__ficha {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem 1.1rem;
  margin-top: .6rem;
  font-family: var(--mono);
  font-size: .78rem;
  color: var(--graphite);
}
.baraja__ficha .foot__mail { padding: .15rem 0; }
@media (min-width: 480px) { .baraja__ficha .foot__redes { margin-left: auto; } }
.ficha__salto { flex: 0 0 100%; height: 0; }
.ficha__foco {
  flex: 0 0 100%;
  margin: .75rem 0 1.4rem;
  display: flex;
  justify-content: center;
}
.ficha__via {
  font-family: var(--grot);
  font-size: clamp(1rem, min(1.6vw, 2.4vh), 1.15rem);
  color: var(--ink);
  text-decoration: none;
  border-bottom: var(--rule) solid var(--graphite);
  padding-bottom: .1rem;
}
.ficha__via:hover { color: var(--cobalt); border-bottom-color: var(--cobalt); }
.ficha__cta {
  position: relative;
  flex: 0 0 auto;
  background: transparent;
  color: var(--ink);
  border: 0;
  border-radius: 0;
  padding: .85rem 1.15rem;
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .17em;
  text-transform: uppercase;
  font-weight: 400;
  text-decoration: none;
  transition: letter-spacing 220ms ease-out, color 170ms ease-out;
}
.ficha__cta::before,
.ficha__cta::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
  width: 14px;
  height: 14px;
  pointer-events: none;
  transition: width 260ms ease-out, height 260ms ease-out, border-color 170ms ease-out;
}
.ficha__cta::before {
  left: 0;
  top: 0;
  border-left: 1px solid var(--ink);
  border-top: 1px solid var(--ink);
}
.ficha__cta::after {
  right: 0;
  bottom: 0;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.ficha__cta:hover,
.ficha__cta:focus-visible { letter-spacing: .2em; }
.ficha__cta:hover::before,
.ficha__cta:hover::after,
.ficha__cta:focus-visible::before,
.ficha__cta:focus-visible::after { width: 100%; height: 100%; }
.ficha__cta:focus-visible {
  outline: none;
  color: var(--cobalt);
}
.ficha__cta:focus-visible::before,
.ficha__cta:focus-visible::after { border-color: var(--cobalt); }
.baraja__llamada {
  margin: 1.35rem 0 0;
  align-self: stretch;
  width: 100%;
  display: flex;
  justify-content: center;
}
.baraja__hoja--portada { max-width: 36ch; }
.baraja__hoja--portada             { --hueco: 21; }
.baraja__hoja[data-slug="agentes"] { --hueco: 15; }
@media (width > 60rem) {
  .baraja__hoja[data-lado="der"] {
    translate: min(0px, calc(var(--gap) + 50% - var(--hueco) * 1vw)) 0;
  }
}
.baraja__hoja--portada .baraja__titulo { font-size: clamp(1.75rem, min(4.8vw, 7.2vh), 3.1rem); }
.baraja__aviso {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.baraja__baja {
  position: fixed;
  right: var(--gap);
  bottom: var(--gap);
  z-index: var(--z-contenido);
  margin: 0;
  color: var(--graphite);
  pointer-events: none;
  display: flex;
  align-items: center;
  gap: .7rem;
}
.baraja__baja__rotulo {
  display: inline-block;
  font-size: .95rem;
  font-weight: 300;
  letter-spacing: .02em;
  white-space: nowrap;
  --pico: .7;
  opacity: 0;
  animation: baja 2600ms ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .baraja__baja__rotulo { animation: none; opacity: var(--pico); transform: none; }
}
:root[data-servicio]:not([data-servicio="inicio"]) .baraja__baja__rotulo {
  display: none;
}
.baraja__baja svg {
  display: block;
  width: 2.1rem;
  height: auto;
  overflow: visible;
}
.baraja__baja path {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: baja 2600ms ease-in-out infinite;
}
.baraja__baja path:nth-child(2) { animation-delay: 160ms; }
.baraja__baja path:nth-child(3) { animation-delay: 320ms; }
@keyframes baja {
  0%   { opacity: 0;           transform: translateY(-2px); }
  18%  { opacity: var(--pico); transform: translateY(0); }
  58%  { opacity: var(--pico); transform: translateY(0); }
  85%  { opacity: 0;           transform: translateY(3px); }
  100% { opacity: 0;           transform: translateY(3px); }
}
@media (prefers-reduced-motion: reduce) {
  .baraja__baja path { animation: none; opacity: var(--pico); transform: none; }
}
@media (max-height: 34rem) {
  .baraja { padding-top: calc(var(--gap) + 2rem); align-content: start; touch-action: pan-y pinch-zoom; overflow-y: auto; }
  .baraja__ficha { margin-top: .2rem; }
  .ficha__foco { margin: .35rem 0 .5rem; }
}
@media (max-height: 22rem) {
  .baraja { padding-top: calc(var(--gap) + 1.25rem); }
  .baraja__hoja { gap: .55rem; }
  .baraja__lead { line-height: 1.45; }
  .ficha__foco { margin: .15rem 0 .3rem; }
  .baraja__ficha { row-gap: .3rem; }
}
:root[data-zoom] .baraja { touch-action: auto; overflow-y: auto; }
.puntero {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 9998;
  opacity: 0;
  will-change: transform;
  transition: opacity 180ms ease-out, width 180ms ease-out,
              height 180ms ease-out, border-color 180ms ease-out;
}
:root[data-puntero-dentro] .puntero { opacity: 1; }
:root[data-puntero="texto"] .puntero { opacity: 0; }
.puntero--anillo {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: var(--rule) solid var(--graphite);
}
:root[data-puntero="tocable"] .puntero--anillo {
  width: 15px;
  height: 15px;
  border-color: var(--ink);
}
.puntero--onda {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 9997;
  border-radius: 50%;
  border: var(--rule) solid var(--cobalt);
  will-change: width, height, opacity;
  animation: puntero-onda 620ms linear forwards;
}
.puntero--onda::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  border: var(--rule) solid var(--ink);
  transform: translate(-50%, -50%);
  animation: puntero-onda-dentro 620ms linear forwards;
}
@keyframes puntero-onda {
  0%   { width: 14px; height: 14px; opacity: 0; }
  7%   { opacity: .9; }
  40%  { width: 62px; height: 62px; }
  60%  { opacity: .55; }
  100% { width: 92px; height: 92px; opacity: 0; }
}
@keyframes puntero-onda-dentro {
  0%, 15% { width: 10px; height: 10px; opacity: 0; }
  22%     { opacity: .7; }
  100%    { width: 48px; height: 48px; opacity: 0; }
}
:root[data-puntero-pulsa] .puntero--anillo {
  width: 9px;
  height: 9px;
  border-color: var(--cobalt);
  transition-duration: 90ms;
}
:root[data-cursor] { cursor: var(--puntero); }
:root[data-cursor] :is(a[href], button, [role="button"], summary) {
  cursor: var(--puntero-activo);
}
:root[data-cursor] :is(input, textarea, select, [contenteditable]) { cursor: auto; }
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}
.notas__lista,
.servicios__lista { margin: 0; padding: 0; list-style: none; display: grid; }
.notas__lista > li,
.servicios__lista > li { padding-bottom: calc(var(--gap) * 1.2); }
.notas__lista > li + li,
.servicios__lista > li + li {
  padding-top: calc(var(--gap) * 1.2);
  border-top: var(--rule) solid var(--ash);
}
.notas__lista h2,
.servicios__lista h2 { max-width: 26ch; }
.notas__lista h2 a,
.servicios__lista h2 a { color: var(--ink); text-decoration: none; }
.notas__lista h2 a:hover,
.servicios__lista h2 a:hover { color: var(--cobalt); }
.servicios__lista { margin-top: calc(var(--gap) * 2.1); }
.servicios__lista > li.conn__sec { margin-top: 0; }
.nota__sigue { margin-top: calc(var(--gap) * 1.6); }
.nota__sigue .prose { color: var(--graphite); }
@media print {
  :root {
    color-scheme: light;
    --ink:        #111111;
    --paper:      #FFFFFF;
    --cobalt:     #000000;
    --vermillion: #000000;
    --graphite:   #555555;
    --ash:        #999999;
  }
  .rail, .head, .field { display: none; }
  .sheet, .foot { margin-left: 0; }
  a { color: inherit; }
  .prose a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; color: #555555; }
}
@media (forced-colors: active) {
  .bandera { forced-color-adjust: none; }
}
.vende {
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  margin-bottom: clamp(2rem, 5vw, 3.5rem);
}
@media (min-width: 62rem) {
  .vende { grid-template-columns: minmax(0, 27rem) minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem); }
  .conn .page__head.vende {
    grid-template-columns: var(--margen) minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 0 clamp(2rem, 4vw, 3.5rem);
    align-items: start;
  }
  .conn .page__head.vende > :is(.habla, .buzon, .medicion, .cadena, .calculo) {
    grid-column: 3;
    grid-row: 1 / -1;
    align-self: center;
  }
}
.vende__acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
.vende__accion {
  font: 500 0.95rem/1 var(--grot);
  letter-spacing: -0.01em;
  padding: 0.85rem 1.2rem;
  border: var(--rule) solid var(--ink);
  color: var(--ink);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: background-color 120ms ease-out, color 120ms ease-out;
}
.vende__accion--primaria { background: var(--ink); color: var(--paper); }
.vende__accion:hover { background: var(--ink); color: var(--paper); }
.vende__accion--primaria:hover { background: transparent; color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .vende__accion { transition: none; } }
.vende__garantia {
  font: 0.8rem/1.5 var(--mono);
  color: var(--graphite);
  margin: 0.9rem 0 0;
  max-width: 34ch;
}
.habla {
  border: var(--rule) solid var(--ash);
  background: var(--hueso);
  display: grid;
  gap: 0;
  max-width: 100%;
  font-family: var(--grot);
}
.habla__barra {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.habla__quien { font: 500 0.85rem/1.2 var(--grot); color: var(--ink); }
.habla__canal { font: 0.7rem/1 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--graphite); margin-left: auto; }
.habla__hilo {
  display: grid;
  gap: 0.55rem;
  padding: 0.9rem;
  align-content: start;
}
.habla__msj {
  font-size: 0.87rem;
  line-height: 1.45;
  padding: 0.6rem 0.75rem;
  max-width: 85%;
  border: var(--rule) solid var(--ash);
  color: var(--ink);
  margin: 0;
}
.habla__msj--suyo { justify-self: start; background: var(--paper); }
.habla__msj--nuestro { justify-self: end; background: var(--ash); border-color: transparent; }
.habla__nota {
  font: 0.72rem/1.4 var(--mono);
  color: var(--graphite);
  text-align: center;
  padding: 0.35rem 0;
  margin: 0;
  letter-spacing: 0.02em;
}
.habla__nota b { color: var(--ink); font-weight: 500; }
.habla__pie {
  border-top: var(--rule) solid var(--ash);
  padding: 0.6rem 0.9rem;
  font: 0.72rem/1.4 var(--mono);
  color: var(--graphite);
}
.buzon {
  border: var(--rule) solid var(--ash);
  background: var(--hueso);
  max-width: 100%;
  font-family: var(--grot);
}
.buzon__barra {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.buzon__titulo { font: 500 0.85rem/1.2 var(--grot); color: var(--ink); }
.buzon__cuenta {
  font: 0.7rem/1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--graphite);
  margin-left: auto;
}
.buzon__lista { list-style: none; margin: 0; padding: 0; }
.buzon__fila {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.1rem 0.6rem;
  padding: 0.7rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.buzon__lista > li:last-child .buzon__fila { border-bottom: 0; }
.buzon__quien {
  grid-column: 1;
  grid-row: 1;
  font: 500 0.85rem/1.3 var(--grot);
  color: var(--ink);
  min-width: 0;
  overflow-wrap: anywhere;
}
.buzon__hora {
  grid-column: 2;
  grid-row: 1;
  font: 0.7rem/1.5 var(--mono);
  color: var(--graphite);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.buzon__ultimo {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--graphite);
  overflow-wrap: anywhere;
}
.buzon__meta {
  grid-column: 1 / -1;
  margin: 0.2rem 0 0;
  font: 0.7rem/1.5 var(--mono);
  letter-spacing: 0.02em;
  color: var(--graphite);
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.45rem;
}
.buzon__meta > * { white-space: nowrap; }
.buzon__meta > *:not(:last-child)::after { content: "·"; margin-left: 0.45rem; }
.buzon__canal { text-transform: uppercase; letter-spacing: 0.08em; }
.buzon__meta b { color: var(--ink); font-weight: 500; }
.buzon__fila--sola {
  border-left: 1.5px solid var(--ink);
  padding-left: calc(0.9rem - 1.5px);
}
.buzon__sinnadie { color: var(--ink); font-weight: 500; }
.buzon__pie {
  border-top: var(--rule) solid var(--ash);
  padding: 0.6rem 0.9rem;
  margin: 0;
  font: 0.72rem/1.4 var(--mono);
  color: var(--graphite);
}
.medicion {
  border: var(--rule) solid var(--ash);
  background: var(--hueso);
  font-family: var(--grot);
  margin: 0;
  max-width: 100%;
}
.medicion__cabecera {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  padding: 0.75rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.medicion__url {
  font: 0.72rem/1.3 var(--mono);
  color: var(--ink);
  overflow-wrap: break-word;
}
.medicion__perfil {
  font: 0.7rem/1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--graphite);
  margin-left: auto;
  white-space: nowrap;
}
.medicion__marca {
  padding: 1rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.medicion__rotulo {
  font: 0.7rem/1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--graphite);
  margin: 0;
}
.medicion__cifra {
  font: 500 clamp(2.6rem, 9vw, 3.4rem)/1 var(--grot);
  letter-spacing: var(--apretado);
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  margin: 0.35rem 0 0;
}
.medicion__de {
  font: 0.95rem/1 var(--mono);
  letter-spacing: 0;
  color: var(--graphite);
  margin-left: 0.4rem;
}
.medicion__rango {
  font: 0.72rem/1.5 var(--mono);
  color: var(--graphite);
  margin: 0.6rem 0 0;
}
.medicion__fila {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  column-gap: 0.75rem;
  padding: 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.medicion__sigla {
  font: 0.7rem/1 var(--mono);
  letter-spacing: 0.08em;
  color: var(--graphite);
  margin: 0;
}
.medicion__valor {
  grid-column: 2;
  grid-row: 1 / 3;
  font: 500 1.35rem/1 var(--grot);
  letter-spacing: var(--apretado);
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  margin: 0;
  align-self: center;
  white-space: nowrap;
}
.medicion__que {
  grid-column: 1;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--ink);
  margin: 0.3rem 0 0;
}
.medicion__pista {
  grid-column: 1 / -1;
  position: relative;
  height: 0.5rem;
  margin: 0.85rem 0 0;
  background: var(--ash);
}
.medicion__lleno {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--valor, 0%);
  background: var(--ink);
}
.medicion__umbral {
  position: absolute;
  top: -0.3rem;
  left: var(--x, 50%);
  font: 0.68rem/1 var(--mono);
  color: var(--graphite);
  transform: translateX(-50%);
  padding-top: 1.35rem;
  white-space: nowrap;
}
.medicion__umbral::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: var(--rule);
  height: 1.1rem;
  background: var(--graphite);
}
.medicion__nota {
  grid-column: 1 / -1;
  font: 0.72rem/1.5 var(--mono);
  color: var(--graphite);
  margin: 1.5rem 0 0;
}
.medicion__pie {
  padding: 0.7rem 0.9rem;
  font: 0.72rem/1.5 var(--mono);
  color: var(--graphite);
}
.medicion__pie a {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.cadena {
  border: var(--rule) solid var(--ash);
  background: var(--hueso);
  display: grid;
  gap: 0;
  max-width: 100%;
  font-family: var(--grot);
}
.cadena__barra {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.cadena__quien { font: 500 0.85rem/1.2 var(--grot); color: var(--ink); }
.cadena__rotulo {
  font: 0.7rem/1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--graphite);
  margin-left: auto;
}
.cadena__hilo { display: grid; gap: 0; align-content: start; }
.cadena__paso {
  display: grid;
  grid-template-columns: 2.1rem minmax(0, 1fr);
  gap: 0.1rem 0.75rem;
  padding: 0.7rem 0.9rem;
  border-top: var(--rule) solid var(--ash);
}
.cadena__paso:first-child { border-top: 0; }
.cadena__orden {
  grid-row: 1 / span 2;
  font: 0.72rem/1.6 var(--mono);
  color: var(--graphite);
  letter-spacing: 0.02em;
  margin: 0;
}
.cadena__hecho { font: 500 0.87rem/1.35 var(--grot); color: var(--ink); margin: 0; }
.cadena__dato { font: 0.72rem/1.5 var(--mono); color: var(--graphite); margin: 0; }
.cadena__corte {
  border-top: var(--rule) dashed var(--ash);
  margin: 0;
  padding: 0.55rem 0.9rem 0.55rem 3.75rem;
  font: 0.72rem/1.4 var(--mono);
  letter-spacing: 0.02em;
  color: var(--graphite);
}
.cadena__paso--suelto {
  border-top: 0;
  padding-left: 1.85rem;
}
.cadena__paso--suelto .cadena__hecho { color: var(--cobalt); }
.cadena__paso--suelto .cadena__orden { color: var(--ink); }
.cadena__pie {
  border-top: var(--rule) solid var(--ash);
  padding: 0.6rem 0.9rem;
  font: 0.72rem/1.4 var(--mono);
  color: var(--graphite);
  margin: 0;
}
.calculo {
  margin: 0;
  max-width: 100%;
  min-width: 0;
}
.calculo__marco {
  border: var(--rule) solid var(--ash);
  background: var(--hueso);
  font-family: var(--mono);
}
.calculo__barra {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.7rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.calculo__archivo {
  font: 500 0.78rem/1.3 var(--grot);
  color: var(--ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.calculo__quien {
  font: 0.68rem/1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--graphite);
  margin-left: auto;
  white-space: nowrap;
}
.calculo__formula {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.45rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
  font: 0.72rem/1.4 var(--mono);
  overflow: hidden;
}
.calculo__ref,
.calculo__fx {
  color: var(--graphite);
  padding-right: 0.55rem;
  border-right: var(--rule) solid var(--ash);
  flex: none;
}
.calculo__fx { font-style: italic; }
.calculo__expr {
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.calculo__rejilla {
  display: grid;
  grid-template-columns:
    1.55rem
    minmax(0, 1.55fr)
    minmax(0, 0.9fr)
    minmax(0, 1.05fr)
    minmax(0, 0.95fr);
}
.calculo__letra,
.calculo__fila {
  font: 0.62rem/1 var(--mono);
  letter-spacing: 0.06em;
  color: var(--graphite);
  display: grid;
  place-items: center;
  padding: 0.42rem 0;
  background: var(--paper);
  border-bottom: var(--rule) solid var(--ash);
  border-right: var(--rule) solid var(--ash);
}
.calculo__celda {
  font-size: clamp(0.62rem, 1.75vw, 0.68rem);
  line-height: 1.5;
  padding: 0.34rem 0.42rem;
  color: var(--ink);
  border-bottom: var(--rule) solid var(--ash);
  border-right: var(--rule) solid var(--ash);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.calculo__celda--cabeza { color: var(--graphite); }
.calculo__celda--num { text-align: right; font-variant-numeric: tabular-nums; }
.calculo__celda--rota { color: var(--vermillion); }
.calculo__celda--foco {
  outline: 1.5px solid var(--cobalt);
  outline-offset: -1.5px;
}
.calculo__rejilla > :nth-child(5n) { border-right: 0; }
.calculo__rejilla > :nth-last-child(-n + 5) { border-bottom: 0; }
.calculo__pestanas {
  display: flex;
  border-top: var(--rule) solid var(--ash);
  background: var(--paper);
  overflow-x: auto;
  scrollbar-width: none;
}
.calculo__pestanas::-webkit-scrollbar { display: none; }
.calculo__pestana {
  font: 0.66rem/1 var(--mono);
  color: var(--graphite);
  padding: 0.55rem 0.7rem;
  border-right: var(--rule) solid var(--ash);
  white-space: nowrap;
}
.calculo__pestana:last-child { border-right: 0; }
.calculo__pestana--activa { color: var(--ink); background: var(--hueso); }
.calculo__pie {
  margin: 0.8rem 0 0;
  font: 0.72rem/1.5 var(--mono);
  color: var(--graphite);
  max-width: 42ch;
}
.plegadas { border-top: var(--rule) solid var(--ash); }
.plegadas details { border-bottom: var(--rule) solid var(--ash); }
.plegadas summary {
  font: 0.9rem/1.5 var(--grot);
  color: var(--ink);
  padding: 0.85rem 1.6rem 0.85rem 0;
  cursor: pointer;
  position: relative;
  list-style: none;
}
.plegadas summary::-webkit-details-marker { display: none; }
.plegadas summary::after {
  content: "";
  position: absolute;
  right: 0.3rem;
  top: 50%;
  width: 0.62rem;
  height: 0.62rem;
  margin-top: -0.31rem;
  background:
    linear-gradient(var(--graphite), var(--graphite)) center/100% var(--rule) no-repeat,
    linear-gradient(var(--graphite), var(--graphite)) center/var(--rule) 100% no-repeat;
  transition: transform 140ms ease-out;
}
.plegadas details[open] summary::after { transform: rotate(90deg); background-size: 100% var(--rule), 0 0; }
@media (prefers-reduced-motion: reduce) { .plegadas summary::after { transition: none; } }
.plegadas summary:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: 3px; }
.plegadas p { margin: 0 0 0.9rem; max-width: var(--medida, 68ch); color: var(--graphite); font-size: 0.92rem; }
.conn .lab__escena {
  margin-top: clamp(4.5rem, 10vw, 8.5rem);
  grid-template-columns: var(--margen) minmax(0, 1fr);
  grid-template-areas: ". num" ". txt" ". fig";
  align-items: start;
}
.conn .lab__escena > .lab__num { grid-area: num; }
.conn .lab__escena > .lab__texto { grid-area: txt; min-width: 0; }
.conn .lab__escena > .lab__figura { grid-area: fig; min-width: 0; margin-top: 1.8rem; container-type: inline-size; }
@media (min-width: 62rem) {
  .conn .lab__escena--fig.lab__escena--der {
    grid-template-columns: var(--margen) minmax(0, 25rem) minmax(0, 1fr);
    grid-template-areas: ". num fig" ". txt fig";
    column-gap: clamp(2.5rem, 5vw, 4.5rem);
  }
  .conn .lab__escena--fig.lab__escena--izq {
    grid-template-columns: var(--margen) minmax(0, 1fr) minmax(0, 25rem);
    grid-template-areas: ". fig num" ". fig txt";
    column-gap: clamp(2.5rem, 5vw, 4.5rem);
  }
  .conn .lab__escena--fig > .lab__figura { margin-top: 0; align-self: center; }
  .conn .lab__escena:not(.lab__escena--fig) { grid-template-columns: var(--margen) minmax(0, var(--medida)); }
}
.lab__num {
  margin: 0 0 0.6rem;
  font: 400 clamp(3.6rem, 9vw, 7rem)/0.82 var(--mono);
  letter-spacing: -0.05em;
  color: transparent;
  -webkit-text-stroke: var(--rule) var(--graphite);
  font-variant-numeric: tabular-nums;
  user-select: none;
}
@supports not (-webkit-text-stroke: 1px black) {
  .lab__num { color: var(--ash); }
}
.lab__texto h2 {
  margin: 0;
  font-weight: 500;
  font-size: clamp(1.7rem, 3.3vw, 2.6rem);
  line-height: 1.06;
  letter-spacing: var(--apretado);
  max-width: 20ch;
  scroll-margin-top: 5rem;
}
.lab__linea {
  margin: 1rem 0 0;
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
  line-height: 1.45;
  color: var(--graphite);
  max-width: 38ch;
}
.lab__detalle { margin-top: 1.6rem; border-top: var(--rule) solid var(--ash); }
.lab__detalle summary {
  font: 0.74rem/1 var(--mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--graphite);
  padding: 0.95rem 1.6rem 0.95rem 0;
  cursor: pointer;
  position: relative;
  list-style: none;
  width: max-content;
  max-width: 100%;
}
.lab__detalle summary::-webkit-details-marker { display: none; }
.lab__detalle summary::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 0.62rem;
  height: 0.62rem;
  margin-top: -0.31rem;
  background:
    linear-gradient(var(--graphite), var(--graphite)) center/100% var(--rule) no-repeat,
    linear-gradient(var(--graphite), var(--graphite)) center/var(--rule) 100% no-repeat;
  transition: transform 140ms ease-out;
}
.lab__detalle[open] summary::after { transform: rotate(90deg); background-size: 100% var(--rule), 0 0; }
.lab__detalle summary:hover { color: var(--ink); }
.lab__detalle summary:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: 3px; }
.lab__detalle .prose { padding: 0.2rem 0 0.4rem; font-size: 0.95rem; color: var(--graphite); }
.lab__detalle .prose :is(p, li) { color: var(--graphite); }
@media (min-width: 62rem) {
  .conn .page__head.vende > .politopo {
    grid-column: 3;
    grid-row: 1 / -1;
    align-self: center;
  }
}
.politopo {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: 36rem;
  justify-self: center;
}
.politopo__escena {
  position: relative;
  display: grid;
  width: 100%;
  aspect-ratio: 1;
}
.politopo__quieto,
.politopo__lienzo {
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  display: block;
}
.politopo__lienzo {
  cursor: grab;
  touch-action: pan-y;
  outline: none;
}
.politopo__lienzo[data-agarrado] { cursor: grabbing; }
.politopo__lienzo:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: -1px; }
.politopo[data-vivo] .politopo__quieto { visibility: hidden; }
.politopo__escena::before,
.politopo__escena::after {
  content: "";
  position: absolute;
  width: 1.1rem;
  height: 1.1rem;
  pointer-events: none;
}
.politopo__escena::before { top: 0; left: 0; border-top: var(--rule) solid var(--graphite); border-left: var(--rule) solid var(--graphite); }
.politopo__escena::after { bottom: 0; right: 0; border-bottom: var(--rule) solid var(--graphite); border-right: var(--rule) solid var(--graphite); }
.politopo__quieto line,
.politopo__quieto polyline { fill: none; vector-effect: non-scaling-stroke; }
.politopo__arista { stroke: var(--ink); stroke-width: 1.5; }
.politopo__oculta { stroke: var(--vermillion); stroke-width: 1.5; stroke-dasharray: 4 4; }
.politopo__malla { stroke: var(--graphite); stroke-width: 0.5; }
.politopo__hebra { stroke: var(--ink); stroke-width: 1.5; }
.politopo__hebra--1 { stroke-dasharray: 7 4; }
.politopo__hebra--2 { stroke-dasharray: 1.5 4; }
.politopo__vertice { fill: var(--ink); }
.politopo__pie {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.9rem;
  align-items: baseline;
  min-height: 2.4rem;
  padding-top: 0.7rem;
  font: 0.72rem/1.5 var(--mono);
  color: var(--graphite);
}
.politopo__fig { color: var(--ink); }
.politopo__mano { margin-left: auto; color: var(--ash); }
@media (hover: none) { .politopo__mano { display: none; } }
.juego {
  border: var(--rule) solid var(--ash);
  background: var(--hueso);
  display: grid;
  font-family: var(--grot);
  min-width: 0;
}
.juego [hidden] { display: none !important; }
.juego__barra {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
}
.juego__titulo { font: 500 0.85rem/1.2 var(--grot); color: var(--ink); }
.juego__canal { font: 0.7rem/1 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--graphite); margin-left: auto; text-align: right; }
.juego__accion {
  justify-self: start;
  margin: 0.2rem 0.9rem 0.9rem;
  font: 500 0.85rem/1 var(--grot);
  padding: 0.65rem 0.95rem;
  border: var(--rule) solid var(--ink);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: background-color 120ms ease-out, color 120ms ease-out;
}
.juego__accion:hover,
.juego__accion[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.juego__accion:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: 3px; }
.juego__pie {
  margin: 0;
  padding: 0.65rem 0.9rem;
  border-top: var(--rule) solid var(--ash);
  font: 0.72rem/1.5 var(--mono);
  color: var(--graphite);
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.9rem;
}
.juego__pie a { color: var(--ink); }
.juego input[type="range"] { accent-color: var(--ink); width: 100%; margin: 0; }
.frontera__cuerpo { display: grid; grid-template-columns: minmax(0, 1fr); }
@container (min-width: 30rem) {
  .frontera__cuerpo { grid-template-columns: minmax(0, 1fr) 10.5rem; }
  .frontera__mapa { border-left: var(--rule) solid var(--ash); }
}
.frontera__hilo {
  display: grid;
  gap: 0.55rem;
  padding: 0.9rem;
  align-content: start;
  min-height: 13rem;
  max-height: 20rem;
  overflow-y: auto;
}
.frontera__mapa { width: 100%; max-width: 13rem; justify-self: center; padding: 0.4rem; }
.frontera__borde { fill: none; stroke: var(--ink); stroke-width: 1; stroke-dasharray: 3 3; }
.frontera__fuera { fill: none; stroke: var(--ash); stroke-width: 0.5; }
.frontera__rotulo,
.frontera__punto text { font: 9px var(--mono); fill: var(--graphite); }
.frontera__punto circle { fill: var(--ink); }
.frontera__punto--persona circle { fill: var(--hueso); stroke: var(--ink); stroke-width: 1.2; }
.frontera__punto--declina path { stroke: var(--ink); stroke-width: 1.4; fill: none; }
.frontera__tecleo { text-align: left; }
.frontera__preguntas {
  list-style: none;
  margin: 0;
  padding: 0.9rem;
  border-top: var(--rule) solid var(--ash);
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.frontera__preguntas button {
  font: 0.82rem/1.25 var(--grot);
  text-align: left;
  padding: 0.5rem 0.7rem;
  border: var(--rule) solid var(--graphite);
  background: var(--paper);
  color: var(--ink);
  cursor: pointer;
  transition: border-color 120ms ease-out;
}
.frontera__preguntas button:hover { border-color: var(--ink); }
.frontera__preguntas button:disabled { cursor: default; color: var(--graphite); border-color: var(--ash); text-decoration: line-through; text-decoration-thickness: var(--rule); }
.frontera__preguntas button:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: 2px; }
.hoja .calculo { margin: 0; border: 0; }
.hoja__antes, .hoja__despues { min-width: 0; }
.sistema { display: grid; font-size: 0.85rem; }
.sistema__barra {
  display: flex;
  justify-content: space-between;
  padding: 0.75rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
  font: 500 0.85rem/1.2 var(--grot);
  color: var(--ink);
}
.sistema__fuente { font: 0.7rem/1.2 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--graphite); }
.sistema__fila {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, 0.8fr);
  gap: 0.6rem;
  align-items: center;
  padding: 0.7rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
  color: var(--ink);
}
.sistema__fila > :last-child { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; }
.sistema__fila--cabeza { font: 0.7rem/1 var(--mono); color: var(--graphite); }
.sistema__estado { font: 0.72rem/1 var(--mono); justify-self: start; padding: 0.3rem 0.45rem; border: var(--rule) solid var(--graphite); }
.sistema__estado--pend { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.hoja__mandos {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.9rem 1.4rem;
  padding: 0.9rem;
  border-top: var(--rule) solid var(--ash);
}
.hoja__mandos .juego__accion { margin: 0; }
.hoja__control { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.35rem 0.6rem; flex: 1 1 12rem; font: 0.72rem/1.3 var(--mono); color: var(--graphite); }
.hoja__control > span { grid-column: 1 / -1; }
.hoja__cuantas { font: 0.95rem/1 var(--mono); color: var(--ink); min-width: 1.2ch; }
.hoja__alcance { margin: 0 0.9rem; height: 0.4rem; border: var(--rule) solid var(--ash); position: relative; }
.hoja__alcance span {
  position: absolute;
  inset: 0 auto 0 0;
  width: calc(28% + var(--n, 0) * 14.4%);
  background: var(--ink);
  transition: width 200ms ease-out;
}
.hoja__reglas { list-style: none; margin: 0; padding: 0.6rem 0.9rem 0.9rem; display: grid; gap: 0.4rem; counter-reset: regla; }
.hoja__regla {
  counter-increment: regla;
  font-size: 0.84rem;
  line-height: 1.4;
  color: var(--ink);
  padding: 0.35rem 0 0.35rem 0.75rem;
  border-left: 1.5px solid var(--ink);
}
.hoja__regla::before { content: "regla " counter(regla, decimal-leading-zero) " · "; font: 0.7rem var(--mono); color: var(--graphite); }
.juego--cadena .cadena { border: 0; }
.cadena--unida .cadena__corte { display: none; }
.cadena--unida .cadena__paso--suelto { border-top: var(--rule) solid var(--ash); padding-left: 0.9rem; }
.cadena--unida .cadena__paso--suelto .cadena__hecho::after { content: "  ✓"; font-family: var(--mono); }
.juego--cadena .cadena__despues { border-top: 0; color: var(--ink); }
.honorario__grafica { width: 100%; display: block; padding: 0.6rem 0.4rem 0; }
.honorario__eje { stroke: var(--ash); stroke-width: 0.5; }
.honorario__pct { stroke: var(--ink); stroke-width: 1.5; stroke-dasharray: 5 4; }
.honorario__fijo { stroke: var(--ink); stroke-width: 1.5; }
.honorario__guia { stroke: var(--graphite); stroke-width: 0.5; stroke-dasharray: 2 3; }
.honorario__marca--pct { fill: var(--ink); }
.honorario__marca--fijo { fill: var(--hueso); stroke: var(--ink); stroke-width: 1.5; }
.honorario__rotulo { font: 9px var(--mono); fill: var(--graphite); }
.honorario__rotulo--fijo { fill: var(--ink); }
.honorario__mandos { padding: 0.4rem 0.9rem 0.9rem; display: grid; gap: 0.7rem; }
.honorario__lectura { margin: 0; font-size: 0.9rem; line-height: 1.5; color: var(--graphite); }
.honorario__lectura output { font-family: var(--mono); color: var(--ink); }
.honorario__lectura b { color: var(--ink); font-weight: 500; }
.carga__pista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem; padding: 0.9rem; }
.carga__carril { display: grid; gap: 0.5rem; min-width: 0; }
.carga__quien { margin: 0; font: 500 0.82rem/1.3 var(--grot); color: var(--ink); }
.carga__pantalla {
  aspect-ratio: 3 / 4;
  border: var(--rule) solid var(--ash);
  background: var(--paper);
  padding: 0.55rem;
  display: grid;
  grid-template-rows: 0.7rem 1fr 0.4rem 0.4rem 0.4rem;
  gap: 0.4rem;
}
.carga__pantalla span { background: var(--ash); }
.carga__pantalla span:nth-child(1) { width: 55%; opacity: clamp(0, calc(var(--p) * 5), 1); }
.carga__pantalla span:nth-child(2) { opacity: clamp(0, calc(var(--p) * 5 - 1), 1); background: var(--trama), var(--ash); }
.carga__pantalla span:nth-child(3) { opacity: clamp(0, calc(var(--p) * 5 - 2), 1); }
.carga__pantalla span:nth-child(4) { width: 80%; opacity: clamp(0, calc(var(--p) * 5 - 3), 1); }
.carga__pantalla span:nth-child(5) { width: 62%; opacity: clamp(0, calc(var(--p) * 5 - 4), 1); }
.carga__reloj { margin: 0; font: 400 clamp(1.5rem, 9cqi, 2.4rem)/1 var(--mono); color: var(--ink); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.carga__que { margin: 0; font: 0.7rem/1.3 var(--mono); color: var(--graphite); }
.carga__carril[data-listo] .carga__que::before { content: "✓ "; color: var(--ink); }
.dueno__asignar { display: inline-flex; gap: 0.3rem; flex-wrap: wrap; }
.dueno__boton {
  font: 0.7rem/1 var(--mono);
  padding: 0.3rem 0.5rem;
  border: var(--rule) solid var(--ink);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
}
.dueno__boton:hover { background: var(--ink); color: var(--paper); }
.dueno__boton:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: 2px; }
.dueno .juego__accion { margin-top: 0.9rem; }
.dueno__cuenta { font-family: var(--mono); color: var(--ink); }
.lab__instalado {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr));
  gap: 0.75rem;
  counter-reset: pieza;
}
.lab__instalado li {
  counter-increment: pieza;
  position: relative;
  padding: 2.6rem 1rem 1.1rem;
  border: var(--rule) solid var(--ash);
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--ink);
  transition: border-color 150ms ease-out;
}
.lab__instalado li::before {
  content: counter(pieza, decimal-leading-zero);
  position: absolute;
  top: 0.8rem;
  left: 1rem;
  font: 0.72rem/1 var(--mono);
  color: var(--graphite);
}
.lab__instalado li::after {
  content: "";
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  width: 0.7rem;
  height: 0.7rem;
  border-top: 1.5px solid var(--ink);
  border-right: 1.5px solid var(--ink);
}
.lab__instalado li:hover { border-color: var(--ink); }
.lab__tachado { list-style: none; margin: 0; padding: 0; border-top: var(--rule) solid var(--ash); }
.lab__tachado li {
  position: relative;
  padding: 0.85rem 0;
  border-bottom: var(--rule) solid var(--ash);
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  line-height: 1.3;
  letter-spacing: -0.012em;
  color: var(--graphite);
  transition: color 300ms linear;
}
.lab__tachado li::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1.5px;
  background: var(--ink);
  transform-origin: left center;
  transition: transform 520ms linear;
}
.lab__tachado li:nth-child(2)::after { transition-delay: 140ms; }
.lab__tachado li:nth-child(3)::after { transition-delay: 280ms; }
.lab__tachado li:nth-child(4)::after { transition-delay: 420ms; }
.lab__tachado li:nth-child(5)::after { transition-delay: 560ms; }
.lab__tachado[data-armado]:not([data-tachado]) li { color: var(--ink); }
.lab__tachado[data-armado]:not([data-tachado]) li::after { transform: scaleX(0); }
.lab__plazo {
  margin: 0;
  padding: clamp(1.4rem, 3vw, 2.2rem) 0;
  border-top: var(--rule) solid var(--ash);
  border-bottom: var(--rule) solid var(--ash);
  font: 400 clamp(1.6rem, 5.2cqi, 3.2rem)/1.15 var(--mono);
  letter-spacing: -0.03em;
  color: var(--ink);
}
.lab__plazo-igual { color: var(--graphite); }
.lab__plazo-x { font-family: var(--serif); font-style: italic; letter-spacing: -0.01em; }
.lab__cifras {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 0 1.5rem;
}
.lab__cifras a {
  display: grid;
  gap: 0.55rem;
  padding: 1.1rem 0 1.3rem;
  border-top: 1.5px solid var(--ink);
  text-decoration: none;
  color: inherit;
}
.lab__cifra {
  font: 400 clamp(1.9rem, 7cqi, 3.4rem)/1 var(--mono);
  letter-spacing: -0.045em;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.lab__cifra-rotulo { font-size: 0.86rem; line-height: 1.45; color: var(--graphite); }
.lab__cifras a:hover .lab__cifra { color: var(--cobalt); }
.lab__cifras a:hover .lab__cifra-rotulo { color: var(--ink); }
.lab__cifras a:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: 4px; }
.lab__bitacora { margin: 0; border: var(--rule) solid var(--ash); background: var(--hueso); }
.lab__bitacora-titulo {
  padding: 0.7rem 0.9rem;
  border-bottom: var(--rule) solid var(--ash);
  font: 0.7rem/1.2 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--graphite);
}
.lab__bitacora ul { list-style: none; margin: 0; padding: 0.4rem 0; }
.lab__bitacora li {
  display: grid;
  grid-template-columns: 6.2rem minmax(0, 1fr);
  gap: 0.8rem;
  padding: 0.5rem 0.9rem;
  font: 0.84rem/1.4 var(--mono);
  color: var(--ink);
}
.lab__bitacora-marca { color: var(--graphite); }
.lab__bitacora li + li { border-top: var(--rule) dashed var(--ash); }
.lab__recorrido { list-style: none; margin: 0; padding: 0; display: grid; }
.lab__recorrido li {
  position: relative;
  display: grid;
  grid-template-columns: 2.6rem minmax(0, 1fr);
  align-items: center;
  padding: 0.95rem 0 0.95rem;
  border-top: var(--rule) solid var(--ash);
}
.lab__recorrido li:last-child { border-bottom: var(--rule) solid var(--ash); }
.lab__recorrido li + li::before {
  content: "";
  position: absolute;
  top: -0.3rem;
  left: 0.55rem;
  width: 0.5rem;
  height: 0.5rem;
  border-right: 1.5px solid var(--ink);
  border-bottom: 1.5px solid var(--ink);
  background: var(--paper);
  transform: rotate(45deg);
}
.lab__recorrido-n { font: 0.72rem/1 var(--mono); color: var(--graphite); }
.lab__recorrido-p { font-size: clamp(1.05rem, 2vw, 1.3rem); letter-spacing: -0.012em; color: var(--ink); }
html[data-ficha-pasos],
html[data-ficha-pasos] body { height: 100%; overflow: hidden; overscroll-behavior: none; }
html[data-ficha-pasos] .foot { display: none; }
html[data-ficha-pasos] .head { pointer-events: none; }
html[data-ficha-pasos] .head * { pointer-events: auto; }
html[data-ficha-pasos] .head {
  position: fixed;
  top: 0;
  left: var(--rail);
  right: 0;
  margin: 0;
  min-height: 3.4rem;
  padding: clamp(0.8rem, 2vh, 1.5rem) var(--gap) 0;
  align-items: center;
}
main[data-pasos] {
  position: fixed;
  inset: 0 0 0 var(--rail);
  max-width: none;
  padding: 0;
  gap: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  align-content: stretch;
  z-index: var(--z-contenido);
}
main[data-pasos] > article {
  position: relative;
  min-height: 0;
  height: 100%;
  align-self: stretch;
  width: 100%;
  max-width: 78rem;
  margin-inline: auto;
}
main[data-pasos] .page__back { display: none; }
main[data-pasos] .pasos__panel {
  position: absolute;
  inset: 0 var(--gap);
  margin: 0;
  max-width: none;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  align-content: safe center;
  padding-block: clamp(0.75rem, 2.5vh, 2rem);
  opacity: 0;
  visibility: hidden;
  transform: translateX(calc(var(--dir, 1) * 2.5rem));
  transition: opacity 200ms ease-out, transform 260ms ease-out, visibility 0s linear 260ms;
}
main[data-pasos] .pasos__panel[data-activo] {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity 200ms ease-out, transform 260ms ease-out, visibility 0s;
}
main[data-pasos] .lab__escena { margin: 0; }
main[data-pasos] .lab__num { font-size: clamp(2.6rem, 7vh, 6rem); }
main[data-pasos] .politopo { max-width: min(36rem, 62vh); }
main[data-pasos] .nota__sigue { grid-template-columns: var(--margen) minmax(0, 1fr); }
main[data-pasos] .nota__sigue .prose { max-width: none; }
main[data-pasos] .nota__sigue ul { display: block; columns: 17rem auto; column-gap: 2.2rem; padding-left: 1rem; }
main[data-pasos] .nota__sigue li { break-inside: avoid; margin: 0 0 0.5rem; font-size: 0.86rem; line-height: 1.35; }
.pasos__barra {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-height: 3.4rem;
  padding: clamp(0.8rem, 2vh, 1.5rem) calc(var(--gap) + 2.6rem) 0 var(--gap);
}
.pasos__donde {
  margin: 0;
  min-width: 0;
  display: flex;
  gap: 0.9rem;
  font: 0.72rem/1.3 var(--mono);
  color: var(--graphite);
  white-space: nowrap;
  overflow: hidden;
}
.pasos__aqui { color: var(--ink); overflow: hidden; text-overflow: ellipsis; }
.pasos__barra[data-inicio] .pasos__cejilla { visibility: hidden; }
.pasos__wa.vende__accion { margin-left: auto; padding: 0.6rem 0.95rem; font-size: 0.85rem; flex: none; }
.pasos__nav {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  padding: 0.85rem var(--gap) clamp(0.85rem, 2vh, 1.4rem);
  border-top: var(--rule) solid var(--ash);
  background: var(--paper);
}
.pasos__progreso {
  position: absolute;
  top: -1px;
  left: 0;
  height: 1.5px;
  width: calc(var(--p, 0) * 100%);
  background: var(--ink);
  transition: width 260ms ease-out;
}
.pasos__antes,
.pasos__despues {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font: 500 0.92rem/1 var(--grot);
  padding: 0.85rem 1.1rem;
  border: var(--rule) solid var(--ink);
  cursor: pointer;
  transition: background-color 120ms ease-out, color 120ms ease-out, opacity 120ms ease-out;
}
.pasos__antes { background: transparent; color: var(--ink); border-color: var(--ash); }
.pasos__antes:hover:not(:disabled) { border-color: var(--ink); }
.pasos__despues { background: var(--ink); color: var(--paper); max-width: min(30rem, 42vw); justify-self: end; }
.pasos__despues:hover:not(:disabled) { background: transparent; color: var(--ink); }
.pasos__despues-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pasos__antes:disabled,
.pasos__despues:disabled { opacity: 0.3; cursor: default; }
.pasos__antes:focus-visible,
.pasos__despues:focus-visible,
.pasos__punto:focus-visible { outline: var(--rule) solid var(--ink); outline-offset: 3px; }
.pasos__puntos {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 0.15rem;
  min-width: 0;
}
.pasos__punto {
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 50%;
  border: var(--rule) solid transparent;
  background: none;
  font: 0.7rem/1 var(--mono);
  color: var(--graphite);
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  transition: border-color 150ms ease-out, color 150ms ease-out;
}
.pasos__punto[data-visto] { color: var(--ink); }
.pasos__punto:hover { border-color: var(--graphite); color: var(--ink); }
.pasos__punto[data-activo] { border-color: var(--ink); color: var(--ink); }
.pasos__cuenta { display: none; font: 0.75rem/1 var(--mono); color: var(--graphite); font-variant-numeric: tabular-nums; }
@media (max-width: 61.99rem) {
  .pasos__puntos { display: none; }
  .pasos__cuenta { display: block; justify-self: center; }
  .pasos__antes { padding: 0.85rem 0.95rem; }
  .pasos__antes-txt { display: none; }
  .pasos__despues { max-width: 62vw; padding: 0.85rem 1rem; }
  .pasos__barra { min-height: 3rem; }
  html[data-ficha-pasos] .head { min-height: 3rem; }
  .pasos__cejilla { display: none; }
  main[data-pasos] .lab__num { display: none; }
  main[data-pasos] .lab__linea { margin-top: 0.6rem; }
  main[data-pasos] .lab__escena > .lab__figura { margin-top: 1.1rem; }
  main[data-pasos] .page__head .vende__acciones,
  main[data-pasos] .page__head .vende__garantia { display: none; }
  main[data-pasos] .page__head .page__lead { font-size: 1rem; }
  .pasos__wa.vende__accion { padding: 0.5rem 0.7rem; font-size: 0.8rem; }
  main[data-pasos] .lab__instalado { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
  main[data-pasos] .lab__instalado li { padding: 1.9rem 0.7rem 0.7rem; font-size: 0.8rem; line-height: 1.4; }
  main[data-pasos] .lab__instalado li::before { top: 0.65rem; left: 0.7rem; }
  main[data-pasos] .lab__instalado li::after { top: 0.6rem; right: 0.6rem; }
  main[data-pasos] .nota__sigue li:nth-child(n + 9) { display: none; }
}
@container (max-width: 29.99rem) {
  .frontera__mapa { display: none; }
}
@media (max-height: 40rem) {
  main[data-pasos] .lab__num { display: none; }
}
main[data-pasos] .lab__escena > .lab__num,
main[data-pasos] .pasos__panel > .conn__num {
  position: absolute;
  z-index: 0;
  top: 50%;
  margin: 0;
  transform: translateY(-50%);
  font: 400 min(46vh, 17vw)/0.78 var(--mono);
  letter-spacing: -0.06em;
  color: transparent;
  -webkit-text-stroke: var(--rule) var(--graphite);
  opacity: 0.45;
  pointer-events: none;
  user-select: none;
}
main[data-pasos] .lab__escena--der > .lab__num { left: calc(var(--margen) - 1.5vw); }
main[data-pasos] .lab__escena--izq > .lab__num,
main[data-pasos] .pasos__panel > .conn__num { right: -1vw; }
main[data-pasos] .lab__escena > :is(.lab__texto, .lab__figura),
main[data-pasos] .pasos__panel > :not(.conn__num) { position: relative; z-index: 1; }
main[data-pasos] .pasos__panel[data-tipo="notas"] > .conn__num { display: none; }
main[data-pasos] .lab__texto h2 { font-size: clamp(2rem, 3.9vw, 3.5rem); line-height: 1.02; max-width: 15ch; }
main[data-pasos] .lab__linea { font-size: clamp(1.08rem, 1.45vw, 1.3rem); max-width: 32ch; }
main[data-pasos] .lab__figura::after {
  content: "fig. " attr(data-fig);
  display: block;
  margin-top: 0.7rem;
  font: 0.7rem/1 var(--mono);
  color: var(--graphite);
}
main[data-pasos] .lab__figura > :is(.lab__plazo-caja, .lab__tachado, .lab__cifras, .lab__recorrido) {
  background: var(--paper);
  padding: 1.2rem;
  margin: -1.2rem;
}
main[data-pasos] .lab__instalado li { background: var(--paper); }
.pasos__fondo { display: none; }
html[data-ficha-pasos] .pasos__fondo {
  display: block;
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  width: min(92vh, 60vw);
  aspect-ratio: 1;
  pointer-events: none;
  opacity: 0;
  --x: 24vw;
  transform: translate(calc(-50% + var(--x)), -50%);
  transition: transform 640ms ease-out, opacity 400ms ease-out;
}
main[data-pasos] > article { z-index: 1; }
main[data-pasos][data-tipo="escena"] .pasos__fondo { opacity: 0.16; }
main[data-pasos][data-tipo="escena"][data-lado="izq"] .pasos__fondo { --x: -18vw; }
main[data-pasos][data-tipo="preguntas"] .pasos__fondo { opacity: 0.1; --x: 26vw; }
main[data-pasos][data-tipo="cierre"] .pasos__fondo { opacity: 0.55; --x: 30vw; }
main[data-pasos][data-tipo="notas"] .pasos__fondo { opacity: 0.06; --x: 0vw; }
@media (max-width: 61.99rem) {
  html[data-ficha-pasos] .pasos__fondo { width: 130vw; --x: 18vw; }
  main[data-pasos][data-tipo="escena"][data-lado="izq"] .pasos__fondo { --x: 18vw; }
  main[data-pasos][data-tipo="escena"] .pasos__fondo { opacity: 0.1; }
  main[data-pasos][data-tipo="cierre"] .pasos__fondo { opacity: 0.25; --x: 10vw; }
  main[data-pasos] .lab__escena > .lab__num,
  main[data-pasos] .pasos__panel > .conn__num {
    display: block;
    top: 0;
    right: -2vw;
    left: auto;
    transform: none;
    font-size: 42vw;
    opacity: 0.35;
  }
}
@media (max-height: 40rem) {
  main[data-pasos] .lab__escena > .lab__num,
  main[data-pasos] .pasos__panel > .conn__num { display: none; }
}
.faq__visor { display: none; }
@media (min-width: 62rem) {
  main[data-pasos] .pasos__faq {
    grid-template-columns: var(--margen) minmax(0, 25rem) minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: clamp(2.5rem, 5vw, 4.5rem);
  }
  main[data-pasos] .pasos__faq > h2 { grid-column: 2; grid-row: 1; font-size: clamp(1.8rem, 3vw, 2.6rem); max-width: 16ch; }
  main[data-pasos] .pasos__faq > .plegadas { grid-column: 2; grid-row: 2; }
  main[data-pasos] .pasos__faq > .faq__visor { grid-column: 3; grid-row: 1 / -1; align-self: center; }
  main[data-pasos] .pasos__faq .plegadas details > p { display: none; }
  main[data-pasos] .pasos__faq .plegadas summary::after { display: none; }
  main[data-pasos] .pasos__faq .plegadas details[open] > summary {
    color: var(--cobalt);
    padding-left: 0.9rem;
    border-left: 1.5px solid var(--ink);
  }
  main[data-pasos] .pasos__faq .plegadas summary { transition: padding-left 150ms ease-out; padding-right: 0; }
  main[data-pasos] .faq__visor {
    display: grid;
    align-content: start;
    gap: 1.1rem;
    min-height: 19rem;
    padding: clamp(1.5rem, 3vw, 2.6rem);
    border: var(--rule) solid var(--ash);
    background: var(--hueso);
  }
  .faq__n { margin: 0; font: 0.72rem/1 var(--mono); color: var(--graphite); }
  .faq__q { margin: 0; font-weight: 500; font-size: clamp(1.4rem, 2.3vw, 2rem); line-height: 1.12; letter-spacing: var(--apretado); max-width: 22ch; }
  .faq__r { margin: 0; font-size: 1.04rem; line-height: 1.62; color: var(--ink); max-width: 54ch; }
}
.lab__plazo-caja { display: grid; gap: 1.5rem; }
.lab__plazo-casos { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.1rem; }
.lab__plazo-casos li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.45rem 1rem; align-items: baseline; }
.lab__plazo-si { font-size: 0.95rem; color: var(--ink); }
.lab__plazo-cuanto { font: 0.76rem/1.3 var(--mono); color: var(--graphite); text-align: right; }
.lab__plazo-barra { grid-column: 1 / -1; height: 0.6rem; border: var(--rule) solid var(--ash); position: relative; }
.lab__plazo-barra span { position: absolute; inset: 0 auto 0 0; width: calc(var(--largo, 0.5) * 100%); background: var(--ink); }
.lab__plazo-casos li + li .lab__plazo-barra span { background: var(--trama), var(--graphite); }
main[data-pasos] .pasos__panel[data-activo] .lab__plazo-barra span { animation: lab-crece 900ms linear both; }
main[data-pasos] .pasos__panel[data-activo] .lab__plazo-casos li + li .lab__plazo-barra span { animation-delay: 180ms; }
@keyframes lab-crece { from { width: 0; } }
main[data-pasos] .vende__cierre { grid-template-columns: var(--margen) minmax(0, 46rem); }
main[data-pasos] .vende__cierre h2 {
  font-size: clamp(2.6rem, 6.2vw, 5.4rem);
  line-height: 0.98;
  letter-spacing: var(--apretado);
  max-width: 13ch;
  margin-bottom: 1.4rem;
}
main[data-pasos] .vende__cierre .prose p { font-size: clamp(1.1rem, 1.6vw, 1.35rem); color: var(--graphite); max-width: 36ch; }
main[data-pasos] .vende__cierre .vende__accion { font-size: 1.05rem; padding: 1.05rem 1.5rem; }
.vende__correo { margin: 0.7rem 0 0; font: 0.78rem/1.5 var(--mono); color: var(--graphite); }
.vende__correo a { color: var(--ink); }
.pasos__pista {
  display: none;
  position: absolute;
  right: var(--gap);
  bottom: calc(100% + 0.7rem);
  font: 0.7rem/1 var(--mono);
  letter-spacing: 0.04em;
  color: var(--graphite);
  pointer-events: none;
}
main[data-pasos][data-paso="0"] .pasos__pista { display: block; }
@media (max-height: 50rem), (max-width: 61.99rem) {
  main[data-pasos] .carga__pantalla { aspect-ratio: 4 / 3; }
}
main[data-compacto] .pasos__panel[data-vista="texto"] > .lab__figura { display: none; }
main[data-compacto] .pasos__panel[data-vista="figura"] > :is(.lab__texto, .lab__num) { display: none; }
main[data-compacto] .pasos__panel[data-vista="figura"] > .lab__figura { margin-top: 0; }
main[data-compacto] .pasos__panel[data-vista="texto"] .lab__texto h2 { font-size: clamp(2rem, 9.5vw, 3rem); }
main[data-compacto] .pasos__panel[data-vista="texto"] .lab__linea { font-size: clamp(1.1rem, 4.6vw, 1.3rem); }
main[data-compacto] .politopo__pie > span:nth-child(2) { display: none; }
@media (min-width: 44rem) and (max-width: 61.99rem) {
  main[data-pasos] .lab__escena--fig.lab__escena--der {
    grid-template-columns: minmax(0, 15rem) minmax(0, 1fr);
    grid-template-areas: "num fig" "txt fig";
    column-gap: 1.75rem;
  }
  main[data-pasos] .lab__escena--fig.lab__escena--izq {
    grid-template-columns: minmax(0, 1fr) minmax(0, 15rem);
    grid-template-areas: "fig num" "fig txt";
    column-gap: 1.75rem;
  }
  main[data-pasos] .lab__escena--fig > .lab__figura { margin-top: 0; align-self: center; }
  main[data-pasos] .lab__escena .lab__texto h2 { font-size: clamp(1.6rem, 3.8vw, 2.2rem); }
  main[data-pasos] .lab__escena .lab__linea { font-size: 1.02rem; }
  main[data-pasos] .lab__escena > .lab__num {
    top: 50%;
    transform: translateY(-50%);
    font-size: 30vw;
  }
  main[data-pasos] .lab__escena--der > .lab__num { left: 0; right: auto; }
  main[data-pasos] .lab__escena--izq > .lab__num { right: 0; left: auto; }
}
@media (pointer: coarse) {
  html[data-ficha-pasos] .theme { min-width: 2.75rem; min-height: 2.75rem; justify-content: center; align-items: center; }
  .pasos__barra { padding-right: calc(var(--gap) + 3.2rem); }
  main[data-pasos] :is(.vende__accion, .juego__accion, .pasos__antes, .pasos__despues) { min-height: 2.75rem; }
  .pasos__punto { width: 2.75rem; height: 2.75rem; }
  .frontera__preguntas button { min-height: 2.75rem; padding: 0.6rem 0.8rem; }
  .dueno__boton { min-height: 2.5rem; padding: 0.5rem 0.85rem; font-size: 0.78rem; }
  .juego input[type="range"] { height: 2.75rem; }
  .lab__detalle summary { padding-block: 1.1rem; }
  main[data-pasos] .plegadas summary { padding-block: 1rem; }
  main[data-pasos] .nota__sigue li { margin-bottom: 0.85rem; }
}
@media (max-height: 32.5rem) {
  .pasos__barra,
  html[data-ficha-pasos] .head { min-height: 2.75rem; padding-top: 0.3rem; }
  .pasos__nav { padding-block: 0.35rem; }
  .pasos__antes, .pasos__despues { padding-block: 0.55rem; }
  main[data-pasos] .pasos__panel { padding-block: 0.4rem; }
  main[data-pasos][data-paso="0"] .pasos__pista { display: none; }
  main[data-pasos] .page__head.vende { grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); column-gap: 1.5rem; align-items: center; }
  main[data-pasos] .page__head.vende > * { grid-column: 1; }
  main[data-pasos] .page__head.vende > .politopo { grid-column: 2; grid-row: 1 / span 6; }
  main[data-pasos] .page__head .page__title { font-size: clamp(1.8rem, 6vh, 2.4rem); }
  main[data-compacto] .pasos__panel[data-vista="texto"] .lab__texto h2,
  main[data-pasos] .lab__texto h2,
  main[data-pasos] .vende__cierre h2,
  main[data-pasos] .pasos__faq > h2 { font-size: clamp(1.4rem, 7vh, 2.1rem); }
  main[data-compacto] .pasos__panel[data-vista="texto"] .lab__linea { font-size: 1rem; }
}
.pasos__nav { padding-bottom: calc(clamp(0.85rem, 2vh, 1.4rem) + env(safe-area-inset-bottom, 0px)); }
main[data-pasos] .lab__escena--izq > .lab__num,
main[data-pasos] .pasos__panel > .conn__num { right: 0; }
main[data-pasos] .lab__figura > :is(.lab__plazo-caja, .lab__tachado, .lab__cifras, .lab__recorrido) { margin-inline: 0; padding-inline: 0; }
main[data-compacto] .page__head .page__title { font-size: clamp(1.9rem, min(8.5vw, 6.5vh), 2.6rem); }
main[data-compacto] .page__head .page__lead { font-size: 0.95rem; }
main[data-compacto] .pasos__faq > h2 { font-size: clamp(1.5rem, min(7vw, 5vh), 2rem); margin-bottom: 0.6rem; }
main[data-compacto] .plegadas summary { font-size: 0.88rem; padding-block: 0.75rem; }
main[data-compacto] .vende__cierre h2 { font-size: clamp(1.9rem, min(9vw, 7vh), 2.6rem); margin-bottom: 0.8rem; }
main[data-compacto] .vende__cierre .prose p { font-size: 1rem; }
main[data-compacto] .vende__cierre .vende__acciones { margin-top: 1rem; }
main[data-compacto] .vende__cierre .vende__accion { font-size: 0.95rem; padding: 0.8rem 1.1rem; }
main[data-compacto] .nota__sigue li:nth-child(n + 7) { display: none; }
main[data-compacto] .nota__sigue h2 { font-size: clamp(1.4rem, 6vw, 1.8rem); }
main[data-compacto] .frontera__hilo { min-height: 7rem; max-height: 11rem; }
main[data-compacto] .frontera__preguntas { gap: 0.35rem; padding: 0.7rem; }
main[data-compacto] .frontera__preguntas button { font-size: 0.8rem; }
main[data-compacto] .dueno .buzon__fila { padding-block: 0.55rem; }
main[data-compacto] .dueno .buzon__ultimo { display: none; }
@media (min-width: 62rem) and (max-height: 50rem) {
  main[data-pasos] .nota__sigue li:nth-child(n + 22) { display: none; }
}
@media (max-height: 45rem) {
  main[data-pasos] .nota__sigue li:nth-child(n + 16) { display: none; }
}
@media (max-height: 32.5rem) {
  main[data-pasos] .page__head .page__lead {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}
main[data-compacto] .hoja .calculo__pie { display: none; }
@media (max-height: 36rem) {
  main[data-compacto] .plegadas summary { padding-block: 0.6rem; }
}
main[data-pasos] .lab__detalle[open] > .prose {
  position: fixed;
  z-index: 8;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  max-width: none;
  overflow: visible;
  background: var(--ink);
  color: var(--paper);
  border: var(--rule) solid var(--ink);
  animation: lab-nota 180ms ease-out both;
}
@keyframes lab-nota { from { opacity: 0; transform: translateY(6px); } }
main[data-pasos] .lab__detalle[open] > .prose[data-hacia="arriba"] { animation-name: lab-nota-arriba; }
@keyframes lab-nota-arriba { from { opacity: 0; transform: translateY(-6px); } }
main[data-pasos] .lab__detalle[open] > .prose::before {
  content: "";
  position: absolute;
  inset: 0;
  transform: translate(7px, 7px);
  border-right: var(--rule) solid var(--graphite);
  border-bottom: var(--rule) solid var(--graphite);
  pointer-events: none;
}
main[data-pasos] .lab__detalle[open] > .prose::after {
  content: "";
  position: absolute;
  left: var(--galon, 24px);
  width: 0.7rem;
  height: 0.7rem;
  border-left: 1.5px solid var(--ink);
  border-top: 1.5px solid var(--ink);
  pointer-events: none;
}
main[data-pasos] .lab__detalle[open] > .prose[data-hacia="abajo"]::after { top: -0.75rem; transform: rotate(45deg); }
main[data-pasos] .lab__detalle[open] > .prose[data-hacia="arriba"]::after { bottom: -0.75rem; transform: rotate(225deg); }
.lab__nota-cabeza { display: none; }
main[data-pasos] .lab__nota-cabeza {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.55rem 0.55rem 0.55rem 1.1rem;
  border-bottom: var(--rule) solid var(--paper);
  position: relative;
  isolation: isolate;
}
main[data-pasos] .lab__nota-cabeza::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--paper);
  opacity: 0.28;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M-1 5 5-1M2 8 8 2' stroke='black' stroke-width='.6' fill='none'/%3E%3C/svg%3E") repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M-1 5 5-1M2 8 8 2' stroke='black' stroke-width='.6' fill='none'/%3E%3C/svg%3E") repeat;
}
.lab__nota-rotulo { font: 0.7rem/1 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--paper); }
.lab__nota-cerrar {
  width: 2.25rem;
  height: 2.25rem;
  display: inline-grid;
  place-items: center;
  border: var(--rule) solid var(--paper);
  border-radius: 50%;
  background: var(--ink);
  color: var(--paper);
  font: 400 1.1rem/1 var(--grot);
  cursor: pointer;
  transition: background-color 120ms ease-out, color 120ms ease-out;
}
.lab__nota-cerrar:hover { background: var(--paper); color: var(--ink); }
.lab__nota-cerrar:focus-visible { outline: var(--rule) solid var(--paper); outline-offset: 2px; }
@media (pointer: coarse) { .lab__nota-cerrar { width: 2.75rem; height: 2.75rem; } }
main[data-pasos] .lab__nota-cuerpo {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1.1rem 1.3rem 1.3rem 2.6rem;
  display: grid;
  align-content: start;
  gap: 0.85rem;
  counter-reset: parrafo;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--paper) 45%, transparent) transparent;
}
main[data-pasos] .lab__nota-cuerpo :is(p, li) {
  margin: 0;
  color: var(--paper);
  font-size: 0.95rem;
  line-height: 1.55;
}
main[data-pasos] .lab__nota-cuerpo > p { position: relative; counter-increment: parrafo; }
main[data-pasos] .lab__nota-cuerpo > p::before {
  content: "¶" counter(parrafo);
  position: absolute;
  left: -1.6rem;
  top: 0.2rem;
  font: 0.62rem/1 var(--mono);
  color: color-mix(in srgb, var(--paper) 55%, transparent);
}
main[data-pasos] .lab__nota-cuerpo > p:first-child { font-size: 1.08rem; line-height: 1.45; letter-spacing: -0.01em; }
main[data-pasos] .lab__nota-cuerpo a { color: var(--paper); border-bottom-color: var(--paper); }
main[data-pasos] .lab__nota-cuerpo :is(ul, ol) { padding-left: 1.1rem; }
main[data-pasos] .lab__detalle[open] > summary { color: var(--ink); }
main[data-nota] .pasos__panel[data-activo] > .lab__texto { z-index: 3; }
main[data-compacto] .lab__nota-cuerpo { padding: 0.9rem 1rem 1rem 2.2rem; gap: 0.7rem; }
main[data-compacto] .lab__nota-cuerpo :is(p, li) { font-size: 0.88rem; line-height: 1.5; }
main[data-compacto] .lab__nota-cuerpo > p:first-child { font-size: 0.98rem; }
main[data-pasos] :is(.pasos__panel, .frontera__hilo) {
  scrollbar-width: thin;
  scrollbar-color: var(--ash) transparent;
}
main[data-pasos] :is(.pasos__panel, .frontera__hilo)::-webkit-scrollbar { width: 6px; height: 6px; }
main[data-pasos] :is(.pasos__panel, .frontera__hilo)::-webkit-scrollbar-track { background: transparent; }
main[data-pasos] :is(.pasos__panel, .frontera__hilo)::-webkit-scrollbar-thumb { background: var(--ash); border-radius: 3px; }
main[data-pasos] :is(.pasos__panel, .frontera__hilo)::-webkit-scrollbar-thumb:hover { background: var(--graphite); }
main[data-pasos] .pal { display: inline-block; }
main[data-pasos] .pasos__panel[data-entra] .pal {
  animation: lab-pal 620ms cubic-bezier(0.2, 0.7, 0.15, 1) both;
  animation-delay: calc(var(--i, 0) * 42ms + 60ms);
}
@keyframes lab-pal {
  from { opacity: 0; transform: translateY(0.6em) rotate(1.5deg); }
}
main[data-pasos] .pasos__panel[data-entra] :is(.lab__linea, .page__lead) {
  animation: lab-sube 560ms cubic-bezier(0.2, 0.7, 0.15, 1) both;
  animation-delay: 380ms;
}
main[data-pasos] .pal--clave {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--cobalt);
  position: relative;
  padding-right: 0.06em;
}
main[data-pasos] .pal--clave::after {
  content: "";
  position: absolute;
  left: 0.04em;
  right: 0.08em;
  bottom: 0.04em;
  height: 1.5px;
  background: currentColor;
  transform-origin: left center;
  transform: scaleX(1);
}
main[data-pasos] .pasos__panel[data-entra] .pal--clave::after {
  animation: lab-filete 700ms cubic-bezier(0.6, 0, 0.2, 1) both;
  animation-delay: calc(var(--n, 6) * 42ms + 260ms);
}
@keyframes lab-filete { from { transform: scaleX(0); } }
main[data-pasos] .pasos__panel[data-entra] > :is(.lab__num, .conn__num) {
  animation: lab-num 900ms cubic-bezier(0.2, 0.7, 0.15, 1) both;
}
@keyframes lab-num { from { opacity: 0; scale: 0.9; } }
main[data-pasos] .pasos__panel[data-entra] > .lab__figura,
main[data-pasos] .pasos__panel[data-entra] > .politopo,
main[data-pasos] .pasos__panel[data-entra] .vende__acciones,
main[data-pasos] .pasos__panel[data-entra] .plegadas,
main[data-pasos] .pasos__panel[data-entra] .faq__visor,
main[data-pasos] .pasos__panel[data-entra] .nota__sigue .prose {
  animation: lab-sube 760ms cubic-bezier(0.2, 0.7, 0.15, 1) both;
  animation-delay: 220ms;
}
@keyframes lab-sube { from { opacity: 0; transform: translateY(28px); } }
@media (min-width: 62rem) and (pointer: fine) {
  main[data-pasos] .pasos__panel[data-activo] > .lab__figura { will-change: translate; }
}
html[data-ficha-pasos] .pasos__fondo { will-change: transform, translate; }
.pasos__asomo { display: none; }
@media (min-width: 75rem) and (pointer: fine) {
  main[data-pasos] .pasos__asomo:not([hidden]) {
    display: block;
    position: absolute;
    z-index: 0;
    right: 0;
    top: 50%;
    transform: translate(56%, -50%);
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    transition: transform 380ms cubic-bezier(0.2, 0.7, 0.15, 1);
  }
  .pasos__asomo-num {
    display: block;
    font: 400 min(30vh, 14vw)/0.8 var(--mono);
    letter-spacing: -0.06em;
    color: transparent;
    -webkit-text-stroke: var(--rule) var(--graphite);
    opacity: 0.55;
    transition: opacity 300ms ease-out;
  }
  .pasos__asomo-tit {
    position: absolute;
    right: 50%;
    bottom: calc(100% + 0.8rem);
    width: max-content;
    max-width: 16rem;
    font: 0.75rem/1.35 var(--mono);
    color: var(--ink);
    text-align: right;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 250ms ease-out, transform 250ms ease-out;
  }
  .pasos__asomo-tit::before { content: "sigue → "; color: var(--graphite); }
  main[data-pasos] .pasos__asomo:hover { transform: translate(36%, -50%); }
  .pasos__asomo:hover .pasos__asomo-num { opacity: 1; -webkit-text-stroke-color: var(--ink); }
  .pasos__asomo:hover .pasos__asomo-tit { opacity: 1; transform: none; }
  main[data-nota] .pasos__asomo { opacity: 0; pointer-events: none; }
}
.juego__turno {
  margin: 0;
  padding: 0.6rem 0.9rem;
  border-top: var(--rule) solid var(--ash);
  background: var(--ink);
  color: var(--paper);
  font: 0.75rem/1.35 var(--mono);
  animation: lab-sube 500ms cubic-bezier(0.2, 0.7, 0.15, 1) both;
}
.dueno__nueva { animation: lab-nueva 2.4s ease-out both; }
@keyframes lab-nueva {
  0% { background: var(--ink); color: var(--paper); }
  35% { background: var(--ink); color: var(--paper); }
  100% { background: transparent; }
}
.dueno__nueva :is(.buzon__quien, .buzon__hora, .buzon__ultimo, .buzon__meta, .buzon__meta *) { color: inherit; }
@media (prefers-reduced-motion: reduce) {
  main[data-pasos] .pal--clave::after { transform: none; }
}