/*
 * Criterium — Front End Styles
 * All selectors scoped to .amcriterium-* or #amcriterium-* prefixes.
 * Body/page background styles intentionally absent — theme's responsibility.
 * !important count: 1 (utility .amcriterium-hidden only).
 */

/* ── Variables ────────────────────────────────────────────────────────────── */
.amcriterium-embed {
    --amcrit-slate-deep:   #0f172a;
    --amcrit-slate-mid:    #1e293b;
    --amcrit-glass-bg:     rgba(30, 41, 59, 0.78);
    --amcrit-glass-border: rgba(255, 255, 255, 0.13);

    /* ── Theme colour tokens — overridden per quiz via front.js ────────────────
       Defaults match the original hardcoded values exactly.
       --amcrit-gold is retained as an alias for --amcrit-accent so that any
       existing references continue to work unchanged.
    ──────────────────────────────────────────────────────────────────────── */
    --amcrit-accent:       #c4a75d;
    --amcrit-gold:         #c4a75d;
    --amcrit-accent-muted: rgba(196, 167, 93, 0.28);
    --amcrit-accent-faint: rgba(196, 167, 93, 0.10);
    --amcrit-on-accent:    #000000;
    --amcrit-text-primary: #ffffff;
    --amcrit-text-body:    #e2d5b5;
    --amcrit-text-muted:   rgba(226, 213, 181, 0.55);
    --amcrit-correct:      #4ade80;
    --amcrit-incorrect:    #f87171;
    --amcrit-radius:       8px;
    --amcrit-radius-sm:    4px;
    --amcrit-transition:   0.22s ease;
    --amcrit-card-bg:      rgba(30, 41, 59, 1);
    --amcrit-card-hue:     rgba(0, 0, 0, 0);
    --amcrit-glass-variant: dark;

    /* ── Typography custom property tokens — set by front.js from typo_json ──
       Defaults match the existing hardcoded values so nothing changes
       unless a custom value is explicitly saved in Display Options.
    ──────────────────────────────────────────────────────────────────────── */

    /* typo_question — card question text */
    --amcrit-typo-q-family:     'Montserrat', sans-serif;
    --amcrit-typo-q-size:       1rem;
    --amcrit-typo-q-colour:     #ffffff;
    --amcrit-typo-q-weight:     600;
    --amcrit-typo-q-style:      normal;
    --amcrit-typo-q-transform:  none;
    --amcrit-typo-q-decoration: none;
    --amcrit-typo-q-spacing:    normal;
    --amcrit-typo-q-height:     1.5;
    --amcrit-typo-q-align:      left;
    --amcrit-typo-q-padding:    0;

    /* typo_option — answer option buttons */
    --amcrit-typo-opt-family:     'Actor', sans-serif;
    --amcrit-typo-opt-size:       0.9rem;
    --amcrit-typo-opt-colour:     #ffffff;
    --amcrit-typo-opt-weight:     400;
    --amcrit-typo-opt-style:      normal;
    --amcrit-typo-opt-transform:  none;
    --amcrit-typo-opt-decoration: none;
    --amcrit-typo-opt-spacing:    normal;
    --amcrit-typo-opt-height:     1.4;
    --amcrit-typo-opt-padding:    0.75rem 1.1rem;

    /* typo_prev — Previous button */
    --amcrit-typo-prev-family:     'Actor', sans-serif;
    --amcrit-typo-prev-size:       0.72rem;
    --amcrit-typo-prev-colour:     #e2d5b5;
    --amcrit-typo-prev-weight:     400;
    --amcrit-typo-prev-style:      normal;
    --amcrit-typo-prev-transform:  uppercase;
    --amcrit-typo-prev-decoration: none;
    --amcrit-typo-prev-spacing:    1.5px;
    --amcrit-typo-prev-height:     1;
    --amcrit-typo-prev-padding:    8px 18px;

    /* typo_timer — timer display */
    --amcrit-typo-timer-family:     'Montserrat', sans-serif;
    --amcrit-typo-timer-size:       clamp(1.4rem, 4vw, 2rem);
    --amcrit-typo-timer-colour:     var(--amcrit-accent);
    --amcrit-typo-timer-weight:     700;
    --amcrit-typo-timer-style:      normal;
    --amcrit-typo-timer-transform:  none;
    --amcrit-typo-timer-decoration: none;
    --amcrit-typo-timer-spacing:    2px;
    --amcrit-typo-timer-height:     1;
    --amcrit-typo-timer-padding:    0;

    /* typo_counter — progress counter label */
    --amcrit-typo-counter-family:     'Actor', sans-serif;
    --amcrit-typo-counter-size:       0.72rem;
    --amcrit-typo-counter-colour:     rgba(226, 213, 181, 0.55);
    --amcrit-typo-counter-weight:     400;
    --amcrit-typo-counter-style:      normal;
    --amcrit-typo-counter-transform:  uppercase;
    --amcrit-typo-counter-decoration: none;
    --amcrit-typo-counter-spacing:    2.5px;
    --amcrit-typo-counter-height:     1;
    --amcrit-typo-counter-padding:    0;

    /* typo_score — score number */
    --amcrit-typo-score-family:     'Montserrat', sans-serif;
    --amcrit-typo-score-size:       clamp(3rem, 12vw, 5rem);
    --amcrit-typo-score-colour:     #ffffff;
    --amcrit-typo-score-weight:     700;
    --amcrit-typo-score-style:      normal;
    --amcrit-typo-score-transform:  none;
    --amcrit-typo-score-decoration: none;
    --amcrit-typo-score-spacing:    normal;
    --amcrit-typo-score-height:     1;
    --amcrit-typo-score-align:      center;
    --amcrit-typo-score-padding:    0;

    /* typo_score_label — "Score" label */
    --amcrit-typo-slabel-family:     'Actor', sans-serif;
    --amcrit-typo-slabel-size:       0.72rem;
    --amcrit-typo-slabel-colour:     rgba(226, 213, 181, 0.55);
    --amcrit-typo-slabel-weight:     400;
    --amcrit-typo-slabel-style:      normal;
    --amcrit-typo-slabel-transform:  uppercase;
    --amcrit-typo-slabel-decoration: none;
    --amcrit-typo-slabel-spacing:    3px;
    --amcrit-typo-slabel-height:     1;
    --amcrit-typo-slabel-align:      center;
    --amcrit-typo-slabel-padding:    0;

    /* typo_time_taken — time elapsed */
    --amcrit-typo-time-family:     'Actor', sans-serif;
    --amcrit-typo-time-size:       0.8rem;
    --amcrit-typo-time-colour:     var(--amcrit-accent);
    --amcrit-typo-time-weight:     400;
    --amcrit-typo-time-style:      normal;
    --amcrit-typo-time-transform:  uppercase;
    --amcrit-typo-time-decoration: none;
    --amcrit-typo-time-spacing:    1.5px;
    --amcrit-typo-time-height:     1;
    --amcrit-typo-time-align:      center;
    --amcrit-typo-time-padding:    0;

    /* typo_remark — score remark text */
    --amcrit-typo-remark-family:     'Actor', sans-serif;
    --amcrit-typo-remark-size:       1.05rem;
    --amcrit-typo-remark-colour:     var(--amcrit-accent);
    --amcrit-typo-remark-weight:     400;
    --amcrit-typo-remark-style:      italic;
    --amcrit-typo-remark-transform:  none;
    --amcrit-typo-remark-decoration: none;
    --amcrit-typo-remark-spacing:    normal;
    --amcrit-typo-remark-height:     1.5;
    --amcrit-typo-remark-align:      center;
    --amcrit-typo-remark-padding:    0;

    /* typo_start_title — start page quiz title */
    --amcrit-typo-stitle-family:     'Montserrat', sans-serif;
    --amcrit-typo-stitle-size:       clamp(1.4rem, 5vw, 2.2rem);
    --amcrit-typo-stitle-colour:     var(--amcrit-accent);
    --amcrit-typo-stitle-weight:     700;
    --amcrit-typo-stitle-style:      normal;
    --amcrit-typo-stitle-transform:  uppercase;
    --amcrit-typo-stitle-decoration: none;
    --amcrit-typo-stitle-spacing:    4px;
    --amcrit-typo-stitle-height:     1.2;
    --amcrit-typo-stitle-align:      center;
    --amcrit-typo-stitle-padding:    0;

    /* typo_start_subtitle — start page subtitle */
    --amcrit-typo-ssub-family:     'Actor', sans-serif;
    --amcrit-typo-ssub-size:       0.82rem;
    --amcrit-typo-ssub-colour:     rgba(226, 213, 181, 0.55);
    --amcrit-typo-ssub-weight:     400;
    --amcrit-typo-ssub-style:      normal;
    --amcrit-typo-ssub-transform:  uppercase;
    --amcrit-typo-ssub-decoration: none;
    --amcrit-typo-ssub-spacing:    2px;
    --amcrit-typo-ssub-height:     1.7;
    --amcrit-typo-ssub-align:      center;
    --amcrit-typo-ssub-padding:    0;

    /* typo_start_meta — meta pills text */
    --amcrit-typo-smeta-family:     'Actor', sans-serif;
    --amcrit-typo-smeta-size:       0.78rem;
    --amcrit-typo-smeta-colour:     rgba(226, 213, 181, 0.7);
    --amcrit-typo-smeta-weight:     400;
    --amcrit-typo-smeta-style:      normal;
    --amcrit-typo-smeta-transform:  uppercase;
    --amcrit-typo-smeta-decoration: none;
    --amcrit-typo-smeta-spacing:    1.5px;
    --amcrit-typo-smeta-height:     1;
    --amcrit-typo-smeta-padding:    6px 18px;

    /* typo_start_btn — start/access briefing button */
    --amcrit-typo-sbtn-family:     'Montserrat', sans-serif;
    --amcrit-typo-sbtn-size:       0.78rem;
    --amcrit-typo-sbtn-colour:     var(--amcrit-on-accent);
    --amcrit-typo-sbtn-weight:     700;
    --amcrit-typo-sbtn-style:      normal;
    --amcrit-typo-sbtn-transform:  uppercase;
    --amcrit-typo-sbtn-decoration: none;
    --amcrit-typo-sbtn-spacing:    2px;
    --amcrit-typo-sbtn-height:     1;
    --amcrit-typo-sbtn-padding:    13px 28px;

    /* typo_result_title — "Evaluation Finalised" heading */
    --amcrit-typo-rtitle-family:     'Montserrat', sans-serif;
    --amcrit-typo-rtitle-size:       clamp(1.1rem, 3vw, 1.5rem);
    --amcrit-typo-rtitle-colour:     var(--amcrit-accent);
    --amcrit-typo-rtitle-weight:     700;
    --amcrit-typo-rtitle-style:      normal;
    --amcrit-typo-rtitle-transform:  uppercase;
    --amcrit-typo-rtitle-decoration: none;
    --amcrit-typo-rtitle-spacing:    3px;
    --amcrit-typo-rtitle-height:     1.2;
    --amcrit-typo-rtitle-align:      center;
    --amcrit-typo-rtitle-padding:    0;

    /* typo_review_q — review question text */
    --amcrit-typo-revq-family:     'Montserrat', sans-serif;
    --amcrit-typo-revq-size:       0.85rem;
    --amcrit-typo-revq-colour:     rgba(255, 255, 255, 0.85);
    --amcrit-typo-revq-weight:     600;
    --amcrit-typo-revq-style:      normal;
    --amcrit-typo-revq-transform:  none;
    --amcrit-typo-revq-decoration: none;
    --amcrit-typo-revq-spacing:    normal;
    --amcrit-typo-revq-height:     1.4;
    --amcrit-typo-revq-padding:    0;

    /* typo_review_ans — review answer text */
    --amcrit-typo-revans-family:     'Actor', sans-serif;
    --amcrit-typo-revans-size:       0.82rem;
    --amcrit-typo-revans-colour:     rgba(226, 213, 181, 0.7);
    --amcrit-typo-revans-weight:     400;
    --amcrit-typo-revans-style:      normal;
    --amcrit-typo-revans-transform:  none;
    --amcrit-typo-revans-decoration: none;
    --amcrit-typo-revans-spacing:    normal;
    --amcrit-typo-revans-height:     1.3;
    --amcrit-typo-revans-padding:    0;

    /* typo_share_label — share section label */
    --amcrit-typo-sharelbl-family:     'Actor', sans-serif;
    --amcrit-typo-sharelbl-size:       0.68rem;
    --amcrit-typo-sharelbl-colour:     var(--amcrit-accent);
    --amcrit-typo-sharelbl-weight:     400;
    --amcrit-typo-sharelbl-style:      normal;
    --amcrit-typo-sharelbl-transform:  uppercase;
    --amcrit-typo-sharelbl-decoration: none;
    --amcrit-typo-sharelbl-spacing:    2.5px;
    --amcrit-typo-sharelbl-height:     1;
    --amcrit-typo-sharelbl-padding:    0;

    /* share icon row display settings */
    --amcrit-share-icon-size:    32px;
    --amcrit-share-icon-gap:     12px;
    --amcrit-share-icon-align:   center;
    --amcrit-share-icon-colour:  var(--amcrit-text-primary);

    /* typo_restart_btn — restart session button */
    --amcrit-typo-restartbtn-family:     'Montserrat', sans-serif;
    --amcrit-typo-restartbtn-size:       0.78rem;
    --amcrit-typo-restartbtn-colour:     var(--amcrit-on-accent);
    --amcrit-typo-restartbtn-weight:     700;
    --amcrit-typo-restartbtn-style:      normal;
    --amcrit-typo-restartbtn-transform:  uppercase;
    --amcrit-typo-restartbtn-decoration: none;
    --amcrit-typo-restartbtn-spacing:    2px;
    --amcrit-typo-restartbtn-height:     1;
    --amcrit-typo-restartbtn-padding:    13px 28px;

    /* typo_hs_btn — highscores button */
    --amcrit-typo-hsbtn-family:     'Montserrat', sans-serif;
    --amcrit-typo-hsbtn-size:       14px;
    --amcrit-typo-hsbtn-colour:     var(--amcrit-accent);
    --amcrit-typo-hsbtn-weight:     600;
    --amcrit-typo-hsbtn-style:      normal;
    --amcrit-typo-hsbtn-transform:  uppercase;
    --amcrit-typo-hsbtn-decoration: none;
    --amcrit-typo-hsbtn-spacing:    0.06em;
    --amcrit-typo-hsbtn-height:     1;
    --amcrit-typo-hsbtn-padding:    0.55rem 1.4rem;

    /* typo_hsid — identity section */
    --amcrit-typo-hsid-family:     'Actor', sans-serif;
    --amcrit-typo-hsid-size:       15px;
    --amcrit-typo-hsid-weight:     400;
    --amcrit-typo-hsid-style:      normal;
    --amcrit-typo-hsid-colour:     var(--amcrit-text-body);
    --amcrit-typo-hsid-spacing:    normal;
    --amcrit-typo-hsid-transform:  none;
    --amcrit-typo-hsid-decoration: none;
    --amcrit-typo-hsid-height:     1.4;
    --amcrit-typo-hsid-align:      left;

    /* typo_hsrid — result identity line */
    --amcrit-typo-hsrid-family:     'Actor', sans-serif;
    --amcrit-typo-hsrid-size:       14px;
    --amcrit-typo-hsrid-weight:     400;
    --amcrit-typo-hsrid-style:      normal;
    --amcrit-typo-hsrid-colour:     rgba(196,167,93,0.7);
    --amcrit-typo-hsrid-spacing:    normal;
    --amcrit-typo-hsrid-transform:  none;
    --amcrit-typo-hsrid-decoration: none;
    --amcrit-typo-hsrid-height:     1.4;
    --amcrit-typo-hsrid-align:      center;

    /* typo_hstbl — highscores rest table */
    --amcrit-typo-hstbl-family:     'Actor', sans-serif;
    --amcrit-typo-hstbl-size:       14px;
    --amcrit-typo-hstbl-weight:     400;
    --amcrit-typo-hstbl-style:      normal;
    --amcrit-typo-hstbl-colour:     var(--amcrit-text-body);
    --amcrit-typo-hstbl-spacing:    normal;
    --amcrit-typo-hstbl-transform:  none;
    --amcrit-typo-hstbl-decoration: none;
    --amcrit-typo-hstbl-height:     1.4;

    /* typo_hstop10 — top-10 card grid */
    --amcrit-typo-hstop10-family:     'Actor', sans-serif;
    --amcrit-typo-hstop10-size:       14px;
    --amcrit-typo-hstop10-weight:     400;
    --amcrit-typo-hstop10-style:      normal;
    --amcrit-typo-hstop10-colour:     var(--amcrit-text-body);
    --amcrit-typo-hstop10-spacing:    normal;
    --amcrit-typo-hstop10-transform:  none;
    --amcrit-typo-hstop10-decoration: none;
    --amcrit-typo-hstop10-height:     1.4;
    --amcrit-typo-hstop10-align:      left;

    /* typo_countdown — countdown overlay */
    --amcrit-typo-countdown-family:     'Montserrat', sans-serif;
    --amcrit-typo-countdown-size:       4rem;
    --amcrit-typo-countdown-weight:     700;
    --amcrit-typo-countdown-style:      normal;
    --amcrit-typo-countdown-colour:     #ffffff;
    --amcrit-typo-countdown-spacing:    normal;
    --amcrit-typo-countdown-transform:  none;
    --amcrit-typo-countdown-decoration: none;
    --amcrit-typo-countdown-height:     1;

    /* highscores modal background */
    --amcrit-hs-modal-bg:            var(--amcrit-card-bg);

    box-sizing: border-box;
    width: 100%;
    padding: 24px 16px;
    display: flex;
    justify-content: center;
    font-family: 'Actor', sans-serif;
    color: var(--amcrit-text-primary);
}

