/* ------------------------------------------------------------- bulles « première fois » (lot 13, 02/10) : la bulle du glossaire, posée là où l'action se passe (firsttime.js) */
.gltip.first { width: min(380px, calc(100vw - 24px)); z-index: 61; }
.gltip.first .glt { font-size: 17px; letter-spacing: .04em; }
.gltip.first .gls { margin-top: 6px; }
.gltip.first .gls b { font-weight: 600; }
.gltip.first .row { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.gltip.first .fnote { font-family: var(--type); font-size: 12px; color: var(--ink-dim); }
.gltip.first .gll { width: auto; margin: 0 0 0 auto; }
.gltip.first .gll.main { color: var(--cream); background: var(--stamp); border-color: var(--stamp); }
.gltip.first .gll.main:hover { background: var(--stamp-deep); }
.gltip.first::before { content: ''; position: absolute; width: 14px; height: 14px; background: var(--card); transform: rotate(45deg); left: var(--ax, 26px); box-shadow: -1px -1px 0 rgba(var(--ink-rgb), .12); }
.gltip.first.below::before { top: -7px; }
.gltip.first.above::before { bottom: -7px; box-shadow: 1px 1px 0 rgba(var(--ink-rgb), .12); }
/* l'anneau sur l'élément visé : un contour, jamais de position (un élément collant ou animé reste ce qu'il est) */
.first-on { outline: 2px solid var(--cream); outline-offset: 5px; border-radius: 4px; }
.ink .first-on, .sheet .first-on, .edwrap .first-on { outline-color: rgba(var(--ink-rgb), .55); }
.ticket.first-on, .xtix.first-on { outline-offset: 8px; }
@media (max-width: 720px) {
  .gltip.first::before { display: none; }
  .gltip.first .gll { min-height: 44px; }
}
