/* ═══════════════════════════════════════
   WoGL — World of GL
   wogl.io | worldofgl.com | mundogl.com
   hello@wogl.io | hola@mundogl.com

   Proprietary. All rights reserved.
   ═══════════════════════════════════════ */

/* One way back, everywhere in Academy (Gera, 5-oct): the museum's nav-back, the pill that reads
   "← BACK TO LESSONS" in Academy PRO, without its outline (Gera, 5-oct: Academy floats, no boxes): a
   soft fill instead of a border. Ivory at rest, champagne under the pointer. Wider than 560px
   it carries its words; on a phone it is a 40px circle with the arrow alone, the same rule as the
   museum. The arrow lives in its own span, the words in .wogl-back-label.
   .wogl-back--float is the same pill floating over a canvas: it gets a dark glass behind it. */
.wogl-back{
  box-sizing:border-box;
  flex:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:2px;
  min-width:40px;
  min-height:40px;
  margin:0;
  padding:0 16px;
  color:rgba(243,236,223,.92);
  background:rgba(243,236,223,.07);
  border:0;
  border-radius:999px;
  font:700 10px/1 'JetBrains Mono',ui-monospace,monospace;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
  transition:color .2s ease,border-color .2s ease,background .2s ease;
}
.wogl-back:hover{color:#e8c89a;background:rgba(232,200,154,.13)}
.wogl-back:focus-visible{outline:2px solid #e8c89a;outline-offset:3px}
.wogl-back--float{background:rgba(8,8,11,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.wogl-back--float:hover{background:rgba(24,20,14,.72)}
@media(max-width:560px){
  .wogl-back{width:40px;padding:0}
  .wogl-back-label{display:none}
}