.amcriterium-embed *,
.amcriterium-embed *::before,
.amcriterium-embed *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* ── Outer wrapper ────────────────────────────────────────────────────────── */
.amcriterium-wrapper {
    width: 100%;
    max-width: 860px;
    background: var(--amcrit-glass-bg);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border: 1px solid var(--amcrit-glass-border);
    border-top: 4px solid var(--amcrit-accent);
    border-radius: var(--amcrit-radius);
    box-shadow: 0 28px 56px -12px rgba(0,0,0,0.65);
    overflow: hidden;
}

.amcriterium-wrapper.amcriterium-quiz-active {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-color: var(--amcrit-glass-border);
    box-shadow: none;
}

/* ── Header bar ───────────────────────────────────────────────────────────── */
.amcriterium-header {
    display: none;
    align-items: center;
    justify-content: space-between;
    padding: 16px 28px;
    background: rgba(15, 23, 42, 0.60);
    border-bottom: 1px solid var(--amcrit-glass-border);
    gap: 16px;
    flex-wrap: wrap;
}

.amcriterium-header.amcriterium-visible { display: flex; }

.amcriterium-timer-display {
    font-family:     var(--amcrit-typo-timer-family);
    font-weight:     var(--amcrit-typo-timer-weight);
    font-size:       var(--amcrit-typo-timer-size);
    font-style:      var(--amcrit-typo-timer-style);
    color:           var(--amcrit-typo-timer-colour);
    text-transform:  var(--amcrit-typo-timer-transform);
    letter-spacing:  var(--amcrit-typo-timer-spacing);
    line-height:     var(--amcrit-typo-timer-height);
    padding:         var(--amcrit-typo-timer-padding);
    min-width: 90px;
}

