.arcade-body {
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    background: radial-gradient(circle at top,#4c0070 0%,#0a001a 60%, #000 100%);
    color: white;
    font-family: Arial, sans-serif;
    text-align: center;
}

#start-screen {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: black;
    z-index: 10;
}

.start-title {
    margin: 0 18px 12px;
    color: #ffd76a;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2rem, 5vw, 4.4rem);
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    -webkit-text-stroke: 1px #6d2d00;
    text-shadow:
        0 2px 0 #a64b00,
        0 4px 0 #512000,
        0 0 10px #ff8a00,
        0 0 24px rgba(255, 160, 0, 0.72);
}

.start-sub {
    min-height: 44px;
    padding: 10px 18px;
    border: 2px solid #00eaff;
    background: transparent;
    color: #00eaff;
    font: inherit;
    cursor: pointer;
    text-shadow: 0 0 10px #00eaff;
    animation: pulse 1s infinite;
}

.academy-entry-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
}

.prologue-link {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    padding: 10px 18px;
    border: 2px solid #ffd700;
    color: #ffd700;
    text-decoration: none;
    box-sizing: border-box;
}

.start-sub:focus-visible,
.prologue-link:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
}

/* Open Gate */
.start-gate {
    width: 760px;
    max-width: 92vw;
    max-height: 70vh;
    height: auto;
    object-fit: contain;
    margin: 10px 0;
    border-radius: 12px;
} 

.hidden {
    display: none;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

#main-content {
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    transform: translateY(-20px);
}

.arcade-title {
    margin: 0 18px 4px;
    color: #ffd76a;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.8rem, 4vw, 3.6rem);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    -webkit-text-stroke: 1px #6d2d00;
    text-shadow:
        0 2px 0 #a64b00,
        0 4px 0 #512000,
        0 0 9px #ff8a00,
        0 0 20px rgba(255, 160, 0, 0.62);
}

.tagline {
    color: #ffd700;
}
/*============================
Hydra Image
===============================*/

.hydra-image {
    width: 92vw;
    max-width: 1200px;
    max-height: 65vh;
    height: auto;
    object-fit: contain;
    display: block;
    margin: 5px auto;
    
}

.game-links {
display: flex;
flex-direction: column;
gap: 15px;
align-items: center;
margin-top: 0;
}

.link-btn {
    display: inline-flex;
    width: 240px;
    min-height: 48px;
    padding: 14px;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 2px solid #f3b33d;
    border-radius: 5px;
    box-sizing: border-box;
    background:
        linear-gradient(180deg, rgba(67, 35, 14, 0.96), rgba(16, 8, 5, 0.98));
    color: #fff4cf;
    text-decoration: none;
    box-shadow:
        inset 0 0 0 2px rgba(255, 216, 118, 0.13),
        inset 0 0 14px rgba(255, 123, 0, 0.18),
        0 0 10px rgba(255, 164, 32, 0.7);
    font: inherit;
    font-weight: 700;
    letter-spacing: 0.015em;
    overflow-wrap: anywhere;
    text-align: center;
}

.link-btn:hover {
    border-color: #fff0a8;
    background: linear-gradient(180deg, #a95613, #4a1c08);
    color: #fff;
    box-shadow:
        inset 0 0 0 2px rgba(255, 244, 194, 0.24),
        0 0 10px #ffd76a,
        0 0 22px rgba(255, 116, 0, 0.75);
    transform: translateY(-2px);
}

.link-btn:focus-visible,
.back-link:focus-visible {
    outline: 3px solid #ffd700;
    outline-offset: 3px;
}

.games-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
    width: min(1002px, calc(100% - 32px));
    margin: 0 auto;
}

.games-links .link-btn {
    flex: 0 1 240px;
    min-width: 0;
}

@media (max-height: 900px) and (min-width: 769px) {
    #main-content {
        height: auto;
        min-height: 100vh;
        overflow: visible;
        padding: 24px 0;
        box-sizing: border-box;
        transform: none;
    }
}

/* ==========================
   GIANT SLAYER BRAND SYSTEM
   ========================== */

.engine-credit {
    margin: 7px 0 14px;
    color: #aeefff;
    font-size: 0.84rem;
    letter-spacing: 0.04em;
}

.certification-cabinet-shell {
    width: min(700px, calc(100% - 28px));
    margin: 0 auto;
    padding: 44px 0 56px;
    text-align: center;
}

body[data-certification="aplus-core1"],
body[data-certification="A+ Core 1"] { --cert-icon-image: url("assets/aplus-core1-kingdom-icon.png"); }
body[data-certification="aplus-core2"],
body[data-certification="A+ Core 2"] { --cert-icon-image: url("assets/aplus-core2-kingdom-icon.png"); }
body[data-certification="network-plus"],
body[data-certification="Network+"] { --cert-icon-image: url("assets/network-plus-kingdom-icon.png"); }
body[data-certification="security-plus"],
body[data-certification="Security+"] { --cert-icon-image: url("assets/security-plus-kingdom-icon.png"); }
body[data-certification="cloud-plus"],
body[data-certification="Cloud+"] { --cert-icon-image: url("assets/cloud-plus-kingdom-castle.png"); }
body[data-certification="linux-essentials"] { --cert-icon-image: url("assets/linux-essentials-kingdom-icon.png"); }
body[data-certification="aws-cloud-practitioner"] { --cert-icon-image: url("assets/aws-cloud-kingdom-icon.png"); }

