.io-menu{position:relative;margin-left:auto;display:flex;align-items:center;justify-content:flex-end;min-width:46px;height:46px;color:white;font-family:inherit;pointer-events:auto;isolation:isolate}
.io-menu-items{display:flex;align-items:center;justify-content:flex-end;white-space:nowrap;min-height:46px;gap:0}
.io-menu-item{display:inline-flex;align-items:center;justify-content:flex-end;flex:none;min-height:44px;color:inherit;text-decoration:none;font-size:clamp(10px,.76vw,12px);font-weight:500;letter-spacing:.025em;line-height:1.3;text-shadow:0 1px 8px rgba(0,0,0,.3);pointer-events:none}
.io-menu.is-open .io-menu-item{pointer-events:auto}
.io-menu-word{display:block;overflow:hidden;white-space:nowrap;width:0;min-width:0;opacity:0;filter:blur(2px);transform:translateX(7px);transition:width 0.64s cubic-bezier(.42,0,.26,1),opacity 0.23s ease,filter 0.23s ease,transform 0.59s cubic-bezier(.42,0,.26,1)}
.io-menu-word-inner{display:inline-block;padding-left:9px;padding-right:6px}
.io-menu-slash{display:block;flex:none;font-size:22px;font-weight:300;line-height:1;width:11px;text-align:center}
.io-menu.is-open .io-menu-word{width:var(--word-width,70px);opacity:1;filter:blur(0);transform:translateX(0)}
/* Apertura desde la derecha: los espacios se abren sucesivamente de derecha a izquierda. */
.io-menu-item:nth-child(4) .io-menu-word{transition-delay:0s,0.075s,0.075s,0s}
.io-menu-item:nth-child(3) .io-menu-word{transition-delay:0.0375s,0.11s,0.11s,0.0375s}
.io-menu-item:nth-child(2) .io-menu-word{transition-delay:0.075s,0.075s,0.075s,0.075s}
.io-menu-item:nth-child(1) .io-menu-word{transition-delay:0.11s,0.23s,0.23s,0.11s}
.io-menu-item:hover .io-menu-word-inner,.io-menu-item:focus-visible .io-menu-word-inner{opacity:.65}
.io-menu-word-inner{transition:opacity 0.11s}
.io-menu-toggle{position:absolute;right:0;top:0;z-index:5;width:38px;height:46px;background:none;border:0;color:inherit;padding:0;cursor:pointer}
.io-menu-toggle:focus-visible{outline:1px solid currentColor;outline-offset:3px}
.io-menu.is-open .io-menu-toggle{width:15px}
/* Móvil vertical: los cuatro separadores se apartan hacia abajo, con palabras en medio. */
@media(max-width:850px) and (orientation:portrait){
 .io-menu{align-self:flex-start;align-items:flex-start;height:auto;min-width:46px;}
 .io-menu-items{flex-direction:column;align-items:flex-end;justify-content:flex-start;min-height:0;gap:0}
 .io-menu-item{min-height:0;height:auto;flex-direction:column-reverse;align-items:flex-end;font-size:13px;pointer-events:none}
 .io-menu.is-open .io-menu-item{pointer-events:auto}
 .io-menu-slash{font-size:25px;height:20px;line-height:20px;width:14px;text-align:right}
 .io-menu-word{height:0;width:auto!important;max-width:200px;opacity:0;transform:translateY(-5px);transition:height 0.64s cubic-bezier(.42,0,.26,1),opacity 0.23s ease,filter 0.23s ease,transform 0.59s cubic-bezier(.42,0,.26,1)}
 .io-menu-word-inner{padding:4px 16px 4px 0;white-space:nowrap}
 .io-menu.is-open .io-menu-word{height:var(--word-height,25px);opacity:1;transform:translateY(0)}
 .io-menu-item:nth-child(1) .io-menu-word{transition-delay:0s,0.075s,0.075s,0s}
 .io-menu-item:nth-child(2) .io-menu-word{transition-delay:0.0375s,0.11s,0.11s,0.0375s}
 .io-menu-item:nth-child(3) .io-menu-word{transition-delay:0.075s,0.075s,0.075s,0.075s}
 .io-menu-item:nth-child(4) .io-menu-word{transition-delay:0.11s,0.23s,0.23s,0.11s}
 .io-menu-toggle{right:0;top:0;width:38px;height:28px}
 .io-menu.is-open .io-menu-toggle{width:38px}
}
/* Landscape móvil usa el formato horizontal incluso con una pantalla baja. */
@media(max-height:540px) and (orientation:landscape){.io-menu-item{font-size:10px}.io-menu-word-inner{padding-left:7px;padding-right:5px}.io-menu-slash{font-size:20px;width:9px}}


/* V61: En vertical, estado inicial idéntico a //// (una única fila).
   Cada barra se desplaza hacia abajo gradualmente al abrir el menú. */
@media (max-width:850px) and (orientation:portrait){
  .io-menu{height:46px;min-width:65px;align-self:flex-start;align-items:center;overflow:visible}
  .io-menu-items{position:absolute;top:0;right:0;width:0;height:46px;min-height:0;display:block;overflow:visible}
  .io-menu-item{
    position:absolute;right:0;top:0;display:flex;flex-direction:row;
    justify-content:flex-end;align-items:center;
    height:29px;min-height:29px;width:max-content;
    font-size:10px;transform:translate(-0px,0px);
    transition:transform 0.64s cubic-bezier(.42,0,.26,1);
  }
  .io-menu-item:nth-child(1){transform:translate(-33px,0);transition-delay:0.11s}
  .io-menu-item:nth-child(2){transform:translate(-22px,0);transition-delay:0.075s}
  .io-menu-item:nth-child(3){transform:translate(-11px,0);transition-delay:0.0375s}
  .io-menu-item:nth-child(4){transform:translate(0,0);transition-delay:0s}
  .io-menu.is-open .io-menu-item:nth-child(1){transform:translate(0,0)}
  .io-menu.is-open .io-menu-item:nth-child(2){transform:translate(0,29px)}
  .io-menu.is-open .io-menu-item:nth-child(3){transform:translate(0,58px)}
  .io-menu.is-open .io-menu-item:nth-child(4){transform:translate(0,87px)}
  .io-menu-slash{height:auto;line-height:1;font-size:22px;width:11px;flex:none;text-align:center}
  .io-menu-word{
    height:auto;width:0!important;max-width:none;opacity:0;
    transform:translateX(7px);
    transition:width 0.64s cubic-bezier(.42,0,.26,1),opacity 0.23s ease,filter 0.23s ease,transform 0.59s cubic-bezier(.42,0,.26,1)
  }
  .io-menu-word-inner{padding:0 5px 0 7px;white-space:nowrap}
  .io-menu.is-open .io-menu-word{height:auto;width:var(--word-width,70px)!important;opacity:1;filter:blur(0);transform:translateX(0)}
  .io-menu-item:nth-child(1) .io-menu-word{transition-delay:0.11s,0.23s,0.23s,0.11s}
  .io-menu-item:nth-child(2) .io-menu-word{transition-delay:0.075s,0.075s,0.075s,0.075s}
  .io-menu-item:nth-child(3) .io-menu-word{transition-delay:0.0375s,0.11s,0.11s,0.0375s}
  .io-menu-item:nth-child(4) .io-menu-word{transition-delay:0s,0.075s,0.075s,0s}
  .io-menu-toggle,.io-menu.is-open .io-menu-toggle{right:-3px;top:0;width:40px;height:45px}
}


.io-menu{color:var(--ink)}.io-menu-item{text-shadow:none}