.amcriterium-timer-display.amcriterium-timer-warn { color: var(--amcrit-incorrect); }

.amcriterium-progress-wrap { flex: 1; min-width: 140px; }

.amcriterium-counter-label {
    font-family:     var(--amcrit-typo-counter-family);
    font-size:       var(--amcrit-typo-counter-size);
    font-weight:     var(--amcrit-typo-counter-weight);
    font-style:      var(--amcrit-typo-counter-style);
    letter-spacing:  var(--amcrit-typo-counter-spacing);
    text-transform:  var(--amcrit-typo-counter-transform);
    color:           var(--amcrit-typo-counter-colour);
    padding:         var(--amcrit-typo-counter-padding);
    margin-bottom: 7px;
}

.amcriterium-progress-track {
    height: 3px;
    background: var(--amcrit-accent-faint);
    border-radius: 2px;
    overflow: hidden;
}

.amcriterium-progress-fill {
    height: 100%;
    background: var(--amcrit-accent);
    width: 0%;
    transition: width 0.35s ease;
}

/* ── Timer strip ──────────────────────────────────────────────────────────── */
.amcriterium-timer-bar-wrap {
    width: 100%;
    height: 3px;
    background: var(--amcrit-accent-faint);
    overflow: hidden;
}

.amcriterium-timer-bar-fill {
    height: 100%;
    background: var(--amcrit-accent);
    width: 0%;
    transition: width 1s linear;
}

/* ── Quiz wrapper ─────────────────────────────────────────────────────────── */
.amcriterium-quiz-wrapper {
    display: none;
    padding: 0 2.8rem;
    background: transparent;
    position: relative;
}

