@media screen {
  :root[data-rediseno-v2] .rv2-etiqueta {
    display: inline-grid;
  }
  :root[data-rediseno-v2] .rv2-etiqueta > span {
    grid-area: 1 / 1;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition:
      opacity 170ms ease,
      transform 170ms var(--dn-curva, ease),
      visibility 0s linear 170ms;
  }
  :root[data-rediseno-v2] .rv2-etiqueta[data-fase="reposo"] > [data-e="reposo"],
  :root[data-rediseno-v2] .rv2-etiqueta[data-fase="guardando"] > [data-e="guardando"],
  :root[data-rediseno-v2] .rv2-etiqueta[data-fase="hecho"] > [data-e="hecho"] {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition:
      opacity 170ms ease,
      transform 170ms var(--dn-curva, ease),
      visibility 0s;
  }
  :root[data-rediseno-v2] .rv2-etiqueta > [data-e="hecho"] {
    color: var(--rol-conforme-texto);
  }
  :root[data-rediseno-v2] .rol-accion .rv2-etiqueta > [data-e="hecho"] {
    color: inherit;
  }
  :root[data-rediseno-v2] .rv2-guardado-texto {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    line-height: 16px;
    color: var(--tinta-2);
    animation: rv2-aparece 170ms var(--dn-curva, ease) both;
  }
  :root[data-rediseno-v2] .rv2-guardado-hecho {
    color: var(--rol-conforme-texto);
  }
  :root[data-rediseno-v2] .rv2-guardado-check {
    width: 12px;
    height: 12px;
  }
  :root[data-rediseno-v2] .rv2-guardado-punto {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--rol-proceso-marca);
    animation: rv2-late 900ms ease-in-out infinite alternate;
  }
  :root[data-rediseno-v2] .rv2-guardado-error {
    display: block;
    margin-top: 8px;
    font-size: 12px;
    line-height: 16px;
    color: var(--rol-critico-texto);
    animation: rv2-aparece 170ms var(--dn-curva, ease) both;
  }
  :root[data-rediseno-v2] .rv2-guardado--en-control .rv2-guardado-vivo {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  :root[data-rediseno-v2] .rv2-guardado--flota {
    display: contents;
  }
  :root[data-rediseno-v2] .rv2-guardado--flota .rv2-guardado-vivo {
    position: absolute;
    top: -8px;
    right: 8px;
    pointer-events: none;
  }
  :root[data-rediseno-v2] .rv2-guardado--flota .rv2-guardado-texto {
    padding: 0 8px;
    border-radius: 999px;
    border: 1px solid var(--borde);
    background: var(--superficie);
  }
  :root[data-rediseno-v2] [data-pendiente] {
    opacity: 0.6;
  }
  :root[data-rediseno-v2] [data-flip] {
    position: relative;
  }
  :root[data-rediseno-v2] [data-arrastrable] {
    cursor: grab;
    user-select: none;
  }
  :root[data-rediseno-v2] [data-levantada] {
    cursor: grabbing;
    box-shadow: var(--sombra-flotante);
  }
  :root[data-rediseno-v2] [data-destino="si"] {
    outline: 2px dashed var(--acento);
    outline-offset: -2px;
  }
  :root[data-rediseno-v2] [data-destino="no"] {
    outline: 2px dashed var(--borde-fuerte);
    outline-offset: -2px;
    cursor: not-allowed;
  }
  :root[data-rediseno-v2] .sb-lista > li {
    transition: none;
  }
  :root[data-rediseno-v2] [data-coreografia],
  :root[data-rediseno-v2] [data-plantilla="lista"] {
    gap: 16px;
  }
  :root[data-rediseno-v2] [data-coreografia] [data-secundaria] {
    animation: rv2-aparece var(--dn-dur-posa, 280ms) var(--dn-curva, ease) 160ms both;
  }
  @keyframes rv2-aparece {
    from {
      opacity: 0;
      transform: translateY(4px);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }
  @keyframes rv2-late {
    from {
      opacity: 0.35;
    }
    to {
      opacity: 1;
    }
  }
}
@media screen and (prefers-reduced-motion: reduce) {
  :root[data-rediseno-v2] .rv2-etiqueta > span,
  :root[data-rediseno-v2] .rv2-guardado-texto,
  :root[data-rediseno-v2] .rv2-guardado-error,
  :root[data-rediseno-v2] .rv2-guardado-punto,
  :root[data-rediseno-v2] [data-coreografia] [data-secundaria] {
    animation: none;
    transition: none;
  }
}
@media (pointer: coarse) {
  :root[data-rediseno-v2] :is(#contenido, [role="dialog"]) :is(button, [role="button"], select, summary, input:not([type="checkbox"], [type="radio"], [type="range"], [type="hidden"], [type="file"], [type="color"])):not(table *, [role="grid"] *, [role="treegrid"] *, [data-papel] *, [data-pantalla="en-vivo"] *, .cn-paso, [data-tirador]) {
    min-height: 48px;
  }
  :root[data-rediseno-v2] :is(#contenido, [role="dialog"]) :is(button, [role="button"], summary):not(table *, [role="grid"] *, [role="treegrid"] *, [data-papel] *, [data-pantalla="en-vivo"] *, .cn-paso, [data-tirador]) {
    min-width: 48px;
  }
  :root[data-rediseno-v2] :is(#contenido, [role="dialog"]) :is(.gap-0, .gap-0\.5, .gap-1, .gap-1\.5):has(> :is(button, a, select, input) + :is(button, a, select, input)):not(table *, [role="grid"] *) {
    gap: 8px;
  }
  :root[data-rediseno-v2] nav[data-origen="pestana"] {
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 16px;
    scrollbar-width: none;
    gap: 8px;
  }
  :root[data-rediseno-v2] nav[data-origen="pestana"]::-webkit-scrollbar {
    display: none;
  }
  :root[data-rediseno-v2][data-diseno="nuevo"] nav[data-origen="pestana"] > a,
  :root[data-rediseno-v2] nav[data-origen="pestana"] > a {
    flex: none;
    height: 48px;
    min-height: 48px;
    min-width: 48px;
    display: inline-flex;
    align-items: center;
    scroll-snap-align: start;
  }
  :root[data-rediseno-v2] [data-campo-numerico] > input {
    font-size: 16px;
    min-height: 48px;
  }
  :root[data-rediseno-v2] [data-campo-numerico]:has(> .cn-paso) {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 48px;
    gap: 8px;
    min-width: 0;
    flex: 1 1 auto;
  }
  :root[data-rediseno-v2] [data-campo-numerico]:has(> .cn-paso) > input {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    min-width: 0;
  }
  :root[data-rediseno-v2] [data-campo-numerico] > .cn-paso[hidden] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    min-height: 48px;
    border: 1px solid var(--borde-fuerte, var(--borde));
    border-radius: 12px;
    background: var(--superficie);
    color: var(--tinta);
    font-size: 20px;
    line-height: 1;
    touch-action: manipulation;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
  }
  :root[data-rediseno-v2] [data-campo-numerico] > .cn-paso:disabled {
    opacity: 0.5;
  }
  :root[data-rediseno-v2] [data-campo-numerico] > .cn-paso:active:not(:disabled) {
    transform: scale(0.96);
    background: var(--hover);
  }
  :root[data-rediseno-v2] [data-campo-numerico] > [data-cn-paso="menos"] {
    grid-column: 1;
    grid-row: 1;
  }
  :root[data-rediseno-v2] [data-campo-numerico] > [data-cn-paso="mas"] {
    grid-column: 3;
    grid-row: 1;
  }
  :root[data-rediseno-v2] [data-campo-numerico][data-cn-forma="apilada"]:has(> .cn-paso) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  :root[data-rediseno-v2] [data-campo-numerico][data-cn-forma="apilada"]:has(> .cn-paso) > input {
    grid-column: 1 / -1;
  }
  :root[data-rediseno-v2] [data-campo-numerico][data-cn-forma="apilada"] > .cn-paso[hidden] {
    width: 100%;
    grid-row: 2;
  }
  :root[data-rediseno-v2] [data-campo-numerico][data-cn-forma="apilada"] > [data-cn-paso="menos"] {
    grid-column: 1;
  }
  :root[data-rediseno-v2] [data-campo-numerico][data-cn-forma="apilada"] > [data-cn-paso="mas"] {
    grid-column: 2;
  }
  :root[data-rediseno-v2] [data-tirador] {
    position: relative;
    touch-action: none;
    cursor: grab;
  }
  :root[data-rediseno-v2] .drawer-sube > [data-tirador]::before {
    content: "";
    position: absolute;
    inset: -22px -32px;
  }
  :root[data-rediseno-v2] .sb-cajon > .sb-cajon-tirador[hidden] {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 24px;
    height: 96px;
    margin-top: -48px;
    z-index: 1;
  }
  :root[data-rediseno-v2] .sb-cajon > .sb-cajon-tirador::after {
    content: "";
    position: absolute;
    top: 28px;
    right: 8px;
    width: 4px;
    height: 40px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.4;
  }
}
:root[data-rediseno-v2] [data-arrastrando] {
  transition: none;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  :root[data-rediseno-v2][data-diseno="nuevo"] .sb-raiz *,
  :root[data-rediseno-v2][data-diseno="nuevo"] .sb-raiz *::before,
  :root[data-rediseno-v2][data-diseno="nuevo"] .sb-raiz *::after {
    animation: none !important;
    transition: none !important;
  }
  :root[data-rediseno-v2][data-diseno="nuevo"] .dn-esq-b {
    opacity: 1;
  }
}
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-group(rv2-morfo) {
  animation: revert;
  animation-duration: 400ms;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
  animation-fill-mode: both;
  overflow: clip;
  border-radius: 12px;
}
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-old(rv2-morfo),
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-new(rv2-morfo) {
  animation-duration: 400ms;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-old(rv2-morfo) {
  animation-name: rv2-sale;
}
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-new(rv2-morfo) {
  animation-name: rv2-entra;
}
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-old(rv2-fondo) {
  display: block;
  animation: rv2-sale 160ms ease-out both;
}
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-new(rv2-fondo) {
  animation: rv2-entra 160ms ease-out 80ms both;
}
:root[data-diseno="nuevo"][data-rediseno-v2]::view-transition-group(rv2-fondo) {
  animation: none;
}
:root[data-diseno="nuevo"][data-rediseno-v2][data-rv2-morfo="volver"]::view-transition-new(rv2-morfo) {
  animation-duration: 240ms;
}
@keyframes rv2-sale {
  from { opacity: 1; }
  to { opacity: 0; }
}
@keyframes rv2-entra {
  from { opacity: 0; }
  to { opacity: 1; }
}
:root[data-rediseno-v2] .rv2-esq {
  opacity: 0;
  animation: rv2-entra 150ms ease-out 120ms forwards;
  pointer-events: none;
}
:root[data-rediseno-v2] .rv2-esq[data-morfo-destino="*"] {
  opacity: 1;
  animation: none;
}
:root[data-rediseno-v2] .rv2-esq-t {
  color: transparent;
  border-radius: 4px;
  background: var(--dn-esqueleto, var(--borde));
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  user-select: none;
}
:root[data-rediseno-v2] .rv2-esq-caja {
  background: var(--dn-esqueleto, var(--borde));
}
:root[data-rediseno-v2] .rv2-esq > :not(.sr-only) {
  position: relative;
  overflow: hidden;
}
:root[data-rediseno-v2] .rv2-esq > :not(.sr-only)::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, var(--dn-esqueleto-brillo, rgb(255 255 255 / 0.5)), transparent);
  animation: rv2-brillo 940ms cubic-bezier(0.45, 0, 0.55, 1) 120ms 2 both;
  pointer-events: none;
}
@keyframes rv2-brillo {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}
:root[data-rediseno-v2] .rv2-llega {
  animation: rv2-entra 220ms ease-out both;
}
@media (prefers-reduced-motion: reduce) {
  :root[data-rediseno-v2] .rv2-esq {
    animation: none;
    opacity: 1;
  }
  :root[data-rediseno-v2] .rv2-esq > :not(.sr-only)::after {
    content: none;
  }
  :root[data-rediseno-v2] .rv2-llega {
    animation: none;
  }
}