/* UKF Melkisedekin Akatemia v0.3.0-alpha */

.ukf-ma-intro-actions .ukf-maka-start {
    background: linear-gradient(135deg, rgba(139, 44, 245, .92), rgba(190, 25, 166, .82));
    border-color: rgba(218, 176, 255, .34);
}

.ukf-ma-intro-actions .ukf-maka-start:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 30px rgba(129, 42, 220, .28);
}

.ukf-ma-projector.is-academy .ukf-ma-topbar {
    opacity: 0;
    pointer-events: none;
}

.ukf-maka-view {
    position: absolute;
    inset: 82px 24px 24px;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(166, 92, 244, .58) transparent;
    z-index: 3;
}

.ukf-maka-shell {
    width: min(1120px, 100%);
    margin: 0 auto;
    padding: 28px 0 54px;
    color: #fff;
}

.ukf-maka-hero,
.ukf-maka-featured,
.ukf-maka-stat,
.ukf-maka-games,
.ukf-maka-launchpad {
    border: 1px solid rgba(188, 149, 255, .18);
    background: linear-gradient(145deg, rgba(37, 31, 62, .96), rgba(15, 17, 37, .96));
    box-shadow: 0 24px 70px rgba(0, 0, 0, .24);
}

.ukf-maka-hero {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 24px 26px;
    border-radius: 24px;
    overflow: hidden;
}

.ukf-maka-hero::after {
    content: '';
    position: absolute;
    width: 260px;
    height: 260px;
    right: -90px;
    top: -150px;
    border-radius: 50%;
    background: rgba(139, 44, 245, .25);
    filter: blur(10px);
    pointer-events: none;
}

.ukf-maka-mark,
.ukf-maka-launchpad-icon {
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    border-radius: 20px;
    font-size: 34px;
    background: linear-gradient(145deg, #8b2cf5, #bb199f);
    box-shadow: 0 14px 35px rgba(139, 44, 245, .35);
}

.ukf-maka-eyebrow,
.ukf-maka-kicker {
    margin-top: 10px;
    display: block;
    margin-bottom: 7px;
    color: #d8b8ff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .14em;
}

.ukf-maka-hero h2,
.ukf-maka-featured h3,
.ukf-maka-games h3,
.ukf-maka-launchpad h2 {
    margin: 0;
    color: #fff;
}

.ukf-maka-hero h2 { font-size: clamp(24px, 3vw, 38px); }
.ukf-maka-hero p { margin: 7px 0 0; color: rgba(255,255,255,.68); }

.ukf-maka-alpha,
.ukf-maka-development {
    position: relative;
    z-index: 1;
    padding: 8px 12px;
    border-radius: 999px;
    color: #e8d8ff;
    background: rgba(139, 44, 245, .19);
    border: 1px solid rgba(196, 148, 255, .2);
    font-size: 11px;
    font-weight: 800;
}

.ukf-maka-dashboard {
    display: grid;
    gap: 18px;
    margin-top: 18px;
}

.ukf-maka-featured {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 28px;
    padding: 30px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 84% 36%, rgba(178, 45, 235, .28), transparent 34%),
        linear-gradient(145deg, rgba(73, 24, 111, .96), rgba(21, 18, 47, .97));
}

.ukf-maka-featured h3 { font-size: clamp(22px, 3vw, 34px); }
.ukf-maka-featured p { max-width: 680px; color: rgba(255,255,255,.72); line-height: 1.55; }
.ukf-maka-trophy { font-size: clamp(70px, 10vw, 124px); filter: drop-shadow(0 16px 22px rgba(0,0,0,.3)); }

.ukf-maka-primary,
.ukf-maka-launchpad-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 22px;
    border: 0;
    border-radius: 999px;
    color: #fff;
    text-decoration: none;
    font-weight: 900;
    background: linear-gradient(135deg, #8b2cf5, #bb199f);
    box-shadow: 0 12px 30px rgba(139, 44, 245, .24);
}

.ukf-maka-primary[disabled] { opacity: .72; cursor: default; }

.ukf-maka-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.ukf-maka-stat {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 3px 12px;
    padding: 20px;
    border-radius: 20px;
}

.ukf-maka-stat > span { grid-row: 1 / 3; font-size: 30px; }
.ukf-maka-stat strong { align-self: end; }
.ukf-maka-stat small { color: rgba(255,255,255,.56); }

.ukf-maka-games {
    padding: 26px;
    border-radius: 24px;
}

.ukf-maka-section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 18px;
    margin-bottom: 18px;
}

.ukf-maka-game-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.ukf-maka-game {
    position: relative;
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
    min-height: 215px;
    padding: 20px;
    text-align: left;
    color: #fff;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 20px;
    background: linear-gradient(155deg, rgba(100, 58, 145, .3), rgba(19, 21, 44, .9));
    opacity: 1;
}

.ukf-maka-game-icon { display: block; margin-bottom: 26px; font-size: 40px; }
.ukf-maka-game strong { display: block; margin-bottom: 9px; font-size: 18px; }
.ukf-maka-game small { display: block; color: rgba(255,255,255,.61); line-height: 1.45; }
.ukf-maka-game:hover,
.ukf-maka-game:focus-visible {
    transform: translateY(-4px);
    border-color: rgba(205, 159, 255, .38);
    box-shadow: 0 18px 36px rgba(0,0,0,.28);
    background: linear-gradient(155deg, rgba(122, 65, 174, .42), rgba(19, 21, 44, .94));
}

.ukf-maka-game.is-playable::after {
    content: '▶';
    position: absolute;
    top: 16px;
    right: 16px;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #8b2cf5, #bb199f);
    box-shadow: 0 10px 22px rgba(139,44,245,.35);
    font-size: 12px;
}

.ukf-maka-game.is-opening { transform: scale(.96); opacity: .78; }

.ukf-maka-game em { position: absolute; left: 20px; bottom: 17px; color: #d8b8ff; font-size: 11px; font-style: normal; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }

.ukf-maka-launchpad {
    overflow: hidden;
    border-radius: 24px;
    color: #fff;
}

.ukf-maka-launchpad-main {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 22px;
    padding: 28px;
    background:
        radial-gradient(circle at 12% 20%, rgba(171, 49, 244, .22), transparent 32%),
        linear-gradient(140deg, rgba(34, 31, 60, .97), rgba(16, 18, 38, .98));
}

.ukf-maka-launchpad-copy p { margin: 7px 0 0; color: rgba(255,255,255,.67); }
.ukf-maka-launchpad-meta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid rgba(255,255,255,.08);
}

.ukf-maka-launchpad-meta span {
    padding: 15px 20px;
    color: rgba(255,255,255,.72);
    text-align: center;
}