.amcriterium-quiz-wrapper.amcriterium-visible { display: block; }

@media (max-width: 560px) {
    .amcriterium-quiz-wrapper { padding: 0 1.2rem; }
}

/* ── Particle canvas ──────────────────────────────────────────────────────── */
.amcriterium-particle-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    display: none;
    -webkit-mask-image:
        linear-gradient(to right,  transparent 0%, black 8%, black 92%, transparent 100%),
        linear-gradient(to bottom, transparent 0%, black 8%, black 92%, transparent 100%);
    -webkit-mask-composite: destination-in;
    mask-image:
        linear-gradient(to right,  transparent 0%, black 8%, black 92%, transparent 100%),
        linear-gradient(to bottom, transparent 0%, black 8%, black 92%, transparent 100%);
    mask-composite: intersect;
}

.amcriterium-quiz-wrapper.amcriterium-particles-active .amcriterium-particle-canvas {
    display: block;
}

/* ── Countdown overlay ────────────────────────────────────────────────────── */
.amcriterium-countdown-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.amcriterium-countdown-overlay:not(.amcriterium-hidden) {
    display: flex;
}

.amcriterium-countdown-text {
    font-family:     var(--amcrit-typo-countdown-family);
    font-size:       var(--amcrit-typo-countdown-size);
    font-weight:     var(--amcrit-typo-countdown-weight);
    font-style:      var(--amcrit-typo-countdown-style);
    color:           var(--amcrit-typo-countdown-colour);
    letter-spacing:  var(--amcrit-typo-countdown-spacing);
    text-transform:  var(--amcrit-typo-countdown-transform);
    text-decoration: var(--amcrit-typo-countdown-decoration);
    line-height:     var(--amcrit-typo-countdown-height);
    text-align: center;
    padding: 0 1rem;
}

/* ── Quiz area ────────────────────────────────────────────────────────────── */
.amcriterium-quiz {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: transparent;
    overflow: visible;
    padding: 2rem 0;
    position: relative;
    z-index: 1;
}

/* ── Card ─────────────────────────────────────────────────────────────────── */
.amcriterium-card {
    position: relative;
    width: 100%;
    max-width: 606px;
    background: var(--amcrit-card-bg);
    border-radius: var(--amcrit-radius-sm);
    padding: 1.6rem 1.8rem 1.4rem;
    transition: opacity 0.32s ease;
    will-change: opacity;
}

.amcriterium-card::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: var(--amcrit-radius-sm);
    background: var(--amcrit-card-hue);
    pointer-events: none;
}

.amcriterium-card.amcriterium-state-active { border-top: 4px solid var(--amcrit-accent); }

/* ── Question text ────────────────────────────────────────────────────────── */
.amcriterium-card-question {
    font-family:     var(--amcrit-typo-q-family);
    font-weight:     var(--amcrit-typo-q-weight);
    font-size:       var(--amcrit-typo-q-size);
    font-style:      var(--amcrit-typo-q-style);
    line-height:     var(--amcrit-typo-q-height);
    color:           var(--amcrit-typo-q-colour);
    text-transform:  var(--amcrit-typo-q-transform);
    text-decoration: var(--amcrit-typo-q-decoration);
    letter-spacing:  var(--amcrit-typo-q-spacing);
    text-align:      var(--amcrit-typo-q-align);
    padding:         var(--amcrit-typo-q-padding);
    margin-bottom: 1.2rem;
    text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}

/* ── Options grid ─────────────────────────────────────────────────────────── */
.amcriterium-card-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-bottom: 1.2rem;
}

@media (max-width: 500px) {
    .amcriterium-card-options { grid-template-columns: 1fr; }
}

.amcriterium-embed .amcriterium-option {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.11);
    padding:         var(--amcrit-typo-opt-padding);
    border-radius: var(--amcrit-radius-sm);
    color:           var(--amcrit-typo-opt-colour);
    cursor: pointer;
    font-family:     var(--amcrit-typo-opt-family);
    font-size:       var(--amcrit-typo-opt-size);
    font-weight:     var(--amcrit-typo-opt-weight);
    font-style:      var(--amcrit-typo-opt-style);
    text-transform:  var(--amcrit-typo-opt-transform);
    text-decoration: var(--amcrit-typo-opt-decoration);
    letter-spacing:  var(--amcrit-typo-opt-spacing);
    line-height:     var(--amcrit-typo-opt-height);
    text-align: left;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    white-space: normal;
    transition: background var(--amcrit-transition), border-color var(--amcrit-transition);
}

.amcriterium-embed .amcriterium-option:hover {
    background: var(--amcrit-accent-faint);
    border-color: var(--amcrit-accent-muted);
    color: var(--amcrit-typo-opt-colour);
}

.amcriterium-embed .amcriterium-option.amcriterium-selected {
    background: var(--amcrit-accent);
    border-color: var(--amcrit-accent);
    color: var(--amcrit-on-accent);
    font-weight: 600;
}

