/* ACE Prelaunch landing page
   Built from the existing ACE space/orbit visual language and repository assets. */

:root {
    --ace-blue: #2176ff;
    --ace-blue-soft: #65a6ff;
    --ace-gold: #f5c451;
    --ace-ink: #f7f9ff;
    --ace-muted: #aebbd6;
    --ace-panel: rgba(11, 18, 43, 0.72);
    --ace-panel-strong: rgba(10, 16, 38, 0.92);
    --ace-line: rgba(143, 179, 255, 0.22);
    --ace-space: #040611;
    --ace-space-2: #0a1025;
}

* { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    background: var(--ace-space);
}

body.ace-prelaunch-page {
    margin: 0;
    min-height: 100vh;
    color: var(--ace-ink);
    background:
        radial-gradient(circle at 16% 16%, rgba(33, 118, 255, 0.16), transparent 28%),
        radial-gradient(circle at 84% 23%, rgba(124, 77, 255, 0.12), transparent 30%),
        linear-gradient(180deg, #03050d 0%, #080d1f 48%, #050815 100%);
    overflow-x: hidden;
    font-family: Inter, Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.ace-space-field,
.ace-space-field::before,
.ace-space-field::after {
    position: fixed;
    inset: 0;
    pointer-events: none;
}

.ace-space-field {
    z-index: 0;
    opacity: .95;
    background-image:
        radial-gradient(1px 1px at 10% 20%, rgba(255,255,255,.9), transparent),
        radial-gradient(2px 2px at 15% 45%, rgba(255,255,255,.55), transparent),
        radial-gradient(1px 1px at 25% 70%, rgba(255,255,255,.42), transparent),
        radial-gradient(2px 2px at 35% 15%, rgba(255,255,255,.8), transparent),
        radial-gradient(1px 1px at 42% 88%, rgba(255,255,255,.5), transparent),
        radial-gradient(1px 1px at 55% 33%, rgba(255,255,255,.7), transparent),
        radial-gradient(2px 2px at 68% 62%, rgba(255,255,255,.9), transparent),
        radial-gradient(1px 1px at 73% 8%, rgba(255,255,255,.4), transparent),
        radial-gradient(1px 1px at 82% 95%, rgba(255,255,255,.6), transparent),
        radial-gradient(2px 2px at 91% 42%, rgba(255,255,255,.8), transparent),
        radial-gradient(1px 1px at 8% 55%, rgba(255,255,255,.5), transparent),
        radial-gradient(1px 1px at 94% 78%, rgba(255,255,255,.7), transparent);
    background-size: 300px 300px, 400px 400px, 250px 250px, 350px 350px,
                     280px 280px, 320px 320px, 380px 380px, 290px 290px,
                     340px 340px, 310px 310px, 270px 270px, 360px 360px;
    animation: aceTwinkle 6s ease-in-out infinite;
}

.ace-space-field::before {
    content: "";
    opacity: .34;
    background: url("../images/galaxy/img-1.png") center 18% / min(1000px, 85vw) auto no-repeat;
    mix-blend-mode: screen;
    filter: saturate(1.25) contrast(1.06);
}

.ace-space-field::after {
    content: "";
    background:
        radial-gradient(circle at 45% 22%, rgba(73, 57, 181, .12), transparent 28%),
        radial-gradient(circle at 76% 72%, rgba(33, 118, 255, .12), transparent 30%);
}

@keyframes aceTwinkle {
    0%, 100% { opacity: .72; }
    50% { opacity: 1; }
}

.ace-page-shell {
    position: relative;
    z-index: 2;
}

.ace-navbar {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1000;
    background: linear-gradient(180deg, rgba(3, 6, 17, .94), rgba(3, 6, 17, .68));
    border-bottom: 1px solid rgba(150, 180, 255, .12);
    backdrop-filter: blur(18px);
}

.ace-navbar .container {
    min-height: 76px;
}

.ace-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: #fff;
    text-decoration: none;
    font-weight: 800;
    letter-spacing: .04em;
}

.ace-brand img {
    width: 58px;
    height: 54px;
    object-fit: contain;
    filter: drop-shadow(0 0 16px rgba(33,118,255,.35));
}

.ace-brand-word {
    font-size: 1.22rem;
}


.ace-prelaunch-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid rgba(245, 196, 81, .34);
    border-radius: 999px;
    color: #ffe29c;
    background: rgba(245, 196, 81, .08);
    font-size: .72rem;
    letter-spacing: .1em;
    font-weight: 800;
}

.ace-prelaunch-pill::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ace-gold);
    box-shadow: 0 0 12px rgba(245, 196, 81, .95);
}

.ace-nav-link {
    color: #c9d5ed;
    text-decoration: none;
    font-size: .92rem;
    font-weight: 600;
    transition: color .2s ease;
}

.ace-nav-link:hover { color: #fff; }

.ace-button,
.ace-button-outline,
.ace-icon-button {
    border-radius: 12px;
    border: 1px solid transparent;
    text-decoration: none;
    font-weight: 750;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}

.ace-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 12px 19px;
    color: #fff;
    background: linear-gradient(135deg, var(--ace-blue), #5e78ff);
    box-shadow: 0 10px 30px rgba(33, 118, 255, .28);
}

.ace-button:hover {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(33, 118, 255, .4);
}

.ace-button-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 18px;
    color: #d9e5ff;
    background: rgba(255,255,255,.035);
    border-color: rgba(153, 182, 245, .2);
}