body.certification-cabinet[data-certification="aplus-core1"] { --kingdom-accent: #00eaff; }
body.certification-cabinet[data-certification="aplus-core2"] { --kingdom-accent: #22d3ee; }
body.certification-cabinet[data-certification="network-plus"] { --kingdom-accent: #8b5cf6; }
body.certification-cabinet[data-certification="security-plus"] { --kingdom-accent: #c65cff; }
body.certification-cabinet[data-certification="cloud-plus"] { --kingdom-accent: #65e8ff; }
body.certification-cabinet[data-certification="linux-essentials"] { --kingdom-accent: #39ff88; }
body.certification-cabinet[data-certification="aws-cloud-practitioner"] { --kingdom-accent: #ff8a00; }

.certification-cabinet-header {
    position: relative;
    overflow: hidden;
    margin-bottom: 26px;
    padding: clamp(20px, 5vw, 34px);
    border: 2px solid #f3b33d;
    border-radius: 14px;
    background:
        radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--kingdom-accent, #00eaff) 14%, transparent), transparent 52%),
        linear-gradient(180deg, rgba(48, 25, 10, 0.96), rgba(9, 6, 12, 0.98));
    box-shadow:
        inset 0 0 0 2px rgba(255, 220, 130, 0.12),
        inset 0 0 24px rgba(255, 128, 0, 0.1),
        0 0 16px rgba(243, 179, 61, 0.48),
        0 0 28px color-mix(in srgb, var(--kingdom-accent, #00eaff) 22%, transparent);
}

.certification-cabinet-header::before {
    content: "";
    position: absolute;
    inset: 7px;
    border: 1px solid rgba(255, 221, 137, 0.3);
    border-radius: 9px;
    pointer-events: none;
}

.certification-cabinet-header .campaign-kicker {
    color: #ffd76a;
    text-shadow: 0 0 8px rgba(255, 156, 32, 0.72);
}

.certification-cabinet-header h1 {
    margin: 12px 0 4px;
    color: var(--kingdom-accent, #00eaff);
    font-size: clamp(1.8rem, 6vw, 2.8rem);
    text-shadow:
        0 0 10px var(--kingdom-accent, #00eaff),
        0 0 22px color-mix(in srgb, var(--kingdom-accent, #00eaff) 55%, transparent);
}

body.certification-cabinet[data-certification] .certification-cabinet-header h1::before {
    content: "";
    display: inline-block;
    width: 3.4rem;
    height: 3.4rem;
    margin-right: 10px;
    background: var(--cert-icon-image) center / contain no-repeat;
    vertical-align: middle;
    filter: drop-shadow(0 0 8px var(--kingdom-accent, #00eaff));
}

.certification-cabinet-header .engine-credit {
    color: #f4e6c0;
}

.certification-cabinet-header p:last-child {
    margin-bottom: 0;
    color: #ffd700;
}

.certification-cabinet .game-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}

.certification-cabinet[data-certification="security-plus"] .certification-cabinet-shell {
    width: min(1400px, calc(100% - 36px));
}

.certification-cabinet[data-certification="aplus-core1"] .certification-cabinet-shell {
    width: min(1500px, calc(100% - 36px));
}

.certification-cabinet[data-certification="aplus-core2"] .certification-cabinet-shell {
    width: min(1500px, calc(100% - 36px));
}

.certification-cabinet[data-certification="network-plus"] .certification-cabinet-shell {
    width: min(1500px, calc(100% - 36px));
}

.certification-cabinet[data-certification="linux-essentials"] .certification-cabinet-shell {
    width: min(1500px, calc(100% - 36px));
}

.certification-cabinet[data-certification="aws-cloud-practitioner"] .certification-cabinet-shell {
    width: min(1500px, calc(100% - 36px));
}

.certification-cabinet[data-certification="cloud-plus"] .certification-cabinet-shell {
    width: min(1500px, calc(100% - 36px));
}

.aplus-training-hero,
.network-training-hero,
.linux-training-hero,
.aws-training-hero,
.cloud-plus-training-hero {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 1.85 / 1;
    margin: 0 0 26px;
    border-radius: 18px;
    background: #07020f;
    box-shadow:
        0 0 18px rgba(198, 92, 255, 0.5),
        0 0 32px rgba(243, 179, 61, 0.22);
}

.aplus-training-hero img,
.network-training-hero img,
.linux-training-hero img,
.aws-training-hero img,
.cloud-plus-training-hero img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.certification-cabinet[data-certification="aplus-core2"] .aplus-training-hero {
    aspect-ratio: 2.1 / 1;
}

.certification-cabinet[data-certification="network-plus"] .network-training-hero {
    aspect-ratio: 2.1 / 1;
}

.certification-cabinet[data-certification="linux-essentials"] .linux-training-hero {
    aspect-ratio: 2.1 / 1;
}

.certification-cabinet[data-certification="aws-cloud-practitioner"] .aws-training-hero {
    aspect-ratio: 2.1 / 1;
}

.certification-cabinet[data-certification="cloud-plus"] .cloud-plus-training-hero {
    aspect-ratio: 2.1 / 1;
}

.security-training-hero {
    position: relative;
    overflow: hidden;
    margin: 0 0 26px;
    padding: 8px;
    border: 2px solid var(--kingdom-accent, #c65cff);
    border-radius: 14px;
    background: rgba(4, 5, 16, 0.92);
    box-shadow:
        inset 0 0 16px rgba(198, 92, 255, 0.12),
        0 0 18px rgba(198, 92, 255, 0.48),
        0 0 30px rgba(243, 179, 61, 0.18);
}

.security-training-hero::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 8px;
    border-radius: 9px;
    background:
        linear-gradient(180deg, rgba(3, 3, 12, 0.78) 0%, rgba(3, 3, 12, 0.2) 30%, transparent 54%),
        linear-gradient(0deg, rgba(3, 3, 12, 0.72) 0%, transparent 25%);
    pointer-events: none;
}

.security-training-hero img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 9px;
}

.security-training-hero-copy.certification-cabinet-header {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 50%;
    width: min(900px, calc(100% - 48px));
    margin: 0;
    padding: 8px 20px 18px;
    transform: translateX(-50%);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.security-training-hero-copy.certification-cabinet-header::before {
    display: none;
}

.security-training-hero-copy.certification-cabinet-header h1 {
    margin: 4px 0 2px;
    font-size: clamp(2.4rem, 5vw, 4.4rem);
}

.security-training-hero-copy.certification-cabinet-header h1::before {
    width: clamp(3rem, 5vw, 4.6rem);
    height: clamp(3rem, 5vw, 4.6rem);
}

.security-training-hero-copy.certification-cabinet-header p {
    margin: 3px 0;
    font-size: clamp(0.78rem, 1.35vw, 1.12rem);
    line-height: 1.28;
}

.security-training-callout {
    position: absolute;
    z-index: 2;
    right: 18px;
    bottom: 15px;
    left: 18px;
    margin: 0;
    color: #ffd76a;
    font-size: clamp(0.95rem, 2vw, 1.55rem);
    font-weight: 800;
    letter-spacing: 0.035em;
    text-shadow: 0 0 8px rgba(255, 156, 32, 0.7);
}

.certification-cabinet[data-certification="security-plus"] .game-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    width: min(1200px, 100%);
    margin: 0 auto;
}

.certification-cabinet[data-certification="aplus-core1"] .game-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    width: min(1200px, 100%);
    margin: 0 auto;
}

.certification-cabinet[data-certification="aplus-core2"] .game-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    width: min(1200px, 100%);
    margin: 0 auto;
}

.certification-cabinet[data-certification="network-plus"] .game-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    width: min(1200px, 100%);
    margin: 0 auto;
}

.certification-cabinet[data-certification="linux-essentials"] .game-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    width: min(1200px, 100%);
    margin: 0 auto;
}

.certification-cabinet[data-certification="aws-cloud-practitioner"] .game-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    width: min(1200px, 100%);
    margin: 0 auto;
}

.certification-cabinet[data-certification="cloud-plus"] .game-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    width: min(1200px, 100%);
    margin: 0 auto;
}

.certification-cabinet[data-certification="security-plus"] .game-links .link-btn {
    width: 100%;
    min-width: 0;
}

.certification-cabinet[data-certification="aplus-core1"] .game-links .link-btn {
    width: 100%;
    min-width: 0;
}

.certification-cabinet[data-certification="aplus-core2"] .game-links .link-btn {
    width: 100%;
    min-width: 0;
}

.certification-cabinet[data-certification="network-plus"] .game-links .link-btn {
    width: 100%;
    min-width: 0;
}

.certification-cabinet[data-certification="linux-essentials"] .game-links .link-btn {
    width: 100%;
    min-width: 0;
}

.certification-cabinet[data-certification="aws-cloud-practitioner"] .game-links .link-btn {
    width: 100%;
    min-width: 0;
}

.certification-cabinet[data-certification="cloud-plus"] .game-links .link-btn {
    width: 100%;
    min-width: 0;
}

@media (max-width: 900px) {
    .certification-cabinet[data-certification="security-plus"] .game-links,
    .certification-cabinet[data-certification="aplus-core1"] .game-links,
    .certification-cabinet[data-certification="aplus-core2"] .game-links,
    .certification-cabinet[data-certification="network-plus"] .game-links,
    .certification-cabinet[data-certification="linux-essentials"] .game-links,
    .certification-cabinet[data-certification="aws-cloud-practitioner"] .game-links,
    .certification-cabinet[data-certification="cloud-plus"] .game-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .certification-cabinet[data-certification="security-plus"] .certification-cabinet-shell,
    .certification-cabinet[data-certification="aplus-core1"] .certification-cabinet-shell,
    .certification-cabinet[data-certification="aplus-core2"] .certification-cabinet-shell,
    .certification-cabinet[data-certification="network-plus"] .certification-cabinet-shell,
    .certification-cabinet[data-certification="linux-essentials"] .certification-cabinet-shell,
    .certification-cabinet[data-certification="aws-cloud-practitioner"] .certification-cabinet-shell,
    .certification-cabinet[data-certification="cloud-plus"] .certification-cabinet-shell {
        width: calc(100% - 14px);
        padding-top: 16px;
    }

    .security-training-hero {
        padding: 4px;
        border-radius: 11px;
    }

    .security-training-hero::after {
        inset: 4px;
        border-radius: 7px;
    }

    .security-training-hero img {
        aspect-ratio: 4 / 3;
        object-fit: cover;
        object-position: center;
    }

    .security-training-hero-copy.certification-cabinet-header {
        top: 7px;
        width: calc(100% - 18px);
        padding: 4px 6px;
    }

    .security-training-hero-copy.certification-cabinet-header .campaign-kicker {
        font-size: 0.62rem;
    }

    .security-training-hero-copy.certification-cabinet-header h1 {
        margin: 2px 0;
        font-size: clamp(1.5rem, 9vw, 2rem);
    }

    .security-training-hero-copy.certification-cabinet-header h1::before {
        width: 2rem;
        height: 2rem;
        margin-right: 5px;
    }

    .security-training-hero-copy.certification-cabinet-header p {
        margin: 1px 0;
        font-size: 0.62rem;
        line-height: 1.18;
    }

    .security-training-callout {
        right: 8px;
        bottom: 9px;
        left: 8px;
        font-size: 0.7rem;
    }

    .certification-cabinet[data-certification="security-plus"] .game-links,
    .certification-cabinet[data-certification="aplus-core1"] .game-links,
    .certification-cabinet[data-certification="aplus-core2"] .game-links,
    .certification-cabinet[data-certification="network-plus"] .game-links,
    .certification-cabinet[data-certification="linux-essentials"] .game-links,
    .certification-cabinet[data-certification="aws-cloud-practitioner"] .game-links,
    .certification-cabinet[data-certification="cloud-plus"] .game-links {
        grid-template-columns: 1fr;
        gap: 12px;
        width: min(300px, 100%);
    }
}

body[data-certification]:not(.certification-cabinet)::before {
    display: block;
    padding: 9px 14px 9px 46px;
    border-bottom: 1px solid rgba(0, 234, 255, 0.7);
    background-color: rgba(1, 8, 20, 0.94);
    background-image: var(--cert-icon-image);
    background-position: 14px center;
    background-repeat: no-repeat;
    background-size: 26px 26px;
    color: #aeefff;
    font-size: 0.76rem;
    font-weight: bold;
    letter-spacing: 0.08em;
    line-height: 1.35;
    text-align: center;
    text-transform: uppercase;
    box-shadow: 0 0 12px rgba(0, 234, 255, 0.28);
}

body[data-certification="aplus-core1"]:not(.certification-cabinet)::before,
body[data-certification="A+ Core 1"]:not(.certification-cabinet)::before { content: "🏰 GIANT SLAYER ACADEMY · A+ CORE 1"; }
body[data-certification="aplus-core2"]:not(.certification-cabinet)::before,
body[data-certification="A+ Core 2"]:not(.certification-cabinet)::before { content: "🏰 GIANT SLAYER ACADEMY · A+ CORE 2"; }
body[data-certification="network-plus"]:not(.certification-cabinet)::before,
body[data-certification="Network+"]:not(.certification-cabinet)::before { content: "🏰 GIANT SLAYER ACADEMY · NETWORK+"; }
body[data-certification="security-plus"]:not(.certification-cabinet)::before,
body[data-certification="Security+"]:not(.certification-cabinet)::before { content: "🏰 GIANT SLAYER ACADEMY · SECURITY+"; }
body[data-certification="cloud-plus"]:not(.certification-cabinet)::before,
body[data-certification="Cloud+"]:not(.certification-cabinet)::before { content: "🏰 GIANT SLAYER ACADEMY · CLOUD+"; }
body[data-certification="linux-essentials"]:not(.certification-cabinet)::before { content: "🏰 GIANT SLAYER ACADEMY · LINUX ESSENTIALS"; }
body[data-certification="aws-cloud-practitioner"]:not(.certification-cabinet)::before { content: "🏰 GIANT SLAYER ACADEMY · AWS CLOUD PRACTITIONER"; }

.games-links .certification-entry::before {
    content: "";
    display: inline-block;
    width: 2.6rem;
    height: 2.6rem;
    margin-right: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
}

.games-links a[href="aplus-core1.html"]::before { background-image: url("assets/aplus-core1-kingdom-icon.png"); }
.games-links a[href="aplus-core2.html"]::before { background-image: url("assets/aplus-core2-kingdom-icon.png"); }
.games-links a[href="network-plus.html"]::before { background-image: url("assets/network-plus-kingdom-icon.png"); }
.games-links a[href="security-plus.html"]::before { background-image: url("assets/security-plus-kingdom-icon.png"); }
.games-links a[href="cloud-plus.html"]::before { background-image: url("assets/cloud-plus-kingdom-castle.png"); }
.games-links a[href="linux-essentials.html"]::before { background-image: url("assets/linux-essentials-kingdom-icon.png"); }
.games-links a[href="aws-cloud-practitioner.html"]::before { background-image: url("assets/aws-cloud-kingdom-icon.png"); }

.certification-campaign-title::before {
    content: "";
    display: inline-block;
    width: clamp(3rem, 7vw, 4.5rem);
    height: clamp(3rem, 7vw, 4.5rem);
    margin-right: 12px;
    background: var(--cert-icon-image) center / contain no-repeat;
    vertical-align: middle;
    filter: drop-shadow(0 0 10px currentColor);
}

.command-center-title-line {
    color: #ffd700;
    font-size: 0.7em;
}

@media (max-width: 768px) {
    #main-content {
        height: auto;
        min-height: 100vh;
        overflow: visible;
        padding: 24px 0;
        box-sizing: border-box;
        transform: none;
    }

    .games-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 240px));
        justify-content: center;
        gap: 14px;
        width: min(540px, calc(100% - 32px));
        margin: 0 auto;
    }

    .games-links .link-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 48px;
        box-sizing: border-box;
        overflow-wrap: anywhere;
        text-align: center;
    }

    .flag-question-btn,
    .favorite-question-btn {
        min-height: 44px;
    }
}

@media (max-width: 480px) {
    .games-links {
        grid-template-columns: minmax(0, 280px);
    }
}

/* Academy 7/7 completion and Finale access */
.academy-finale-announcement {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1000;
  width: min(31rem, calc(100vw - 2rem));
  padding: 1.25rem;
  border: 2px solid #ffd86b;
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(9, 13, 30, 0.98), rgba(32, 21, 4, 0.98));
  color: #fff;
  box-shadow: 0 0 2rem rgba(255, 216, 107, 0.42);
}

.academy-finale-announcement h2,
.academy-finale-access h3 {
  margin: 0.35rem 0 0.6rem;
  color: #ffd86b;
}

.academy-finale-announcement p,
.academy-finale-access p {
  margin: 0;
  line-height: 1.55;
}

.academy-finale-announcement-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1rem;
}