.amcriterium-option-letter {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 0.50;
    flex-shrink: 0;
    width: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.amcriterium-selected .amcriterium-option-letter { opacity: 0.65; }

/* ── Card controls ────────────────────────────────────────────────────────── */
.amcriterium-card-controls { display: flex; gap: 10px; }

/* ── Content area ─────────────────────────────────────────────────────────── */
.amcriterium-content {
    padding: 2.2rem 2.8rem 2.4rem;
}

@media (max-width: 560px) {
    .amcriterium-content { padding: 1.6rem 1.2rem 2rem; }
}

/* ── Start page ───────────────────────────────────────────────────────────── */
.amcriterium-start { text-align: center; }

.amcriterium-quiz-title {
    font-family:     var(--amcrit-typo-stitle-family);
    font-weight:     var(--amcrit-typo-stitle-weight);
    font-size:       var(--amcrit-typo-stitle-size);
    font-style:      var(--amcrit-typo-stitle-style);
    color:           var(--amcrit-typo-stitle-colour);
    letter-spacing:  var(--amcrit-typo-stitle-spacing);
    text-transform:  var(--amcrit-typo-stitle-transform);
    text-decoration: var(--amcrit-typo-stitle-decoration);
    line-height:     var(--amcrit-typo-stitle-height);
    text-align:      var(--amcrit-typo-stitle-align);
    padding:         var(--amcrit-typo-stitle-padding);
    margin-bottom: 0.5rem;
}

.amcriterium-quiz-subtitle {
    font-family:     var(--amcrit-typo-ssub-family);
    font-size:       var(--amcrit-typo-ssub-size);
    font-weight:     var(--amcrit-typo-ssub-weight);
    font-style:      var(--amcrit-typo-ssub-style);
    letter-spacing:  var(--amcrit-typo-ssub-spacing);
    text-transform:  var(--amcrit-typo-ssub-transform);
    text-decoration: var(--amcrit-typo-ssub-decoration);
    color:           var(--amcrit-typo-ssub-colour);
    line-height:     var(--amcrit-typo-ssub-height);
    text-align:      var(--amcrit-typo-ssub-align);
    padding:         var(--amcrit-typo-ssub-padding);
    margin-bottom: 2rem;
}

.amcriterium-meta-row {
    display: flex;
    justify-content: center;
    gap: 24px;
    margin-bottom: 2.4rem;
    flex-wrap: wrap;
}

.amcriterium-meta-pill {
    background: var(--amcrit-accent-faint);
    border: 1px solid var(--amcrit-accent-muted);
    border-radius: 20px;
    font-family:     var(--amcrit-typo-smeta-family);
    font-size:       var(--amcrit-typo-smeta-size);
    font-weight:     var(--amcrit-typo-smeta-weight);
    font-style:      var(--amcrit-typo-smeta-style);
    letter-spacing:  var(--amcrit-typo-smeta-spacing);
    text-transform:  var(--amcrit-typo-smeta-transform);
    text-decoration: var(--amcrit-typo-smeta-decoration);
    line-height:     var(--amcrit-typo-smeta-height);
    color:           var(--amcrit-typo-smeta-colour);
    padding:         var(--amcrit-typo-smeta-padding);
}

.amcriterium-meta-pill span { color: var(--amcrit-accent); font-weight: 600; }

/* ── Buttons ──────────────────────────────────────────────────────────────── */
.amcriterium-embed .amcriterium-btn-ghost {
    background: transparent;
    border: 1px solid var(--amcrit-glass-border);
    color:           var(--amcrit-typo-prev-colour);
    padding:         var(--amcrit-typo-prev-padding);
    cursor: pointer;
    font-family:     var(--amcrit-typo-prev-family);
    font-size:       var(--amcrit-typo-prev-size);
    font-weight:     var(--amcrit-typo-prev-weight);
    font-style:      var(--amcrit-typo-prev-style);
    letter-spacing:  var(--amcrit-typo-prev-spacing);
    text-transform:  var(--amcrit-typo-prev-transform);
    text-decoration: var(--amcrit-typo-prev-decoration);
    line-height:     var(--amcrit-typo-prev-height);
    border-radius: var(--amcrit-radius-sm);
    transition: background var(--amcrit-transition), border-color var(--amcrit-transition);
}

.amcriterium-embed .amcriterium-btn-ghost:hover:not(:disabled) {
    background: rgba(255,255,255,0.07);
    border-color: var(--amcrit-accent-muted);
    color: var(--amcrit-typo-prev-colour);
}

.amcriterium-embed .amcriterium-btn-ghost:disabled { opacity: 0.18; cursor: not-allowed; }

.amcriterium-embed .amcriterium-btn-primary {
    background: var(--amcrit-accent);
    border: 1px solid var(--amcrit-accent);
    color:           var(--amcrit-typo-sbtn-colour);
    padding:         var(--amcrit-typo-sbtn-padding);
    cursor: pointer;
    font-family:     var(--amcrit-typo-sbtn-family);
    font-weight:     var(--amcrit-typo-sbtn-weight);
    font-size:       var(--amcrit-typo-sbtn-size);
    font-style:      var(--amcrit-typo-sbtn-style);
    letter-spacing:  var(--amcrit-typo-sbtn-spacing);
    text-transform:  var(--amcrit-typo-sbtn-transform);
    text-decoration: var(--amcrit-typo-sbtn-decoration);
    line-height:     var(--amcrit-typo-sbtn-height);
    border-radius: var(--amcrit-radius-sm);
    transition: opacity var(--amcrit-transition);
}

.amcriterium-embed .amcriterium-btn-primary:hover {
    opacity: 0.88;
    background: var(--amcrit-accent);
    border-color: var(--amcrit-accent);
    color: var(--amcrit-typo-sbtn-colour);
}

/* ── Share icon buttons ───────────────────────────────────────────────────── */
.amcriterium-share-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--amcrit-share-icon-size);
    height: var(--amcrit-share-icon-size);
    background: transparent;
    border: none;
    border-radius: 4px;
    color: var(--amcrit-share-icon-colour);
    cursor: pointer;
    padding: 0;
    transition: color var(--amcrit-transition), transform var(--amcrit-transition);
    flex-shrink: 0;
}

.amcriterium-share-icon-btn svg {
    width: 100%;
    height: 100%;
    display: block;
}

.amcriterium-share-icon-btn:hover {
    color: var(--amcrit-accent);
    transform: scale(1.12);
}

/* ── Share image buttons (fixed text) ────────────────────────────────────── */
.amcriterium-embed .amcriterium-btn-share {
    background: transparent;
    border: 1px solid var(--amcrit-accent-muted);
    color: var(--amcrit-accent);
    padding: 10px 16px;
    cursor: pointer;
    font-family:     var(--amcrit-typo-restartbtn-family);
    font-size:       var(--amcrit-typo-restartbtn-size);
    font-weight:     var(--amcrit-typo-restartbtn-weight);
    font-style:      var(--amcrit-typo-restartbtn-style);
    letter-spacing:  var(--amcrit-typo-restartbtn-spacing);
    text-transform:  var(--amcrit-typo-restartbtn-transform);
    text-decoration: var(--amcrit-typo-restartbtn-decoration);
    line-height:     var(--amcrit-typo-restartbtn-height);
    border-radius: var(--amcrit-radius-sm);
    transition: background var(--amcrit-transition), color var(--amcrit-transition), border-color var(--amcrit-transition);
}

.amcriterium-embed .amcriterium-btn-share:hover {
    background: var(--amcrit-accent);
    border-color: var(--amcrit-accent);
    color: var(--amcrit-on-accent);
}

/* ── Result ───────────────────────────────────────────────────────────────── */
.amcriterium-result { display: none; text-align: center; }
.amcriterium-result.amcriterium-visible { display: block; }

.amcriterium-result-title {
    font-family:     var(--amcrit-typo-rtitle-family);
    font-weight:     var(--amcrit-typo-rtitle-weight);
    font-size:       var(--amcrit-typo-rtitle-size);
    font-style:      var(--amcrit-typo-rtitle-style);
    color:           var(--amcrit-typo-rtitle-colour);
    text-transform:  var(--amcrit-typo-rtitle-transform);
    text-decoration: var(--amcrit-typo-rtitle-decoration);
    letter-spacing:  var(--amcrit-typo-rtitle-spacing);
    line-height:     var(--amcrit-typo-rtitle-height);
    text-align:      var(--amcrit-typo-rtitle-align);
    padding:         var(--amcrit-typo-rtitle-padding);
    margin-bottom: 0.8rem;
}

.amcriterium-score-display {
    font-family:     var(--amcrit-typo-score-family);
    font-weight:     var(--amcrit-typo-score-weight);
    font-size:       var(--amcrit-typo-score-size);
    font-style:      var(--amcrit-typo-score-style);
    color:           var(--amcrit-typo-score-colour);
    text-transform:  var(--amcrit-typo-score-transform);
    text-decoration: var(--amcrit-typo-score-decoration);
    letter-spacing:  var(--amcrit-typo-score-spacing);
    line-height:     var(--amcrit-typo-score-height);
    text-align:      var(--amcrit-typo-score-align);
    padding:         var(--amcrit-typo-score-padding);
    margin: 0.4rem 0 0.2rem;
}