.ace-button-outline:hover {
    color: #fff;
    border-color: rgba(153, 182, 245, .42);
    background: rgba(255,255,255,.065);
    transform: translateY(-2px);
}

.ace-icon-button {
    width: 43px;
    height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #dce7ff;
    background: rgba(255,255,255,.045);
    border-color: rgba(153, 182, 245, .18);
    cursor: pointer;
}

.ace-icon-button:hover {
    color: #fff;
    background: rgba(255,255,255,.09);
    border-color: rgba(153, 182, 245, .38);
}

.ace-hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 118px 0 68px;
    position: relative;
}

.ace-hero-copy {
    max-width: 650px;
}

.ace-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #d9e5ff;
    font-size: .82rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.ace-eyebrow::before {
    content: "";
    width: 28px;
    height: 2px;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--ace-gold), var(--ace-blue));
    box-shadow: 0 0 10px rgba(33,118,255,.5);
}

.ace-hero h1 {
    margin: 0;
    font-size: clamp(3.1rem, 6vw, 6.2rem);
    line-height: .94;
    letter-spacing: -.055em;
    font-weight: 850;
    max-width: 820px;
}

.ace-hero h1 .accent {
    display: block;
    color: transparent;
    background: linear-gradient(100deg, #fff 0%, #95c5ff 48%, #f5d277 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

.ace-hero-copy > p {
    max-width: 620px;
    margin: 26px 0 0;
    font-size: 1.08rem;
    line-height: 1.78;
    color: var(--ace-muted);
}

.ace-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.ace-status-row {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.ace-status-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border-radius: 999px;
    color: #bac9e7;
    border: 1px solid rgba(153,182,245,.13);
    background: rgba(255,255,255,.03);
    font-size: .78rem;
}

.ace-status-chip i {
    color: var(--ace-gold);
}

/* Universe / Caribbean orbit. The proportions and speeds mirror the existing
   account/base_auth.html ecosystem. */
.ace-universe-wrap {
    position: relative;
    min-height: 690px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ace-ecosystem {
    position: relative;
    width: 700px;
    height: 700px;
    transform: scale(.88);
    transform-origin: center;
}

.ace-orbit-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    pointer-events: none;
    border: 2px solid rgba(138,180,248,.30);
    box-shadow: 0 0 28px rgba(138,180,248,.14), inset 0 0 20px rgba(138,180,248,.06);
}

.ace-orbit-ring::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 1px dashed rgba(200,180,255,.22);
}

.ace-orbit-ring.r1 { width: 300px; height: 300px; }
.ace-orbit-ring.r2 { width: 450px; height: 450px; }
.ace-orbit-ring.r3 { width: 600px; height: 600px; }
.ace-orbit-ring.r4 { width: 760px; height: 760px; }

.ace-core {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 190px;
    height: 190px;
    margin: -95px 0 0 -95px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    z-index: 20;
    background:
        radial-gradient(circle, rgba(255,223,118,.34) 0%, rgba(57,107,255,.16) 43%, transparent 70%);
    animation: aceCorePulse 3.4s ease-in-out infinite;
}

.ace-core img {
    width: 96px;
    height: 96px;
    object-fit: contain;
    filter: drop-shadow(0 0 22px rgba(128,183,255,.55));
}

.ace-core-label {
    position: absolute;
    bottom: 23px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    font-size: .7rem;
    font-weight: 850;
    letter-spacing: .16em;
    color: #dce7ff;
}

@keyframes aceCorePulse {
    0%, 100% {
        box-shadow: 0 0 32px rgba(255,200,100,.24), 0 0 72px rgba(52,113,255,.10);
    }
    50% {
        box-shadow: 0 0 54px rgba(255,200,100,.44), 0 0 105px rgba(52,113,255,.24);
    }
}

.ace-orbit {
    position: absolute;
    inset: 0;
}

.ace-orbit.o1 { animation: aceOrbit 20s linear infinite; }
.ace-orbit.o2 { animation: aceOrbit 32s linear infinite; }
.ace-orbit.o3 { animation: aceOrbit 48s linear infinite; }
.ace-orbit.o4 { animation: aceOrbit 65s linear infinite; }

@keyframes aceOrbit {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.ace-node {
    position: absolute;
    top: 50%;
    left: 50%;
    transform-origin: 0 0;
}

.ace-orbit.o1 .ace-node:nth-child(1) { transform: rotate(0deg) translateX(150px); }
.ace-orbit.o1 .ace-node:nth-child(2) { transform: rotate(90deg) translateX(150px); }
.ace-orbit.o1 .ace-node:nth-child(3) { transform: rotate(180deg) translateX(150px); }
.ace-orbit.o1 .ace-node:nth-child(4) { transform: rotate(270deg) translateX(150px); }

.ace-orbit.o2 .ace-node:nth-child(1) { transform: rotate(45deg) translateX(225px); }
.ace-orbit.o2 .ace-node:nth-child(2) { transform: rotate(135deg) translateX(225px); }
.ace-orbit.o2 .ace-node:nth-child(3) { transform: rotate(225deg) translateX(225px); }
.ace-orbit.o2 .ace-node:nth-child(4) { transform: rotate(315deg) translateX(225px); }

.ace-orbit.o3 .ace-node:nth-child(1) { transform: rotate(22.5deg) translateX(300px); }
.ace-orbit.o3 .ace-node:nth-child(2) { transform: rotate(112.5deg) translateX(300px); }
.ace-orbit.o3 .ace-node:nth-child(3) { transform: rotate(202.5deg) translateX(300px); }
.ace-orbit.o3 .ace-node:nth-child(4) { transform: rotate(292.5deg) translateX(300px); }

.ace-orbit.o4 .ace-node:nth-child(1) { transform: rotate(67.5deg) translateX(380px); }
.ace-orbit.o4 .ace-node:nth-child(2) { transform: rotate(157.5deg) translateX(380px); }
.ace-orbit.o4 .ace-node:nth-child(3) { transform: rotate(247.5deg) translateX(380px); }
.ace-orbit.o4 .ace-node:nth-child(4) { transform: rotate(337.5deg) translateX(380px); }

.ace-node-lock {
    position: absolute;
    top: -24px;
    left: -24px;
    width: 48px;
    height: 48px;
}

.ace-orbit.o1 .ace-node-lock { animation: aceCounter 20s linear infinite; }
.ace-orbit.o2 .ace-node-lock { animation: aceCounter 32s linear infinite; }
.ace-orbit.o3 .ace-node-lock { animation: aceCounter 48s linear infinite; }
.ace-orbit.o4 .ace-node-lock { animation: aceCounter 65s linear infinite; }

@keyframes aceCounter {
    from { transform: rotate(0deg); }
    to { transform: rotate(-360deg); }
}

.ace-flag {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid rgba(255,255,255,.65);
    background: #10182d;
    box-shadow: 0 0 16px rgba(112,166,255,.38), 0 0 32px rgba(112,166,255,.14);
    transition: transform .25s ease, box-shadow .25s ease;
}

.ace-flag:hover {
    transform: scale(1.16);
    box-shadow: 0 0 24px rgba(255,255,255,.5), 0 0 46px rgba(112,166,255,.38);
}

.ace-flag img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Sections */
.ace-section {
    position: relative;
    padding: 104px 0;
}

.ace-section-heading {
    max-width: 720px;
    margin-bottom: 38px;
}

.ace-kicker {
    color: #87baff;
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.ace-section h2 {
    margin: 11px 0 0;
    font-size: clamp(2rem, 4vw, 3.55rem);
    line-height: 1.08;
    letter-spacing: -.035em;
    font-weight: 830;
}

.ace-section-heading p,
.ace-map-copy p,
.ace-access-copy p {
    color: var(--ace-muted);
    line-height: 1.75;
    margin-top: 15px;
}

.ace-glass-panel {
    border: 1px solid var(--ace-line);
    background:
        linear-gradient(180deg, rgba(18,30,67,.62), rgba(8,13,31,.76));
    backdrop-filter: blur(16px);
    border-radius: 28px;
    box-shadow: 0 30px 90px rgba(0,0,0,.28);
}

.ace-feature-card {
    height: 100%;
    padding: 25px;
    border: 1px solid rgba(149,179,244,.15);
    border-radius: 20px;
    background: rgba(10,17,38,.58);
    transition: transform .22s ease, border-color .22s ease, background .22s ease;
}

.ace-feature-card:hover {
    transform: translateY(-4px);
    border-color: rgba(149,179,244,.32);
    background: rgba(14,24,53,.72);
}

.ace-feature-icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 1.35rem;
    margin-bottom: 18px;
    background: linear-gradient(145deg, rgba(33,118,255,.9), rgba(101,84,255,.78));
    box-shadow: 0 9px 28px rgba(33,118,255,.24);
}

.ace-feature-card h3 {
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0 0 10px;
}

.ace-feature-card p {
    margin: 0;
    color: #aebbd6;
    font-size: .92rem;
    line-height: 1.65;
}

/* Map */
.ace-map-grid {
    display: grid;
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
    gap: 42px;
    align-items: center;
}

.ace-map-copy {
    padding: 10px 0 10px 10px;
}

.ace-map-copy h2 {
    margin-top: 11px;
}

.ace-territory-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 24px;
}

.ace-territory-list span {
    padding: 7px 10px;
    border-radius: 999px;
    font-size: .76rem;
    color: #cbd9f4;
    background: rgba(255,255,255,.035);
    border: 1px solid rgba(153,182,245,.13);
}

.ace-map-shell {
    position: relative;
    min-height: 500px;
    overflow: hidden;
    padding: 18px;
}

.ace-map-shell::before {
    content: "";
    position: absolute;
    inset: 12% 15%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(33,118,255,.17), transparent 68%);
    filter: blur(6px);
    pointer-events: none;
}