.ukf-maka-launchpad-meta span + span { border-left: 1px solid rgba(255,255,255,.08); }
.ukf-maka-launchpad-meta b { margin-left: 6px; color: #d9bcff; }

@media (max-width: 900px) {
    .ukf-maka-game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ukf-maka-launchpad-main { grid-template-columns: auto 1fr; }
    .ukf-maka-launchpad-button { grid-column: 1 / -1; width: 100%; }
}

@media (max-width: 680px) {
    .ukf-maka-view { inset: 68px 10px 10px; }
    .ukf-maka-shell { padding: 16px 0 32px; }
    .ukf-maka-hero { grid-template-columns: auto 1fr; padding: 18px; border-radius: 20px; }
    .ukf-maka-alpha { grid-column: 1 / -1; justify-self: start; }
    .ukf-maka-mark { width: 54px; height: 54px; border-radius: 16px; font-size: 27px; }
    .ukf-maka-featured { grid-template-columns: 1fr; padding: 22px; }
    .ukf-maka-trophy { display: none; }
    .ukf-maka-stat-grid { grid-template-columns: 1fr; }
    .ukf-maka-games { padding: 20px; }
    .ukf-maka-section-head { align-items: start; flex-direction: column; }
    .ukf-maka-game-grid { grid-template-columns: 1fr; }
    .ukf-maka-game { min-height: 185px; }
    .ukf-maka-launchpad-main { grid-template-columns: 1fr; text-align: center; }
    .ukf-maka-launchpad-icon { margin: 0 auto; }
    .ukf-maka-launchpad-meta { grid-template-columns: 1fr; }
    .ukf-maka-launchpad-meta span + span { border-left: 0; border-top: 1px solid rgba(255,255,255,.08); }
}


/* Screens and playable Alpha flow */
.ukf-maka-screen {
    animation: ukfMakaScreenIn .28s ease both;
}

@keyframes ukfMakaScreenIn {
    from { opacity: 0; transform: translateY(10px) scale(.992); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.ukf-maka-cover,
.ukf-maka-quiz,
.ukf-maka-result {
    width: min(880px, 100%);
    margin: 34px auto 0;
    color: #fff;
}

.ukf-maka-cover,
.ukf-maka-question-card,
.ukf-maka-result {
    border: 1px solid rgba(188,149,255,.2);
    border-radius: 28px;
    background:
        radial-gradient(circle at 85% 8%, rgba(153, 49, 235, .2), transparent 34%),
        linear-gradient(145deg, rgba(39, 31, 66, .98), rgba(14, 16, 36, .98));
    box-shadow: 0 28px 80px rgba(0,0,0,.3);
}

.ukf-maka-cover {
    padding: clamp(26px, 5vw, 54px);
    text-align: center;
}

.ukf-maka-cover-icon,
.ukf-maka-result-icon {
    display: grid;
    place-items: center;
    width: 92px;
    height: 92px;
    margin: 0 auto 22px;
    border-radius: 28px;
    font-size: 48px;
    background: linear-gradient(145deg, rgba(139,44,245,.92), rgba(187,25,159,.9));
    box-shadow: 0 18px 44px rgba(139,44,245,.32);
}

.ukf-maka-cover h2,
.ukf-maka-question-card h2,
.ukf-maka-result h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(27px, 4vw, 44px);
    line-height: 1.16;
}

.ukf-maka-cover-lead {
    max-width: 650px;
    margin: 14px auto 0;
    color: rgba(255,255,255,.7);
    font-size: 17px;
    line-height: 1.6;
}

.ukf-maka-cover-facts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin: 30px 0;
}

.ukf-maka-cover-facts > div {
    display: grid;
    gap: 5px;
    padding: 18px 12px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 18px;
    background: rgba(255,255,255,.035);
}

.ukf-maka-cover-facts span { font-size: 25px; }
.ukf-maka-cover-facts small { color: rgba(255,255,255,.54); }
.ukf-maka-cover-facts strong { color: #fff; }

.ukf-maka-cover-actions,
.ukf-maka-result-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.ukf-maka-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 22px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    color: #fff;
    background: rgba(255,255,255,.06);
    font-weight: 900;
    cursor: pointer;
}

.ukf-maka-secondary:hover { background: rgba(255,255,255,.1); }
.ukf-maka-coming-note { margin: 20px 0 0; color: #d9bcff; font-weight: 800; }

.ukf-maka-quiz-hud {
    display: grid;
    grid-template-columns: auto auto 1fr;
    gap: 14px;
    align-items: center;
    margin-bottom: 14px;
}

.ukf-maka-quiz-hud > div:not(.ukf-maka-progress) {
    min-width: 108px;
    padding: 12px 16px;
    border: 1px solid rgba(188,149,255,.16);
    border-radius: 16px;
    background: rgba(24,22,48,.92);
}

.ukf-maka-quiz-hud small { display: block; color: rgba(255,255,255,.52); }
.ukf-maka-quiz-hud strong { color: #fff; font-size: 18px; }

.ukf-maka-progress {
    height: 12px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
}

.ukf-maka-progress span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #8b2cf5, #d324a7);
    transition: width .3s ease;
}

.ukf-maka-question-card { padding: clamp(24px, 5vw, 46px); }
.ukf-maka-question-card h2 { max-width: 760px; margin-bottom: 26px; }

.ukf-maka-answers {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.ukf-maka-answer {
    display: grid;
    grid-template-columns: 42px 1fr;
    align-items: center;
    gap: 13px;
    min-height: 70px;
    padding: 12px 16px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 18px;
    color: #fff;
    text-align: left;
    background: rgba(255,255,255,.045);
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.ukf-maka-answer:hover:not(:disabled) {
    transform: translateY(-2px);
    border-color: rgba(194,145,255,.4);
    background: rgba(139,44,245,.12);
}

.ukf-maka-answer > span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: rgba(139,44,245,.2);
    color: #e7d5ff;
    font-weight: 900;
}

.ukf-maka-answer.is-correct {
    border-color: rgba(78, 222, 145, .62);
    background: rgba(29, 160, 92, .2);
}

.ukf-maka-answer.is-correct > span { background: rgba(29,160,92,.55); color: #fff; }
.ukf-maka-answer.is-wrong { border-color: rgba(255, 91, 111, .62); background: rgba(190, 38, 69, .2); }
.ukf-maka-answer.is-wrong > span { background: rgba(190,38,69,.58); color: #fff; }
.ukf-maka-answer:disabled { cursor: default; opacity: 1; }

.ukf-maka-explanation {
    margin-top: 20px;
    padding: 20px;
    border: 1px solid rgba(188,149,255,.19);
    border-radius: 20px;
    background: rgba(139,44,245,.1);
    animation: ukfMakaExplainIn .24s ease both;
}

@keyframes ukfMakaExplainIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.ukf-maka-explanation > strong { font-size: 20px; color: #fff; }
.ukf-maka-explanation p { margin: 8px 0 18px; color: rgba(255,255,255,.72); line-height: 1.55; }

.ukf-maka-result {
    padding: clamp(30px, 6vw, 64px);
    text-align: center;
}

.ukf-maka-result > p { color: rgba(255,255,255,.67); }
.ukf-maka-result-score {
    display: grid;
    gap: 8px;
    width: min(360px, 100%);
    margin: 26px auto;
    padding: 24px;
    border: 1px solid rgba(188,149,255,.2);
    border-radius: 22px;
    background: rgba(139,44,245,.1);
}

.ukf-maka-result-score strong { color: #fff; font-size: clamp(38px, 7vw, 68px); }
.ukf-maka-result-score span { color: #d9bcff; font-weight: 800; }

@media (max-width: 680px) {
    .ukf-maka-cover,
    .ukf-maka-quiz,
    .ukf-maka-result { margin-top: 12px; }
    .ukf-maka-cover-facts { grid-template-columns: 1fr 1fr; }
    .ukf-maka-quiz-hud { grid-template-columns: 1fr 1fr; }
    .ukf-maka-progress { grid-column: 1 / -1; }
    .ukf-maka-answers { grid-template-columns: 1fr; }
    .ukf-maka-cover-actions,
    .ukf-maka-result-actions { flex-direction: column-reverse; }
    .ukf-maka-cover-actions button,
    .ukf-maka-result-actions button { width: 100%; }
}


/* v0.2.2 Alpha – Game Feel Patch */
#ukf-maka-view .ukf-maka-shell {
    position: relative;
    isolation: isolate;
}

#ukf-maka-view .ukf-maka-shell::before,
#ukf-maka-view .ukf-maka-shell::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 420px;
    height: 420px;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(70px);
    opacity: .12;
    animation: makaAmbientDrift 14s ease-in-out infinite alternate;
}

#ukf-maka-view .ukf-maka-shell::before {
    top: 8%;
    right: 2%;
    background: #b52ad8;
}

#ukf-maka-view .ukf-maka-shell::after {
    left: 2%;
    bottom: 6%;
    background: #7428ff;
    animation-delay: -6s;
}

.ukf-maka-screen {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    transition: opacity 180ms ease, transform 220ms cubic-bezier(.2,.75,.25,1);
    will-change: opacity, transform;
}

.ukf-maka-screen.is-entering {
    opacity: 0;
    transform: translate3d(28px, 0, 0) scale(.985);
}

.ukf-maka-screen.is-entering-back {
    opacity: 0;
    transform: translate3d(-28px, 0, 0) scale(.985);
}

.ukf-maka-screen.is-leaving {
    opacity: 0;
    transform: translate3d(-22px, 0, 0) scale(.99);
}

.ukf-maka-screen.is-leaving-back {
    opacity: 0;
    transform: translate3d(22px, 0, 0) scale(.99);
}

.ukf-maka-game,
.ukf-maka-primary,
.ukf-maka-secondary,
.ukf-maka-answer {
    -webkit-tap-highlight-color: transparent;
    transition: transform 160ms ease, box-shadow 220ms ease, border-color 220ms ease, background 220ms ease, filter 220ms ease;
}

.ukf-maka-game {
    position: relative;
    overflow: hidden;
    transform: translateY(0) scale(1);
}

.ukf-maka-game::before {
    content: "";
    position: absolute;
    inset: -1px;
    pointer-events: none;
    background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.10) 50%, transparent 80%);
    transform: translateX(-120%);
    transition: transform 520ms ease;
}

.ukf-maka-game:hover {
    transform: translateY(-6px) scale(1.015);
    box-shadow: 0 18px 38px rgba(102, 32, 190, .24), 0 0 0 1px rgba(190, 83, 255, .22);
}

.ukf-maka-game:hover::before {
    transform: translateX(120%);
}

.ukf-maka-game:hover .ukf-maka-game-icon {
    animation: makaIconFloat 1.4s ease-in-out infinite;
}

.ukf-maka-game:active,
.ukf-maka-primary:active,
.ukf-maka-secondary:active,
.ukf-maka-answer:active {
    transform: scale(.975);
}

.ukf-maka-game.is-opening {
    z-index: 2;
    transform: translateY(-3px) scale(1.045);
    filter: brightness(1.13);
    box-shadow: 0 22px 52px rgba(181, 42, 216, .34), 0 0 30px rgba(139, 49, 255, .18);
}

.ukf-maka-primary {
    background-size: 180% 180%;
    animation: makaGradientIdle 7s ease infinite;
}

.ukf-maka-primary:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(186, 31, 202, .28), 0 0 22px rgba(141, 44, 255, .20);
    filter: brightness(1.08);
}

.ukf-maka-secondary:hover:not(:disabled) {
    transform: translateY(-2px);
    border-color: rgba(190, 111, 255, .46);
    box-shadow: 0 10px 24px rgba(31, 16, 62, .20);
}

.ukf-maka-question-card.is-question-entering {
    animation: makaQuestionIn 300ms cubic-bezier(.2,.8,.25,1) both;
}

.ukf-maka-question-card.is-question-leaving {
    animation: makaQuestionOut 170ms ease both;
}

.ukf-maka-answer.is-answer-entering {
    opacity: 0;
    animation: makaAnswerIn 260ms cubic-bezier(.2,.8,.25,1) forwards;
    animation-delay: var(--maka-answer-delay, 0ms);
}

.ukf-maka-answer:hover:not(:disabled) {
    transform: translateY(-2px);
    border-color: rgba(174, 97, 255, .55);
    box-shadow: 0 10px 24px rgba(50, 24, 90, .20);
}

.ukf-maka-answer.is-correct {
    animation: makaCorrectPulse 620ms cubic-bezier(.2,.8,.25,1) both;
}

.ukf-maka-answer.is-wrong {
    animation: makaWrongShake 360ms ease both;
}

[data-maka-score].is-score-pop {
    display: inline-block;
    animation: makaScorePop 420ms cubic-bezier(.2,.9,.25,1) both;
}

.ukf-maka-progress > span,
[data-maka-progress-bar] {
    transition: width 520ms cubic-bezier(.2,.8,.25,1), filter 220ms ease;
    box-shadow: 0 0 18px rgba(217, 35, 207, .25);
}

.ukf-maka-explanation {
    opacity: 0;
    transform: translateY(14px) scale(.99);
    transition: opacity 240ms ease, transform 280ms cubic-bezier(.2,.8,.25,1);
}

.ukf-maka-explanation.is-revealed {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.ukf-maka-result.is-celebrating .ukf-maka-result-icon {
    animation: makaMedalDrop 720ms cubic-bezier(.2,.9,.25,1) both;
}

.ukf-maka-result.is-celebrating .ukf-maka-kicker,
.ukf-maka-result.is-celebrating h2,
.ukf-maka-result.is-celebrating > p,
.ukf-maka-result.is-celebrating .ukf-maka-result-score,
.ukf-maka-result.is-celebrating .ukf-maka-result-actions {
    opacity: 0;
    animation: makaResultStep 420ms ease forwards;
}

.ukf-maka-result.is-celebrating h2 { animation-delay: 90ms; }
.ukf-maka-result.is-celebrating > p { animation-delay: 150ms; }
.ukf-maka-result.is-celebrating .ukf-maka-result-score { animation-delay: 220ms; }
.ukf-maka-result.is-celebrating .ukf-maka-result-actions { animation-delay: 300ms; }

@keyframes makaAmbientDrift {
    from { transform: translate3d(-12px, -8px, 0) scale(.95); }
    to { transform: translate3d(26px, 18px, 0) scale(1.08); }
}

@keyframes makaIconFloat {
    0%, 100% { transform: translateY(0) rotate(0); }
    50% { transform: translateY(-5px) rotate(2deg); }
}

@keyframes makaGradientIdle {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

@keyframes makaQuestionIn {
    from { opacity: 0; transform: translateY(18px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes makaQuestionOut {
    from { opacity: 1; transform: translateX(0) scale(1); }
    to { opacity: 0; transform: translateX(-22px) scale(.99); }
}

@keyframes makaAnswerIn {
    from { opacity: 0; transform: translateY(10px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes makaCorrectPulse {
    0% { transform: scale(.985); box-shadow: 0 0 0 rgba(48, 206, 139, 0); }
    42% { transform: scale(1.018); box-shadow: 0 0 0 5px rgba(48, 206, 139, .13), 0 0 28px rgba(48, 206, 139, .22); }
    100% { transform: scale(1); box-shadow: 0 0 20px rgba(48, 206, 139, .14); }
}

@keyframes makaWrongShake {
    0%, 100% { transform: translateX(0); }
    22% { transform: translateX(-7px); }
    45% { transform: translateX(6px); }
    68% { transform: translateX(-3px); }
    84% { transform: translateX(2px); }
}

@keyframes makaScorePop {
    0% { transform: translateY(4px) scale(.86); opacity: .55; }
    55% { transform: translateY(-3px) scale(1.18); opacity: 1; text-shadow: 0 0 18px rgba(220, 42, 211, .45); }
    100% { transform: translateY(0) scale(1); }
}

@keyframes makaMedalDrop {
    0% { opacity: 0; transform: translateY(-22px) scale(.65) rotate(-10deg); }
    55% { opacity: 1; transform: translateY(5px) scale(1.12) rotate(4deg); }
    100% { opacity: 1; transform: translateY(0) scale(1) rotate(0); }
}

@keyframes makaResultStep {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    #ukf-maka-view *,
    #ukf-maka-view *::before,
    #ukf-maka-view *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* v0.3.0 Alpha – Question Engine learning links */
.ukf-maka-learning-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin: 4px 0 18px;
    padding: 13px 14px;
    border: 1px solid rgba(203, 166, 255, .18);
    border-radius: 15px;
    background: rgba(13, 15, 35, .34);
}

.ukf-maka-reference {
    color: #ddc6ff;
    font-size: 13px;
    font-weight: 800;
}

.ukf-maka-reader-button {
    min-height: 39px;
    margin-left: auto;
    padding: 0 16px;
    border: 1px solid rgba(217, 187, 255, .28);
    border-radius: 999px;
    color: #fff;
    cursor: pointer;
    font-weight: 850;
    background: linear-gradient(135deg, rgba(139,44,245,.88), rgba(187,25,159,.82));
    box-shadow: 0 10px 25px rgba(95, 32, 165, .22);
    transition: transform .18s ease, box-shadow .18s ease;
}

.ukf-maka-reader-button:hover,
.ukf-maka-reader-button:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(112, 38, 185, .34);
}

@media (max-width: 680px) {
    .ukf-maka-reader-button { width: 100%; margin-left: 0; }
}
/* v0.3.1 compact flow */
.ukf-maka-featured{display:none!important}.ukf-maka-dashboard{gap:18px!important}.ukf-maka-stat-grid{margin-top:0!important}.ukf-maka-stat{appearance:none;text-align:left;color:inherit;cursor:pointer}.ukf-maka-game-icon{font-size:32px}.ukf-maka-view,.ukf-maka-shell{overflow:hidden!important}.ukf-maka-screen[data-maka-screen="quiz"]{height:100%;overflow:hidden}.ukf-maka-quiz{height:100%;max-height:100%;overflow:hidden;display:flex;flex-direction:column;justify-content:center}.ukf-maka-question-card{max-height:calc(100vh - 250px);overflow:hidden}.ukf-maka-explanation{max-height:360px;overflow:auto}.ukf-maka-answers[hidden]{display:none!important}.ukf-maka-answers.is-resolving{animation:makaAnswersOut .26s ease both}.ukf-maka-answer.is-correct{animation:makaCorrectPulse .5s ease both}.ukf-maka-answer.is-wrong{animation:makaWrongShake .38s ease both}.ukf-maka-info{max-width:760px;margin:12vh auto 0;text-align:center;padding:48px;border:1px solid rgba(169,100,255,.35);border-radius:24px;background:linear-gradient(145deg,rgba(58,32,91,.9),rgba(14,16,37,.96))}.ukf-maka-info-icon{font-size:54px;margin-bottom:18px}.ukf-maka-info p{font-size:18px;line-height:1.6;color:#c8c0d6;margin:12px 0 28px}@keyframes makaAnswersOut{to{opacity:0;transform:translateY(-10px)}}@keyframes makaCorrectPulse{50%{transform:scale(1.025);box-shadow:0 0 28px rgba(94,234,150,.45)}}@keyframes makaWrongShake{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
@media(max-width:700px){.ukf-maka-stat-grid{grid-template-columns:1fr 1fr 1fr!important;gap:8px!important}.ukf-maka-stat{padding:12px 8px!important}.ukf-maka-stat small{display:none}.ukf-maka-game-grid{grid-template-columns:1fr 1fr!important}.ukf-maka-question-card{max-height:calc(100vh - 180px)}}

/* v0.3.3-alpha: quiz feedback, reader return and mobile lobby */
.ukf-maka-explanation > strong.is-correct {
    color: #55e89a;
    text-shadow: 0 0 22px rgba(85, 232, 154, .28);
}

.ukf-maka-explanation > strong.is-wrong {
    color: #ff7185;
    text-shadow: 0 0 22px rgba(255, 113, 133, .22);
}

.ukf-maka-return-quiz {
    position: sticky;
    top: 10px;
    z-index: 25;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: min(900px, calc(100% - 32px));
    min-height: 48px;
    margin: 8px auto 16px;
    padding: 0 22px;
    border: 1px solid rgba(207, 170, 255, .34);
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(135deg, rgba(139, 44, 245, .96), rgba(187, 25, 159, .94));
    box-shadow: 0 14px 34px rgba(80, 23, 151, .34);
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.ukf-maka-return-quiz:hover,
.ukf-maka-return-quiz:focus-visible {
    transform: translateY(-1px);
    filter: brightness(1.08);
}

@media (max-width: 700px) {
    #ukf-maka-view[data-screen="lobby"] {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    #ukf-maka-view[data-screen="lobby"] .ukf-maka-shell {
        height: auto !important;
        min-height: 100%;
        overflow: visible !important;
        padding: 10px 0 72px !important;
    }

    #ukf-maka-view[data-screen="lobby"] .ukf-maka-dashboard,
    #ukf-maka-view[data-screen="lobby"] .ukf-maka-games,
    #ukf-maka-view[data-screen="lobby"] .ukf-maka-game-grid {
        min-width: 0;
        width: 100%;
    }

    #ukf-maka-view[data-screen="lobby"] .ukf-maka-stat-grid,
    #ukf-maka-view[data-screen="lobby"] .ukf-maka-game-grid {
        grid-template-columns: 1fr !important;
    }

    #ukf-maka-view[data-screen="lobby"] .ukf-maka-stat,
    #ukf-maka-view[data-screen="lobby"] .ukf-maka-game {
        width: 100%;
        min-width: 0;
    }

    #ukf-maka-view[data-screen="lobby"] .ukf-maka-game {
        min-height: 150px;
    }

    .ukf-maka-return-quiz {
        top: 6px;
        width: calc(100% - 20px);
        min-height: 46px;
        margin-bottom: 10px;
    }
}

/* v0.3.4: Akatemian oma arkistokortin lukunäkymä. Ei iframea eikä Arkistojen detail-näkymää. */
.ukf-maka-reader {
    width: min(920px, 100%);
    margin: 18px auto 40px;
    color: #fff;
}

.ukf-maka-reader-back {
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    margin: 0 0 16px;
    padding: 0 22px;
    border: 1px solid rgba(217, 174, 255, .3);
    border-radius: 999px;
    color: #fff;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
    background: linear-gradient(135deg, #8b2cf5, #bb199f);
    box-shadow: 0 12px 30px rgba(139, 44, 245, .25);
}

.ukf-maka-reader-loading,
.ukf-maka-reader-error {
    padding: 34px;
    border: 1px solid rgba(188,149,255,.2);
    border-radius: 24px;
    text-align: center;
    background: linear-gradient(145deg, rgba(39,31,66,.98), rgba(14,16,36,.98));
}

.ukf-maka-reader-error {
    color: #ffd0d6;
    border-color: rgba(255, 94, 115, .35);
}

.ukf-maka-reader-content {
    overflow: hidden;
    border: 1px solid rgba(188,149,255,.2);
    border-radius: 28px;
    background: linear-gradient(180deg, #111b31 0%, #0d1528 100%);
    box-shadow: 0 28px 80px rgba(0,0,0,.34);
}

.ukf-maka-reader-image-wrap {
    margin: 0;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #0a1020;
}

.ukf-maka-reader-image-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ukf-maka-reader-timeline {
    padding: 8px 18px;
    color: #dbc17a;
    text-align: center;
    font-size: 13px;
    font-weight: 800;
    background: rgba(25, 37, 61, .95);
    border-top: 1px solid rgba(255,255,255,.05);
    border-bottom: 1px solid rgba(255,255,255,.05);
}

.ukf-maka-reader-header {
    padding: 30px 34px 18px;
    text-align: center;
}

.ukf-maka-reader-theme {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 14px;
    padding: 7px 13px;
    border: 1px solid color-mix(in srgb, var(--maka-theme-color, #8b2cf5) 55%, transparent);
    border-radius: 999px;
    color: #fff;
    background: color-mix(in srgb, var(--maka-theme-color, #8b2cf5) 30%, transparent);
    font-size: 12px;
    font-weight: 900;
}

.ukf-maka-reader-header h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(30px, 5vw, 48px);
    line-height: 1.12;
}

.ukf-maka-reader-type {
    display: inline-block;
    margin-top: 14px;
    padding: 6px 16px;
    border-radius: 999px;
    color: #d9e3ff;
    background: #30466f;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.ukf-maka-reader-short,
.ukf-maka-reader-body {
    padding-left: clamp(22px, 5vw, 54px);
    padding-right: clamp(22px, 5vw, 54px);
}

.ukf-maka-reader-short {
    padding-bottom: 8px;
    color: rgba(255,255,255,.9);
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.65;
}

.ukf-maka-reader-body {
    padding-top: 12px;
    padding-bottom: 38px;
    color: rgba(255,255,255,.84);
    font-size: 16px;
    line-height: 1.75;
}

.ukf-maka-reader-body h2,
.ukf-maka-reader-body h3,
.ukf-maka-reader-body h4 {
    margin: 1.5em 0 .55em;
    color: #fff;
    line-height: 1.25;
}

.ukf-maka-reader-body p:first-child { margin-top: 0; }
.ukf-maka-reader-body p:last-child { margin-bottom: 0; }

.ukf-maka-reader-meta {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 8px 18px;
    margin: 0 clamp(22px, 5vw, 54px) 28px;
    padding: 20px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    background: rgba(255,255,255,.035);
}

.ukf-maka-reader-meta dt {
    color: rgba(255,255,255,.52);
    font-weight: 800;
}

.ukf-maka-reader-meta dd {
    margin: 0;
    color: #fff;
    font-weight: 700;
}

.ukf-maka-reader-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 clamp(22px, 5vw, 54px) 36px;
}

.ukf-maka-reader-tags span {
    padding: 7px 11px;
    border: 1px solid rgba(188,149,255,.18);
    border-radius: 999px;
    color: #d9bcff;
    background: rgba(139,44,245,.12);
    font-size: 12px;
    font-weight: 800;
}

@media (max-width: 680px) {
    .ukf-maka-reader {
        margin-top: 4px;
        margin-bottom: 24px;
    }
    .ukf-maka-reader-back {
        min-height: 44px;
        margin-bottom: 10px;
    }
    .ukf-maka-reader-content {
        border-radius: 20px;
    }
    .ukf-maka-reader-image-wrap {
        aspect-ratio: 4 / 3;
    }
    .ukf-maka-reader-header {
        padding: 24px 20px 14px;
    }
    .ukf-maka-reader-header h2 {
        font-size: 30px;
    }
    .ukf-maka-reader-short {
        font-size: 16px;
        text-align: left;
    }
    .ukf-maka-reader-body {
        font-size: 15px;
        line-height: 1.68;
    }
    .ukf-maka-reader-meta {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .ukf-maka-reader-meta dd + dt {
        margin-top: 10px;
    }
}


/* v0.3.5 Alpha – shuffle, mobile scroll and UI cleanup */
.ukf-maka-development,
.ukf-maka-game em { display: none !important; }

.ukf-maka-launchpad-meta--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

#ukf-maka-view[data-screen="reader"] {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

#ukf-maka-view[data-screen="reader"] .ukf-maka-shell {
    height: auto !important;
    min-height: 100%;
    overflow: visible !important;
    padding-top: 0 !important;
    padding-bottom: 48px !important;
}

#ukf-maka-view[data-screen="reader"] .ukf-maka-screen[data-maka-screen="reader"] {
    height: auto !important;
    overflow: visible !important;
}

.ukf-maka-reader { margin-top: 0; }
.ukf-maka-reader-back {
    position: sticky;
    top: 0;
    margin-bottom: 8px;
    border-radius: 0 0 18px 18px;
}

@media (max-width: 680px) {
    .ukf-maka-launchpad-meta--compact { grid-template-columns: 1fr; }
    .ukf-maka-game { min-height: 0 !important; padding: 18px !important; }
    .ukf-maka-game-icon { margin-bottom: 16px !important; }
    .ukf-maka-reader-back {
        top: 0;
        width: 100%;
        margin: 0 0 8px;
        border-radius: 0 0 16px 16px;
    }
    .ukf-maka-reader-content { overflow: visible; }
}

/* v0.3.6 Alpha – safe layout and game-feel patch built on v0.3.5 */

/* Reader uses the projector's existing floating back control; remove duplicate row. */
.ukf-maka-reader-back { display: none !important; }
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader { margin-top: 0 !important; }
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content { border-radius: 24px; }

/* Keep the existing global controls floating over Academy content without changing JS state handling. */
.ukf-ma-projector.is-academy #ukf-ma-global-back,
.ukf-ma-projector.is-academy [data-ma-close] {
    position: absolute !important;
    top: 18px !important;
    z-index: 80 !important;
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    border-radius: 50% !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    background: rgba(24, 24, 48, .72) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.28);
}
.ukf-ma-projector.is-academy #ukf-ma-global-back { left: 18px !important; }
.ukf-ma-projector.is-academy [data-ma-close] { right: 18px !important; }

/* Compact, secondary learning link. */
.ukf-maka-learning-links {
    display: block;
    margin: 4px 0 14px;
    padding: 0;
    border: 0;
    background: transparent;
}
.ukf-maka-reader-button {
    width: auto !important;
    min-height: 34px;
    margin: 0;
    padding: 0 13px;
    border-color: rgba(217,187,255,.2);
    font-size: 13px;
    font-weight: 800;
    background: rgba(139,44,245,.18);
    box-shadow: none;
}
.ukf-maka-reader-button:hover,
.ukf-maka-reader-button:focus-visible {
    transform: translateY(-1px);
    background: rgba(139,44,245,.28);
    box-shadow: 0 8px 20px rgba(70,25,130,.2);
}

/* Question and answer transitions. No popup/opening logic is changed. */
.ukf-maka-question-card.is-question-entering {
    animation: makaQuestionEnter .42s cubic-bezier(.22,.8,.25,1) both;
}
.ukf-maka-answer.is-answer-entering {
    animation: makaAnswerEnter .36s cubic-bezier(.22,.8,.25,1) both;
    animation-delay: var(--maka-answer-delay, 0ms);
}
.ukf-maka-explanation.is-revealed {
    animation: makaFeedbackEnter .38s cubic-bezier(.22,.8,.25,1) both;
}
.ukf-maka-explanation > strong.is-correct::after {
    content: ' ✦';
    display: inline-block;
    animation: makaSpark .72s ease both;
}
[data-maka-score].is-score-pop {
    animation: makaScorePop .38s cubic-bezier(.2,.9,.2,1.2) both;
}
[data-maka-progress-bar] {
    transition: width .5s cubic-bezier(.22,.8,.25,1) !important;
}
.ukf-maka-primary,
.ukf-maka-secondary,
.ukf-maka-game,
.ukf-maka-stat {
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.ukf-maka-primary:active,
.ukf-maka-secondary:active,
.ukf-maka-game:active,
.ukf-maka-stat:active { transform: scale(.985); }

@keyframes makaQuestionEnter {
    from { opacity: 0; transform: translateX(22px) scale(.985); }
    to { opacity: 1; transform: translateX(0) scale(1); }
}
@keyframes makaAnswerEnter {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes makaFeedbackEnter {
    from { opacity: 0; transform: translateY(14px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes makaSpark {
    0% { opacity: 0; transform: scale(.5) rotate(-20deg); }
    45% { opacity: 1; transform: scale(1.35) rotate(8deg); }
    100% { opacity: .75; transform: scale(1) rotate(0); }
}
@keyframes makaScorePop {
    0% { transform: scale(1); }
    55% { transform: scale(1.22); text-shadow: 0 0 18px rgba(189,74,255,.65); }
    100% { transform: scale(1); }
}

@media (max-width: 680px) {
    .ukf-ma-projector.is-academy #ukf-ma-global-back,
    .ukf-ma-projector.is-academy [data-ma-close] {
        top: 12px !important;
        width: 44px !important;
        height: 44px !important;
    }
    .ukf-ma-projector.is-academy #ukf-ma-global-back { left: 12px !important; }
    .ukf-ma-projector.is-academy [data-ma-close] { right: 12px !important; }
    #ukf-maka-view[data-screen="reader"] .ukf-maka-shell { padding-top: 0 !important; }
    #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content { border-radius: 18px; }
    .ukf-maka-reader-button { max-width: 100%; white-space: normal; line-height: 1.25; }
}

@media (prefers-reduced-motion: reduce) {
    .ukf-maka-question-card,
    .ukf-maka-answer,
    .ukf-maka-explanation,
    [data-maka-score],
    [data-maka-progress-bar] {
        animation: none !important;
        transition: none !important;
    }
}

/* v0.3.7 Alpha – actual floating navigation + themed leaderboard */
.ukf-ma-projector.is-academy .ukf-maka-view {
    inset: 18px !important;
}
.ukf-ma-projector.is-academy .ukf-maka-shell {
    padding-top: 0 !important;
}
.ukf-ma-projector.is-academy .ukf-maka-hero {
    padding-left: 92px;
    padding-right: 92px;
}
.ukf-ma-projector.is-academy #ukf-ma-global-back,
.ukf-ma-projector.is-academy [data-ma-close] {
    position: absolute !important;
    top: 18px !important;
    opacity: 1;
    filter: saturate(1);
    transition: opacity .28s ease, filter .28s ease, transform .2s ease, background .28s ease !important;
}
.ukf-ma-projector.is-academy.maka-controls-dim #ukf-ma-global-back,
.ukf-ma-projector.is-academy.maka-controls-dim [data-ma-close] {
    opacity: .38 !important;
    filter: saturate(.55);
    background: rgba(24,24,48,.48) !important;
}
.ukf-ma-projector.is-academy #ukf-ma-global-back:hover,
.ukf-ma-projector.is-academy [data-ma-close]:hover,
.ukf-ma-projector.is-academy #ukf-ma-global-back:focus-visible,
.ukf-ma-projector.is-academy [data-ma-close]:focus-visible {
    opacity: 1 !important;
    filter: saturate(1);
    transform: scale(1.07);
}
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content {
    margin-top: 0 !important;
}

.ukf-maka-leaderboard {
    width: min(980px, 100%);
    margin: 36px auto 0;
    padding: 32px;
    border: 1px solid rgba(188,149,255,.22);
    border-radius: 26px;
    background: linear-gradient(145deg, rgba(41,31,71,.97), rgba(13,16,36,.98));
    box-shadow: 0 28px 80px rgba(0,0,0,.28);
}
.ukf-maka-leaderboard-head { text-align: center; margin-bottom: 24px; }
.ukf-maka-leaderboard-head h2 { margin: 7px 0 8px; font-size: clamp(28px,4vw,42px); }
.ukf-maka-leaderboard-head p { margin: 0; color: rgba(255,255,255,.66); }
.ukf-maka-board-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
    margin-bottom: 18px;
}
.ukf-maka-board-tab {
    min-height: 46px;
    padding: 8px 10px;
    border: 1px solid rgba(188,149,255,.18);
    border-radius: 14px;
    color: rgba(255,255,255,.72);
    background: rgba(255,255,255,.035);
    font-weight: 800;
    cursor: pointer;
}
.ukf-maka-board-tab.is-active {
    color: #fff;
    border-color: rgba(193,112,255,.56);
    background: linear-gradient(135deg, rgba(139,44,245,.42), rgba(187,25,159,.28));
    box-shadow: 0 10px 26px rgba(100,35,180,.18);
}
.ukf-maka-my-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.ukf-maka-my-stats > div {
    padding: 16px;
    border: 1px solid rgba(188,149,255,.16);
    border-radius: 16px;
    text-align: center;
    background: rgba(255,255,255,.03);
}
.ukf-maka-my-stats small { display:block; color:rgba(255,255,255,.55); margin-bottom:4px; }
.ukf-maka-my-stats strong { font-size: 23px; }
.ukf-maka-ranking { display:grid; gap:10px; margin-bottom:20px; }
.ukf-maka-ranking-row {
    display: grid;
    grid-template-columns: 48px minmax(0,1fr) auto;
    gap: 4px 12px;
    align-items: center;
    padding: 14px 16px;
    border: 1px solid rgba(188,149,255,.14);
    border-radius: 16px;
    background: rgba(255,255,255,.025);
}
.ukf-maka-ranking-row .ukf-maka-rank { grid-row: 1 / 3; font-size: 22px; text-align:center; }
.ukf-maka-ranking-row > span:not(.ukf-maka-rank) { font-weight: 900; color: #e9d4ff; }
.ukf-maka-ranking-row small { color: rgba(255,255,255,.5); }
.ukf-maka-board-loading,
.ukf-maka-board-empty { padding: 34px 16px; text-align:center; color:rgba(255,255,255,.62); }

@media (max-width: 680px) {
    .ukf-ma-projector.is-academy .ukf-maka-view { inset: 0 !important; }
    .ukf-ma-projector.is-academy .ukf-maka-shell { padding: 0 10px 30px !important; }
    .ukf-ma-projector.is-academy .ukf-maka-hero {
        padding-left: 72px !important;
        padding-right: 72px !important;
        padding-top: 28px !important;
    }
    .ukf-ma-projector.is-academy #ukf-ma-global-back,
    .ukf-ma-projector.is-academy [data-ma-close] { top: 12px !important; }
    .ukf-maka-leaderboard { margin-top: 88px; padding: 18px; border-radius: 20px; }
    .ukf-maka-board-tabs { grid-template-columns: 1fr 1fr; }
    .ukf-maka-my-stats { grid-template-columns: 1fr; }
    .ukf-maka-ranking-row { grid-template-columns: 42px minmax(0,1fr); }
    .ukf-maka-ranking-row > span:not(.ukf-maka-rank) { grid-column: 2; }
}

/* v0.3.10 Score Engine */
.ukf-maka-result-score [data-maka-save-status]{display:block;margin-top:10px;font-size:12px;opacity:.78}
.ukf-maka-result-score [data-maka-save-status].is-success{color:#58d68d;opacity:1}
.ukf-maka-result-score [data-maka-save-status].is-error{color:#ff8f8f;opacity:1}

/* v0.3.11 Alpha – mobile cleanup, safe HUD and integrated reader */
.ukf-maka-alpha,
.ukf-maka-admin-version { display:none !important; }
.ukf-maka-stat-grid.has-two-items { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ukf-maka-launchpad-meta--compact { grid-template-columns: 1fr !important; }

/* Keep the quiz HUD below the projector controls. */
#ukf-maka-view[data-screen="quiz"] .ukf-maka-quiz {
    padding-top: 74px;
    box-sizing: border-box;
}
#ukf-maka-view[data-screen="quiz"] .ukf-maka-quiz-hud {
    position: relative;
    z-index: 2;
}

/* Reader is one coherent card: the image follows the same rounded shell. */
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content {
    overflow: hidden !important;
    border-radius: 28px !important;
}
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader-image-wrap,
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader-image-wrap img {
    border-radius: 27px 27px 0 0;
}
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader-image-wrap {
    margin: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

@media (max-width: 680px) {
    .ukf-ma-projector.is-academy .ukf-maka-shell { padding: 0 8px 24px !important; }
    .ukf-ma-projector.is-academy .ukf-maka-hero {
        grid-template-columns: 52px minmax(0,1fr) !important;
        gap: 14px !important;
        padding: 74px 18px 20px !important;
        border-radius: 0 0 22px 22px !important;
    }
    .ukf-maka-hero h2 { font-size: 25px !important; line-height:1.08; }
    .ukf-maka-hero p { font-size: 15px; line-height:1.4; }
    .ukf-maka-eyebrow { font-size: 9px; }
    .ukf-maka-mark { width:52px !important;height:52px !important;font-size:25px !important; }
    .ukf-maka-dashboard { margin-top: 12px !important; }
    .ukf-maka-stat-grid,
    .ukf-maka-stat-grid.has-two-items { grid-template-columns: 1fr 1fr !important; }
    .ukf-maka-stat { min-width:0; padding:14px 12px !important; }
    .ukf-maka-stat > span { font-size:24px !important; }
    .ukf-maka-stat strong { font-size:14px; overflow-wrap:anywhere; }
    .ukf-maka-games { padding:18px 14px !important; }
    .ukf-maka-game-grid { grid-template-columns:1fr !important; }
    .ukf-maka-game { min-height:0 !important; }

    #ukf-maka-view[data-screen="quiz"] .ukf-maka-quiz {
        justify-content:flex-start !important;
        padding-top: 76px !important;
        overflow-y:auto !important;
    }
    #ukf-maka-view[data-screen="quiz"] .ukf-maka-question-card {
        max-height:none !important;
        overflow:visible !important;
    }
    #ukf-maka-view[data-screen="quiz"] .ukf-maka-quiz-hud {
        margin-bottom:12px !important;
    }

    #ukf-maka-view[data-screen="reader"] .ukf-maka-reader {
        padding-top: 72px !important;
    }
    #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content {
        border-radius: 22px !important;
    }
    #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-image-wrap,
    #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-image-wrap img {
        border-radius: 21px 21px 0 0;
    }
}


/* v0.3.12 Alpha – compact lobby, explanation modal and persistent next action */
.ukf-ma-projector.is-academy .ukf-maka-hero{min-height:0!important;grid-template-columns:auto 1fr!important;gap:14px!important;padding:14px 16px!important;border-radius:22px!important}
.ukf-ma-projector.is-academy .ukf-maka-hero::after{width:150px;height:150px;top:-90px}
.ukf-ma-projector.is-academy .ukf-maka-mark{width:46px!important;height:46px!important;border-radius:14px!important;font-size:24px!important}
.ukf-ma-projector.is-academy .ukf-maka-hero h2{font-size:clamp(20px,3vw,27px)!important;line-height:1.12!important}
.ukf-ma-projector.is-academy .ukf-maka-hero p{margin:3px 0 0!important;font-size:12px!important;line-height:1.25!important;color:rgba(255,255,255,.58)!important}
.ukf-maka-answer-actions{position:sticky;bottom:0;z-index:8;display:grid;gap:12px;margin:18px -8px -8px;padding:14px 8px 8px;background:linear-gradient(180deg,rgba(22,18,48,0),rgba(22,18,48,.96) 28%)}
.ukf-maka-answer-actions[hidden]{display:none!important}.ukf-maka-answer-actions>strong{display:block;text-align:center;font-size:18px}.ukf-maka-answer-actions>strong.is-correct{color:#76efad}.ukf-maka-answer-actions>strong.is-wrong{color:#ff8b9a}.ukf-maka-answer-actions>div{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ukf-maka-answer-actions .ukf-maka-primary,.ukf-maka-answer-actions .ukf-maka-secondary{width:100%;min-height:46px}
.ukf-maka-explanation-modal{position:fixed;inset:0;z-index:999999;display:grid;place-items:center;padding:18px;background:rgba(5,7,20,.74);backdrop-filter:blur(8px);opacity:0;transition:opacity .18s ease}.ukf-maka-explanation-modal[hidden]{display:none!important}.ukf-maka-explanation-modal.is-open{opacity:1}.ukf-maka-explanation-dialog{position:relative;width:min(560px,100%);max-height:min(78vh,720px);overflow:auto;padding:26px;border:1px solid rgba(197,151,255,.28);border-radius:24px;background:radial-gradient(circle at 85% 0,rgba(148,46,226,.24),transparent 35%),linear-gradient(145deg,#282044,#111429);box-shadow:0 30px 100px rgba(0,0,0,.55);transform:translateY(12px) scale(.98);transition:transform .18s ease}.ukf-maka-explanation-modal.is-open .ukf-maka-explanation-dialog{transform:none}.ukf-maka-explanation-dialog h2{margin:4px 42px 12px 0;color:#fff;font-size:26px}.ukf-maka-explanation-dialog p{color:rgba(255,255,255,.78);line-height:1.65;white-space:pre-line}.ukf-maka-explanation-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border:1px solid rgba(255,255,255,.12);border-radius:50%;color:#fff;background:rgba(9,10,27,.55);font-size:28px;cursor:pointer}.ukf-maka-explanation-dialog .ukf-maka-learning-links{margin:20px 0 12px}.ukf-maka-explanation-dialog>.ukf-maka-secondary{width:100%;margin-top:10px}
.ukf-maka-reset-panel{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px}.ukf-maka-reset-panel h2{margin:0 0 5px}.ukf-maka-reset-panel p{margin:0;color:#646970}
@media(max-width:680px){.ukf-ma-projector.is-academy .ukf-maka-hero{padding:11px 13px!important;border-radius:18px!important}.ukf-ma-projector.is-academy .ukf-maka-mark{width:40px!important;height:40px!important;font-size:21px!important;border-radius:12px!important}.ukf-ma-projector.is-academy .ukf-maka-hero h2{font-size:20px!important}.ukf-ma-projector.is-academy .ukf-maka-hero p{font-size:11px!important}.ukf-maka-question-card{overflow:auto!important;padding-bottom:8px!important}.ukf-maka-answer-actions>div{grid-template-columns:1fr 1fr}.ukf-maka-explanation-modal{padding:10px}.ukf-maka-explanation-dialog{max-height:84vh;padding:22px 18px 18px;border-radius:20px}.ukf-maka-reset-panel{align-items:flex-start;flex-direction:column}}

/* v0.3.13 Alpha – difficulty modes, safe controls, full-screen explanation */
.ukf-ma-projector.is-academy #ukf-ma-global-back,
.ukf-ma-projector.is-academy [data-ma-close] {
    top: 18px !important;
    z-index: 10020 !important;
}
.ukf-ma-projector.is-academy .ukf-maka-view {
    inset-top: 92px;
}
.ukf-ma-projector.is-academy .ukf-maka-shell {
    padding-top: 42px !important;
}
.ukf-maka-answer-actions > div {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
}
.ukf-maka-answer-actions [data-maka-show-explanation],
.ukf-maka-answer-actions [data-maka-next] {
    width: 100% !important;
}
.ukf-maka-answer-actions [data-maka-next] {
    min-height: 50px;
}
.ukf-maka-explanation-modal {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    z-index: 2147483000 !important;
    display: grid !important;
    place-items: center !important;
    padding: 20px !important;
}
.ukf-maka-explanation-modal[hidden] { display: none !important; }
.ukf-maka-explanation-dialog {
    width: min(620px, calc(100vw - 24px)) !important;
    max-height: calc(100dvh - 40px) !important;
    margin: 0 !important;
}
.ukf-maka-difficulty {
    width: min(760px, 100%);
    margin: 70px auto 0;
    padding: clamp(24px, 5vw, 46px);
    text-align: center;
    border: 1px solid rgba(188,149,255,.2);
    border-radius: 26px;
    background: radial-gradient(circle at 80% 0,rgba(147,48,230,.22),transparent 34%),linear-gradient(145deg,rgba(39,31,66,.98),rgba(14,16,36,.98));
    box-shadow: 0 28px 80px rgba(0,0,0,.3);
}
.ukf-maka-difficulty h2 { margin: 6px 0 10px; color:#fff; font-size:clamp(28px,4vw,42px); }
.ukf-maka-difficulty > p { margin:0 auto 24px; max-width:620px; color:rgba(255,255,255,.68); line-height:1.55; }
.ukf-maka-difficulty-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:22px; }
.ukf-maka-difficulty-grid button {
    min-height:150px; padding:22px 16px; border:1px solid rgba(255,255,255,.11); border-radius:20px; color:#fff;
    background:linear-gradient(155deg,rgba(100,58,145,.35),rgba(19,21,44,.92)); cursor:pointer;
}
.ukf-maka-difficulty-grid button:hover { transform:translateY(-3px); border-color:rgba(205,159,255,.4); }
.ukf-maka-difficulty-grid strong,.ukf-maka-difficulty-grid small { display:block; }
.ukf-maka-difficulty-grid strong { font-size:20px; margin-bottom:8px; }
.ukf-maka-difficulty-grid small { color:rgba(255,255,255,.62); line-height:1.45; }
.ukf-maka-quiz-hud { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
.ukf-maka-timer { text-align:center; }
.ukf-maka-timer.is-urgent strong { color:#ff7c9f; animation:makaTimerPulse .7s infinite alternate; }
@keyframes makaTimerPulse { to { transform:scale(1.12); } }
.ukf-maka-coins { margin:16px 0 0; padding:12px 16px; border-radius:14px; background:rgba(255,200,70,.1); color:#ffe4a3; font-weight:800; }

@media(max-width:680px){
    .ukf-ma-projector.is-academy #ukf-ma-global-back,
    .ukf-ma-projector.is-academy [data-ma-close] { top:14px !important; }
    .ukf-ma-projector.is-academy .ukf-maka-shell { padding-top:52px !important; }
    .ukf-maka-difficulty { margin-top:34px; padding:22px 16px; border-radius:20px; }
    .ukf-maka-difficulty-grid { grid-template-columns:1fr; }
    .ukf-maka-difficulty-grid button { min-height:94px; }
    .ukf-maka-explanation-modal { padding:12px !important; }
}

/* v0.4.0 stabilization */
#ukf-ma-projector.is-academy .ukf-maka-shell{padding-top:82px!important}
#ukf-ma-projector.is-academy #ukf-ma-global-back,#ukf-ma-projector.is-academy [data-ma-close]{z-index:10020!important}
.ukf-maka-hero{border-radius:18px!important;min-height:0!important;padding:16px 72px!important}
.ukf-maka-answer-actions{background:transparent!important;box-shadow:none!important;padding:14px 0 0!important;position:static!important}
.ukf-maka-answer-actions>div{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
.ukf-maka-explanation-modal{position:fixed!important;inset:0!important;z-index:100000!important;display:grid!important;place-items:center!important;padding:20px!important;background:rgba(7,6,24,.82)!important;overflow:auto!important}
.ukf-maka-explanation-modal[hidden]{display:none!important}.ukf-maka-explanation-dialog{width:min(560px,100%)!important;max-height:calc(100dvh - 40px)!important;overflow:auto!important;margin:auto!important}
.ukf-maka-screen[data-maka-screen="leaderboard"]{min-height:0!important;height:auto!important;overflow:visible!important}.ukf-maka-leaderboard{min-height:0!important;height:auto!important;overflow:visible!important;justify-content:flex-start!important}.ukf-maka-board-panel{overflow:visible!important}
@media(max-width:600px){#ukf-ma-projector.is-academy .ukf-maka-shell{padding-top:78px!important}.ukf-maka-hero{padding:14px 58px!important}.ukf-maka-quiz-hud{grid-template-columns:repeat(3,minmax(0,1fr))!important}.ukf-maka-quiz-hud .ukf-maka-progress{grid-column:1/-1!important}.ukf-maka-answer-actions>div{grid-template-columns:1fr!important}}


/* v0.4.1-alpha: UI stabilization patch */
#ukf-maka-view.ukf-maka-view {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}
#ukf-maka-view .ukf-maka-shell {
    height: auto !important;
    min-height: 100% !important;
    overflow: visible !important;
    padding-top: 8px !important;
    padding-bottom: 64px !important;
}
#ukf-maka-view .ukf-maka-screen,
#ukf-maka-view .ukf-maka-screen[data-maka-screen="quiz"],
#ukf-maka-view .ukf-maka-screen[data-maka-screen="leaderboard"],
#ukf-maka-view .ukf-maka-screen[data-maka-screen="difficulty"] {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}
#ukf-maka-view .ukf-maka-quiz,
#ukf-maka-view .ukf-maka-leaderboard,
#ukf-maka-view .ukf-maka-difficulty,
#ukf-maka-view .ukf-maka-info,
#ukf-maka-view .ukf-maka-result {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    justify-content: flex-start !important;
    margin-top: 0 !important;
}
#ukf-maka-view .ukf-maka-question-card {
    max-height: none !important;
    overflow: visible !important;
}
#ukf-maka-view .ukf-maka-answers {
    overflow: visible !important;
}
#ukf-maka-view .ukf-maka-answer-actions {
    position: static !important;
    margin: 18px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
#ukf-maka-view .ukf-maka-board-panel,
#ukf-maka-view .ukf-maka-ranking {
    overflow: visible !important;
    max-height: none !important;
}
.ukf-maka-explanation-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000 !important;
    display: grid !important;
    place-items: center !important;
    width: 100vw !important;
    height: 100dvh !important;
    padding: 18px !important;
    overflow-y: auto !important;
    background: rgba(5, 7, 20, .86) !important;
}
.ukf-maka-explanation-modal[hidden] { display: none !important; }
.ukf-maka-explanation-dialog {
    width: min(560px, calc(100vw - 36px)) !important;
    max-height: calc(100dvh - 36px) !important;
    margin: auto !important;
    overflow-y: auto !important;
}
@media (max-width: 700px) {
    #ukf-maka-view.ukf-maka-view { inset: 76px 10px 10px !important; }
    #ukf-maka-view .ukf-maka-shell { padding-top: 0 !important; }
    #ukf-maka-view .ukf-maka-quiz-hud { margin-top: 0 !important; }
    #ukf-maka-view .ukf-maka-leaderboard,
    #ukf-maka-view .ukf-maka-difficulty,
    #ukf-maka-view .ukf-maka-info,
    #ukf-maka-view .ukf-maka-result { padding-top: 18px !important; }
    #ukf-maka-view .ukf-maka-answer-actions > div { grid-template-columns: 1fr !important; }
}


/* v0.4.2-alpha — mobile layout reset and modal reliability */
.ukf-ma-projector.is-academy .ukf-maka-view,
#ukf-maka-view.ukf-maka-view {
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}
.ukf-ma-projector.is-academy .ukf-maka-shell,
#ukf-maka-view .ukf-maka-shell {
    width: min(1120px, 100%) !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 82px 18px 32px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}
#ukf-maka-view .ukf-maka-screen,
#ukf-maka-view .ukf-maka-quiz,
#ukf-maka-view .ukf-maka-leaderboard,
#ukf-maka-view .ukf-maka-difficulty,
#ukf-maka-view .ukf-maka-info,
#ukf-maka-view .ukf-maka-result,
#ukf-maka-view .ukf-maka-reader {
    position: static !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding-top: 0 !important;
    overflow: visible !important;
    transform: none !important;
    justify-content: flex-start !important;
}
#ukf-maka-view .ukf-maka-screen[hidden] { display: none !important; }
#ukf-maka-view .ukf-maka-quiz-hud {
    margin: 0 0 14px !important;
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)) !important;
}
#ukf-maka-view .ukf-maka-quiz-hud > div:not(.ukf-maka-progress) {
    min-width: 0 !important;
}
#ukf-maka-view .ukf-maka-progress { grid-column: 1 / -1 !important; }
#ukf-maka-view .ukf-maka-question-card {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
}
#ukf-maka-view .ukf-maka-answer-actions {
    position: static !important;
    inset: auto !important;
    margin: 18px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
#ukf-maka-view .ukf-maka-answer-actions > div {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
}
#ukf-maka-view .ukf-maka-leaderboard {
    padding: 22px !important;
}
#ukf-maka-view .ukf-maka-board-panel,
#ukf-maka-view .ukf-maka-ranking {
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}
.ukf-ma-projector.is-academy #ukf-ma-global-back,
.ukf-ma-projector.is-academy [data-ma-close] {
    position: absolute !important;
    top: 18px !important;
    z-index: 10030 !important;
}
.ukf-maka-explanation-modal {
    position: absolute !important;
    inset: 0 !important;
    z-index: 100040 !important;
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 18px !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    pointer-events: auto !important;
    background: rgba(5, 7, 20, .9) !important;
}
.ukf-maka-explanation-modal[hidden] { display: none !important; }
.ukf-maka-explanation-dialog {
    position: relative !important;
    width: min(560px, 100%) !important;
    max-height: calc(100% - 8px) !important;
    margin: auto !important;
    overflow-y: auto !important;
    pointer-events: auto !important;
}
@media (max-width: 700px) {
    .ukf-ma-projector.is-academy .ukf-maka-shell,
    #ukf-maka-view .ukf-maka-shell {
        padding: 76px 10px 24px !important;
    }
    .ukf-ma-projector.is-academy #ukf-ma-global-back,
    .ukf-ma-projector.is-academy [data-ma-close] { top: 12px !important; }
    #ukf-maka-view .ukf-maka-hero {
        padding: 14px 16px !important;
        border-radius: 18px !important;
    }
    #ukf-maka-view .ukf-maka-quiz,
    #ukf-maka-view .ukf-maka-leaderboard,
    #ukf-maka-view .ukf-maka-difficulty,
    #ukf-maka-view .ukf-maka-info,
    #ukf-maka-view .ukf-maka-result,
    #ukf-maka-view .ukf-maka-reader {
        padding-top: 0 !important;
    }
    #ukf-maka-view .ukf-maka-question-card { padding: 22px 18px !important; }
    #ukf-maka-view .ukf-maka-question-card h2 { font-size: 19px !important; }
    #ukf-maka-view .ukf-maka-leaderboard { padding: 18px !important; }
    .ukf-maka-explanation-modal { padding: 10px !important; }
    .ukf-maka-explanation-dialog {
        width: 100% !important;
        max-height: calc(100% - 4px) !important;
        border-radius: 20px !important;
    }
}