.amcriterium-score-label {
    font-family:     var(--amcrit-typo-slabel-family);
    font-size:       var(--amcrit-typo-slabel-size);
    font-weight:     var(--amcrit-typo-slabel-weight);
    font-style:      var(--amcrit-typo-slabel-style);
    letter-spacing:  var(--amcrit-typo-slabel-spacing);
    text-transform:  var(--amcrit-typo-slabel-transform);
    text-decoration: var(--amcrit-typo-slabel-decoration);
    color:           var(--amcrit-typo-slabel-colour);
    text-align:      var(--amcrit-typo-slabel-align);
    padding:         var(--amcrit-typo-slabel-padding);
    margin-bottom: 0.5rem;
}

.amcriterium-time-taken {
    font-family:     var(--amcrit-typo-time-family);
    font-size:       var(--amcrit-typo-time-size);
    font-weight:     var(--amcrit-typo-time-weight);
    font-style:      var(--amcrit-typo-time-style);
    letter-spacing:  var(--amcrit-typo-time-spacing);
    text-transform:  var(--amcrit-typo-time-transform);
    text-decoration: var(--amcrit-typo-time-decoration);
    color:           var(--amcrit-typo-time-colour);
    text-align:      var(--amcrit-typo-time-align);
    padding:         var(--amcrit-typo-time-padding);
    margin-bottom: 1rem;
}

.amcriterium-remark {
    font-family:     var(--amcrit-typo-remark-family);
    font-style:      var(--amcrit-typo-remark-style);
    font-size:       var(--amcrit-typo-remark-size);
    font-weight:     var(--amcrit-typo-remark-weight);
    color:           var(--amcrit-typo-remark-colour);
    text-transform:  var(--amcrit-typo-remark-transform);
    text-decoration: var(--amcrit-typo-remark-decoration);
    letter-spacing:  var(--amcrit-typo-remark-spacing);
    line-height:     var(--amcrit-typo-remark-height);
    text-align:      var(--amcrit-typo-remark-align);
    padding:         var(--amcrit-typo-remark-padding);
    margin: 1rem 0 2rem;
}

/* ── Review ───────────────────────────────────────────────────────────────── */
.amcriterium-review-wrap {
    margin-top: 2rem;
    text-align: left;
    border-top: 1px solid var(--amcrit-glass-border);
    padding-top: 1.5rem;
    max-height: 38vh;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--amcrit-accent) transparent;
}

.amcriterium-review-item {
    margin-bottom: 1.2rem;
    padding: 0.9rem 1rem;
    background: rgba(255,255,255,0.025);
    border-left: 3px solid var(--amcrit-accent-muted);
    border-radius: 0 var(--amcrit-radius-sm) var(--amcrit-radius-sm) 0;
}

.amcriterium-review-item.amcriterium-correct { border-left-color: var(--amcrit-correct); }
.amcriterium-review-item.amcriterium-wrong   { border-left-color: var(--amcrit-incorrect); }

.amcriterium-review-q {
    font-family:     var(--amcrit-typo-revq-family);
    font-weight:     var(--amcrit-typo-revq-weight);
    font-size:       var(--amcrit-typo-revq-size);
    font-style:      var(--amcrit-typo-revq-style);
    letter-spacing:  var(--amcrit-typo-revq-spacing);
    text-transform:  var(--amcrit-typo-revq-transform);
    text-decoration: var(--amcrit-typo-revq-decoration);
    line-height:     var(--amcrit-typo-revq-height);
    color:           var(--amcrit-typo-revq-colour);
    padding:         var(--amcrit-typo-revq-padding);
    margin-bottom: 5px;
}

.amcriterium-review-answer {
    font-family:     var(--amcrit-typo-revans-family);
    font-size:       var(--amcrit-typo-revans-size);
    font-weight:     var(--amcrit-typo-revans-weight);
    font-style:      var(--amcrit-typo-revans-style);
    letter-spacing:  var(--amcrit-typo-revans-spacing);
    text-transform:  var(--amcrit-typo-revans-transform);
    text-decoration: var(--amcrit-typo-revans-decoration);
    line-height:     var(--amcrit-typo-revans-height);
    color:           var(--amcrit-typo-revans-colour);
    padding:         var(--amcrit-typo-revans-padding);
}
.amcriterium-review-answer-correct  { color: var(--amcrit-correct); }
.amcriterium-review-answer-wrong    { color: var(--amcrit-incorrect); }

/* ── Share section ────────────────────────────────────────────────────────── */
.amcriterium-share-section {
    margin: 2rem 0;
    padding: 1.4rem 1.6rem;
    background: rgba(255,255,255,0.02);
    border: 1px solid var(--amcrit-glass-border);
    border-radius: var(--amcrit-radius);
}

.amcriterium-share-row {
    margin-bottom: 1.2rem;
}

.amcriterium-share-row:last-child {
    margin-bottom: 0;
}

.amcriterium-share-row-label {
    font-family:     var(--amcrit-typo-sharelbl-family);
    font-size:       var(--amcrit-typo-sharelbl-size);
    font-weight:     var(--amcrit-typo-sharelbl-weight);
    font-style:      var(--amcrit-typo-sharelbl-style);
    letter-spacing:  var(--amcrit-typo-sharelbl-spacing);
    text-transform:  var(--amcrit-typo-sharelbl-transform);
    text-decoration: var(--amcrit-typo-sharelbl-decoration);
    line-height:     var(--amcrit-typo-sharelbl-height);
    color:           var(--amcrit-typo-sharelbl-colour);
    padding:         var(--amcrit-typo-sharelbl-padding);
    margin-bottom: 0.7rem;
}

.amcriterium-share-icon-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--amcrit-share-icon-gap);
    justify-content: var(--amcrit-share-icon-align);
    padding: 0.6rem 0;
}

.amcriterium-share-row--image {
    margin-top: 1.2rem;
}

.amcriterium-share-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
}

@media (min-width: 480px) { .amcriterium-share-grid { grid-template-columns: 1fr 1fr; } }

/* ── Restart button — scoped to beat .amcriterium-btn-primary specificity ─── */
.amcriterium-embed .amcriterium-restart-btn {
    color:           var(--amcrit-typo-restartbtn-colour);
    padding:         var(--amcrit-typo-restartbtn-padding);
    font-family:     var(--amcrit-typo-restartbtn-family);
    font-weight:     var(--amcrit-typo-restartbtn-weight);
    font-size:       var(--amcrit-typo-restartbtn-size);
    font-style:      var(--amcrit-typo-restartbtn-style);
    letter-spacing:  var(--amcrit-typo-restartbtn-spacing);
    text-transform:  var(--amcrit-typo-restartbtn-transform);
    text-decoration: var(--amcrit-typo-restartbtn-decoration);
    line-height:     var(--amcrit-typo-restartbtn-height);
}

/* ── Question image ───────────────────────────────────────────────────────── */
.amcriterium-question-img-wrap {
    width: 100%;
    max-width: 480px;
    margin: 0 auto 1.2rem;
    border-radius: var(--amcrit-radius-sm);
    overflow: hidden;
    aspect-ratio: 16 / 9;
}