#ace-caribbean-map {
    position: relative;
    z-index: 2;
    height: 465px;
    width: 100%;
}

.jvm-tooltip {
    background: #0c1733 !important;
    border: 1px solid rgba(149,179,244,.24);
    border-radius: 9px !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.28);
}

/* Access */
.ace-access-panel {
    padding: clamp(28px, 5vw, 58px);
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) auto;
    gap: 32px;
    align-items: center;
    overflow: hidden;
    position: relative;
}

.ace-access-panel::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    right: -160px;
    top: -180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(33,118,255,.28), transparent 67%);
    pointer-events: none;
}

.ace-access-copy {
    position: relative;
    z-index: 2;
    max-width: 710px;
}

.ace-access-copy h2 {
    margin-bottom: 0;
}

.ace-access-actions {
    position: relative;
    z-index: 2;
    min-width: 200px;
}

.ace-access-actions .ace-button {
    width: 100%;
    min-height: 50px;
}

.ace-prelaunch-note {
    margin-top: 14px;
    color: #94a3c2;
    font-size: .78rem;
    line-height: 1.55;
}

.ace-footer {
    position: relative;
    padding: 38px 0 42px;
    color: #8090ae;
    border-top: 1px solid rgba(149,179,244,.10);
    font-size: .84rem;
}

