/* Choice grid (leans on global layout; no page-level overflow rules) */
.mc-choices {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    width: 100%;
    justify-items: center;
}

/* Buttons: keep existing visual identity */
.mc-choice-button {
    width: 100%;
    max-width: 340px;
    padding: 0.6rem;
    background: #f5f5f5;
    border: 2px solid transparent;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: black;
    gap: 0.25rem;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease, background-color .2s ease, border-color .2s ease;
}

    .mc-choice-button.glow {
        box-shadow: 0 0 12px 4px rgba(255, 255, 0, 0.6);
    }

    .mc-choice-button:focus-visible {
        box-shadow: 0 0 0 3px rgba(108,160,220,.45), 0 0 0 6px rgba(108,160,220,.25);
    }

    .mc-choice-button:active {
        transform: translateY(.5px);
    }

    .mc-choice-button:disabled {
        cursor: not-allowed;
        opacity: 1;
    }

    /* Wrong/try-again state */
    .mc-choice-button.wrong {
        opacity: .6;
        text-decoration: line-through;
        pointer-events: none;
        border: 1px solid #e74c3c;
        background-color: #fbeaea;
    }

/* Option image */
.mc-emoji-image {
    width: clamp(36px, 7svh, 56px);
    height: clamp(36px, 7svh, 56px);
    object-fit: contain;
}

/* Scenario image tweaks (works with global .eqn-img wrapper) */
.mc-scenario-image {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 0 auto .5rem auto;
}

/* Simple 2-col upshift on roomier devices */
@media (min-width: 600px) {
    .mc-choices {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .6rem;
    }

    .mc-choice-button {
        max-width: 100%;
    }
}

/* Start the SweetAlert confirm button as fully transparent & unclickable */
.eqn-swal-transparent {
    background-color: transparent !important;
    color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    pointer-events: none !important;
    transition: background-color .3s ease, color .3s ease, border-color .3s ease;
}