/* Botón «Volver arriba» (assets/arriba.js): recuadro blanco con flecha y la palabra debajo.
   Colores fijos: también va en las portadas 6-9, que tienen su propio estilo. */
.arriba{position:fixed;right:max(30px,env(safe-area-inset-right,0px));bottom:max(30px,env(safe-area-inset-bottom,0px));z-index:32;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:56px;height:48px;padding:0;background:#fff;color:#000;border:1px solid #ccc;border-radius:0;font:900 10px/1 var(--font,"Helvetica Neue",Helvetica,Arial,sans-serif);letter-spacing:.02em;text-transform:uppercase;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s ease,transform .25s ease,visibility .25s,background .2s,color .2s}
.arriba.visible{opacity:1;visibility:visible;transform:none}
.arriba:hover{background:#000;color:#fff;border-color:#000}
.arriba:focus-visible{outline:2px solid #1f4fd1;outline-offset:2px}
body.bloqueo .arriba{display:none}
@media (max-width:860px){
  .arriba{right:max(10px,env(safe-area-inset-right,0px));bottom:max(10px,env(safe-area-inset-bottom,0px));width:52px;height:44px;font-size:9px;gap:4px}
}
@media (prefers-reduced-motion:reduce){
  .arriba{transition:none;transform:none}
}