/*
 * Corpus Animator original visual restoration.
 * Keeps the migrated application/account layout, while restoring the
 * original cyan palette, Orbitron display type, animated sigil, and
 * volumetric smoke/fold background.
 */

:root {
    --corpus-bg: #02090B;
    --corpus-bg-deep: #031217;
    --corpus-panel: rgba(6, 26, 32, 0.72);
    --corpus-panel-strong: rgba(8, 36, 43, 0.88);
    --corpus-cyan: #00F5FF;
    --corpus-cyan-bright: #5AFFFF;
    --corpus-cyan-mid: #00BFCB;
    --corpus-cyan-dark: #006A73;
    --corpus-text: #E8FFFF;
    --corpus-muted: #7FA9AD;
    --corpus-border: rgba(18, 67, 74, 0.95);

    /* Map the migrated layout tokens back onto the original Corpus palette. */
    --er-bg: var(--corpus-bg);
    --er-panel: rgba(6, 26, 32, 0.88);
    --er-panel-soft: rgba(0, 245, 255, 0.035);
    --er-line: rgba(18, 67, 74, 0.95);
    --er-line-strong: rgba(0, 245, 255, 0.55);
    --er-text: var(--corpus-text);
    --er-muted: var(--corpus-muted);
    --er-gold: var(--corpus-cyan);

    --orb-size: 17.15%;
    --rotation-duration: 20s;
    --pulse-duration: 2.8s;
    --orb-hue-min: -180deg;
    --orb-hue-max: -150deg;
}

html,
body {
    background: var(--corpus-bg) !important;
    color: var(--corpus-text);
}

body {
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at 50% 22%, rgba(0, 245, 255, 0.07) 0%, rgba(0, 130, 145, 0.022) 24%, transparent 55%),
        radial-gradient(circle at 50% 72%, rgba(0, 245, 255, 0.03) 0%, transparent 36%),
        linear-gradient(180deg, #02090B 0%, #02080A 55%, #010506 100%) !important;
}

/* Original Corpus display type. */
.er-site-mark__title,
.er-case-study h1,
.er-application h2,
.er-case-card h2,
.er-method-card h2,
.er-member-panel h1,
.er-member-panel h2,
.er-modal__dialog h2,
.er-purchase-card__heading h2,
.er-release-row__heading h3,
.er-credit-store__heading h3,
.er-ticket-create h3,
.er-ticket-list-section h3,
.er-ticket-thread h3,
.er-core__title,
.ca-feature-summary h2 {
    font-family: "Orbitron", "Inter", ui-sans-serif, system-ui, sans-serif !important;
}

.er-site-mark__title {
    color: var(--corpus-cyan) !important;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-shadow: 0 0 10px rgba(0,245,255,.12), 0 0 34px rgba(0,245,255,.08) !important;
}

/* Restore the original dark-cyan application surfaces. */
.er-case-card,
.er-method-card,
.er-license-tier,
.er-member-panel,
.er-modal__dialog,
.er-purchase-card,
.er-release-row,
.er-credit-package,
.er-ticket-create,
.er-ticket-list-section,
.er-ticket-thread {
    border-color: rgba(18, 67, 74, .9) !important;
    background: linear-gradient(180deg, rgba(6, 26, 32, .62), rgba(3, 18, 23, .76)) !important;
    box-shadow: inset 0 0 22px rgba(0, 245, 255, .025), 0 0 26px rgba(0, 245, 255, .035);
}

.er-hero {
    border-bottom-color: rgba(18, 67, 74, .82) !important;
}

/* Original volumetric smoke + cloth-fold field. */
.corpus-hybrid-field {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
}

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

body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: radial-gradient(circle at center, transparent 52%, rgba(0, 0, 0, .52) 100%);
}

/* The migrated particle/network canvas is intentionally not used. */
.er-particle-field {
    display: none !important;
}

/* Original animated Corpus sigil, fitted into the migrated radial-control shell. */
.er-sigil__art > .corpus-logo {
    position: absolute;
    inset: 2%;
    z-index: 2;
    width: 96%;
    height: 96%;
    max-width: none;
    aspect-ratio: 1;
    pointer-events: none;
    filter: drop-shadow(0 0 12px rgba(0,245,255,.12)) drop-shadow(0 0 34px rgba(0,245,255,.08));
}

.er-sigil__art > .corpus-logo::before {
    content: "";
    position: absolute;
    inset: 15%;
    border-radius: 50%;
    z-index: -1;
    background: radial-gradient(circle, rgba(0,245,255,.14) 0%, rgba(0,245,255,.06) 24%, rgba(0,191,203,.018) 46%, transparent 72%);
    filter: blur(22px);
    animation: corpus-aura 2.8s ease-in-out infinite;
}

.corpus-sunburst,
.corpus-face,
.corpus-orb {
    position: absolute;
    display: block;
}

.corpus-face {
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 2;
    pointer-events: none;
}

.corpus-sunburst {
    left: var(--orb-x);
    top: var(--orb-y);
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    overflow: visible;
    z-index: 1;
    pointer-events: none;
    filter: drop-shadow(0 0 4px rgba(0,245,255,.68)) drop-shadow(0 0 14px rgba(0,245,255,.30));
}

.corpus-rays {
    fill: var(--corpus-cyan);
}

#corpus-rotor {
    transform-box: view-box;
    transform-origin: 50% 50%;
    animation: corpus-rotate var(--rotation-duration) linear infinite;
    will-change: transform;
}

