/* labs-link.css — classic-only chrome: the in-flow bottom nav bar with the
   day-nav links and the "play labs" beaker. Uses the game's own CSS variables. */

.labs-navbar {
  display: flex;
  justify-content: space-between; /* day-nav at the left, play-labs at the right */
  align-items: center;
  gap: 14px;
  /* The bar is the last item in the .app grid (row-gap 18px) with an empty
     .game-footer above it, so it floats well below the card. Pull it up a bit
     and tighten the top padding to sit closer to the game card. */
  margin-top: -16px;
  padding: 10px 6px 4px;
  font-size: 13px;
}
.labs-nav-day { display: inline-flex; align-items: center; gap: 12px; }
.labs-nav-play { display: inline-flex; align-items: center; gap: 6px; }

/* "today's puzzle" link with the calendar icon */
.labs-daylink { display: inline-flex; align-items: center; gap: 4px; }
.labs-cal-ico { display: inline-flex; }
.labs-cal-icon { width: 13px; height: 13px; display: block; }

/* small, gray, tilted "play labs" beaker */
.labs-beaker-ico { display: inline-flex; }
.labs-beaker { width: 10px; height: 14px; display: block; transform: translateX(-2px) rotate(-11deg); }

/* Only show the bottom nav bar on the actual game view — not during the loading
   spinner, and NOT on the "no puzzle for this day" setup view (where the labs
   link is just noise; that view has its own "today's puzzle →"). */
.labs-navbar { display: none; }
.app:has(#game-view:not([hidden])) .labs-navbar { display: flex; }