/* v0.4.8 Alpha – kilpailukortti, Urantia-kolikkolupaus ja tasapainoinen leaderboard */
.ukf-maka-coin-promise {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #f1dcff;
    font-weight: 800;
    white-space: normal;
}
.ukf-maka-coin-promise img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    flex: 0 0 22px;
    filter: drop-shadow(0 2px 7px rgba(255,196,45,.28));
}
.ukf-maka-stat--competition small {
    line-height: 1.35;
}
.ukf-maka-ranking-row {
    grid-template-columns: 52px minmax(0, 1fr) minmax(220px, auto);
    gap: 14px;
}
.ukf-maka-ranking-row .ukf-maka-rank {
    grid-row: auto;
    align-self: center;
}
.ukf-maka-ranking-player {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
}
.ukf-maka-ranking-player strong {
    overflow-wrap: anywhere;
    font-size: 17px;
}
.ukf-maka-ranking-player > span {
    color: #e9d4ff;
    font-weight: 900;
}
.ukf-maka-ranking-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(100px, 1fr));
    gap: 9px;
    align-items: stretch;
}
.ukf-maka-ranking-metrics > span {
    display: flex;
    min-height: 58px;
    padding: 9px 12px;
    border: 1px solid rgba(188,149,255,.13);
    border-radius: 13px;
    background: rgba(255,255,255,.035);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.ukf-maka-ranking-metrics small {
    margin-bottom: 2px;
    color: rgba(255,255,255,.55);
    font-size: 11px;
    font-weight: 700;
}
.ukf-maka-ranking-metrics b {
    color: #fff;
    font-size: 14px;
    line-height: 1.2;
}
@media (max-width: 680px) {
    .ukf-maka-ranking-row {
        grid-template-columns: 42px minmax(0,1fr) !important;
        gap: 10px 12px;
        padding: 14px !important;
    }
    .ukf-maka-ranking-player {
        grid-column: 2;
    }
    .ukf-maka-ranking-metrics {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0,1fr));
        width: 100%;
    }
    .ukf-maka-ranking-metrics > span {
        min-height: 54px;
        padding: 8px;
    }
    .ukf-maka-coin-promise img {
        width: 20px;
        height: 20px;
        flex-basis: 20px;
    }
}