.corpus-orb {
    left: var(--orb-x);
    top: var(--orb-y);
    width: var(--orb-size);
    height: auto;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 3;
    pointer-events: none;
    animation: corpus-orb-hue var(--pulse-duration) ease-in-out infinite;
    will-change: filter;
}

/* Existing hand/purchase/account controls remain above the animated sigil. */
.er-sigil .er-node,
.er-home-label-layer,
.er-account-label-layer,
.er-sigil .er-core {
    z-index: 12 !important;
}

/* The migrated Previous / Next raster-label controls are gone. */
.er-home-label--previous,
.er-home-label--next {
    display: none !important;
}

/* New concise feature summary. */
.ca-feature-summary {
    max-width: 760px;
    margin: 28px 0 0;
    padding: 22px 24px;
    border-left: 1px solid rgba(0, 245, 255, .62);
    background: linear-gradient(90deg, rgba(0, 245, 255, .055), transparent 80%);
}

.ca-feature-summary h2 {
    margin: 0 0 14px;
    color: var(--corpus-cyan);
    font-size: clamp(1rem, 1.7vw, 1.25rem);
    letter-spacing: .12em;
    text-transform: uppercase;
}

.ca-feature-summary ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--corpus-text);
}

.ca-feature-summary li {
    position: relative;
    padding-left: 18px;
    line-height: 1.45;
}

.ca-feature-summary li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .64em;
    width: 6px;
    height: 6px;
    border: 1px solid var(--corpus-cyan-mid);
    transform: rotate(45deg);
    box-shadow: 0 0 8px rgba(0,245,255,.35);
}

.ca-feature-summary li span {
    color: var(--corpus-muted);
    font-size: .9em;
}

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

@keyframes corpus-orb-hue {
    0% { filter: hue-rotate(var(--orb-hue-min)) drop-shadow(0 0 10px rgba(0,245,255,.26)); }
    50% { filter: hue-rotate(var(--orb-hue-max)) drop-shadow(0 0 22px rgba(0,245,255,.46)); }
    100% { filter: hue-rotate(var(--orb-hue-min)) drop-shadow(0 0 10px rgba(0,245,255,.26)); }
}

@keyframes corpus-aura {
    0%, 100% { opacity: .58; transform: scale(.96); }
    50% { opacity: .96; transform: scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
    #corpus-rotor,
    .corpus-orb,
    .er-sigil__art > .corpus-logo::before {
        animation-play-state: paused;
    }
}

/* Keep migrated interactive labels inside the original cyan family. */
.er-home-label,
.er-account-label {
    color: var(--corpus-text);
}

.er-home-label:hover,
.er-home-label:focus-visible,
.er-home-label.is-linked-hover,
.er-account-label:hover,
.er-account-label:focus-visible {
    color: var(--corpus-cyan-bright) !important;
}

.er-home-label.is-active,
.er-home-label:active,
.er-home-label.is-linked-active,
.er-account-label.is-active,
.er-account-label:active {
    color: var(--corpus-cyan) !important;
}

.er-sigil .er-core__title {
    color: var(--corpus-text) !important;
    text-shadow: 0 0 12px rgba(0, 245, 255, .28) !important;
}


/* ===== v1.0.2 clean showcase navigation ===== */
/* Public showcase: keep the animated sigil completely free of controls. */
.er-member-public .er-sigil .er-node,
.er-member-public .er-sigil .er-home-label-layer,
.er-member-public .er-sigil .er-core {
    display: none !important;
}

.ca-case-nav {
    position: absolute;
    left: 50%;
    bottom: -10px;
    z-index: 24;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 3vw, 34px);
    transform: translateX(-50%);
}

.ca-case-nav__button {
    width: clamp(46px, 5vw, 58px);
    height: clamp(46px, 5vw, 58px);
    display: grid;
    place-items: center;
    padding: 0 0 3px;
    border: 1px solid rgba(0, 245, 255, .55);
    border-radius: 50%;
    background: rgba(1, 9, 13, .62);
    color: var(--corpus-cyan-bright);
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: clamp(1.45rem, 2.4vw, 1.9rem);
    line-height: 1;
    cursor: pointer;
    box-shadow:
        inset 0 0 18px rgba(0, 245, 255, .06),
        0 0 14px rgba(0, 245, 255, .12);
    text-shadow: 0 0 12px rgba(0, 245, 255, .62);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.ca-case-nav__button:hover,
.ca-case-nav__button:focus-visible {
    outline: none;
    transform: translateY(-2px);
    border-color: rgba(83, 249, 255, .95);
    background: rgba(0, 245, 255, .09);
    box-shadow:
        inset 0 0 22px rgba(0, 245, 255, .10),
        0 0 18px rgba(0, 245, 255, .28),
        0 0 40px rgba(0, 245, 255, .12);
}

.ca-case-nav__button:active {
    transform: translateY(0) scale(.96);
}

/* Make the footer mark readable without changing its artwork. */
.er-site-footer__logo {
    padding: 8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 245, 255, .22) 0%, rgba(0, 245, 255, .10) 34%, rgba(0, 245, 255, .025) 58%, transparent 76%);
    filter:
        brightness(1.14)
        drop-shadow(0 0 8px rgba(0, 245, 255, .75))
        drop-shadow(0 0 22px rgba(0, 245, 255, .42))
        drop-shadow(0 0 42px rgba(0, 245, 255, .20));
}

@media (max-width: 760px) {
    .ca-case-nav { bottom: -2px; }
}

@media (max-width: 520px) {
    .ca-case-nav { bottom: 0; gap: 18px; }
}