.ace-footer strong {
    color: #dce7ff;
}

@media (max-width: 1199.98px) {
    .ace-ecosystem { transform: scale(.72); }
    .ace-universe-wrap { min-height: 575px; }
}

@media (max-width: 991.98px) {
    .ace-navbar .ace-nav-link { display: none; }

    .ace-hero {
        padding-top: 130px;
        text-align: center;
    }

    .ace-hero-copy {
        margin: 0 auto;
    }

    .ace-hero-actions,
    .ace-status-row {
        justify-content: center;
    }

    .ace-universe-wrap {
        min-height: 560px;
        margin-top: 14px;
    }

    .ace-ecosystem { transform: scale(.66); }

    .ace-map-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .ace-map-copy {
        padding: 0;
    }

    .ace-access-panel {
        grid-template-columns: 1fr;
    }

    .ace-access-actions {
        width: min(100%, 320px);
    }
}

@media (max-width: 575.98px) {
    .ace-navbar .container { min-height: 68px; }
    .ace-prelaunch-pill { display: none; }
    .ace-brand-word { font-size: 1.05rem; }

    .ace-hero {
        min-height: auto;
        padding: 112px 0 32px;
    }

    .ace-hero h1 {
        font-size: clamp(2.8rem, 15vw, 4.1rem);
    }

    .ace-universe-wrap {
        min-height: 420px;
        overflow: hidden;
    }

    .ace-ecosystem { transform: scale(.47); }

    .ace-section {
        padding: 76px 0;
    }

    .ace-map-shell {
        min-height: 390px;
        padding: 9px;
        border-radius: 20px;
    }

    #ace-caribbean-map {
        height: 370px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .ace-space-field,
    .ace-orbit,
    .ace-node-lock,
    .ace-core {
        animation: none !important;
    }
}

/* Hosted prelaunch integration: retain the ACE-3 design while keeping the
   complete orbit visible and the map controls usable on smaller screens. */