.academy-finale-later {
  border-color: #9aa5bd;
  color: #d7deed;
}

.academy-finale-access {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(154, 165, 189, 0.48);
  border-radius: 0.85rem;
  background: rgba(5, 10, 24, 0.72);
}

.academy-finale-access.unlocked,
.academy-finale-hub-link {
  border-color: #ffd86b;
  box-shadow: 0 0 1.25rem rgba(255, 216, 107, 0.25);
}

.academy-finale-lock {
  flex: 0 0 auto;
  font-size: 2rem;
  opacity: 0.72;
}

@media (max-width: 480px) {
  .academy-finale-announcement {
    right: 0.65rem;
    bottom: 0.65rem;
    width: calc(100vw - 1.3rem);
    max-height: calc(100vh - 1.3rem);
    overflow-y: auto;
  }

  .academy-finale-announcement-actions,
  .academy-finale-access {
    align-items: stretch;
    flex-direction: column;
  }

  .academy-finale-announcement-actions .link-btn,
  .academy-finale-access .link-btn {
    width: 100%;
  }

  .academy-finale-lock {
    align-self: center;
  }
}

.crt-overlay {
    pointer-events: none;
    position: fixed;
inset: 0;
background: repeating-linear-gradient(rgba(255, 255,255,0.04) 0px, rgba(255,255,255,0.04) 1px, transparent 2px, transparent 4px,);
opacity: 0.25;
z-index: 100;
}

.game-start {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: radial-gradient(circle, #001f3f 0%, #050014 60%, #000 100%);
}

.back-link {
    color: #00eaff;
    text-decoration: none;
    text-shadow: 0 0 8px #00eaff;
}

.player-card {
    margin: 20px auto;
    padding: 15px;
    width: 85%;
    max-width: 420px;
    border: 2px solid #00eaff;
    background: rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 15px #00eaff;
}

.world-grid {
    display: grid;
    gap: 18px;
    padding: 20px;
    max-width: 900px;
    margin: 0 auto;
}

.world-card {
    border: 2px solid #ff00ff;
    background: rgba(10, 10, 25, 0.9);
    padding: 18px;
    box-shadow: 0 0 14px #ff00ff;
}

.world-card h3 {
    color: #ffd700;
}

.world-card h4 {
    color: #00f2ff;
}

.locked-text {
    color: #ff5555;
}

.stage-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    margin-top: 15px;
}

.stage-list button {
    width: 20px;
    padding: 10px;
    background: #111;
    color: #fff;
    border: 2px solid #00eaff;
    box-shadow: 0 0 10px #00eaff;
}

.stage-list button:hover {
    background: #00eaff;
    color: #000;
}

/* ========================================== CAMPAIGN MAP ========================================== */ 
.tagline { color: #ffd700;
    font-size: 0.9rem;
    margin-bottom: 25px; 
    text-shadow: 0 0 8px #ffd700;
 } 
 
 .campaign-map { display: flex; 
    flex-direction: column; 
    align-items: center; 
    gap: 30px; 
    margin-bottom: 40px; 
} 

.campaign-map > .world {
    align-self: center;
    margin-bottom: 20px;
}
    
.row { display: flex; 
    justify-content: center; 
    gap: 50px; 
    width: 100%; 
} 

.world-start { 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
} 

.path { 
    font-size: 2rem; 
    color: #00f2ff; 
    margin-bottom: 10px; 
} 

.world { 
    width: 180px; 
    min-height: 140px; 
    padding: 15px; 
    border: 2px solid #00f2ff; 
    border-radius: 12px; 
    background: rgba(15,15,30,.9); 
    color: white; 
    text-decoration: none; 
    box-shadow: 0 0 15px #00f2ff; 
    transition: .3s; 
} 

.world:hover { 
    transform: scale(1.05); 
    box-shadow: 0 0 25px #00f2ff; 
} 

.world h3 { 
    margin-top: 10px; 
} 

.unlocked { 
    border-color: #00ff66; 
    box-shadow: 0 0 20px #00ff66; 
} 

.unlocked:hover { 
    box-shadow: 0 0 30px #00ff66; 
} 

.locked { 
    opacity: .45; 
    border-color: gray; 
    box-shadow: none; 
    cursor: not-allowed; 
} 

.arcade-footer { 
    margin-top: 40px; 
    margin-bottom: 40px; 
} 
/* ========================
================== 
WORLD SCREEN 
==================
======================== */ 

.world-screen { 
    min-height: 100vh; 
    padding: 20px 10px; 
} 

.world-intro-card { 
    max-width: 700px; 
    margin: 20px auto; 
    padding: 20px 20px; 
    border: 2px solid #00ff66; 
    background: rgba(0, 0, 0, 0.75); 
    box-shadow: 0 0 25px #00ff66; 
} 

