/* AX-UI-ARROWS: small ▲ ▼ pair (top / bottom). Classes axar-*. Light, round, never over bottom bars. */
.axar{position:fixed;left:14px;bottom:var(--axar-b,20px);display:flex;flex-direction:column;gap:8px;z-index:85;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .25s ease,transform .25s ease,bottom .25s ease;-webkit-tap-highlight-color:transparent}
.axar.is-on{opacity:1;transform:none;pointer-events:auto}
.axar.axar-r{left:auto;right:14px}
.axar button{width:40px;height:40px;padding:0;border-radius:50%;border:1px solid rgba(16,25,43,.14);background:rgba(255,255,255,.9);color:#10192B;box-shadow:0 8px 20px -10px rgba(16,25,43,.45);display:grid;place-items:center;cursor:pointer;transition:transform .15s ease,background .15s ease}
.axar button:hover{background:#fff;transform:scale(1.06)}
.axar button:focus-visible{outline:2px solid #C9A24A;outline-offset:2px}
.axar button[hidden]{display:none}
.axar svg{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:860px){.axar{left:12px}.axar.axar-r{right:12px}}
@media (hover:none) and (max-width:860px){.axar.is-idle{opacity:0;pointer-events:none}}
@media (prefers-reduced-motion:reduce){.axar,.axar button{transition:none}}
@media print{.axar{display:none!important}}