/* v0.4.9 polish */
.ukf-ma-projector.is-academy #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content{
    margin-top:0!important;
    padding-top:0!important;
}
.ukf-ma-projector.is-academy #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-card,
.ukf-ma-projector.is-academy #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-image{
    margin-top:0!important;
}
.ukf-maka-stat--leaderboard,
.ukf-maka-stat--competition{
    display:flex;
    align-items:center;
    gap:14px;
}
.ukf-maka-stat--leaderboard h3,
.ukf-maka-stat--competition h3{
    margin:0;
    display:flex;
    align-items:center;
    min-height:40px;
}


/* v0.4.10 – answer feedback, reader top alignment and lobby button alignment */

/* Keep the chosen answer visible long enough to register before the result actions appear. */
.ukf-maka-answers .ukf-maka-answer:disabled {
    cursor: default;
    opacity: 1;
}
.ukf-maka-answers .ukf-maka-answer:disabled:not(.is-correct):not(.is-wrong) {
    opacity: .64;
}

/* In the reader, the archive card begins at the top of the projector. The global back/close
   controls remain absolutely positioned above the image. */
.ukf-ma-projector.is-academy #ukf-maka-view[data-screen="reader"] .ukf-maka-shell,
#ukf-maka-view[data-screen="reader"] .ukf-maka-shell {
    padding-top: 0 !important;
}
.ukf-ma-projector.is-academy #ukf-maka-view[data-screen="reader"] .ukf-maka-reader,
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.ukf-ma-projector.is-academy #ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content,
#ukf-maka-view[data-screen="reader"] .ukf-maka-reader-content {
    margin-top: 0 !important;
}