.world-subtitle { 
    color: #ffd700; 
    text-shadow: 0 0 10px #ffd700; 
    margin-bottom: 25px; 
} 

.message-box { 
    margin: 25px auto; 
    padding: 20px; 
    max-width: 500px; 
    border: 2px solid #00eaff; 
    background: rgba(10, 10, 25, 0.9); 
    box-shadow: 0 0 15px #00eaff; 
    color: white; 
    line-height: 1.7; 
} 

.mode-grid { 
    display: grid; 
    gap: 18px; 
    max-width: 700px; 
    margin: 30px auto; 
} 

/* Objective Selection screens grow with their objective buttons. */
.world-screen:has(.mode-grid a[href*="objective="]) {
    height: auto;
    min-height: 0;
}

.world-screen:has(.mode-grid a[href*="objective="]) > .world-card,
.world-screen:has(.mode-grid a[href*="objective="]) > .world-intro-card,
.world-screen:has(.mode-grid a[href*="objective="]) .mode-grid {
    height: auto;
    min-height: 0;
}

.mode-card { 
    padding: 22px; 
    border: 2px solid #ff00ff; 
    background: rgba(10, 10, 25, 0.9); 
    color: white; 
    text-decoration: none; 
    box-shadow: 0 0 15px #ff00ff; 
    font-size: 1rem; transition: 0.3s; 
} 
    
.mode-card:hover { 
    transform: scale(1.05); 
    background: #ff00ff; 
    color: black; 
} 

/* ==========================
REUSABLE CAMPAIGN PROGRESS UI
============================= */

.campaign-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 12px;
    width: min(900px, calc(100% - 30px));
    margin: 20px auto;
}

.campaign-stat {
    padding: 14px 10px;
    border: 1px solid #00eaff;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.65);
    box-shadow: 0 0 10px rgba(0, 234, 255, 0.6);
}

.campaign-stat strong,
.campaign-stat span,
.objective-card span {
    display: block;
}

.campaign-stat strong {
    color: #ffd700;
    font-size: 1.35rem;
}

.campaign-stat span {
    margin-top: 6px;
    font-size: 0.8rem;
}

.overall-progress-summary,
.world-progress-summary {
    width: min(700px, calc(100% - 30px));
    margin: 18px auto;
}

.progress-heading,
.objective-number {
    color: #00eaff;
    font-weight: bold;
}

.campaign-progress {
    height: 12px;
    overflow: hidden;
    margin: 10px 0 8px;
    border: 1px solid #00eaff;
    border-radius: 999px;
    background: #090914;
}

.campaign-progress-fill {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #00eaff, #00ff66);
    box-shadow: 0 0 10px #00ff66;
    transition: width 0.35s ease;
}

.attempt-progress .campaign-progress-fill {
    background: linear-gradient(90deg, #0066ff, #00eaff);
    box-shadow: 0 0 10px rgba(0, 234, 255, 0.75);
}

.completion-badge {
    display: inline-block;
    padding: 4px 9px;
    border: 1px solid #ffd700;
    border-radius: 999px;
    color: #ffd700;
    font-size: 0.74rem;
}

.completion-badge.complete {
    border-color: #00ff66;
    color: #00ff66;
}

.objective-card {
    text-align: left;
}

.objective-card.objective-mastered {
    border-color: #00ff66;
    box-shadow: 0 0 14px rgba(0, 255, 102, 0.55);
}

.objective-attempted-label {
    margin-top: 10px;
    color: #00eaff;
    font-size: 0.8rem;
}

.objective-card-title {
    margin: 7px 0 11px;
    color: white;
    font-size: 1.05rem;
    font-weight: bold;
}

.objective-weight {
    color: #ffd700;
    font-size: 0.84rem;
}

.objective-question-count {
    margin-top: 5px;
    color: #c9c9d8;
    font-size: 0.8rem;
}

.world-card-progress {
    display: block;
    margin-top: 9px;
}

@media (max-width: 700px) {
    .campaign-stats {
        grid-template-columns: repeat(2, minmax(120px, 1fr));
    }

    .objective-card {
        padding: 18px;
    }
}

@media (max-width: 420px) {
    .campaign-stats {
        grid-template-columns: 1fr;
    }
}

/* ==============================
LINUX ESSENTIALS CAMPAIGN JOURNEY
============================== */

.linux-campaign-shell {
    width: min(1120px, calc(100% - 32px));
    margin: 0 auto;
    padding: 28px 0 48px;
}

.linux-campaign-hero {
    padding: 24px 16px 14px;
}

.campaign-kicker,
.campaign-panel-label,
.quest-heading > span,
.world-label,
.stage-type {
    display: block;
    color: #00eaff;
    font-size: 0.72rem;
    font-weight: bold;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.campaign-command-panel {
    position: relative;
    display: grid;
    grid-template-columns: minmax(220px, 0.75fr) minmax(300px, 1.25fr);
    gap: 18px 30px;
    overflow: hidden;
    padding: 28px;
    border: 2px solid #00eaff;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(9, 12, 28, 0.96), rgba(5, 28, 28, 0.9));
    box-shadow: 0 0 24px rgba(0, 234, 255, 0.45), inset 0 0 30px rgba(0, 234, 255, 0.06);
    text-align: left;
}

.campaign-command-panel::after {
    content: "🐉";
    position: absolute;
    right: 20px;
    top: 12px;
    font-size: 4rem;
    opacity: 0.08;
}

.campaign-command-copy h2 {
    margin: 8px 0 10px;
    color: #ffd700;
}

.campaign-command-copy p {
    max-width: 420px;
    margin: 0;
    color: #c9c9d8;
    line-height: 1.6;
}

.campaign-overall-slot.overall-progress-summary {
    align-self: center;
    width: 100%;
    margin: 0;
    padding: 18px;
    border: 1px solid rgba(0, 255, 102, 0.45);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.34);
}

.campaign-overall-slot .campaign-progress {
    height: 18px;
}

.campaign-stats-slot.campaign-stats {
    grid-column: 1 / -1;
    width: 100%;
    margin: 4px 0 0;
}

.campaign-stats-slot .campaign-stat {
    text-align: center;
}

.linux-quest {
    margin-top: 58px;
}

.quest-heading {
    margin-bottom: 38px;
}

.quest-heading h2 {
    margin: 8px 0 0;
    color: #ffd700;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.55);
}

.linux-campaign-path {
    position: relative;
    width: min(860px, 100%);
    margin: 0 auto 40px;
    gap: 0;
}

.linux-campaign-path::before {
    content: "";
    position: absolute;
    top: 30px;
    bottom: 110px;
    left: 50%;
    width: 3px;
    transform: translateX(-50%);
    background: linear-gradient(#00eaff, #00ff66 65%, #ffd700);
    box-shadow: 0 0 12px #00eaff;
}

.campaign-stage {
    position: relative;
    display: flex;
    width: 50%;
    min-height: 190px;
    padding: 18px 52px 18px 0;
    box-sizing: border-box;
}

.campaign-stage.stage-right {
    align-self: flex-end;
    justify-content: flex-start;
    padding: 18px 0 18px 52px;
}

.stage-marker {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: -22px;
    display: grid;
    width: 42px;
    height: 42px;
    transform: translateY(-50%);
    place-items: center;
    border: 2px solid #00eaff;
    border-radius: 50%;
    background: #080818;
    color: #ffd700;
    box-shadow: 0 0 14px #00eaff;
    font-size: 0.75rem;
    font-weight: bold;
}

.stage-right .stage-marker {
    right: auto;
    left: -22px;
}

.linux-campaign-path .world {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    min-height: 150px;
    box-sizing: border-box;
    text-align: left;
}

.linux-campaign-path .world:hover {
    transform: translateY(-4px) scale(1.015);
}

.world-icon {
    display: block;
    margin-bottom: 5px;
    font-size: 1.75rem;
}

.linux-campaign-path .world strong {
    display: block;
    margin-top: 6px;
    line-height: 1.35;
}

.linux-campaign-path .world-progress-summary {
    width: 100%;
    margin: 12px 0 0;
}

.linux-campaign-path .campaign-progress {
    height: 9px;
    margin: 7px 0 6px;
}

.campaign-trial .world {
    border-color: #ff00ff;
    box-shadow: 0 0 18px rgba(255, 0, 255, 0.65);
}

.campaign-trial .stage-type {
    margin-top: 10px;
    color: #ff8cff;
}

.final-stage {
    align-self: center;
    width: min(520px, 100%);
    min-height: auto;
    margin-top: 35px;
    padding: 44px 0 0;
}

.final-stage-crown {
    position: absolute;
    z-index: 2;
    top: -2px;
    left: 50%;
    color: #ffd700;
    font-size: 2.6rem;
    text-shadow: 0 0 15px #ffd700;
    transform: translateX(-50%);
}

.linux-campaign-path .final-dungeon {
    width: 100%;
    min-height: 190px;
    align-items: center;
    border-color: #ffd700;
    background: linear-gradient(145deg, rgba(42, 18, 7, 0.96), rgba(15, 10, 30, 0.98));
    box-shadow: 0 0 30px rgba(255, 215, 0, 0.72), inset 0 0 30px rgba(255, 215, 0, 0.08);
    text-align: center;
}

.linux-campaign-path .final-dungeon strong {
    color: #ffd700;
    font-size: 1.45rem;
    letter-spacing: 0.1em;
}

.linux-campaign-path .final-dungeon .stage-type {
    margin-top: 12px;
    color: #fff0a6;
}

@media (max-width: 760px) {
    .campaign-command-panel {
        grid-template-columns: 1fr;
        padding: 22px;
    }

    .campaign-stats-slot.campaign-stats {
        grid-column: auto;
    }

    .linux-campaign-path {
        align-items: stretch;
        padding-left: 34px;
        box-sizing: border-box;
    }

    .linux-campaign-path::before {
        left: 14px;
        bottom: 100px;
    }

    .campaign-stage,
    .campaign-stage.stage-right {
        align-self: stretch;
        width: 100%;
        min-height: 170px;
        padding: 14px 0 14px 28px;
    }

    .stage-marker,
    .stage-right .stage-marker {
        right: auto;
        left: -41px;
        width: 38px;
        height: 38px;
    }

    .final-stage {
        margin-top: 30px;
        padding-top: 44px;
    }
}

@media (max-width: 480px) {
    .linux-campaign-shell {
        width: min(100% - 20px, 1120px);
        padding-top: 14px;
    }

    .linux-campaign-hero {
        padding-inline: 4px;
    }

    .campaign-command-panel {
        padding: 17px;
    }

    .campaign-stats-slot.campaign-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .campaign-stats-slot .campaign-stat {
        padding: 11px 6px;
    }

    .linux-campaign-path .world {
        min-height: 155px;
        padding: 14px;
    }
}


/* ==========================
================ 
HYDRA QUIZ 
=============================
================= */ 

.answers-box { 
    display: flex; 
    flex-direction: column; 
    gap: 8px; 
    margin: 10px auto; 
    max-width: 500px; 
} 

.answer-option { 
    display: flex; 
    align-items: center; 
    gap: 12px; 
    padding: 10px; 
    border: 2px solid #00eaff; 
    background: rgba(0, 0, 0, 0.75); 
    color: white; 
    cursor: pointer; 
    box-shadow: 0 0 10px #00eaff; 
} 

.answer-option:hover { 
    background: rgba(0, 234, 255, 0.2); 
} 

.answer-option input { 
    transform: scale(1.3); 
} 

#feedback { 
    color: #ffd700; 
    margin-top: 18px; 
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: .35;
        transform: scale(1.05);
    }
}