.ace-universe-wrap {min-height: 0; height: 580px; margin: 0; overflow: hidden;}
.ace-ecosystem {flex: 0 0 700px; transform: scale(var(--universe-scale, .64));}
.ace-hero h1 {line-height: 1.06;}
.ace-prelaunch-pill, .ace-core-label {font-size: .75rem;}
.ace-status-chip, .ace-kicker, .ace-eyebrow, .ace-territory-list span, .ace-prelaunch-note {font-size: .875rem;}
.ace-map-shell {padding-top: 24px;}
.ace-map-chooser {position: relative; z-index: 3; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: .875rem; font-weight: 600;}
.ace-map-chooser select {flex: 1; min-width: 180px; width: 100%; color: #f7f9ff; background: #101d3d; border: 1px solid #60759e; border-radius: 8px; padding: 10px; font: inherit;}
.jvm-zoom-btn {width: 32px; height: 32px; line-height: 32px; font-size: 22px; background: #2176ff; border-radius: 6px;}
.jvm-zoomout {top: 48px;}
a:focus-visible, button:focus-visible, select:focus-visible, [role="button"]:focus-visible {outline: 3px solid #f5c451; outline-offset: 4px;}
.ace-skip-link {position: absolute; top: -80px; left: 16px; z-index: 2000; background: #fff; color: #040611; padding: 12px 20px;}
.ace-skip-link:focus {top: 10px;}
.ace-motion-paused .ace-space-field, .ace-motion-paused .ace-orbit, .ace-motion-paused .ace-node-lock, .ace-motion-paused .ace-core {animation-play-state: paused;}
#caribbean, #access {scroll-margin-top: 76px;}
@media (max-width: 575.98px) {
 .ace-navbar .container {padding: 0 16px; gap: 10px!important;}
 .ace-navbar .ace-brand {gap: 5px;}
 .ace-navbar .ace-brand img {width: 44px; height: 41px;}
 .ace-nav-signin {padding: 10px 12px; font-size: .875rem;}
 .ace-icon-button {width: 36px; height: 40px;}
 .ace-nav-signin i {display: none;}
 .ace-hero h1 {font-size: clamp(2.5rem, 12vw, 4.1rem);}
 .ace-hero .container {padding-left: 20px; padding-right: 20px;}
}
@media (prefers-reduced-motion: reduce) {#ace-motion-toggle {display:none;}}

body.ace-prelaunch-page {--bs-heading-color: #f7f9ff; --bs-body-color: #f7f9ff; --bs-body-font-size: 1rem; font-size: 1rem;}
.ace-button, .ace-button-outline {font-size: 1rem;}
.ace-space-field::before {-webkit-mask-image: radial-gradient(ellipse 54% 44% at 50% 38%, #000 32%, transparent 94%); mask-image: radial-gradient(ellipse 54% 44% at 50% 38%, #000 32%, transparent 94%);}
.jvm-zoom-btn {display: grid; place-items: center; padding: 0; line-height: 1;}
.jvm-zoom-btn.jvm-zoomout {top: 50px;}
@keyframes aceCounter {
 from {transform: rotate(var(--flag-unspin, 0deg));}
 to {transform: rotate(calc(var(--flag-unspin, 0deg) - 360deg));}
}
@media (prefers-reduced-motion: reduce) {.ace-node-lock {transform: rotate(var(--flag-unspin, 0deg));}}

.ace-hero h1, .ace-section h2, .ace-feature-card h3 {color: #f7f9ff;}

/* Compact prelaunch entrance. Content can reflow when text is enlarged. */
.ace-page-shell {min-height: 100svh; display: grid; grid-template-rows: auto 1fr auto;}
.ace-navbar {position: relative; inset: auto;}
.ace-navbar .container {min-height: 72px;}
.ace-landing-main {display: flex; min-width: 0; outline: none;}
.ace-hero {width: 100%; min-height: 0; padding: 24px 0;}
.ace-landing-grid {display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 32px;}
.ace-hero-copy {max-width: 580px;}
.ace-eyebrow {margin-bottom: 12px; font-size: .875rem;}
.ace-hero h1 {font-size: clamp(2rem, 3.8vw, 3.5rem); line-height: 1.12; margin: 0;}
.ace-hero h1 .accent {display: block; font-size: clamp(3.8rem, 7vw, 6.4rem); line-height: 1.05;}
.ace-hero-copy > p {margin-top: 18px; font-size: 1.0625rem; line-height: 1.5; max-width: 430px;}
.ace-hero-actions {margin-top: 20px;}
.ace-universe-column {min-width: 0; align-self: stretch; display: flex; align-items: center;}
.ace-universe-wrap {width: 100%; height: min(600px, calc(100svh - 150px)); min-height: 0; margin: 0; overflow: hidden;}
.ace-creator-card {margin-top: 28px; padding: 20px 22px; border: 1px solid rgba(245,196,81,.28); border-radius: 18px; background: linear-gradient(135deg,rgba(26,35,64,.84),rgba(10,17,38,.88)); text-align: left;}
.ace-creator-heading {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px;}
.ace-creator-heading h2 {margin: 0; font-size: 1.25rem; line-height: 1.25; color: #f7f9ff; font-weight: 750; letter-spacing: -.02em;}
.ace-coming-soon {color: #ffe29c; background: rgba(245,196,81,.09); border: 1px solid rgba(245,196,81,.25); border-radius: 99px; padding: 4px 10px; font-size: .875rem; line-height: 1.3; white-space: nowrap;}
.ace-creator-card p {margin: 12px 0 0; color: #e4eafa; font-size: 1rem; line-height: 1.5;}
.ace-creator-card .ace-creator-note {font-size: .875rem; line-height: 1.4; color: #aebbd6; margin-top: 10px;}
.ace-footer {padding: 12px 0; font-size: .875rem;}
.ace-footer-row {display: flex; justify-content: space-between; align-items: center; gap: 8px 16px;}
@media (max-width: 991.98px) {
 .ace-landing-grid {grid-template-columns: 1.15fr 1fr; gap: 16px;}
 .ace-hero {text-align: left;}
 .ace-hero-copy {margin: 0;}
 .ace-hero-actions {justify-content: flex-start;}
 .ace-universe-wrap {height: min(500px, calc(100svh - 140px));}
 .ace-creator-card {padding: 18px;}
}
@media (max-width: 767.98px) {
 .ace-navbar .container {min-height: 64px;}
 .ace-landing-grid {grid-template-columns: 1fr; max-width: 560px;}
 .ace-universe-column {display: none;}
 .ace-hero {padding: 20px 0;}
 .ace-hero-copy {max-width: none;}
 .ace-hero h1 {font-size: clamp(2rem, 6vw, 2.6rem);}
 .ace-hero h1 .accent {font-size: clamp(3.5rem, 11vw, 4.5rem);}
 .ace-hero-copy > p {margin-top: 12px;}
 .ace-hero-actions {margin-top: 16px;}
 .ace-creator-card {margin-top: 24px;}
 .ace-footer-row {flex-wrap: wrap; font-size: .875rem;}
 .ace-footer-row > span:first-child {display: none;}
 .ace-footer {padding: 10px 0;}
}
@media (max-width: 767.98px) and (max-height: 680px) {
 .ace-hero {padding: 10px 0;}
 .ace-eyebrow {font-size: .875rem; letter-spacing: .05em; margin-bottom: 8px;}
 .ace-hero h1 {font-size: 2rem;}
 .ace-hero h1 .accent {font-size: 3.5rem;}
 .ace-hero-copy > p {font-size: 1rem; line-height: 1.4; margin-top: 8px;}
 .ace-hero-actions {margin-top: 12px;}
 .ace-hero-actions .ace-button {padding: 10px 16px;}
 .ace-creator-card {margin-top: 16px; padding: 14px;}
 .ace-creator-card p {margin-top: 8px; line-height: 1.4;}
 .ace-creator-heading h2 {font-size: 1.125rem;}
 .ace-coming-soon {padding: 3px 8px;}
}
@media (min-width: 768px) and (max-height: 650px) {
 .ace-navbar .container {min-height: 60px;}
 .ace-hero {padding: 14px 0;}
 .ace-hero h1 {font-size: 2rem;}
 .ace-hero h1 .accent {font-size: 3.8rem;}
 .ace-hero-copy > p {margin-top: 10px;}
 .ace-hero-actions {margin-top: 12px;}
 .ace-creator-card {margin-top: 16px; padding: 16px;}
 .ace-creator-card p {margin-top: 8px;}
}
@media (max-width: 360px) {
 .ace-eyebrow {letter-spacing: 0;}
 .ace-eyebrow::before {display: none;}
 .ace-hero h1 {font-size: 1.75rem;}
 .ace-hero h1 .accent {font-size: 3.2rem;}
 .ace-creator-heading {gap: 8px;}
 .ace-creator-heading h2 {font-size: 1rem;}
}
@media (min-width: 600px) and (max-height: 500px) {
 .ace-navbar .container {min-height: 54px;}
 .ace-landing-grid {display: block; max-width: 1140px;}
 .ace-universe-column {display: none;}
 .ace-hero {padding: 10px 0;}
 .ace-hero-copy {display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; max-width: none;}
 .ace-hero-copy > .ace-eyebrow {grid-column: 1; grid-row: 1; margin-bottom: 8px; font-size: .875rem; letter-spacing: 0;}
 .ace-eyebrow::before {display: none;}
 .ace-hero h1 {grid-column: 1; grid-row: 2; font-size: 1.6rem;}
 .ace-hero h1 .accent {font-size: 3.1rem;}
 .ace-hero-copy > p {grid-column: 1; grid-row: 3; margin-top: 8px; font-size: 1rem; line-height: 1.4;}
 .ace-hero-actions {grid-column: 1; grid-row: 4; margin-top: 10px;}
 .ace-hero-actions .ace-button {padding: 9px 12px;}
 .ace-creator-card {grid-column: 2; grid-row: 1 / 5; align-self: center; margin: 0; padding: 14px;}
 .ace-creator-card p {margin-top: 8px; line-height: 1.4;}
 .ace-footer {padding: 8px 0;}
}
@media (max-width: 360px) and (max-height: 680px) {
 /* The header already provides sign-in on compact phones. */
 .ace-hero-actions {display: none;}
}

/* Sign-in stays within the landing experience while the Caribbean orbit remains visible. */
.ace-page-shell {transition: transform .42s cubic-bezier(.22,.8,.22,1), filter .42s ease; transform-origin: left center;}
.ace-auth-backdrop {position:fixed;inset:0;z-index:1200;background:rgba(4,6,17,.56);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;}
.ace-auth-drawer {position:fixed;z-index:1210;inset:0 0 0 auto;width:min(520px,48vw);background:#fff;box-shadow:-22px 0 70px rgba(4,6,17,.38);transform:translateX(102%);visibility:hidden;transition:transform .42s cubic-bezier(.22,.8,.22,1),visibility .42s ease;}
.ace-auth-drawer iframe {display:block;width:100%;height:100%;border:0;background:#fff;}
.ace-auth-close {position:absolute;z-index:2;top:12px;right:14px;display:grid;place-items:center;width:44px;height:44px;border:1px solid #e3e6ed;border-radius:10px;background:#fff;color:#0f172a;font-size:1.45rem;cursor:pointer;}
.ace-auth-open {overflow:hidden;}
.ace-auth-open .ace-page-shell {transform:translateX(-7vw) scale(.985);filter:saturate(.92);}
.ace-auth-open .ace-auth-backdrop {opacity:1;visibility:visible;}
.ace-auth-open .ace-auth-drawer {transform:translateX(0);visibility:visible;}

@media (max-width: 767.98px) {
 .ace-landing-main {display:block;}
 .ace-hero {padding:4px 0 28px;}
 .ace-landing-grid {display:flex;flex-direction:column;max-width:none;padding:0;gap:0;}
 .ace-universe-column {display:flex;order:1;width:100%;height:clamp(330px,54svh,520px);align-items:center;overflow:hidden;}
 .ace-universe-wrap {width:100vw;height:clamp(330px,54svh,520px);min-height:330px;margin:0;overflow:hidden;}
 .ace-hero-copy {order:2;position:relative;z-index:2;width:calc(100% - 32px);margin:-54px auto 0;padding:20px 18px 18px;border:1px solid rgba(149,179,244,.16);border-radius:20px;background:rgba(7,12,29,.90);box-shadow:0 24px 60px rgba(0,0,0,.28);}
 .ace-hero h1 {font-size:clamp(1.8rem,7vw,2.5rem);}
 .ace-hero h1 .accent {font-size:clamp(3.15rem,14vw,4.5rem);}
 .ace-creator-card {padding:16px;margin-top:18px;}
 .ace-auth-drawer {inset:34svh 0 0;width:100%;height:66svh;border-radius:22px 22px 0 0;transform:translateY(102%);}
 .ace-auth-open .ace-auth-drawer {transform:translateY(0);}
 .ace-auth-open .ace-page-shell {transform:none;filter:none;}
 .ace-auth-close {top:8px;right:10px;}
}

@media (min-width: 600px) and (max-height: 500px) {
 .ace-landing-grid {display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);max-width:1140px;}
 .ace-universe-column {display:flex;grid-column:2;grid-row:1;height:calc(100svh - 72px);}
 .ace-universe-wrap {height:calc(100svh - 72px);min-height:280px;}
 .ace-hero-copy {grid-column:1;grid-row:1;}
}

@media (prefers-reduced-motion: reduce) {
 .ace-page-shell,.ace-auth-backdrop,.ace-auth-drawer {transition:none;}
}

/* Keep ACE and its full name together in the top banner. */
.ace-navbar .container {flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px;}
.ace-navbar .ace-brand {min-width: 0; flex: 1 1 28rem; gap: 14px;}
.ace-navbar .ace-brand img {flex-shrink: 0;}
.ace-navbar .ace-brand-word {font-size: 1.75rem; flex-shrink: 0;}
.ace-brand-meaning {color: #e2eaff; border-left: 1px solid rgba(150,180,255,.4); padding-left: 16px; font-size: clamp(1.125rem, 1.6vw, 1.5rem); font-weight: 700; line-height: 1.25; letter-spacing: .01em;}
.ace-navbar-actions {margin-left: auto; flex-shrink: 0;}
@media (max-width: 575.98px) {
    .ace-navbar .ace-brand {flex-basis: 100%; gap: 10px;}
    .ace-brand-meaning {padding-left: 10px; font-size: 1.125rem;}
}

/* A true full-bleed continuation of the original ACE universe artwork. */
.ace-space-field::before {
    opacity: .48;
    background: url("../images/galaxy/ace-universe-continuous.png") center center / cover no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-mask-image: none;
    mask-image: none;
}

/* The fixed field is sized from the current visible viewport. Browser zoom and
   window resizing therefore recalculate the full-bleed crop instead of exposing
   an edge of the background artwork. */
.ace-space-field,
.ace-space-field::before,
.ace-space-field::after {width: 100vw; height: 100dvh; min-width: 100vw; min-height: 100dvh;}

.ace-space-field::after {
    inset: 0;
    opacity: 1;
    background:
        radial-gradient(circle at 45% 22%, rgba(73, 57, 181, .12), transparent 28%),
        radial-gradient(circle at 76% 72%, rgba(33, 118, 255, .12), transparent 30%);
    mix-blend-mode: normal;
    filter: none;
}

/* CARIB VERSE keeps the familiar Caribbean orbit, but turns every flag into
   an accessible country and territory control. */
.ace-caribverse-page .ace-node {padding:0;border:0;background:transparent;color:inherit;cursor:pointer;}
.ace-caribverse-page .ace-node .ace-flag {display:block;}
.ace-caribverse-page .ace-node[aria-pressed="true"] .ace-flag {transform:scale(1.22);border-color:#f5c451;box-shadow:0 0 0 4px rgba(245,196,81,.26),0 0 28px rgba(245,196,81,.64),0 0 48px rgba(112,166,255,.34);}
.ace-caribverse-page .ace-node:focus-visible {outline:0;}
.ace-caribverse-page .ace-node:focus-visible .ace-flag {outline:3px solid #f5c451;outline-offset:5px;}
.ace-country-picker {display:grid;gap:7px;max-width:470px;margin-top:20px;color:#dce7ff;font-size:.875rem;font-weight:800;}
.ace-country-picker select {min-height:46px;padding:10px 12px;border:1px solid rgba(149,179,244,.42);border-radius:10px;color:#f7f9ff;background:#101d3d;font:inherit;}
.ace-country-card {display:flex;align-items:flex-start;gap:16px;max-width:550px;margin-top:16px;padding:17px;border:1px solid rgba(149,179,244,.26);border-radius:18px;background:linear-gradient(135deg,rgba(18,31,67,.84),rgba(7,12,29,.88));box-shadow:0 18px 44px rgba(0,0,0,.2);}
.ace-country-card>img {display:block;flex:none;width:96px;height:96px;border:2px solid rgba(255,255,255,.72);border-radius:16px;object-fit:cover;box-shadow:0 0 24px rgba(112,166,255,.32);}
.ace-country-card-copy {min-width:0;}
.ace-country-kicker {margin:0!important;color:#87baff;font-size:.73rem!important;font-weight:850;letter-spacing:.13em;text-transform:uppercase;}
.ace-country-card h2 {margin:4px 0 8px;color:#fff;font-size:1.4rem;line-height:1.2;}
.ace-country-facts {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 16px;margin:0;}
.ace-country-facts div {display:grid;gap:2px;}
.ace-country-facts dt {color:#9fb2d8;font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;}
.ace-country-facts dd {margin:0;color:#f7f9ff;font-size:.9rem;line-height:1.35;}
.ace-country-card-copy>#ace-country-note {max-width:none;margin:10px 0 0;color:#c8d4eb;font-size:.9rem;line-height:1.45;}
@media (max-width:575.98px) {
 .ace-country-card {gap:13px;padding:15px;}
 .ace-country-card>img {width:76px;height:76px;border-radius:13px;}
 .ace-country-card h2 {font-size:1.18rem;}
 .ace-country-facts {grid-template-columns:1fr;gap:7px;}
}

/* Empty rotating orbit layers must never intercept another ring's flags. */
.ace-caribverse-page .ace-orbit {pointer-events:none;}
.ace-caribverse-page .ace-node {pointer-events:auto;touch-action:manipulation;}
.ace-country-card-copy {flex:1;}
#ace-country-rotation-status {font-size:.8rem;line-height:1.4;color:#c8d4eb;margin:14px 0 8px;}
#ace-country-resume {font-size:.8rem;padding:8px 12px;}
#ace-country-resume[hidden] {display:none;}
@media(max-width:575px){.ace-country-card{flex-direction:column;}.ace-country-card-copy{width:100%;}.ace-country-facts{grid-template-columns:repeat(2,minmax(0,1fr));}}

.ace-fact-sources{font-size:.75rem;margin:12px 0 0;color:#c8d4eb;}.ace-fact-sources a{color:#adcfff;text-decoration:underline;}

/* Keep the Carib Verse introduction, country facts and top controls in the
   first view. The title is intentionally one compact line. */
.ace-caribverse-page .ace-hero{padding:12px 0;}
.ace-caribverse-page .ace-landing-grid{align-items:start;}
.ace-caribverse-page .ace-hero h1{white-space:nowrap;font-size:clamp(1.85rem,3.2vw,3rem);line-height:1;}
.ace-caribverse-page .ace-hero h1 .accent{display:inline;font-size:inherit;line-height:inherit;}
.ace-caribverse-page .ace-hero-copy>.ace-eyebrow{margin-bottom:8px;}
.ace-caribverse-page .ace-hero-copy>p{margin-top:10px;font-size:1rem;line-height:1.4;}
.ace-caribverse-page .ace-country-picker{margin-top:12px;gap:5px;}
.ace-caribverse-page .ace-country-picker select{min-height:40px;padding:8px 11px;}
.ace-caribverse-page .ace-country-card{gap:12px;margin-top:10px;padding:12px;border-radius:14px;}
.ace-caribverse-page .ace-country-card>img{width:72px;height:72px;border-radius:12px;}
.ace-caribverse-page .ace-country-card h2{margin:2px 0 6px;font-size:1.2rem;}
.ace-caribverse-page .ace-country-facts{gap:6px 12px;}
.ace-caribverse-page .ace-country-facts dt{font-size:.67rem;}
.ace-caribverse-page .ace-country-facts dd{font-size:.82rem;line-height:1.25;}
.ace-caribverse-page #ace-country-rotation-status{margin:8px 0 0;font-size:.74rem;}
.ace-caribverse-page .ace-fact-sources{margin-top:7px;font-size:.68rem;}
.ace-caribverse-page .ace-hero-actions{margin-top:12px;}

@media (max-width:767.98px){
 .ace-caribverse-page .ace-hero{padding:0 0 12px;}
 .ace-caribverse-page .ace-universe-column{height:clamp(190px,34svh,290px);}
 .ace-caribverse-page .ace-universe-wrap{height:clamp(190px,34svh,290px);min-height:190px;}
 .ace-caribverse-page .ace-hero-copy{margin:-130px auto 0;padding:14px 16px 16px;}
 .ace-caribverse-page .ace-hero h1{font-size:clamp(1.65rem,6.4vw,2.2rem);}
 .ace-caribverse-page .ace-hero-copy>p{font-size:.95rem;}
}

@media (max-width:767.98px) and (max-height:680px){
 .ace-caribverse-page .ace-navbar .container{min-height:52px;}
 .ace-caribverse-page .ace-hero{padding:0;}
 .ace-caribverse-page .ace-universe-column{height:150px;}
 .ace-caribverse-page .ace-universe-wrap{height:150px;min-height:150px;}
 .ace-caribverse-page .ace-hero-copy{margin:-110px auto 0;padding:10px 14px 12px;border-radius:14px;}
 .ace-caribverse-page .ace-hero-copy>.ace-eyebrow{display:none;}
 .ace-caribverse-page .ace-hero h1{font-size:clamp(1.5rem,6vw,1.9rem);}
 .ace-caribverse-page .ace-hero-copy>p{margin-top:6px;font-size:.87rem;line-height:1.3;}
 .ace-caribverse-page .ace-country-picker{margin-top:8px;}
 .ace-caribverse-page .ace-country-picker>span{display:none;}
 .ace-caribverse-page .ace-country-picker select{min-height:36px;padding:6px 9px;font-size:.8rem;}
 .ace-caribverse-page .ace-country-card{gap:9px;margin-top:8px;padding:9px;border-radius:11px;}
 .ace-caribverse-page .ace-country-card>img{width:50px;height:50px;border-radius:9px;}
 .ace-caribverse-page .ace-country-kicker{display:none;}
 .ace-caribverse-page .ace-country-card h2{margin:0 0 4px;font-size:1rem;}
 .ace-caribverse-page .ace-country-facts{gap:4px 8px;}
 .ace-caribverse-page .ace-country-facts dt{font-size:.58rem;}
 .ace-caribverse-page .ace-country-facts dd{font-size:.7rem;line-height:1.15;}
 .ace-caribverse-page #ace-country-rotation-status,.ace-caribverse-page .ace-fact-sources,.ace-caribverse-page .ace-hero-actions,.ace-caribverse-page .ace-footer{display:none;}
}