.amcriterium-question-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Two-column layout — left/right image position */
.amcriterium-question-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2rem;
    align-items: center;
    margin-bottom: 1.2rem;
}

.amcriterium-question-cols .amcriterium-question-img-wrap {
    margin: 0;
    max-width: 100%;
}

.amcriterium-question-cols .amcriterium-card-question {
    margin-bottom: 0;
}

.amcriterium-question-col-text {
    display: flex;
    align-items: center;
}

@media (max-width: 560px) {
    .amcriterium-question-cols {
        grid-template-columns: 1fr;
    }
    .amcriterium-question-cols--left .amcriterium-question-img-wrap,
    .amcriterium-question-cols--right .amcriterium-question-img-wrap {
        order: -1;
        max-width: 100%;
        margin-bottom: 0.8rem;
    }
}

/* ── Option image ─────────────────────────────────────────────────────────── */
.amcriterium-option-img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: calc(var(--amcrit-radius-sm) - 1px);
}

.amcriterium-option-text-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0.4rem 0;
}

/* ── Card question — below-image variant needs bottom margin ──────────────── */
.amcriterium-question-img-wrap + .amcriterium-card-question {
    margin-top: 0;
}

.amcriterium-card-question + .amcriterium-question-img-wrap {
    margin-top: 0;
    margin-bottom: 1.2rem;
}


.amcriterium-embed.amcriterium-glass-light {
    --amcrit-glass-bg:     rgba(255, 250, 240, 0.75);
    --amcrit-glass-border: rgba(196, 167, 93, 0.25);
    --amcrit-card-bg:      rgba(255, 250, 240, 0.92);
    --amcrit-text-primary: #0f172a;
    --amcrit-text-body:    #1e293b;
    --amcrit-text-muted:   rgba(15, 23, 42, 0.5);
}

/* ── Utility ──────────────────────────────────────────────────────────────── */
.amcriterium-hidden  { display: none !important; }
.amcriterium-divider { height: 1px; background: var(--amcrit-glass-border); margin: 2rem 0; }

/* ── Identity section ─────────────────────────────────────────────────────── */
.amcriterium-identity-section {
    margin: 1.4rem 0 1rem;
    text-align: left;
    font-family: var(--amcrit-typo-hsid-family);
    font-size:   var(--amcrit-typo-hsid-size);
    font-weight: var(--amcrit-typo-hsid-weight);
    font-style:  var(--amcrit-typo-hsid-style);
    color:       var(--amcrit-typo-hsid-colour);
    letter-spacing: var(--amcrit-typo-hsid-spacing);
    line-height:    var(--amcrit-typo-hsid-height);
}

.amcriterium-identity-row {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    margin-bottom: 0.6rem;
}

.amcriterium-identity-select {
    flex: 0 0 42%;
    height: 2.8rem;
    background: var(--amcrit-card-bg);
    border: 1px solid var(--amcrit-glass-border);
    border-radius: var(--amcrit-radius-sm);
    font-family: var(--amcrit-typo-hsid-family);
    font-size:   var(--amcrit-typo-hsid-size);
    font-weight: var(--amcrit-typo-hsid-weight);
    padding: 0 0.9rem;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.amcriterium-identity-select:focus {
    border-color: var(--amcrit-accent);
}

.amcriterium-identity-input-wrap {
    flex: 1;
}

.amcriterium-identity-hint {
    font-family:  var(--amcrit-typo-hsid-family);
    font-size:    13px;
    color:        rgba(196,167,93,0.55);
    margin-top: 0.4rem;
    min-height: 1em;
    line-height: 1.4;
    text-align: left;
}

.amcriterium-identity-input {
    width: 100%;
    height: 2.8rem;
    background: var(--amcrit-card-bg);
    border: 1px solid var(--amcrit-glass-border);
    border-radius: var(--amcrit-radius-sm);
    font-family: var(--amcrit-typo-hsid-family);
    font-size:   var(--amcrit-typo-hsid-size);
    font-weight: var(--amcrit-typo-hsid-weight);
    padding: 0 0.9rem;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.amcriterium-identity-input:focus {
    border-color: var(--amcrit-accent);
}

/* Colour scoped via embed specificity — consistent with plugin ID-scoped pattern */
.amcriterium-embed .amcriterium-identity-select,
.amcriterium-embed .amcriterium-identity-input {
    color: var(--amcrit-typo-hsid-colour);
}

.amcriterium-identity-input:disabled,
.amcriterium-identity-select:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

/* ── Guest toggle pill ────────────────────────────────────────────────────── */
.amcriterium-guest-row {
    margin-top: 0.8rem;
    display: flex;
    justify-content: center;
}

.amcriterium-guest-label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-family: var(--amcrit-typo-hsid-family);
    font-size:   var(--amcrit-typo-hsid-size);
    color: var(--amcrit-typo-hsid-colour);
    cursor: pointer;
    user-select: none;
}

.amcriterium-toggle-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.amcriterium-guest-toggle {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
}

.amcriterium-toggle-track {
    display: block;
    width: 40px;
    height: 22px;
    background: rgba(196,167,93,0.18);
    border: 1px solid var(--amcrit-glass-border);
    border-radius: 11px;
    position: relative;
    transition: background 0.22s, border-color 0.22s;
    cursor: pointer;
}

.amcriterium-toggle-thumb {
    display: block;
    width: 16px;
    height: 16px;
    background: var(--amcrit-text-body);
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    transition: transform 0.22s, background 0.22s;
}

.amcriterium-guest-toggle:checked + .amcriterium-toggle-track {
    background: rgba(196,167,93,0.35);
    border-color: var(--amcrit-accent);
}

.amcriterium-guest-toggle:checked + .amcriterium-toggle-track .amcriterium-toggle-thumb {
    transform: translateX(18px);
    background: var(--amcrit-accent);
}

/* ── Start actions row ────────────────────────────────────────────────────── */
.amcriterium-start-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.7rem;
    margin-top: 1.2rem;
}

/* ── Highscores button ────────────────────────────────────────────────────── */
.amcriterium-embed .amcriterium-hs-btn {
    background: transparent;
    border: 1px solid var(--amcrit-glass-border);
    border-radius: var(--amcrit-radius-sm);
    color:           var(--amcrit-typo-hsbtn-colour);
    padding:         var(--amcrit-typo-hsbtn-padding);
    cursor: pointer;
    font-family:     var(--amcrit-typo-hsbtn-family);
    font-size:       var(--amcrit-typo-hsbtn-size);
    font-weight:     var(--amcrit-typo-hsbtn-weight);
    font-style:      var(--amcrit-typo-hsbtn-style);
    letter-spacing:  var(--amcrit-typo-hsbtn-spacing);
    text-transform:  var(--amcrit-typo-hsbtn-transform);
    text-decoration: var(--amcrit-typo-hsbtn-decoration);
    line-height:     var(--amcrit-typo-hsbtn-height);
    transition: border-color 0.2s, color 0.2s;
}

.amcriterium-embed .amcriterium-hs-btn:hover {
    border-color: var(--amcrit-accent);
    color: var(--amcrit-accent);
}