/* ==========================
   GIANT SLAYER COMMAND CENTER
   ========================== */

.command-center {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 40px 0 56px;
}

.command-center-hero {
    display: grid;
    grid-template-columns: minmax(150px, 210px) minmax(0, 1fr) minmax(150px, 210px);
    align-items: end;
    gap: 20px;
    margin-bottom: 28px;
    text-align: center;
}

.command-center-hero-copy {
    align-self: center;
    min-width: 0;
}

.command-center-character {
    display: block;
    width: 100%;
    max-width: 180px;
    max-height: 220px;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.28));
}

.command-center-warrior {
    justify-self: end;
}

.command-center-giant {
    justify-self: start;
    max-width: 185px;
}

@media (max-width: 820px) {
    .command-center-hero {
        grid-template-columns: minmax(90px, 120px) minmax(0, 1fr) minmax(90px, 120px);
        gap: 12px;
    }

    .command-center-character {
        max-height: 155px;
    }
}

@media (max-width: 520px) {
    .command-center-hero {
        position: relative;
        display: block;
        min-height: 0;
        margin-bottom: 18px;
    }

    .command-center-character {
        position: absolute;
        bottom: 0;
        width: 64px;
        height: 92px;
        object-fit: contain;
        pointer-events: none;
    }

    .command-center-hero-copy {
        min-height: 0;
    }

    .command-center-warrior {
        left: 0;
    }

    .command-center-giant {
        right: 0;
    }

    .command-center-hero .campaign-kicker {
        font-size: 0.7rem;
    }

    .command-center-hero .arcade-title {
        font-size: clamp(1.55rem, 9vw, 2rem);
    }

    .command-center-hero .engine-credit,
    .command-center-hero .tagline {
        font-size: 0.72rem;
    }

    .command-center-hero .tagline {
        min-height: 38px;
        padding: 0 68px;
    }
}

.academy-summary,
.dashboard-campaign-card {
    border: 2px solid #00eaff;
    border-radius: 14px;
    background: rgba(1, 12, 24, 0.92);
    box-shadow: 0 0 20px rgba(0, 234, 255, 0.24);
}