/* Align the lobby icon and title on one common vertical centre line. */
#ukf-maka-view[data-screen="lobby"] .ukf-maka-stat {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
}
#ukf-maka-view[data-screen="lobby"] .ukf-maka-stat > span {
    display: inline-flex !important;
    flex: 0 0 34px;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}
#ukf-maka-view[data-screen="lobby"] .ukf-maka-stat > strong {
    align-self: center !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}
#ukf-maka-view[data-screen="lobby"] .ukf-maka-stat > small {
    margin-left: auto;
}

@media (max-width: 700px) {
    .ukf-ma-projector.is-academy #ukf-maka-view[data-screen="reader"] .ukf-maka-shell,
    #ukf-maka-view[data-screen="reader"] .ukf-maka-shell {
        padding: 0 8px 24px !important;
    }
    #ukf-maka-view[data-screen="lobby"] .ukf-maka-stat > small {
        display: none !important;
    }
}

/* v0.4.11 – remove duplicated quiz top offset only.
   The shell already reserves space for the global back/close controls. */
#ukf-maka-view[data-screen="quiz"] .ukf-maka-quiz {
    padding-top: 0 !important;
}

/* v1.0.0 – Arkistojen kanssa synkronoitu teemavalitsin */
#ukf-maka-view .ukf-maka-theme-picker { display:flex; flex-direction:column; gap:18px; }
#ukf-maka-view .ukf-maka-section-head p { margin:8px 0 0; color:rgba(255,255,255,.64); }
#ukf-maka-view .ukf-maka-theme-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
#ukf-maka-view .ukf-maka-theme-choice { position:relative; min-height:128px; padding:20px; text-align:left; color:#fff; border:1px solid color-mix(in srgb,var(--maka-theme-color,#9a4cff) 42%,transparent); border-radius:20px; background:linear-gradient(145deg,color-mix(in srgb,var(--maka-theme-color,#9a4cff) 15%,#18172d),#111426); cursor:pointer; opacity:.58; transition:transform .18s ease,opacity .18s ease,border-color .18s ease,box-shadow .18s ease; }
#ukf-maka-view .ukf-maka-theme-choice.is-all { --maka-theme-color:#d694ff; }
#ukf-maka-view .ukf-maka-theme-choice.is-selected { opacity:1; border-color:var(--maka-theme-color,#b55cff); box-shadow:0 0 0 2px color-mix(in srgb,var(--maka-theme-color,#b55cff) 24%,transparent),0 12px 34px rgba(0,0,0,.18); }
#ukf-maka-view .ukf-maka-theme-choice.is-selected::after { content:'✓'; position:absolute; top:14px; right:14px; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:var(--maka-theme-color,#b55cff); color:#fff; font-weight:900; }
#ukf-maka-view .ukf-maka-theme-choice:hover { transform:translateY(-2px); }
#ukf-maka-view .ukf-maka-theme-icon { display:block; margin-bottom:14px; font-size:30px; }
#ukf-maka-view .ukf-maka-theme-choice strong,#ukf-maka-view .ukf-maka-theme-choice small { display:block; }
#ukf-maka-view .ukf-maka-theme-choice small { margin-top:7px; color:rgba(255,255,255,.62); }
#ukf-maka-view .ukf-maka-theme-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:4px; }
#ukf-maka-view .ukf-maka-theme-actions span { color:#cfc7dd; font-weight:700; }
#ukf-maka-view .ukf-maka-question-card { position:relative; isolation:isolate; border-color:color-mix(in srgb,var(--maka-question-theme,#8b2cf5) 46%,transparent)!important; }
#ukf-maka-view .ukf-maka-question-card::before { content:''; position:absolute; inset:0; z-index:-2; border-radius:inherit; background-image:linear-gradient(135deg,rgba(21,18,45,.88),rgba(13,16,35,.96)),var(--maka-question-image,none); background-size:cover; background-position:center; opacity:0; transition:opacity .25s ease; pointer-events:none; }
#ukf-maka-view .ukf-maka-question-card.has-card-image::before { opacity:1; }
#ukf-maka-view .ukf-maka-question-card::after { content:''; position:absolute; inset:0; z-index:-1; border-radius:inherit; background:radial-gradient(circle at 12% 8%,color-mix(in srgb,var(--maka-question-theme,#8b2cf5) 22%,transparent),transparent 48%); pointer-events:none; }
#ukf-maka-view .ukf-maka-question-card [data-maka-quiz-label] { color:color-mix(in srgb,var(--maka-question-theme,#d5a8ff) 72%,white); }
@media(max-width:900px){#ukf-maka-view .ukf-maka-theme-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:600px){#ukf-maka-view .ukf-maka-theme-grid{grid-template-columns:1fr 1fr;gap:10px}#ukf-maka-view .ukf-maka-theme-choice{min-height:112px;padding:15px;border-radius:16px}#ukf-maka-view .ukf-maka-theme-icon{font-size:25px;margin-bottom:10px}#ukf-maka-view .ukf-maka-theme-actions{align-items:stretch;flex-direction:column}#ukf-maka-view .ukf-maka-theme-actions .ukf-maka-primary{width:100%}}

/* v1.0.1: simplified theme selection actions. */
#ukf-maka-view .ukf-maka-theme-actions { justify-content:flex-end; }


/* v1.0.7: selkeä pelitila, virhelaskuri ja Game Over */
.ukf-maka-difficulty-grid small > span {
    display: block;
    min-height: 1.45em;
}
.ukf-maka-difficulty-grid .ukf-maka-coin-promise {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 2px;
}
.ukf-maka-mistakes.is-danger strong {
    color: #ff7c9f !important;
}
#ukf-maka-view .ukf-maka-quiz-hud {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.ukf-maka-result.is-game-over {
    border-color: rgba(255, 92, 128, .38);
    background: radial-gradient(circle at 50% 0, rgba(189, 35, 78, .22), transparent 38%), linear-gradient(145deg, rgba(43, 26, 52, .98), rgba(14, 16, 36, .98));
}
.ukf-maka-result.is-game-over .ukf-maka-result-icon {
    background: linear-gradient(145deg, rgba(181, 37, 79, .94), rgba(90, 25, 95, .92));
}
.ukf-maka-result.is-game-over [data-maka-result-score] {
    color: #ff8ca8;
}
@media (max-width: 600px) {
    #ukf-maka-view .ukf-maka-quiz-hud {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
    #ukf-maka-view .ukf-maka-quiz-hud > div:not(.ukf-maka-progress) {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    #ukf-maka-view .ukf-maka-quiz-hud small {
        font-size: 11px;
    }
}