/* ── Result identity display ──────────────────────────────────────────────── */
.amcriterium-result-identity {
    margin-bottom: 0.8rem;
    font-family:     var(--amcrit-typo-hsrid-family);
    font-size:       var(--amcrit-typo-hsrid-size);
    font-weight:     var(--amcrit-typo-hsrid-weight);
    font-style:      var(--amcrit-typo-hsrid-style);
    color:           var(--amcrit-typo-hsrid-colour);
    letter-spacing:  var(--amcrit-typo-hsrid-spacing);
    text-transform:  var(--amcrit-typo-hsrid-transform);
    text-decoration: var(--amcrit-typo-hsrid-decoration);
    line-height:     var(--amcrit-typo-hsrid-height);
    text-align:      var(--amcrit-typo-hsrid-align);
}

/* ── Result actions row ───────────────────────────────────────────────────── */
.amcriterium-result-actions {
    display: flex;
    justify-content: center;
    margin: 1rem 0;
}

/* ── Highscores modal overlay ─────────────────────────────────────────────── */
.amcriterium-hs-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.72);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

.amcriterium-hs-overlay.amcriterium-hidden {
    display: none !important;
}

.amcriterium-hs-modal {
    background: var(--amcrit-hs-modal-bg, var(--amcrit-card-bg));
    border: 1px solid var(--amcrit-glass-border);
    border-top: 3px solid var(--amcrit-accent);
    border-radius: var(--amcrit-radius);
    width: 100%;
    max-width: 680px;
    max-height: 82vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 32px 64px -12px rgba(0,0,0,0.7);
    overflow: hidden;
}

.amcriterium-hs-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.4rem;
    border-bottom: 1px solid var(--amcrit-glass-border);
    flex-shrink: 0;
}

.amcriterium-hs-modal-title {
    font-family:     var(--amcrit-typo-hstbl-family);
    font-size:       var(--amcrit-typo-hstbl-size);
    font-weight:     var(--amcrit-typo-hstbl-weight);
    font-style:      var(--amcrit-typo-hstbl-style);
    color: var(--amcrit-accent);
    letter-spacing:  0.06em;
}

.amcriterium-hs-modal-close {
    background: transparent;
    border: none;
    color: var(--amcrit-text-body);
    font-size: 1rem;
    cursor: pointer;
    opacity: 0.6;
    padding: 0.2rem 0.4rem;
    line-height: 1;
    transition: opacity 0.15s;
}

.amcriterium-hs-modal-close:hover { opacity: 1; }

.amcriterium-hs-modal-body {
    overflow-y: auto;
    flex: 1;
    padding: 1.2rem 1.4rem;
}

.amcriterium-hs-loading {
    text-align: center;
    color: rgba(196,167,93,0.4);
    font-size: 0.85rem;
    padding: 2rem 0;
}

/* ── Highscores top 10 cards ──────────────────────────────────────────────── */
.amcriterium-hs-top10-label {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--amcrit-accent);
    opacity: 0.7;
    margin-bottom: 0.6rem;
}

.amcriterium-hs-cards-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}

@media (max-width: 480px) {
    .amcriterium-hs-cards-grid { grid-template-columns: 1fr; }
}

.amcriterium-hs-card {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.8rem;
    background: rgba(196,167,93,0.07);
    border: 1px solid var(--amcrit-accent);
    border-radius: var(--amcrit-radius-sm);
    font-family:     var(--amcrit-typo-hstop10-family);
    font-size:       var(--amcrit-typo-hstop10-size);
    font-weight:     var(--amcrit-typo-hstop10-weight);
    font-style:      var(--amcrit-typo-hstop10-style);
    color:           var(--amcrit-typo-hstop10-colour);
    letter-spacing:  var(--amcrit-typo-hstop10-spacing);
    text-transform:  var(--amcrit-typo-hstop10-transform);
    text-decoration: var(--amcrit-typo-hstop10-decoration);
    line-height:     var(--amcrit-typo-hstop10-height);
    min-width: 0;
}

.amcriterium-hs-card-rank {
    flex: 0 0 24px;
    font-weight: 700;
    color: var(--amcrit-accent);
    text-align: center;
}

.amcriterium-hs-platform-icon {
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    line-height: 1;
    opacity: 0.85;
}

.amcriterium-hs-platform-cell {
    width: 20px;
    text-align: center;
    padding: 4px 2px;
}

.amcriterium-hs-platform-cell .amcriterium-hs-platform-icon {
    display: inline-flex;
}

.amcriterium-hs-card-name {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.amcriterium-hs-card-score {
    flex: 0 0 auto;
    opacity: 0.8;
}

.amcriterium-hs-card-time {
    flex: 0 0 38px;
    text-align: right;
    opacity: 0.65;
}

/* ── Highscores rest table ────────────────────────────────────────────────── */
.amcriterium-hs-table {
    width: 100%;
    border-collapse: collapse;
    font-family:     var(--amcrit-typo-hstbl-family);
    font-size:       var(--amcrit-typo-hstbl-size);
    font-weight:     var(--amcrit-typo-hstbl-weight);
    font-style:      var(--amcrit-typo-hstbl-style);
    color:           var(--amcrit-typo-hstbl-colour);
    letter-spacing:  var(--amcrit-typo-hstbl-spacing);
    text-transform:  var(--amcrit-typo-hstbl-transform);
    text-decoration: var(--amcrit-typo-hstbl-decoration);
    line-height:     var(--amcrit-typo-hstbl-height);
    margin-bottom: 1.2rem;
}

.amcriterium-hs-table th {
    text-align: left;
    padding: 0.45rem 0.7rem;
    border-bottom: 1px solid var(--amcrit-glass-border);
    color: var(--amcrit-accent);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 600;
}

.amcriterium-hs-table td {
    padding: 0.45rem 0.7rem;
    border-bottom: 1px solid rgba(196,167,93,0.07);
    vertical-align: middle;
}

.amcriterium-hs-table .amcriterium-hs-rank {
    width: 32px;
    text-align: center;
    font-weight: 700;
    color: var(--amcrit-accent);
    opacity: 0.6;
}

.amcriterium-hs-profile-link {
    color: var(--amcrit-accent);
    text-decoration: none;
    border-bottom: 1px solid rgba(196,167,93,0.3);
    transition: border-color 0.15s;
}

.amcriterium-hs-profile-link:hover {
    border-color: var(--amcrit-accent);
}

.amcriterium-hs-rest-wrap {
    max-height: 260px;
    overflow-y: auto;
    border-top: 1px solid var(--amcrit-glass-border);
    margin-top: 0.8rem;
}

/* ── Highscores typography tokens — applied via CSS custom properties set in front.js ── */
}

/* ── Score submission status ──────────────────────────────────────────────── */
.amcriterium-hs-submit-status {
    font-size: 0.8rem;
    letter-spacing: 0.04em;
    text-align: center;
    margin-bottom: 0.5rem;
    padding: 0.3rem 0;
}

.amcriterium-hs-submit-status.amcriterium-hs-submit-ok {
    color: var(--amcrit-accent);
    opacity: 0.85;
}

.amcriterium-hs-submit-status.amcriterium-hs-submit-fail {
    color: var(--amcrit-text-body);
    opacity: 0.45;
}