.dashboard-campaign-card:nth-child(1) { --cert-accent: #00eaff; --cert-icon-image: url("assets/aplus-core1-kingdom-icon.png"); }
.dashboard-campaign-card:nth-child(2) { --cert-accent: #22d3ee; --cert-icon-image: url("assets/aplus-core2-kingdom-icon.png"); }
.dashboard-campaign-card:nth-child(3) { --cert-accent: #8b5cf6; --cert-icon-image: url("assets/network-plus-kingdom-icon.png"); }
.dashboard-campaign-card:nth-child(4) { --cert-accent: #c65cff; --cert-icon-image: url("assets/security-plus-kingdom-icon.png"); }
.dashboard-campaign-card:nth-child(5) { --cert-accent: #65e8ff; --cert-icon-image: url("assets/cloud-plus-kingdom-castle.png"); }
.dashboard-campaign-card:nth-child(6) { --cert-accent: #00eaff; --cert-icon-image: url("assets/linux-essentials-kingdom-icon.png"); }
.dashboard-campaign-card:nth-child(7) { --cert-accent: #ff8a00; --cert-icon-image: url("assets/aws-cloud-kingdom-icon.png"); }

.dashboard-campaign-card {
    border-color: var(--cert-accent, #00eaff);
    box-shadow: 0 0 22px color-mix(in srgb, var(--cert-accent, #00eaff) 30%, transparent);
}

.academy-summary {
    margin-bottom: 34px;
    padding: 24px;
}

.academy-summary > h2 {
    margin-top: 0;
}

.academy-summary-heading,
.dashboard-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.academy-summary-heading h2,
.dashboard-card-header h3 {
    margin: 4px 0 0;
}

.dashboard-card-header h3::before,
.dashboard-enter::before {
    content: "";
    display: inline-block;
    width: 3.4rem;
    height: 3.4rem;
    flex: 0 0 auto;
    margin-right: 10px;
    background: var(--cert-icon-image) center / contain no-repeat;
    vertical-align: middle;
    filter: drop-shadow(0 0 8px var(--cert-accent, #00eaff));
}

.dashboard-section-title {
    margin: 0 0 18px;
    text-align: center;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.dashboard-campaign-card {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    padding: 22px;
}

.dashboard-percent {
    flex: 0 0 auto;
    color: #ffd700;
    font-size: 1.35rem;
}

.dashboard-progress {
    height: 16px;
    overflow: hidden;
    border: 1px solid #00eaff;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.72);
}

.dashboard-campaign-card .dashboard-progress {
    border-color: var(--cert-accent, #00eaff);
    box-shadow: 0 0 8px color-mix(in srgb, var(--cert-accent, #00eaff) 36%, transparent);
}

.dashboard-progress > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #00eaff, #39ff88);
    box-shadow: 0 0 12px rgba(57, 255, 136, 0.72);
    transition: width 0.35s ease;
}

.dashboard-metrics,
.academy-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.dashboard-metric {
    min-width: 0;
    padding: 12px 8px;
    border: 1px solid rgba(0, 234, 255, 0.48);
    border-radius: 8px;
    background: rgba(0, 234, 255, 0.06);
    text-align: center;
}

.dashboard-metrics .dashboard-metric {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    min-height: 96px;
    padding: 12px;
    border-color: color-mix(in srgb, var(--cert-accent, #00eaff) 62%, transparent);
    background: color-mix(in srgb, var(--cert-accent, #00eaff) 7%, rgba(1, 12, 24, 0.92));
}

.dashboard-metrics .dashboard-metric::before {
    grid-column: 1;
    grid-row: 1 / 3;
    font-size: 2.55rem;
    line-height: 1;
    filter: drop-shadow(0 0 7px currentColor);
}

.dashboard-metrics .dashboard-metric strong,
.dashboard-metrics .dashboard-metric span {
    grid-column: 2;
}

.dashboard-metric strong,
.dashboard-metric span {
    display: block;
}

.dashboard-metrics .dashboard-metric:nth-child(1)::before { content: "🎯"; }
.dashboard-metrics .dashboard-metric:nth-child(2)::before { content: "❓"; }
.dashboard-metrics .dashboard-metric:nth-child(3)::before { content: "🎯"; }
.dashboard-metrics .dashboard-metric:nth-child(4)::before { content: "🔥"; }
.dashboard-metrics .dashboard-metric:nth-child(5)::before { content: "🕒"; }
.dashboard-metrics .dashboard-metric:nth-child(6)::before { content: "🏰"; }
.dashboard-metrics .dashboard-metric:nth-child(7)::before { content: "📄"; }
.dashboard-metrics .dashboard-metric:nth-child(8)::before { content: "✅"; }
.dashboard-metrics .dashboard-metric:nth-child(9)::before { content: "🏆"; }

.dashboard-metrics .dashboard-metric span::before {
    content: none !important;
}

.academy-metrics .dashboard-metric:nth-child(1) span::before { content: "❓ "; }
.academy-metrics .dashboard-metric:nth-child(2) span::before { content: "✅ "; }
.academy-metrics .dashboard-metric:nth-child(3) span::before { content: "🎯 "; }
.academy-metrics .dashboard-metric:nth-child(4) span::before { content: "🕒 "; }
.academy-metrics .dashboard-metric:nth-child(5) span::before { content: "🎯 "; }
.academy-metrics .dashboard-metric:nth-child(6) span::before { content: "🏰 "; }
.academy-metrics .dashboard-metric:nth-child(7) span::before { content: "🏆 "; }
.academy-metrics .dashboard-metric:nth-child(8) span::before { content: "👑 "; }

.academy-metrics .dashboard-metric span::before {
    display: inline-block;
    margin-right: 6px;
    font-size: 1.65rem;
    line-height: 1;
    vertical-align: middle;
    filter: drop-shadow(0 0 5px rgba(255, 215, 0, 0.42));
}

.dashboard-metric strong {
    color: #ffd700;
    font-size: 1.05rem;
}

.dashboard-metric span {
    margin-top: 5px;
    font-size: 0.74rem;
    line-height: 1.35;
}

.dashboard-domain-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    font-size: 0.82rem;
    line-height: 1.5;
}

.dashboard-domain-context {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-left: 3px solid var(--cert-accent, #00eaff);
    background: rgba(255, 255, 255, 0.035);
    font-size: 0.78rem;
    line-height: 1.45;
}

.dashboard-domain-context span,
.dashboard-intelligence-note,
.dashboard-priority-group > p,
.dashboard-objective-exam-row small {
    color: #b9c8d8;
}

.dashboard-training-intelligence {
    display: grid;
    gap: 10px;
}

.dashboard-intelligence-section,
.dashboard-world-details {
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--cert-accent, #00eaff) 55%, transparent);
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.28);
}

.dashboard-intelligence-section > summary,
.dashboard-world-details > summary {
    min-height: 44px;
    padding: 12px 14px;
    cursor: pointer;
    font-weight: 800;
    line-height: 1.4;
}

.dashboard-intelligence-section > summary { color: #fff0a6; }

.dashboard-world-details > summary {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    color: #dffcff;
    font-size: 0.82rem;
}

.dashboard-intelligence-section[open] > summary,
.dashboard-world-details[open] > summary {
    border-bottom: 1px solid rgba(0, 234, 255, 0.25);
}

.dashboard-intelligence-section > :not(summary) { margin-inline: 14px; }
.dashboard-intelligence-section > :last-child { margin-bottom: 14px; }
.dashboard-intelligence-section h4,
.dashboard-intelligence-section h5 { margin-block: 16px 8px; }

.dashboard-intelligence-note,
.dashboard-empty-state,
.dashboard-legacy-note,
.dashboard-study-areas {
    font-size: 0.76rem;
    line-height: 1.55;
}

.dashboard-legacy-note {
    padding: 10px;
    border: 1px solid rgba(255, 215, 0, 0.42);
    border-radius: 7px;
    background: rgba(255, 215, 0, 0.07);
    color: #fff0a6;
}

.dashboard-world-list,
.dashboard-evidence-list,
.dashboard-domain-results,
.dashboard-objective-exam-grid {
    display: grid;
    gap: 8px;
}

.dashboard-evidence-list,
.dashboard-objective-exam-grid { padding: 10px; }

.dashboard-reinforcement-grid,
.dashboard-exam-grid,
.dashboard-priority-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.dashboard-evidence-row,
.dashboard-exam-result,
.dashboard-domain-result,
.dashboard-objective-exam-row,
.dashboard-priority-group,
.dashboard-priority-row {
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(0, 234, 255, 0.24);
    border-radius: 7px;
    background: rgba(0, 234, 255, 0.045);
    font-size: 0.75rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.dashboard-evidence-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.dashboard-evidence-metrics,
.dashboard-priority-row { display: grid; gap: 4px; }

.dashboard-evidence-link {
    display: inline-block;
    margin-top: 8px;
    color: #7df9ff;
}

.dashboard-status {
    flex: 0 0 auto;
    padding: 2px 7px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 800;
}

.dashboard-status-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.dashboard-status.is-ready { color: #72ff9d; }
.dashboard-status.insufficient { color: #b9c8d8; }
.dashboard-status.needs-work,
.dashboard-domain-result.needs-study,
.dashboard-objective-exam-row.needs-study {
    color: #ffd166;
    border-color: rgba(255, 209, 102, 0.48);
}

.dashboard-exam-result,
.dashboard-domain-result,
.dashboard-objective-exam-row { display: grid; gap: 5px; }

.dashboard-priority-group > h5,
.dashboard-priority-group > p { margin: 0 0 7px; }

.dashboard-priority-group {
    display: grid;
    align-content: start;
    gap: 7px;
}

.dashboard-no-priority { color: #72ff9d; font-size: 0.74rem; }

.dashboard-achievements {
    display: flex;
    justify-content: center;
    gap: 12px;
    font-size: 1.8rem;
}

.dashboard-achievement {
    filter: grayscale(1);
    opacity: 0.28;
}

.dashboard-achievement.earned {
    filter: none;
    opacity: 1;
    text-shadow: 0 0 12px #ffd700;
}

.dashboard-enter,
.campaign-dashboard-link {
    align-self: center;
}

.dashboard-enter {
    width: min(100%, 440px);
    min-height: 66px;
    border-color: #ff00ff;
    font-size: 1.05rem;
    box-shadow: 0 0 14px rgba(255, 0, 255, 0.45);
}

.dashboard-enter::before {
    width: 2.75rem;
    height: 2.75rem;
    margin-right: 10px;
    filter: drop-shadow(0 0 7px var(--cert-accent, #00eaff));
}

.current-mission {
    margin: 20px 0 0;
    padding: 16px;
    border: 1px solid rgba(255, 215, 0, 0.65);
    border-radius: 10px;
    background: rgba(255, 215, 0, 0.06);
    color: #ffd700;
    text-align: center;
}

.current-mission .campaign-panel-label {
    display: block;
    margin-bottom: 8px;
}

.current-mission a {
    color: #fff;
    font-weight: bold;
}

.achievement-toast {
    position: fixed;
    z-index: 10000;
    right: 20px;
    bottom: 20px;
    max-width: min(360px, calc(100% - 40px));
    padding: 16px 18px;
    border: 2px solid #ffd700;
    border-radius: 10px;
    background: rgba(1, 12, 24, 0.98);
    color: #fff;
    box-shadow: 0 0 24px rgba(255, 215, 0, 0.48);
    text-align: center;
}

.achievement-toast strong,
.achievement-toast span {
    display: block;
}

.achievement-toast span {
    margin-top: 5px;
    color: #ffd700;
}

@media (max-width: 820px) {
    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .academy-metrics,
    .dashboard-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .command-center {
        width: min(100% - 20px, 1180px);
        padding-top: 22px;
    }

    .academy-summary,
    .dashboard-campaign-card {
        padding: 16px;
    }

    .academy-summary-heading,
    .dashboard-card-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .dashboard-domain-row {
        grid-template-columns: 1fr;
    }

    .dashboard-domain-context,
    .dashboard-evidence-heading,
    .dashboard-world-details > summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-reinforcement-grid,
    .dashboard-exam-grid,
    .dashboard-priority-grid { grid-template-columns: 1fr; }

    .dashboard-intelligence-section > summary,
    .dashboard-world-details > summary { padding: 12px 10px; }

    .dashboard-intelligence-section > :not(summary) { margin-inline: 10px; }
    .dashboard-evidence-list,
    .dashboard-objective-exam-grid { padding: 8px; }

    .dashboard-achievements {
        gap: 8px;
        font-size: 1.55rem;
    }

    .dashboard-metrics .dashboard-metric {
        grid-template-columns: 52px minmax(0, 1fr);
        min-height: 88px;
        padding: 10px 8px;
    }

    .dashboard-metrics .dashboard-metric::before {
        font-size: 2.15rem;
    }

    .academy-metrics .dashboard-metric span::before {
        margin-right: 4px;
        font-size: 1.45rem;
    }

    .dashboard-enter {
        min-height: 60px;
        font-size: 0.92rem;
    }
}

@media (max-width: 420px) {
    body[data-certification]:not(.certification-cabinet)::before {
        padding-inline: 8px;
        font-size: 0.68rem;
        letter-spacing: 0.045em;
    }

    .certification-cabinet-shell {
        width: min(100% - 20px, 700px);
        padding-top: 24px;
    }
}

/* ==========================
   REVIEW HUB & QUESTION FLAGS
   ========================== */

.flag-control-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 14px 0;
}

.flag-question-btn,
.favorite-question-btn,
.flag-remove-btn,
.review-back-button {
    border: 1px solid #ffd700;
    border-radius: 7px;
    background: rgba(0, 0, 0, 0.72);
    color: #ffd700;
    cursor: pointer;
    font: inherit;
}

.objective-quiz-return {
    display: inline-block;
    margin: 4px 0 16px;
    font-size: 0.78rem;
}

.objective-quiz-return.hidden {
    display: none;
}

.flag-question-btn {
    padding: 8px 12px;
    font-size: 0.82rem;
}

.favorite-question-btn {
    padding: 8px 12px;
    border-color: #ff8de8;
    color: #ffb8f0;
    font-size: 0.82rem;
}

.flag-question-btn:hover,
.flag-question-btn:focus-visible,
.flag-question-btn.is-flagged {
    background: rgba(255, 215, 0, 0.14);
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.42);
}

.favorite-question-btn:hover,
.favorite-question-btn:focus-visible,
.favorite-question-btn.is-favorite,
.flag-question-btn.is-favorite {
    border-color: #ff8de8;
    background: rgba(255, 141, 232, 0.14);
    color: #ffb8f0;
    box-shadow: 0 0 10px rgba(255, 141, 232, 0.42);
}

.review-hub-shell .world-intro-card {
    box-sizing: border-box;
    width: min(900px, 100%);
}

.review-category-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin: 24px 0;
}

.review-category {
    display: flex;
    min-width: 0;
    min-height: 112px;
    padding: 13px 8px;
    border: 1px solid rgba(0, 234, 255, 0.35);
    border-radius: 9px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: rgba(0, 0, 0, 0.48);
    color: #fff;
    cursor: pointer;
    font: inherit;
    text-align: center;
}

.review-category.active {
    border-color: #ffd700;
    box-shadow: 0 0 14px rgba(255, 215, 0, 0.3);
}

.review-category[aria-disabled="true"] {
    opacity: 0.52;
}

.review-category strong,
.review-category span {
    display: block;
}

.review-category span {
    font-size: 0.7rem;
}

.review-filter-bar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 18px 0;
}

.review-filter-bar label {
    color: #00eaff;
    font-size: 0.8rem;
    text-align: left;
}

.review-filter-bar select {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 10px;
    border: 1px solid #00eaff;
    border-radius: 6px;
    background: #06121f;
    color: #fff;
}

.review-summary,
.review-empty {
    text-align: center;
}

.flagged-question-list {
    display: grid;
    gap: 12px;
    margin: 18px 0 24px;
}

.flagged-question-card {
    padding: 16px;
    border: 1px solid rgba(0, 234, 255, 0.5);
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.5);
    text-align: left;
}

.review-source {
    color: #ffd700;
    font-size: 0.76rem;
    line-height: 1.45;
}

.review-reasons {
    margin: 10px 0;
    color: #8eeeff;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.45;
}

.session-history-card {
    padding: 16px;
    border: 1px solid rgba(255, 215, 0, 0.45);
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.5);
    text-align: left;
}

.session-history-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.session-history-heading h2 {
    margin: 0;
    font-size: 1rem;
}

.session-type-badge {
    padding: 5px 8px;
    border: 1px solid rgba(0, 234, 255, 0.55);
    border-radius: 999px;
    color: #8eeeff;
    font-size: 0.72rem;
    white-space: nowrap;
}

.session-history-result {
    color: #f5f7ff;
    font-weight: 700;
}

.session-repeat-link {
    display: inline-block;
    margin-top: 8px;
}

.adaptive-objective-card {
    padding: 16px;
    border: 1px solid rgba(0, 234, 255, 0.45);
    border-left: 4px solid #00eaff;
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.5);
    text-align: left;
}

.adaptive-objective-card.weak {
    border-left-color: #ff5c5c;
}

.adaptive-objective-card.improving {
    border-left-color: #ffd45c;
}

.adaptive-objective-card.stable {
    border-left-color: #55e68a;
}

.adaptive-allocation {
    margin: 10px 0 6px;
    color: #8eeeff;
    font-weight: 700;
}

.adaptive-reason {
    margin-bottom: 0;
    color: #e8e8e8;
    line-height: 1.55;
}

.recovery-progress {
  margin: 10px 0;
  color: #ffd166;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.flag-remove-btn {
    padding: 7px 10px;
}

#flaggedSession {
    padding: 20px;
    border: 1px solid rgba(0, 234, 255, 0.5);
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.4);
}

.review-feedback {
    min-height: 42px;
    margin: 18px 0;
    color: #ffd700;
    line-height: 1.55;
}

.review-back-button {
    display: inline-block;
    margin-top: 18px;
    padding: 8px 10px;
}

.weak-objective-card {
    padding: 20px;
    border: 1px solid rgba(0, 234, 255, 0.48);
    border-left-width: 4px;
    border-radius: 10px;
    background: linear-gradient(145deg, rgba(3, 14, 27, 0.94), rgba(0, 0, 0, 0.7));
    text-align: left;
}

.weak-objective-card.weak { border-left-color: #ff5d73; }
.weak-objective-card.improving { border-left-color: #ffd166; }
.weak-objective-card.stable { border-left-color: #5ee68a; }
.weak-objective-card.unassessed { border-left-color: #a7b3c3; }

.weak-objective-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.weak-objective-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1rem, 2vw, 1.3rem);
    line-height: 1.45;
}

.weak-status {
    flex: 0 0 auto;
    padding: 6px 9px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
}

.weak-status.weak { color: #ff8797; }
.weak-status.improving { color: #ffd166; }
.weak-status.stable { color: #70eda0; }
.weak-status.unassessed { color: #bdc7d4; }

.weak-evidence-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0;
}

.weak-evidence-line {
    display: flex;
    min-width: 0;
    min-height: 82px;
    padding: 11px;
    border: 1px solid rgba(0, 234, 255, 0.2);
    border-radius: 8px;
    flex-direction: column;
    gap: 5px;
    background: rgba(0, 0, 0, 0.38);
}

.weak-evidence-line span,
.weak-evidence-line small {
    color: #b9c8d8;
    font-size: 0.7rem;
    line-height: 1.4;
}

.weak-evidence-line strong {
    color: #00eaff;
    font-size: 1rem;
}

.weak-recovery-summary {
    margin: 12px 0;
    color: #70eda0;
    font-weight: 700;
}

.weak-ranking-reason {
    margin: 14px 0;
    padding: 13px;
    border-radius: 8px;
    background: rgba(255, 209, 102, 0.08);
}

.weak-ranking-reason strong { color: #ffd166; }
.weak-ranking-reason p { margin: 7px 0 0; line-height: 1.55; }
.weak-review-button { margin-top: 4px; }

@media (max-width: 760px) {
    .review-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .weak-evidence-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .review-hub-shell .world-intro-card {
        padding-inline: 14px;
    }

    .review-category-grid,
    .review-filter-bar {
        grid-template-columns: 1fr;
    }

    .review-category {
        min-height: 88px;
    }

    .weak-objective-heading {
        flex-direction: column;
    }

    .weak-evidence-grid {
        grid-template-columns: 1fr;
    }

    #flaggedSession {
        padding: 14px;
    }
}

/* ==========================
   PRACTICE EXAM TIMER
   ========================== */

.hydra-exam-awaiting-start .message-box,
.hydra-exam-awaiting-start .player-card,
.hydra-exam-awaiting-start .flag-control-row {
    display: none;
}

.hydra-exam-start,
.hydra-exam-timer,
.hydra-time-results {
    width: min(760px, calc(100% - 32px));
    margin: 18px auto;
    padding: 20px;
    box-sizing: border-box;
    border: 2px solid #ffd700;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.88);
    box-shadow: 0 0 18px rgba(255, 215, 0, 0.28);
    text-align: center;
}

.hydra-exam-start h2,
.hydra-time-results h3 {
    margin-top: 0;
    color: #ffd700;
}

.hydra-exam-certification {
    color: #00f7ff;
    font-size: 1.2rem;
    font-weight: 700;
}

.hydra-exam-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0;
}

.hydra-exam-details div {
    padding: 12px;
    border: 1px solid rgba(0, 247, 255, 0.45);
    border-radius: 8px;
}

.hydra-exam-details dt {
    color: #00f7ff;
    font-size: 0.85rem;
}

.hydra-exam-details dd {
    margin: 6px 0 0;
    color: #fff;
    font-weight: 700;
}

.hydra-exam-notice {
    color: #ffd700;
}

.hydra-overtime-option,
.hydra-training-pause-option {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    max-width: 620px;
    margin: 18px auto;
    padding: 14px;
    border: 1px solid rgba(255, 0, 85, 0.55);
    border-radius: 8px;
    text-align: left;
    cursor: pointer;
}

.hydra-overtime-option input,
.hydra-training-pause-option input {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
}

.hydra-training-pause-option {
    border-color: rgba(0, 247, 255, 0.55);
}

.hydra-exam-start .link-btn {
    width: min(280px, 100%);
    min-height: 48px;
}

.hydra-exam-timer {
    position: sticky;
    top: 10px;
    z-index: 20;
    padding: 12px 18px;
}

.hydra-timer-label,
#hydraTimerValue {
    display: inline-block;
    color: #ffd700;
    font-weight: 700;
}

#hydraTimerValue {
    margin-left: 8px;
    font-size: 1.35rem;
    font-variant-numeric: tabular-nums;
}

.hydra-timer-message {
    min-height: 1.25em;
    margin: 7px 0 0;
    font-weight: 700;
}

.hydra-timer-actions,
.hydra-confirm-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 10px;
}

.hydra-timer-control {
    min-height: 44px;
    padding: 9px 14px;
    border: 1px solid #00f7ff;
    border-radius: 7px;
    background: rgba(0, 0, 0, 0.82);
    color: #00f7ff;
    cursor: pointer;
    font: inherit;
}

.hydra-timer-control:hover,
.hydra-timer-control:focus-visible {
    background: rgba(0, 247, 255, 0.13);
    box-shadow: 0 0 10px rgba(0, 247, 255, 0.45);
}

.hydra-timer-control.is-danger {
    border-color: #ff5f7f;
    color: #ff8aa2;
}

.hydra-exam-paused {
    overflow: hidden;
}

.hydra-pause-overlay,
.hydra-confirm-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 16px;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.94);
}

.hydra-pause-card,
.hydra-confirm-card {
    width: min(560px, 100%);
    padding: 26px;
    box-sizing: border-box;
    border: 2px solid #ffd700;
    border-radius: 12px;
    background: #110020;
    box-shadow: 0 0 28px rgba(255, 215, 0, 0.45);
    text-align: center;
}

.hydra-pause-card h2,
.hydra-confirm-card h2 {
    margin-top: 0;
    color: #ffd700;
}

.hydra-pause-card .link-btn {
    width: min(260px, 100%);
    min-height: 48px;
}

.hydra-pause-overlay.hidden,
.hydra-confirm-overlay.hidden {
    display: none;
}

.hydra-exam-timer.is-warning {
    border-color: #ff8c00;
    box-shadow: 0 0 18px rgba(255, 140, 0, 0.55);
}

.hydra-exam-timer.is-expired,
.hydra-exam-timer.is-overtime {
    border-color: #ff305f;
    box-shadow: 0 0 18px rgba(255, 48, 95, 0.65);
}

.hydra-exam-timer.is-expired #hydraTimerValue,
.hydra-exam-timer.is-overtime .hydra-timer-label,
.hydra-exam-timer.is-overtime #hydraTimerValue,
.hydra-time-limit-notice {
    color: #ff5f7f;
}

.hydra-time-results p {
    margin: 8px 0;
}

.hydra-performance-results {
    width: min(760px, calc(100% - 32px));
    margin: 18px auto;
    padding: 20px;
    box-sizing: border-box;
    border: 2px solid #00f7ff;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.88);
    box-shadow: 0 0 18px rgba(0, 247, 255, 0.24);
    text-align: left;
}

.hydra-performance-results h3,
.hydra-performance-results h4 {
    color: #00f7ff;
    text-align: center;
}

.hydra-result-overview {
    text-align: center;
}

.hydra-domain-results {
    display: grid;
    gap: 8px;
    margin: 14px 0;
}

.hydra-domain-result {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(0, 247, 255, 0.4);
    border-radius: 7px;
}

.hydra-domain-result dt {
    min-width: 0;
    overflow-wrap: anywhere;
}

.hydra-domain-result dd {
    margin: 0;
    color: #ffd700;
    font-weight: 700;
    white-space: nowrap;
}

.hydra-study-areas {
    overflow-wrap: anywhere;
}

.hydra-previous-result {
    margin-top: 18px;
}

.hydra-previous-result > summary {
    color: #00f7ff;
    cursor: pointer;
    font-weight: 700;
}

@media (max-width: 600px) {
    .hydra-exam-details {
        grid-template-columns: 1fr;
    }

    .hydra-exam-start,
    .hydra-exam-timer,
    .hydra-time-results,
    .hydra-performance-results {
        width: calc(100% - 20px);
        padding: 16px;
    }

    .hydra-domain-result {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .hydra-domain-result dd {
        white-space: normal;
    }

    .hydra-exam-timer {
        top: 4px;
    }

    .hydra-timer-label,
    #hydraTimerValue {
        display: block;
        margin-left: 0;
    }
}

/* Learner-declared certification completion pathway */
.already-certified-slot {
    display: grid;
    gap: 10px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid color-mix(in srgb, var(--cert-accent, #00eaff) 38%, transparent);
}

.already-certified-record-action,
.already-certified-card-actions button {
    width: fit-content;
    padding: 4px 0;
    color: #9eeeff;
    background: none;
    border: 0;
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.already-certified-record-action:hover,
.already-certified-record-action:focus-visible,
.already-certified-card-actions button:hover,
.already-certified-card-actions button:focus-visible {
    color: #fff1a8;
    outline: 2px solid #ffd700;
    outline-offset: 3px;
}

.already-certified-recorded {
    display: grid;
    gap: 5px;
    padding: 13px 14px;
    color: #dffaff;
    background: rgba(0, 234, 255, 0.08);
    border: 1px solid rgba(0, 234, 255, 0.38);
    border-radius: 9px;
}

.already-certified-recorded strong {
    color: #8ff7d2;
}

.already-certified-recorded span,
.already-certified-recorded small {
    color: #b8cbd7;
}

.already-certified-card-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 3px;
}

.already-certified-dialog {
    box-sizing: border-box;
    width: min(calc(100% - 28px), 620px);
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    overflow: auto;
    overflow-x: hidden;
    padding: clamp(22px, 5vw, 38px);
    color: #e8fbff;
    background: linear-gradient(160deg, #07192a, #020811 74%);
    border: 1px solid rgba(0, 234, 255, 0.72);
    border-radius: 14px;
    box-shadow: 0 0 42px rgba(0, 234, 255, 0.2), 0 30px 80px rgba(0, 0, 0, 0.78);
}

.already-certified-dialog::backdrop {
    background: rgba(0, 3, 10, 0.82);
    backdrop-filter: blur(4px);
}

.already-certified-dialog h2 {
    margin: 8px 0 14px;
    color: #ffd76a;
    line-height: 1.15;
}

.already-certified-trust-note {
    padding: 12px 14px;
    color: #bfd3df;
    background: rgba(255, 215, 106, 0.07);
    border-left: 3px solid #ffd76a;
    line-height: 1.5;
}

.already-certified-date-label {
    display: grid;
    gap: 8px;
    margin: 18px 0 8px;
    color: #dffaff;
    font-weight: 700;
}

.already-certified-date-label input {
    box-sizing: border-box;
    width: 100%;
    min-height: 46px;
    padding: 9px 11px;
    color: #f5fdff;
    color-scheme: dark;
    background: #061321;
    border: 1px solid rgba(0, 234, 255, 0.62);
    border-radius: 7px;
    font: inherit;
}

.already-certified-honor {
    display: grid;
    gap: 10px;
    margin: 18px 0 8px;
    padding: 14px;
    color: #dffaff;
    background: rgba(0, 234, 255, 0.055);
    border: 1px solid rgba(0, 234, 255, 0.34);
    border-radius: 9px;
}

.already-certified-honor legend {
    padding: 0 7px;
    color: #ffd76a;
    font-weight: 800;
}

.already-certified-honor p {
    margin: 0;
    color: #bfd3df;
    line-height: 1.5;
}

.already-certified-honor label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    cursor: pointer;
    line-height: 1.45;
}

.already-certified-honor input {
    width: 20px;
    height: 20px;
    margin: 1px 0 0;
    accent-color: #00eaff;
}

.already-certified-error {
    min-height: 1.4em;
    margin: 8px 0;
    color: #ff9a9a;
    font-weight: 700;
}

.already-certified-dialog-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
}

.already-certified-dialog-actions .link-btn {
    min-height: 46px;
    margin: 0;
}

.already-certified-dialog-actions .danger {
    color: #fff;
    background: linear-gradient(180deg, #b83246, #781a2a);
    border-color: #ff8494;
}

@media (max-width: 390px) {
    .already-certified-record-action {
        width: 100%;
        min-height: 44px;
        text-align: left;
    }

    .already-certified-card-actions button {
        min-height: 44px;
        padding-inline: 3px;
    }

    .already-certified-dialog {
        width: calc(100% - 20px);
        padding: 22px 16px;
    }

    .already-certified-dialog-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .already-certified-dialog-actions .link-btn {
        width: 100%;
    }

    .already-certified-honor {
        padding: 12px;
    }
}