/* Confort de lecture de la carte (jour et nuit), voir confort-carte.js.
   1. Le menu du haut se range ; il revient quand le pointeur approche du haut de l'écran,
      ou quand on touche un des deux coins du haut.
   2. Les indications du bas de page ne sont plus recouvertes par les objets de l'inventaire. */
body[data-screen=explore] .global-bar{transition:transform .28s ease,opacity .28s ease}
body[data-screen=explore]:not(.menu-visible) .global-bar:not(:focus-within){transform:translateY(-100%);opacity:0;pointer-events:none}
.coin-menu{position:absolute;top:0;z-index:29;width:56px;height:56px;padding:0;border:0;background:none;cursor:pointer;display:none}
.coin-menu.gauche{left:0}
.coin-menu.droite{right:0}
body[data-screen=explore]:not(.menu-visible) .coin-menu{display:block}
.coin-menu:focus-visible{outline:2px solid #f0cf7c;outline-offset:-4px;border-radius:8px}
/* Petit repère discret dans chaque coin, pour savoir où toucher. */
.coin-menu::before{content:"";position:absolute;top:9px;width:18px;height:3px;border-radius:2px;background:#f0cf7c;opacity:.45;box-shadow:0 6px #f0cf7c,0 12px #f0cf7c}
.coin-menu.gauche::before{left:10px}
.coin-menu.droite::before{right:10px}
body[data-world=dark] .coin-menu::before{background:#d8a8b3;box-shadow:0 6px #d8a8b3,0 12px #d8a8b3}
@media (prefers-reduced-motion:reduce){body[data-screen=explore] .global-bar{transition:none}}