/* One decorative back icon for every mini game. Button text supplies its accessible name. */
.mini-game-page button.mg-back {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.48em;
    min-height: 44px;
    white-space: nowrap;
}

.mini-game-page button.mg-back::before {
    --mg-back-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.85' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8 8 12 12 16M8 12h9'/%3E%3C/svg%3E");
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    background-color: currentColor;
    -webkit-mask: var(--mg-back-glyph) center / contain no-repeat;
    mask: var(--mg-back-glyph) center / contain no-repeat;
    filter: drop-shadow(0 0 3px rgba(70, 207, 255, 0.35));
}

.mini-game-page button.mg-back:focus-visible {
    outline: 2px solid #61d9ff;
    outline-offset: 3px;
}

/* Puck Rush hides this button on its HUD via inline display:none; preserve that rule. */
#puckrush-page.active #prg-back-btn.mg-back { display: inline-flex; }

@media (max-width: 360px) {
    .mini-game-page button.mg-back { gap: 0.32em; }
    .mini-game-page button.mg-back::before { width: 22px; height: 22px; flex-basis: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .mini-game-page button.mg-back::before { filter: none; }
}