:root {
    color-scheme: dark;
    --bg-primary: #05070d;
    --bg-secondary: #080d16;
    --bg-tertiary: #0d1420;
    --glass-light: rgba(255, 255, 255, 0.075);
    --glass-medium: rgba(15, 24, 39, 0.62);
    --glass-dark: rgba(4, 8, 15, 0.82);
    --border-soft: rgba(255, 255, 255, 0.1);
    --border-strong: rgba(255, 255, 255, 0.16);
    --border-active: rgba(82, 210, 255, 0.38);
    --accent-primary: #4fd9ff;
    --accent-primary-strong: #8ce9ff;
    --accent-secondary: #168cff;
    --accent-green: #39e58c;
    --accent-amber: #ffb84d;
    --accent-red: #ff6b7a;
    --discord: #5865f2;
    --text-primary: #f7faff;
    --text-secondary: #aebacb;
    --text-muted: #7f8fa6;
    --gradient-brand: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    --gradient-glass: linear-gradient(135deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.025));
    --gradient-text: linear-gradient(110deg, #ffffff 8%, #a8ecff 55%, #56baff 100%);
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --radius-pill: 999px;
    --shadow-soft: 0 18px 56px rgba(0, 0, 0, 0.28);
    --shadow-glass: 0 24px 80px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    --shadow-focus: 0 0 0 4px rgba(79, 217, 255, 0.18);
    --blur-sm: 18px;
    --blur-md: 24px;
    --blur-lg: 32px;
    --container: 1240px;
    --container-wide: 1440px;
    --content-text: 720px;
    --nav-height: 72px;
    --transition-fast: 160ms ease;
    --transition-base: 280ms cubic-bezier(0.2, 0.75, 0.2, 1);
    --transition-slow: 650ms cubic-bezier(0.2, 0.75, 0.2, 1);
    --z-background: -10;
    --z-content: 1;
    --z-header: 120;
    --z-menu: 110;
    --pointer-x: 50%;
    --pointer-y: 24%;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

html {
    overflow-x: hidden;
    background: var(--bg-primary);
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--nav-height) + 2.5rem);
}

body {
    margin: 0;
    min-width: 0;
    min-height: 100vh;
    overflow-x: clip;
    background: var(--bg-primary);
    color: var(--text-primary);
    font-family: Inter, Manrope, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 1rem;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.menu-open {
    overflow: hidden;
}

img,
svg {
    display: block;
    max-width: 100%;
}

img {
    height: auto;
}

button,
input {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    color: inherit;
}

p,
h1,
h2,
h3,
h4 {
    margin-top: 0;
}

p:last-child {
    margin-bottom: 0;
}

::selection {
    background: rgba(79, 217, 255, 0.3);
    color: var(--text-primary);
}

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: var(--bg-primary);
}

::-webkit-scrollbar-thumb {
    border: 3px solid var(--bg-primary);
    border-radius: var(--radius-pill);
    background: rgba(79, 217, 255, 0.38);
}

:focus-visible {
    outline: 2px solid var(--accent-primary);
    outline-offset: 4px;
}

.skip-link {
    position: fixed;
    z-index: 999;
    top: var(--space-4);
    left: var(--space-4);
    padding: var(--space-3) var(--space-5);
    transform: translateY(-160%);
    border-radius: var(--radius-sm);
    background: var(--text-primary);
    color: var(--bg-primary);
    font-weight: 800;
    transition: transform var(--transition-fast);
}

.skip-link:focus {
    transform: translateY(0);
}

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

.site-backdrop {
    position: fixed;
    z-index: var(--z-background);
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    background:
        radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgba(22, 140, 255, 0.12), transparent 30rem),
        radial-gradient(circle at 78% 72%, rgba(57, 229, 140, 0.08), transparent 28rem),
        linear-gradient(180deg, var(--bg-primary), var(--bg-secondary) 56%, var(--bg-primary));
}

.discord-page .site-backdrop {
    background:
        linear-gradient(90deg, rgba(5, 7, 13, 0.68), rgba(5, 7, 13, 0.42) 50%, rgba(5, 7, 13, 0.68)),
        linear-gradient(180deg, rgba(5, 7, 13, 0.08), rgba(5, 7, 13, 0.5)),
        url("../discord-background.webp") center / cover no-repeat,
        var(--bg-primary);
}

.discord-page .site-backdrop::before {
    opacity: 0.11;
}

.discord-page .site-backdrop::after {
    opacity: 0.05;
}

.discord-page .ambient-orb {
    opacity: 0.07;
}

.site-backdrop::before {
    position: absolute;
    inset: -10%;
    content: "";
    opacity: 0.18;
    background-image:
        linear-gradient(rgba(114, 195, 255, 0.15) 1px, transparent 1px),
        linear-gradient(90deg, rgba(114, 195, 255, 0.15) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 80%, transparent);
    transform: perspective(900px) rotateX(58deg) translateY(18%);
    transform-origin: center bottom;
}

.site-backdrop::after {
    position: absolute;
    inset: 0;
    content: "";
    opacity: 0.09;
    background-image: radial-gradient(rgba(255, 255, 255, 0.7) 0.7px, transparent 0.8px);
    background-size: 5px 5px;
    mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
}

.ambient-orb,
.voxel {
    position: absolute;
    will-change: transform;
}

.ambient-orb {
    width: min(42rem, 80vw);
    aspect-ratio: 1;
    border-radius: 50%;
    filter: blur(100px);
    opacity: 0.12;
    animation: drift 18s ease-in-out infinite alternate;
}

.ambient-orb--cyan {
    top: -18rem;
    right: -10rem;
    background: var(--accent-primary);
}

.ambient-orb--green {
    bottom: -24rem;
    left: -14rem;
    background: var(--accent-green);
    animation-delay: -8s;
}

.voxel {
    width: 54px;
    aspect-ratio: 1;
    opacity: 0.12;
    border: 1px solid rgba(79, 217, 255, 0.65);
    background: linear-gradient(135deg, rgba(79, 217, 255, 0.24), transparent);
    box-shadow: inset 0 0 24px rgba(79, 217, 255, 0.12);
    transform: rotate(30deg) skew(-8deg);
    animation: voxel-float 12s ease-in-out infinite;
}

.voxel--one {
    top: 22%;
    left: 5%;
}

.voxel--two {
    top: 62%;
    right: 8%;
    width: 36px;
    border-color: rgba(57, 229, 140, 0.7);
    animation-delay: -4s;
}

.voxel--three {
    top: 76%;
    left: 26%;
    width: 26px;
    animation-delay: -8s;
}

@keyframes drift {
    to { transform: translate3d(4rem, 3rem, 0) scale(1.08); }
}

@keyframes voxel-float {
    50% { transform: translateY(-28px) rotate(40deg) skew(-8deg); }
}

.container,
.container-wide {
    width: min(calc(100% - 2rem), var(--container));
    margin-inline: auto;
}

.container-wide {
    max-width: var(--container-wide);
}

.site-main {
    position: relative;
    z-index: var(--z-content);
}

.section {
    position: relative;
    padding-block: clamp(4.5rem, 9vw, 8rem);
}

.section--compact {
    padding-block: clamp(3rem, 6vw, 5rem);
}

.section-heading {
    display: grid;
    gap: var(--space-4);
    max-width: var(--content-text);
    margin-bottom: clamp(2rem, 5vw, 3.5rem);
}

.section-heading--center {
    margin-inline: auto;
    text-align: center;
}

.section-label,
.eyebrow {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
    color: var(--accent-primary-strong);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.15em;
    line-height: 1.2;
    text-transform: uppercase;
}

.section-heading--center .section-label {
    justify-self: center;
}

.eyebrow {
    padding: 0.65rem 0.9rem;
    border: 1px solid var(--border-active);
    border-radius: var(--radius-pill);
    background: rgba(79, 217, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.status-dot {
    width: 0.45rem;
    height: 0.45rem;
    flex: 0 0 auto;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 4px rgba(79, 217, 255, 0.1);
}

.display-title,
.section-title,
.card-title {
    color: var(--text-primary);
    font-weight: 800;
    letter-spacing: -0.04em;
    text-wrap: balance;
}

.display-title {
    max-width: 13ch;
    margin-bottom: var(--space-6);
    font-size: clamp(2.7rem, 6.6vw, 5.8rem);
    line-height: 0.98;
}

.section-title {
    margin-bottom: 0;
    font-size: clamp(2rem, 4vw, 3.6rem);
    line-height: 1.08;
}

.card-title {
    margin-bottom: var(--space-3);
    font-size: clamp(1.2rem, 2vw, 1.5rem);
    line-height: 1.2;
}

.gradient-text {
    color: transparent;
    background: var(--gradient-text);
    background-clip: text;
    -webkit-background-clip: text;
}

.lead,
.section-copy {
    max-width: var(--content-text);
    color: var(--text-secondary);
    text-wrap: pretty;
}

.lead {
    margin-bottom: var(--space-8);
    font-size: clamp(1.05rem, 2vw, 1.22rem);
    line-height: 1.7;
}

.section-copy {
    margin-bottom: 0;
    font-size: clamp(1rem, 1.6vw, 1.1rem);
}

.muted {
    color: var(--text-muted);
}

.glass,
.glass-strong,
.glass-soft {
    border: 1px solid var(--border-soft);
    background: var(--gradient-glass), var(--glass-medium);
    box-shadow: var(--shadow-glass);
    -webkit-backdrop-filter: blur(var(--blur-md)) saturate(135%);
    backdrop-filter: blur(var(--blur-md)) saturate(135%);
}

.glass-strong {
    border-color: var(--border-strong);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.035)),
        var(--glass-dark);
    -webkit-backdrop-filter: blur(var(--blur-lg)) saturate(145%);
    backdrop-filter: blur(var(--blur-lg)) saturate(145%);
}

.glass-soft {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)), rgba(11, 19, 31, 0.54);
    box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    -webkit-backdrop-filter: blur(var(--blur-sm)) saturate(125%);
    backdrop-filter: blur(var(--blur-sm)) saturate(125%);
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .glass,
    .glass-soft {
        background: #0c1421;
    }

    .glass-strong,
    .nav-shell {
        background: #080e18;
    }
}

.site-header {
    position: fixed;
    z-index: var(--z-header);
    top: 0;
    left: 0;
    width: 100%;
    padding: var(--space-4);
    pointer-events: none;
}

.nav-shell {
    display: flex;
    width: min(100%, var(--container-wide));
    min-height: var(--nav-height);
    margin-inline: auto;
    padding: 0.65rem 0.75rem 0.65rem 1rem;
    align-items: center;
    gap: var(--space-6);
    border: 1px solid var(--border-soft);
    border-radius: 1.35rem;
    background: rgba(7, 13, 23, 0.66);
    box-shadow: 0 12px 44px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    -webkit-backdrop-filter: blur(22px) saturate(140%);
    backdrop-filter: blur(22px) saturate(140%);
    pointer-events: auto;
    transition: background var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}

.site-header.is-scrolled .nav-shell {
    border-color: var(--border-strong);
    background: rgba(5, 9, 16, 0.9);
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.brand {
    display: inline-flex;
    min-width: max-content;
    min-height: 44px;
    align-items: center;
    gap: var(--space-3);
    border-radius: var(--radius-sm);
}

.brand img {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    object-fit: cover;
    box-shadow: 0 0 22px rgba(79, 217, 255, 0.16);
}

.brand-text {
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.brand-text span {
    color: var(--accent-primary);
}

.desktop-nav {
    display: flex;
    margin-left: auto;
    align-items: center;
    gap: 0.2rem;
}

.nav-link {
    position: relative;
    display: inline-flex;
    min-height: 44px;
    padding-inline: 0.82rem;
    align-items: center;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-size: 0.84rem;
    font-weight: 700;
    transition: color var(--transition-fast), background var(--transition-fast);
}

.nav-link::after {
    position: absolute;
    right: 0.8rem;
    bottom: 0.45rem;
    left: 0.8rem;
    height: 2px;
    content: "";
    border-radius: var(--radius-pill);
    background: var(--gradient-brand);
    transform: scaleX(0);
    transition: transform var(--transition-base);
}

.nav-link:hover,
.nav-link[aria-current="page"],
.nav-link.is-active {
    background: rgba(255, 255, 255, 0.045);
    color: var(--text-primary);
}

.nav-link.is-active::after,
.nav-link[aria-current="page"]::after {
    transform: scaleX(1);
}

.mobile-toggle {
    display: none;
    width: 44px;
    height: 44px;
    margin-left: auto;
    padding: 0;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-sm);
    background: var(--glass-light);
    cursor: pointer;
}

.mobile-toggle-lines,
.mobile-toggle-lines::before,
.mobile-toggle-lines::after {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transition: transform var(--transition-base), opacity var(--transition-fast);
}

.mobile-toggle-lines {
    position: relative;
}

.mobile-toggle-lines::before,
.mobile-toggle-lines::after {
    position: absolute;
    left: 0;
    content: "";
}

.mobile-toggle-lines::before { top: -6px; }
.mobile-toggle-lines::after { top: 6px; }

.mobile-toggle[aria-expanded="true"] .mobile-toggle-lines {
    background: transparent;
}

.mobile-toggle[aria-expanded="true"] .mobile-toggle-lines::before {
    top: 0;
    transform: rotate(45deg);
}

.mobile-toggle[aria-expanded="true"] .mobile-toggle-lines::after {
    top: 0;
    transform: rotate(-45deg);
}

.mobile-menu {
    display: none;
}

.nav-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: var(--space-2);
}

.nav-launch {
    display: inline-flex;
    min-width: 116px;
    min-height: 46px;
    padding: 0.45rem 0.7rem;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid rgba(79, 217, 255, 0.17);
    border-radius: var(--radius-sm);
    background: linear-gradient(135deg, rgba(79, 217, 255, 0.075), rgba(22, 140, 255, 0.025));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
    transition: border-color var(--transition-fast), background var(--transition-fast), transform var(--transition-fast);
}

.nav-launch:hover {
    border-color: var(--border-active);
    background: rgba(79, 217, 255, 0.1);
    transform: translateY(-1px);
}

.nav-launch-signal {
    position: relative;
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--accent-primary);
    box-shadow: 0 0 15px rgba(79, 217, 255, 0.8);
}

.nav-launch-signal::after {
    position: absolute;
    content: "";
    inset: -5px;
    border: 1px solid rgba(79, 217, 255, 0.25);
    border-radius: 50%;
    animation: launch-beacon 2.4s ease-out infinite;
}

.nav-launch small,
.nav-launch strong {
    display: block;
    line-height: 1.1;
    white-space: nowrap;
}

.nav-launch small {
    margin-bottom: 0.18rem;
    color: var(--text-muted);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.56rem;
    letter-spacing: 0.08em;
}

.nav-launch strong {
    color: var(--accent-primary-strong);
    font-size: 0.68rem;
}

.nav-actions .btn {
    min-height: 46px;
    padding: 0.7rem 0.9rem;
}

.btn-account {
    color: var(--text-primary);
}

.btn-account .icon {
    color: var(--accent-primary-strong);
}

.mobile-menu-actions {
    display: grid;
    margin-top: var(--space-4);
    gap: var(--space-2);
}

.mobile-menu-actions .btn {
    width: 100%;
    margin-top: 0;
}

.footer-action {
    min-height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    font-size: inherit;
    text-align: left;
    transition: color var(--transition-fast);
}

.footer-action:hover {
    color: var(--text-primary);
}

.btn-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.btn {
    position: relative;
    display: inline-flex;
    min-height: 48px;
    padding: 0.8rem 1.2rem;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1.2;
    cursor: pointer;
    transition: transform var(--transition-fast), border-color var(--transition-fast), background var(--transition-base), box-shadow var(--transition-base), color var(--transition-fast), opacity var(--transition-fast);
}

.btn::before {
    position: absolute;
    top: -80%;
    left: -35%;
    width: 35%;
    height: 260%;
    content: "";
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.34), transparent);
    transform: rotate(18deg) translateX(-220%);
    transition: transform 650ms ease;
}

.btn:hover::before {
    transform: rotate(18deg) translateX(600%);
}

.btn:hover {
    transform: translateY(-2px);
}

.btn:active {
    transform: translateY(0) scale(0.98);
}

.btn:focus-visible {
    outline: 2px solid var(--text-primary);
    outline-offset: 3px;
    box-shadow: var(--shadow-focus);
}

.btn[disabled],
.btn[aria-disabled="true"] {
    opacity: 0.48;
    pointer-events: none;
    cursor: not-allowed;
}

.btn[aria-busy="true"],
.btn.is-loading {
    color: transparent;
    pointer-events: none;
}

.btn[aria-busy="true"]::after,
.btn.is-loading::after {
    position: absolute;
    width: 1.1rem;
    height: 1.1rem;
    content: "";
    border: 2px solid rgba(255, 255, 255, 0.38);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 700ms linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

.btn-primary {
    background: var(--gradient-brand);
    box-shadow: 0 12px 34px rgba(22, 140, 255, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.32);
    color: #03101a;
}

.btn-primary:hover {
    box-shadow: 0 16px 42px rgba(22, 140, 255, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.38);
}

.btn-secondary {
    border-color: var(--border-strong);
    background: rgba(255, 255, 255, 0.055);
    color: var(--text-primary);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.btn-secondary:hover {
    border-color: var(--border-active);
    background: rgba(79, 217, 255, 0.075);
}

.btn-tertiary {
    padding-inline: 0.35rem;
    border-color: transparent;
    background: transparent;
    color: var(--accent-primary-strong);
    box-shadow: none;
}

.btn-tertiary:hover {
    background: rgba(79, 217, 255, 0.055);
    color: var(--text-primary);
}

.btn-tertiary:hover .icon {
    transform: translateX(3px);
}

.btn-discord {
    background: linear-gradient(135deg, #7480ff, var(--discord));
    box-shadow: 0 12px 34px rgba(88, 101, 242, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.3);
    color: #fff;
}

.discord-icon {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    flex: 0 0 auto;
    object-fit: contain;
    filter: drop-shadow(0 4px 9px rgba(22, 26, 70, 0.28));
}

.discord-icon--large {
    width: 42px;
    height: 42px;
    filter: drop-shadow(0 7px 14px rgba(88, 101, 242, 0.32));
}

.btn-link {
    display: inline-flex;
    min-height: 44px;
    padding: 0.45rem 0;
    align-items: center;
    gap: var(--space-2);
    border-radius: var(--radius-sm);
    color: var(--accent-primary-strong);
    font-weight: 800;
}

.btn-link svg {
    transition: transform var(--transition-base);
}

.btn-link:hover svg {
    transform: translateX(4px);
}

.icon {
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.hero {
    display: grid;
    min-height: min(920px, 100svh);
    padding-top: clamp(8.5rem, 15vh, 11rem);
    padding-bottom: clamp(4rem, 8vw, 7rem);
    align-items: center;
}

.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.07fr) minmax(340px, 0.93fr);
    align-items: center;
    gap: clamp(2rem, 5vw, 5rem);
}

.hero-copy {
    position: relative;
    z-index: 2;
}

.hero-copy .eyebrow {
    margin-bottom: var(--space-6);
}

.hero-chips,
.tag-list,
.principle-list {
    display: flex;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    gap: var(--space-2);
    list-style: none;
}

.hero-chips {
    margin-top: var(--space-6);
}

.chip,
.tag,
.micro-badge {
    display: inline-flex;
    min-height: 32px;
    padding: 0.4rem 0.72rem;
    align-items: center;
    gap: var(--space-2);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.045);
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
}

.chip-dot {
    width: 0.42rem;
    height: 0.42rem;
    border-radius: 50%;
    background: var(--accent-green);
    box-shadow: 0 0 12px rgba(57, 229, 140, 0.5);
}

.hero-visual {
    position: relative;
    min-height: 520px;
    perspective: 1200px;
}

.logo-stage {
    position: absolute;
    inset: 2.8rem 1.5rem;
    display: grid;
    padding: clamp(1rem, 2vw, 1.75rem);
    place-items: center;
    overflow: hidden;
    border-radius: var(--radius-xl);
    transform: rotateY(-4deg) rotateX(2deg);
    transition: transform var(--transition-slow);
}

.hero-visual:hover .logo-stage {
    transform: rotateY(0) rotateX(0) translateY(-4px);
}

.logo-stage::before {
    position: absolute;
    width: 80%;
    aspect-ratio: 1;
    content: "";
    border: 1px solid rgba(79, 217, 255, 0.2);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(79, 217, 255, 0.18), transparent 62%);
    box-shadow: 0 0 80px rgba(22, 140, 255, 0.18);
    animation: orbit-pulse 6s ease-in-out infinite;
}

@keyframes orbit-pulse {
    50% { transform: scale(1.06); opacity: 0.7; }
}

.logo-stage img {
    position: relative;
    z-index: 1;
    width: min(100%, 460px);
    border-radius: 22%;
    filter: drop-shadow(0 28px 45px rgba(0, 0, 0, 0.46)) drop-shadow(0 0 28px rgba(79, 217, 255, 0.14));
}

.floating-panel {
    position: absolute;
    z-index: 3;
    display: grid;
    gap: 0.15rem;
    min-width: 190px;
    padding: 0.9rem 1rem;
    border-radius: var(--radius-md);
}

.floating-panel strong {
    font-size: 0.9rem;
}

.floating-panel span {
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 650;
}

.floating-panel--top {
    top: 0;
    right: 0;
}

.floating-panel--bottom {
    bottom: 0;
    left: 0;
}

.metric-line {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.pillar-grid,
.feature-grid,
.plugin-grid {
    display: grid;
    gap: var(--space-5);
}

.pillar-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pillar-card {
    position: relative;
    min-height: 390px;
    padding: clamp(1.5rem, 3vw, 2.2rem);
    overflow: hidden;
    border-radius: var(--radius-lg);
    transition: transform var(--transition-base), border-color var(--transition-base), background var(--transition-base), box-shadow var(--transition-base);
}

.pillar-card::after {
    position: absolute;
    inset: auto -15% -35% 10%;
    height: 70%;
    content: "";
    border-radius: 50%;
    opacity: 0.11;
    background: var(--card-accent, var(--accent-primary));
    filter: blur(60px);
    transition: opacity var(--transition-base), transform var(--transition-slow);
}

.pillar-card:hover {
    border-color: color-mix(in srgb, var(--card-accent, var(--accent-primary)) 42%, transparent);
    transform: translateY(-8px);
    box-shadow: 0 30px 82px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.11);
}

.pillar-card:hover::after {
    opacity: 0.18;
    transform: scale(1.15);
}

.pillar-card--green { --card-accent: var(--accent-green); }
.pillar-card--cyan { --card-accent: var(--accent-primary); }
.pillar-card--amber { --card-accent: var(--accent-amber); }

.pillar-number {
    position: absolute;
    top: 1.2rem;
    right: 1.4rem;
    color: rgba(255, 255, 255, 0.11);
    font-size: 3.4rem;
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1;
}

.icon-box {
    display: grid;
    width: 58px;
    height: 58px;
    margin-bottom: var(--space-6);
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--card-accent, var(--accent-primary)) 32%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--card-accent, var(--accent-primary)) 10%, transparent);
    color: var(--card-accent, var(--accent-primary));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.icon-box .icon {
    width: 28px;
    height: 28px;
}

.pillar-card p {
    position: relative;
    z-index: 1;
    margin-bottom: var(--space-6);
    color: var(--text-secondary);
}

.pillar-card .tag-list {
    position: relative;
    z-index: 1;
    margin-top: auto;
}

.fair-panel {
    position: relative;
    display: grid;
    padding: clamp(2rem, 5vw, 4.5rem);
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: center;
    gap: clamp(2rem, 5vw, 5rem);
    overflow: hidden;
    border-radius: var(--radius-xl);
}

.fair-panel::after {
    position: absolute;
    top: -70%;
    right: -16%;
    width: 55%;
    aspect-ratio: 1;
    content: "";
    border-radius: 50%;
    background: rgba(57, 229, 140, 0.12);
    filter: blur(90px);
}

.fair-kicker {
    margin-bottom: var(--space-4);
    color: var(--accent-green);
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.principle-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.principle {
    min-height: 132px;
    padding: var(--space-5);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.035);
}

.principle strong {
    display: block;
    margin-bottom: var(--space-2);
}

.principle span {
    color: var(--text-muted);
    font-size: 0.85rem;
}

.cta-panel {
    position: relative;
    display: grid;
    padding: clamp(2rem, 5vw, 4rem);
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-8);
    overflow: hidden;
    border-radius: var(--radius-xl);
}

.cta-panel::before {
    position: absolute;
    inset: -1px;
    content: "";
    opacity: 0.4;
    background: linear-gradient(110deg, rgba(79, 217, 255, 0.16), transparent 42%, rgba(57, 229, 140, 0.09));
    pointer-events: none;
}

.cta-panel > * {
    position: relative;
    z-index: 1;
}

.site-footer {
    position: relative;
    z-index: var(--z-content);
    padding: var(--space-8) var(--space-4) var(--space-6);
}

.footer-panel {
    display: grid;
    width: min(100%, var(--container-wide));
    margin-inline: auto;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: var(--space-8);
    border-radius: var(--radius-xl);
}

.footer-brand {
    max-width: 440px;
}

.footer-brand .brand {
    margin-bottom: var(--space-4);
}

.footer-brand p,
.footer-meta {
    color: var(--text-muted);
    font-size: 0.86rem;
}

.footer-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-8);
}

.footer-links h2 {
    margin-bottom: var(--space-3);
    color: var(--text-primary);
    font-size: 0.76rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.footer-links ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-links a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    color: var(--text-secondary);
    font-size: 0.88rem;
    transition: color var(--transition-fast);
}

.footer-links a:hover {
    color: var(--accent-primary-strong);
}

.footer-bottom {
    display: flex;
    width: min(100%, var(--container-wide));
    margin: var(--space-5) auto 0;
    padding-inline: var(--space-2);
    justify-content: space-between;
    gap: var(--space-4);
    color: var(--text-muted);
    font-size: 0.75rem;
}

.project-status {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

/* Premium homepage */
.hero--premium .display-title { max-width: 12ch; }
.hero--premium .hero-visual { isolation: isolate; }

.chip--launch {
    border-color: rgba(79, 217, 255, 0.2);
    background: linear-gradient(135deg, rgba(79, 217, 255, 0.09), rgba(22, 140, 255, 0.04));
    color: var(--text-primary);
}

.chip--launch .chip-dot {
    background: var(--accent-primary);
    box-shadow: 0 0 14px rgba(79, 217, 255, 0.7);
}

.mobile-launch-summary {
    display: none;
}

.hero-launch-visual {
    min-height: 650px;
}

.launch-core {
    --launch-progress: 0deg;
    position: absolute;
    z-index: 2;
    inset: 0;
    display: grid;
    padding: clamp(1.1rem, 2vw, 1.5rem);
    place-items: center;
    align-content: space-between;
    overflow: hidden;
    border-color: rgba(126, 218, 255, 0.18);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(180deg, rgba(15, 27, 44, 0.84), rgba(4, 9, 17, 0.93)),
        radial-gradient(circle at 50% 28%, rgba(79, 217, 255, 0.16), transparent 42%);
    box-shadow:
        0 38px 110px rgba(0, 0, 0, 0.48),
        0 0 80px rgba(22, 140, 255, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.11);
    isolation: isolate;
}

.launch-core::before,
.launch-core::after {
    position: absolute;
    z-index: -1;
    content: "";
    pointer-events: none;
}

.launch-core::before {
    inset: 0;
    opacity: 0.24;
    background-image:
        linear-gradient(rgba(79, 217, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(79, 217, 255, 0.08) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom, black, transparent 76%);
}

.launch-core::after {
    top: 17%;
    left: 50%;
    width: 78%;
    aspect-ratio: 1;
    border: 1px solid rgba(79, 217, 255, 0.11);
    border-radius: 50%;
    box-shadow: 0 0 90px rgba(79, 217, 255, 0.11), inset 0 0 70px rgba(22, 140, 255, 0.05);
    transform: translateX(-50%);
}

.launch-scan {
    position: absolute;
    z-index: 0;
    top: -25%;
    right: 0;
    left: 0;
    height: 18%;
    background: linear-gradient(to bottom, transparent, rgba(79, 217, 255, 0.045), transparent);
    pointer-events: none;
    animation: launch-scan 8s ease-in-out infinite;
}

.launch-core-top,
.launch-core-footer {
    position: relative;
    z-index: 2;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.58rem;
    letter-spacing: 0.075em;
}

.launch-core-top {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.075);
    color: var(--text-muted);
}

.launch-core-top strong {
    position: relative;
    padding-left: 0.9rem;
    color: var(--accent-green);
    font-size: inherit;
}

.launch-core-top strong::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 5px;
    height: 5px;
    content: "";
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 10px currentColor;
    transform: translateY(-50%);
}

.launch-emblem {
    position: relative;
    z-index: 1;
    display: grid;
    width: clamp(124px, 14vw, 166px);
    margin: 0.45rem 0 0.1rem;
    aspect-ratio: 1;
    place-items: center;
}

.launch-emblem::before,
.launch-emblem::after {
    position: absolute;
    content: "";
    border-radius: 38%;
    pointer-events: none;
}

.launch-emblem::before {
    inset: -16px;
    border: 1px solid rgba(79, 217, 255, 0.14);
    transform: rotate(12deg);
    animation: launch-frame-rotate 22s linear infinite;
}

.launch-emblem::after {
    inset: -29px;
    border: 1px dashed rgba(57, 229, 140, 0.12);
    transform: rotate(-8deg);
    animation: launch-frame-rotate 30s linear infinite reverse;
}

.launch-progress-ring {
    display: grid;
    width: 100%;
    padding: 4px;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 34%;
    background: conic-gradient(from 210deg, var(--accent-primary) var(--launch-progress), rgba(255, 255, 255, 0.075) 0);
    box-shadow: 0 0 34px rgba(79, 217, 255, 0.16);
}

.launch-progress-ring picture {
    display: grid;
    width: 100%;
    height: 100%;
    padding: 0.5rem;
    place-items: center;
    border-radius: calc(34% - 3px);
    background: linear-gradient(145deg, rgba(8, 17, 29, 0.98), rgba(3, 8, 14, 0.97));
}

.launch-progress-ring img {
    width: 100%;
    height: 100%;
    border-radius: 24%;
    object-fit: contain;
    filter: drop-shadow(0 14px 22px rgba(0, 0, 0, 0.46)) drop-shadow(0 0 18px rgba(79, 217, 255, 0.18));
}

.launch-kicker {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--text-muted);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.launch-date {
    position: relative;
    z-index: 1;
    display: block;
    color: var(--text-primary);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: clamp(2rem, 4.1vw, 3.25rem);
    font-weight: 850;
    line-height: 0.9;
    letter-spacing: -0.075em;
    text-shadow: 0 0 28px rgba(79, 217, 255, 0.18);
    white-space: nowrap;
}

.launch-date span {
    margin-inline: 0.08em;
    color: rgba(79, 217, 255, 0.45);
    font-weight: 400;
}

.launch-tminus {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: baseline;
    color: var(--accent-primary-strong);
    font-family: "SFMono-Regular", Consolas, monospace;
    line-height: 1;
}

.launch-tminus > span {
    margin-right: 0.16em;
    color: var(--text-muted);
    font-size: clamp(1rem, 2vw, 1.35rem);
}

.launch-tminus strong {
    min-width: 2.8ch;
    font-size: clamp(2.4rem, 5.5vw, 4.2rem);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.08em;
    text-align: right;
}

.launch-tminus small {
    margin-left: 0.5rem;
    color: var(--text-secondary);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.14em;
}

.launch-clock {
    position: relative;
    z-index: 1;
    display: grid;
    width: min(100%, 330px);
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: start;
    gap: 0.45rem;
    font-family: "SFMono-Regular", Consolas, monospace;
}

.launch-clock > div {
    display: grid;
    min-width: 0;
    padding: 0.55rem 0.45rem;
    gap: 0.15rem;
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: var(--radius-sm);
    background: rgba(1, 6, 12, 0.48);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
    text-align: center;
}

.launch-clock > span {
    padding-top: 0.5rem;
    color: rgba(79, 217, 255, 0.42);
    font-size: 1.25rem;
    animation: launch-colon 1s steps(1, end) infinite;
}

.launch-clock strong {
    font-size: clamp(1.15rem, 2.6vw, 1.65rem);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.launch-clock small {
    color: var(--text-muted);
    font-size: 0.52rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.launch-core-message {
    position: relative;
    z-index: 1;
    max-width: 38ch;
    margin: 0;
    color: var(--text-secondary);
    font-size: clamp(0.68rem, 1.2vw, 0.78rem);
    line-height: 1.55;
    text-align: center;
}

.launch-core-footer {
    padding-top: 0.7rem;
    border-top: 1px solid rgba(255, 255, 255, 0.075);
    color: var(--text-muted);
}

.launch-core-footer i {
    height: 1px;
    flex: 1;
    background: linear-gradient(90deg, transparent, rgba(79, 217, 255, 0.3), transparent);
}

.launch-noscript {
    position: absolute;
    z-index: 4;
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    margin: 0;
    padding: 0.65rem;
    border-radius: var(--radius-sm);
    background: rgba(4, 9, 16, 0.94);
    color: var(--text-secondary);
    font-size: 0.72rem;
    text-align: center;
}

.hero-orbit {
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    aspect-ratio: 1;
    border: 1px solid rgba(79, 217, 255, 0.13);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.hero-orbit::before {
    position: absolute;
    top: 50%;
    left: -4px;
    width: 8px;
    height: 8px;
    content: "";
    border-radius: 50%;
    background: var(--accent-primary);
    box-shadow: 0 0 18px rgba(79, 217, 255, 0.75);
}

.hero-orbit--outer { width: min(580px, 92%); animation: orbit-spin 34s linear infinite; }
.hero-orbit--inner { width: min(430px, 70%); border-color: rgba(57, 229, 140, 0.1); animation: orbit-spin 24s linear infinite reverse; }
.hero-orbit--inner::before { background: var(--accent-green); box-shadow: 0 0 18px rgba(57, 229, 140, 0.62); }

.project-signal {
    display: grid;
    padding: 0.7rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-lg);
    background: rgba(8, 14, 24, 0.72);
    box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    -webkit-backdrop-filter: blur(var(--blur-md));
    backdrop-filter: blur(var(--blur-md));
}

.signal-item {
    display: flex;
    min-width: 0;
    min-height: 88px;
    padding: 1rem;
    align-items: center;
    gap: var(--space-3);
    border-right: 1px solid var(--border-soft);
}

.signal-item:last-child { border-right: 0; }
.signal-item > span { color: rgba(79, 217, 255, 0.42); font-family: "SFMono-Regular", Consolas, monospace; font-size: 0.68rem; font-weight: 800; }
.signal-item small, .signal-item strong { display: block; }
.signal-item small { color: var(--text-muted); font-size: 0.62rem; }
.signal-item strong { overflow: hidden; font-size: 0.78rem; text-overflow: ellipsis; white-space: nowrap; }

.signal-item--launch {
    background: linear-gradient(135deg, rgba(79, 217, 255, 0.075), transparent);
}

.signal-item--launch strong {
    color: var(--accent-primary-strong);
}

.world-preview-shell {
    position: relative;
    display: grid;
    padding: clamp(1.5rem, 5vw, 4.5rem);
    grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
    align-items: center;
    gap: clamp(2.5rem, 7vw, 7rem);
    overflow: hidden;
    border-radius: var(--radius-xl);
}

.world-preview-shell::before {
    position: absolute;
    top: -14rem;
    right: -8rem;
    width: 38rem;
    aspect-ratio: 1;
    content: "";
    border-radius: 50%;
    background: rgba(22, 140, 255, 0.11);
    filter: blur(95px);
}

.world-preview-copy, .world-path { position: relative; z-index: 1; }
.world-preview-copy .section-title { margin: var(--space-4) 0 var(--space-5); }
.world-preview-copy > p:not(.section-label) { max-width: 660px; color: var(--text-secondary); }
.world-preview-copy .btn { margin-top: var(--space-5); }

.world-path {
    display: grid;
    padding: clamp(1rem, 3vw, 2rem);
    gap: var(--space-3);
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: var(--radius-lg);
    background: rgba(3, 8, 15, 0.45);
}

.world-path-line {
    position: absolute;
    top: 3rem;
    bottom: 3rem;
    left: calc(clamp(1rem, 3vw, 2rem) + 19px);
    width: 1px;
    background: linear-gradient(var(--accent-primary), rgba(79, 217, 255, 0.06));
}

.path-node {
    position: relative;
    display: grid;
    min-height: 62px;
    padding: 0.7rem 0.85rem;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: var(--space-3);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.025);
}

.path-node > span { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid var(--border-soft); border-radius: 12px; background: rgba(5, 10, 18, 0.92); color: var(--text-muted); font-family: "SFMono-Regular", Consolas, monospace; font-size: 0.62rem; font-weight: 850; }
.path-node small, .path-node strong { display: block; }
.path-node small { color: var(--text-muted); font-size: 0.61rem; }
.path-node strong { font-size: 0.84rem; }
.path-node.is-active { border-color: rgba(79, 217, 255, 0.16); background: rgba(79, 217, 255, 0.055); }
.path-node.is-active > span { border-color: var(--border-active); color: var(--accent-primary-strong); box-shadow: 0 0 20px rgba(79, 217, 255, 0.12); }

.systems-showcase::before { position: absolute; z-index: -1; top: 20%; right: 0; width: 28rem; height: 28rem; content: ""; border-radius: 50%; background: rgba(57, 229, 140, 0.055); filter: blur(100px); }
.system-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.system-category { position: relative; min-height: 245px; padding: var(--space-6); overflow: hidden; border-radius: var(--radius-lg); transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base); }
.system-category:hover { border-color: var(--border-active); transform: translateY(-5px); box-shadow: 0 24px 68px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.1); }
.system-category > span { position: absolute; top: 1rem; right: 1.2rem; color: rgba(255, 255, 255, 0.09); font-size: 2rem; font-weight: 900; }
.system-category-icon { display: grid; width: 48px; height: 48px; margin-bottom: var(--space-5); place-items: center; border: 1px solid rgba(79, 217, 255, 0.18); border-radius: 14px; background: rgba(79, 217, 255, 0.07); color: var(--accent-primary-strong); }
.system-category-icon .icon { width: 23px; height: 23px; }
.system-category h3 { margin-bottom: var(--space-2); font-size: 1.03rem; }
.system-category p { color: var(--text-muted); font-size: 0.82rem; }

.systems-footer { display: flex; margin-top: var(--space-5); padding: var(--space-5); align-items: center; justify-content: space-between; gap: var(--space-5); border-radius: var(--radius-lg); }
.systems-footer strong, .systems-footer span { display: block; }
.systems-footer strong { font-size: 1.15rem; }
.systems-footer span { color: var(--text-muted); font-size: 0.72rem; }

.launch-manifest-section {
    padding-top: clamp(4rem, 8vw, 7rem);
    padding-bottom: clamp(4.5rem, 9vw, 8rem);
}

.launch-manifest {
    position: relative;
    display: grid;
    padding: clamp(1.5rem, 5vw, 4rem);
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    align-items: center;
    gap: clamp(2.5rem, 7vw, 7rem);
    overflow: hidden;
    border-color: rgba(79, 217, 255, 0.16);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(125deg, rgba(12, 23, 38, 0.88), rgba(4, 9, 17, 0.92)),
        radial-gradient(circle at 78% 42%, rgba(22, 140, 255, 0.16), transparent 38%);
    isolation: isolate;
}

.launch-manifest::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: "";
    opacity: 0.22;
    background-image: linear-gradient(90deg, rgba(79, 217, 255, 0.08) 1px, transparent 1px);
    background-size: 92px 100%;
    pointer-events: none;
}

.launch-manifest-glow {
    position: absolute;
    z-index: -1;
    top: 16%;
    right: 5%;
    width: 33rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(22, 140, 255, 0.14);
    filter: blur(100px);
    pointer-events: none;
}

.launch-manifest-copy,
.launch-monument,
.launch-rail {
    position: relative;
    z-index: 1;
}

.launch-manifest-copy .section-title {
    max-width: 13ch;
    margin: var(--space-4) 0 var(--space-5);
}

.launch-manifest-copy blockquote {
    margin: var(--space-6) 0 0;
    padding: 0.2rem 0 0.2rem 1rem;
    border-left: 2px solid var(--accent-primary);
    color: var(--text-primary);
    font-size: clamp(1rem, 2vw, 1.25rem);
    font-weight: 760;
    line-height: 1.45;
}

.launch-manifest-copy .btn-row {
    margin-top: var(--space-7);
}

.launch-monument {
    display: grid;
    min-height: 320px;
    padding: clamp(1.25rem, 3vw, 2rem);
    place-items: center;
    align-content: center;
    gap: var(--space-6);
    overflow: hidden;
    border: 1px solid rgba(79, 217, 255, 0.18);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.015)),
        rgba(3, 8, 15, 0.58);
    box-shadow: 0 25px 75px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

.launch-monument::before,
.launch-monument::after {
    position: absolute;
    content: "";
    pointer-events: none;
}

.launch-monument::before {
    width: 290px;
    aspect-ratio: 1;
    border: 1px solid rgba(79, 217, 255, 0.11);
    border-radius: 50%;
    box-shadow: 0 0 70px rgba(79, 217, 255, 0.08), inset 0 0 60px rgba(79, 217, 255, 0.04);
    animation: orbit-pulse 6s ease-in-out infinite;
}

.launch-monument::after {
    right: 8%;
    bottom: 12%;
    left: 8%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(79, 217, 255, 0.42), transparent);
}

.launch-monument-label {
    position: relative;
    padding: 0.45rem 0.75rem;
    border: 1px solid rgba(57, 229, 140, 0.2);
    border-radius: var(--radius-pill);
    background: rgba(57, 229, 140, 0.055);
    color: var(--accent-green);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.1em;
}

.launch-monument time {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: clamp(0.25rem, 1vw, 0.7rem);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-variant-numeric: tabular-nums;
    line-height: 0.82;
    white-space: nowrap;
}

.launch-monument time strong {
    font-size: clamp(2.7rem, 5vw, 4.6rem);
    letter-spacing: -0.095em;
    text-shadow: 0 0 30px rgba(79, 217, 255, 0.14);
}

.launch-monument time strong:last-child {
    color: var(--accent-primary-strong);
}

.launch-monument time i {
    color: rgba(79, 217, 255, 0.32);
    font-size: clamp(1.3rem, 2.5vw, 2rem);
    font-style: normal;
    font-weight: 300;
}

.launch-monument > p {
    position: relative;
    margin: 0;
    color: var(--text-secondary);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.11em;
}

.launch-monument > p span {
    margin-inline: 0.4rem;
    color: var(--accent-primary);
}

.launch-rail {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: auto minmax(120px, 1fr) auto;
    align-items: center;
    gap: var(--space-5);
}

.launch-rail-node {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: var(--space-3);
    align-items: center;
}

.launch-rail-node > span {
    grid-row: 1 / 3;
    width: 10px;
    height: 10px;
    border: 2px solid rgba(79, 217, 255, 0.65);
    border-radius: 50%;
    background: var(--bg-primary);
    box-shadow: 0 0 17px rgba(79, 217, 255, 0.42);
}

.launch-rail-node.is-current > span {
    border-color: var(--accent-green);
    box-shadow: 0 0 17px rgba(57, 229, 140, 0.48);
}

.launch-rail-node small,
.launch-rail-node strong {
    white-space: nowrap;
}

.launch-rail-node small {
    color: var(--text-muted);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.57rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.launch-rail-node strong {
    font-size: 0.76rem;
}

.launch-rail-track {
    position: relative;
    height: 1px;
    overflow: visible;
    background: rgba(255, 255, 255, 0.09);
}

.launch-rail-track i {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, var(--accent-green), var(--accent-primary), rgba(79, 217, 255, 0.12));
    opacity: 0.65;
}

.launch-rail-track b {
    position: absolute;
    top: -3px;
    left: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent-primary-strong);
    box-shadow: 0 0 14px rgba(79, 217, 255, 0.82);
    animation: launch-packet 5s ease-in-out infinite;
}

body[data-launch-state="final-month"] .launch-core,
body[data-launch-state="final-week"] .launch-core {
    border-color: rgba(79, 217, 255, 0.31);
    box-shadow: 0 38px 110px rgba(0, 0, 0, 0.48), 0 0 100px rgba(22, 140, 255, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body[data-launch-state="final-day"] .launch-core,
body[data-launch-state="final-hour"] .launch-core,
body[data-launch-state="final-ten"] .launch-core {
    border-color: rgba(255, 184, 77, 0.38);
    box-shadow: 0 38px 110px rgba(0, 0, 0, 0.5), 0 0 110px rgba(255, 184, 77, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body[data-launch-state="final-ten"] .launch-core {
    animation: launch-final-pulse 1s ease-in-out infinite;
}

body[data-launch-state="final-day"] .launch-core-top strong,
body[data-launch-state="final-hour"] .launch-core-top strong,
body[data-launch-state="final-ten"] .launch-core-top strong,
body[data-launch-state="final-day"] .launch-tminus,
body[data-launch-state="final-hour"] .launch-tminus,
body[data-launch-state="final-ten"] .launch-tminus {
    color: var(--accent-amber);
}

body[data-launch-state="launched"] .launch-core,
body[data-launch-state="launched"] .launch-monument {
    border-color: rgba(57, 229, 140, 0.35);
    box-shadow: 0 38px 110px rgba(0, 0, 0, 0.5), 0 0 110px rgba(57, 229, 140, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body[data-launch-state="launched"] .launch-progress-ring {
    background: conic-gradient(var(--accent-green) 1turn, var(--accent-green) 0);
}

body[data-launch-state="launched"] .launch-tminus small {
    font-size: 0;
}

body[data-launch-state="launched"] .launch-tminus small::after {
    content: "START";
    font-size: 0.65rem;
}

@keyframes launch-beacon {
    from { opacity: 0.8; transform: scale(0.55); }
    to { opacity: 0; transform: scale(1.5); }
}

@keyframes launch-scan {
    0%, 12% { transform: translateY(-120%); opacity: 0; }
    28%, 68% { opacity: 1; }
    88%, 100% { transform: translateY(760%); opacity: 0; }
}

@keyframes launch-frame-rotate {
    to { transform: rotate(372deg); }
}

@keyframes launch-colon {
    50% { opacity: 0.2; }
}

@keyframes launch-packet {
    0% { left: 0; opacity: 0; }
    12% { opacity: 1; }
    88% { opacity: 1; }
    100% { left: calc(100% - 7px); opacity: 0; }
}

@keyframes launch-final-pulse {
    50% { border-color: rgba(255, 184, 77, 0.62); transform: scale(1.003); }
}

.roadmap-grid { display: grid; margin: 0; padding: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); list-style: none; }
.roadmap-card { position: relative; min-height: 230px; padding: var(--space-6); overflow: hidden; border-radius: var(--radius-lg); }
.roadmap-card > span { display: block; margin-bottom: var(--space-8); color: var(--accent-primary-strong); font-family: "SFMono-Regular", Consolas, monospace; font-size: 0.7rem; font-weight: 850; }
.roadmap-card small, .roadmap-card strong { display: block; }
.roadmap-card small { margin-bottom: 0.35rem; color: var(--text-muted); font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase; }
.roadmap-card strong { font-size: 0.94rem; }
.roadmap-card p { margin-top: var(--space-3); color: var(--text-muted); font-size: 0.76rem; }

.launch-window { display: flex; width: fit-content; margin: var(--space-5) auto 0; padding: 0.85rem 1.1rem; align-items: center; gap: var(--space-3); border-radius: var(--radius-pill); }
.launch-window small, .launch-window strong { display: block; }
.launch-window small { color: var(--text-muted); font-size: 0.6rem; }
.launch-window strong { font-size: 0.8rem; }

.community-cta { position: relative; display: grid; padding: clamp(1.5rem, 5vw, 3.5rem); grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(1.5rem, 4vw, 3rem); overflow: hidden; border-radius: var(--radius-xl); }
.community-signal { position: relative; display: grid; width: 112px; aspect-ratio: 1; place-items: center; border: 1px solid rgba(126, 139, 255, 0.22); border-radius: 30px; background: rgba(88, 101, 242, 0.09); }
.community-signal img { width: 74px; height: 74px; object-fit: contain; }
.community-signal span { position: absolute; inset: -12px; border: 1px solid rgba(126, 139, 255, 0.1); border-radius: 36px; animation: community-signal 3.2s ease-out infinite; }
.community-signal span:last-child { animation-delay: -1.6s; }

@keyframes community-signal { from { opacity: 0.5; transform: scale(0.82); } to { opacity: 0; transform: scale(1.28); } }

/* Login preview */
body.dialog-open { overflow: hidden; }
.login-dialog { position: fixed; width: min(calc(100% - 1.25rem), 590px); max-height: calc(100svh - 2rem); padding: 0; overflow: hidden auto; border: 1px solid rgba(147, 190, 255, 0.2); border-radius: var(--radius-xl); outline: 0; background: linear-gradient(145deg, rgba(14, 23, 38, 0.98), rgba(4, 8, 15, 0.97)); color: var(--text-primary); box-shadow: 0 40px 140px rgba(0, 0, 0, 0.68), inset 0 1px 0 rgba(255, 255, 255, 0.1); }
.login-dialog::backdrop { background: rgba(1, 4, 9, 0.8); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.login-dialog[open] { animation: dialog-enter 320ms cubic-bezier(0.2, 0.75, 0.2, 1); }
.login-dialog-glow { position: absolute; top: -12rem; right: -10rem; width: 26rem; aspect-ratio: 1; border-radius: 50%; background: rgba(22, 140, 255, 0.16); filter: blur(75px); pointer-events: none; }
.login-dialog-header, .login-dialog-actions { position: relative; display: flex; padding: 1rem 1.2rem; align-items: center; justify-content: space-between; gap: var(--space-4); border-bottom: 1px solid var(--border-soft); }
.login-dialog-brand { display: flex; align-items: center; gap: var(--space-3); }
.login-dialog-brand img { width: 48px; height: 48px; border-radius: 14px; }
.login-dialog-brand small, .login-dialog-brand strong { display: block; }
.login-dialog-brand small { color: var(--text-muted); font-size: 0.6rem; letter-spacing: 0.12em; }
.login-dialog-brand strong { font-size: 0.88rem; }
.dialog-close { display: grid; width: 44px; height: 44px; padding: 0; place-items: center; border: 1px solid var(--border-soft); border-radius: var(--radius-sm); background: rgba(255, 255, 255, 0.04); color: var(--text-secondary); cursor: pointer; }
.dialog-close:hover { border-color: var(--border-active); color: var(--text-primary); }
.login-dialog-body { position: relative; display: grid; padding: clamp(1.5rem, 5vw, 3rem); justify-items: center; text-align: center; }
.login-status-icon { display: grid; width: 74px; height: 74px; margin-bottom: var(--space-6); place-items: center; border: 1px solid rgba(79, 217, 255, 0.22); border-radius: 22px; background: rgba(79, 217, 255, 0.08); color: var(--accent-primary-strong); box-shadow: 0 0 38px rgba(22, 140, 255, 0.12); }
.login-status-icon .icon { width: 34px; height: 34px; }
.login-dialog-body .section-label { margin-bottom: var(--space-4); }
.login-dialog-body h2 { margin-bottom: var(--space-4); font-size: clamp(1.7rem, 5vw, 2.55rem); letter-spacing: -0.04em; line-height: 1.05; }
.login-dialog-body > p:last-of-type { max-width: 480px; color: var(--text-secondary); }
.login-safety { display: inline-flex; margin-top: var(--space-5); padding: 0.6rem 0.8rem; align-items: center; gap: var(--space-2); border: 1px solid rgba(57, 229, 140, 0.15); border-radius: var(--radius-pill); background: rgba(57, 229, 140, 0.05); color: #a9f7cf; font-size: 0.64rem; font-weight: 750; }
.login-dialog-actions { justify-content: flex-end; border-top: 1px solid var(--border-soft); border-bottom: 0; background: rgba(2, 6, 13, 0.28); }
.login-noscript { position: relative; z-index: var(--z-content); padding-block: var(--space-8); }
.login-noscript > div { padding: clamp(1.25rem, 4vw, 2.5rem); border-radius: var(--radius-lg); }
.login-noscript h2 { margin: var(--space-3) 0; font-size: clamp(1.5rem, 4vw, 2.4rem); }
.login-noscript p:last-child { color: var(--text-secondary); }
@keyframes dialog-enter { from { opacity: 0; transform: translateY(18px) scale(0.97); } to { opacity: 1; transform: none; } }

/* World manifesto */
.reading-progress { position: fixed; z-index: 220; top: 0; right: 0; left: 0; height: 3px; background: rgba(255, 255, 255, 0.035); pointer-events: none; }
.reading-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--accent-primary), var(--discord), var(--accent-green)); box-shadow: 0 0 14px rgba(79, 217, 255, 0.48); transform: scaleX(0); transform-origin: left center; will-change: transform; }

.world-hero { display: grid; min-height: min(920px, 100svh); padding-top: clamp(9rem, 16vh, 12rem); padding-bottom: clamp(4rem, 8vw, 7rem); grid-template-columns: minmax(0, 1fr) minmax(420px, 0.8fr); align-items: center; gap: clamp(3rem, 7vw, 7rem); }
.world-hero-copy .eyebrow { margin-bottom: var(--space-6); }
.world-hero h1 { max-width: 11ch; margin-bottom: var(--space-6); font-size: clamp(3.2rem, 7vw, 7rem); line-height: 0.92; letter-spacing: -0.065em; text-wrap: balance; }

.world-core { position: relative; display: grid; min-height: 540px; place-items: center; overflow: hidden; border-radius: var(--radius-xl); }
.world-core > img { position: relative; z-index: 2; width: min(58%, 300px); border-radius: 24%; filter: drop-shadow(0 30px 48px rgba(0, 0, 0, 0.5)) drop-shadow(0 0 25px rgba(79, 217, 255, 0.15)); }
.world-core-rings span { position: absolute; top: 50%; left: 50%; width: 62%; aspect-ratio: 1; border: 1px solid rgba(79, 217, 255, 0.16); border-radius: 50%; transform: translate(-50%, -50%); }
.world-core-rings span:nth-child(2) { width: 82%; border-color: rgba(88, 101, 242, 0.13); }
.world-core-rings span:nth-child(3) { width: 108%; border-color: rgba(57, 229, 140, 0.08); }
.core-label { position: absolute; z-index: 3; min-width: 132px; padding: 0.7rem 0.85rem; border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: rgba(6, 12, 21, 0.82); box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.07); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.core-label small, .core-label strong { display: block; }
.core-label small { color: var(--text-muted); font-size: 0.56rem; text-transform: uppercase; }
.core-label strong { font-size: 0.76rem; }
.core-label--one { top: 10%; left: 9%; }
.core-label--two { top: 22%; right: 6%; }
.core-label--three { right: 10%; bottom: 13%; }
.core-label--four { bottom: 8%; left: 8%; }

.world-facts { display: grid; margin-bottom: clamp(4rem, 8vw, 7rem); grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); background: rgba(7, 13, 23, 0.72); box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.06); overflow: hidden; }
.world-facts > div { min-width: 0; padding: var(--space-5); border-right: 1px solid var(--border-soft); }
.world-facts > div:last-child { border-right: 0; }
.world-facts span, .world-facts strong, .world-facts small { display: block; }
.world-facts span { margin-bottom: var(--space-5); color: var(--accent-primary-strong); font-family: "SFMono-Regular", Consolas, monospace; font-size: 0.64rem; }
.world-facts strong { font-size: 0.84rem; }
.world-facts small { margin-top: 0.25rem; color: var(--text-muted); font-size: 0.62rem; }

.world-story { display: grid; padding-bottom: clamp(5rem, 10vw, 9rem); grid-template-columns: 270px minmax(0, 1fr); align-items: start; gap: clamp(2rem, 5vw, 5rem); }
.chapter-nav { position: sticky; top: calc(var(--nav-height) + 2.5rem); padding: var(--space-5); border-radius: var(--radius-lg); }
.chapter-nav h2 { margin: var(--space-3) 0 var(--space-5); font-size: 1.15rem; }
.chapter-nav nav { display: grid; gap: 0.25rem; }
.chapter-nav nav a { position: relative; min-height: 40px; padding: 0.58rem 0.7rem 0.58rem 1rem; border-radius: var(--radius-sm); color: var(--text-muted); font-size: 0.72rem; font-weight: 700; transition: color var(--transition-fast), background var(--transition-fast); }
.chapter-nav nav a::before { position: absolute; top: 50%; left: 0.35rem; width: 4px; height: 4px; content: ""; border-radius: 50%; background: currentColor; transform: translateY(-50%); }
.chapter-nav nav a:hover, .chapter-nav nav a.is-active { background: rgba(79, 217, 255, 0.065); color: var(--accent-primary-strong); }
.chapter-cta { display: flex; min-height: 44px; margin-top: var(--space-5); padding: 0.65rem 0.75rem; align-items: center; gap: var(--space-2); border: 1px solid rgba(126, 139, 255, 0.18); border-radius: var(--radius-sm); background: rgba(88, 101, 242, 0.08); color: #c6caff; font-size: 0.66rem; font-weight: 800; }
.chapter-cta img { width: 20px; height: 20px; }

.world-article { display: grid; min-width: 0; gap: var(--space-5); }
.world-chapter { position: relative; padding: clamp(1.5rem, 5vw, 4.5rem); overflow: hidden; border-radius: var(--radius-xl); scroll-margin-top: calc(var(--nav-height) + 2rem); }
.world-chapter::after { position: absolute; top: -10rem; right: -10rem; width: 24rem; aspect-ratio: 1; content: ""; border-radius: 50%; background: rgba(79, 217, 255, 0.04); filter: blur(70px); pointer-events: none; }
.world-chapter > * { position: relative; z-index: 1; }
.chapter-number { position: absolute; z-index: 0; top: 1rem; right: 1.5rem; color: rgba(255, 255, 255, 0.05); font-size: clamp(4rem, 10vw, 8rem); font-weight: 900; letter-spacing: -0.08em; line-height: 1; }
.world-chapter h2 { max-width: 17ch; margin: var(--space-4) 0 var(--space-6); font-size: clamp(2rem, 4.5vw, 4.2rem); line-height: 1.02; letter-spacing: -0.05em; text-wrap: balance; }
.world-chapter h3 { margin: var(--space-10) 0 var(--space-4); font-size: clamp(1.25rem, 2.4vw, 1.7rem); letter-spacing: -0.03em; }
.world-chapter > p:not(.section-label), .world-chapter li { max-width: 76ch; color: var(--text-secondary); font-size: clamp(0.98rem, 1.4vw, 1.08rem); line-height: 1.82; }
.world-chapter blockquote { margin: var(--space-8) 0 0; padding: var(--space-5) var(--space-6); border: 1px solid rgba(79, 217, 255, 0.14); border-left: 3px solid var(--accent-primary); border-radius: 0 var(--radius-md) var(--radius-md) 0; background: rgba(79, 217, 255, 0.045); color: var(--text-primary); font-size: clamp(1.05rem, 2vw, 1.3rem); font-weight: 750; }

.world-definition-list { display: grid; margin: var(--space-6) 0 0; padding: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); list-style: none; }
.world-definition-list li { padding: var(--space-4); border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: rgba(255, 255, 255, 0.025); }
.world-definition-list strong, .world-definition-list span { display: block; }
.world-definition-list strong { color: var(--text-primary); font-size: 0.82rem; }
.world-definition-list span { margin-top: 0.3rem; color: var(--text-muted); font-size: 0.72rem; line-height: 1.5; }
.world-chapter--final { border-color: rgba(79, 217, 255, 0.2); }
.world-definition { margin-top: var(--space-8); padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid rgba(57, 229, 140, 0.16); border-radius: var(--radius-lg); background: rgba(57, 229, 140, 0.045); }
.world-definition small { color: var(--accent-green); font-weight: 850; letter-spacing: 0.1em; text-transform: uppercase; }
.world-definition p { margin-top: var(--space-3); color: var(--text-primary); font-size: clamp(1rem, 1.7vw, 1.18rem); }
.world-final-actions { display: flex; margin-top: var(--space-6); flex-wrap: wrap; gap: var(--space-3); }
.world-slogans { padding: clamp(2rem, 5vw, 4rem); }
.world-slogans h2 { margin: var(--space-4) 0 var(--space-6); font-size: clamp(2rem, 4vw, 3.6rem); letter-spacing: -0.045em; }
.slogan-cloud { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.slogan-cloud span { padding: 0.65rem 0.85rem; border: 1px solid var(--border-soft); border-radius: var(--radius-pill); background: rgba(255, 255, 255, 0.035); color: var(--text-secondary); font-size: 0.75rem; font-weight: 700; }

/* Plugin directory */
.subpage-hero {
    padding-top: clamp(9rem, 18vw, 13rem);
    padding-bottom: clamp(3.5rem, 7vw, 5rem);
    text-align: center;
}

.subpage-hero .eyebrow,
.subpage-hero .section-label {
    margin-inline: auto;
}

.subpage-hero .display-title {
    max-width: 16ch;
    margin: var(--space-6) auto;
}

.subpage-hero .lead {
    margin-inline: auto;
}

.directory-shell {
    padding: clamp(1rem, 2.6vw, 1.5rem);
    border-radius: var(--radius-xl);
}

.directory-toolbar {
    display: grid;
    margin-bottom: var(--space-8);
    grid-template-columns: minmax(240px, 1fr) auto;
    align-items: center;
    gap: var(--space-4);
}

.search-field {
    position: relative;
}

.search-field .icon {
    position: absolute;
    top: 50%;
    left: 1rem;
    color: var(--text-muted);
    transform: translateY(-50%);
    pointer-events: none;
}

.search-input {
    width: 100%;
    min-height: 50px;
    padding: 0.75rem 1rem 0.75rem 3rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    outline: 0;
    background: rgba(2, 7, 13, 0.5);
    color: var(--text-primary);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}

.search-input::placeholder {
    color: var(--text-muted);
}

.search-input:focus {
    border-color: var(--accent-primary);
    background: rgba(5, 12, 21, 0.82);
    box-shadow: var(--shadow-focus);
}

.result-count {
    color: var(--text-secondary);
    font-size: 0.84rem;
    font-weight: 750;
    white-space: nowrap;
}

.filter-group {
    display: flex;
    margin-bottom: var(--space-8);
    padding-bottom: 0;
    flex-wrap: wrap;
    gap: var(--space-2);
    overflow: visible;
}

.filter-button {
    min-height: 44px;
    padding: 0.62rem 0.9rem;
    flex: 0 0 auto;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.035);
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 780;
    cursor: pointer;
    transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-base);
}

.filter-button:hover {
    border-color: var(--border-active);
    color: var(--text-primary);
}

.filter-button[aria-pressed="true"] {
    border-color: rgba(79, 217, 255, 0.36);
    background: rgba(79, 217, 255, 0.12);
    color: var(--accent-primary-strong);
}

.plugin-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.plugin-card {
    --category-accent: var(--accent-primary);
    position: relative;
    min-width: 0;
    border-radius: var(--radius-lg);
    transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), opacity var(--transition-base);
}

.plugin-card[data-category="security"] { --category-accent: #64c8ff; }
.plugin-card[data-category="lands"] { --category-accent: var(--accent-amber); }
.plugin-card[data-category="gameplay"] { --category-accent: var(--accent-green); }
.plugin-card[data-category="economy"] { --category-accent: #61d9c6; }
.plugin-card[data-category="admin"] { --category-accent: #ff8793; }
.plugin-card[data-category="utility"] { --category-accent: #9ac1ff; }
.plugin-card[data-category="interface"] { --category-accent: #7fe8ff; }

.plugin-card[hidden] {
    display: none;
}

.plugin-card:hover,
.plugin-card:focus-within {
    border-color: color-mix(in srgb, var(--category-accent) 40%, transparent);
    transform: translateY(-5px);
    box-shadow: 0 24px 68px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.plugin-card details {
    height: 100%;
}

@supports selector(details::details-content) {
    .plugin-card details::details-content {
        block-size: 0;
        overflow: hidden;
        opacity: 0;
        transition: block-size var(--transition-base), content-visibility var(--transition-base), opacity var(--transition-base);
        transition-behavior: allow-discrete;
    }

    .plugin-card details[open]::details-content {
        block-size: auto;
        opacity: 1;
    }
}

.plugin-card summary {
    display: grid;
    min-height: 320px;
    padding: var(--space-6);
    grid-template-rows: auto auto 1fr auto;
    cursor: pointer;
    list-style: none;
}

.plugin-card summary::-webkit-details-marker {
    display: none;
}

.plugin-card summary:focus-visible {
    border-radius: var(--radius-lg);
    outline-offset: -4px;
}

.plugin-icon {
    display: grid;
    width: 52px;
    height: 52px;
    margin-bottom: var(--space-5);
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--category-accent) 34%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--category-accent) 10%, transparent);
    color: var(--category-accent);
}

.plugin-icon .icon {
    width: 25px;
    height: 25px;
}

.plugin-category {
    display: block;
    margin-bottom: var(--space-2);
    color: var(--category-accent);
    font-size: 0.66rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.plugin-card h2 {
    margin-bottom: var(--space-3);
    font-size: 1.18rem;
    letter-spacing: -0.02em;
}

.plugin-summary-copy {
    margin-bottom: var(--space-5);
    color: var(--text-secondary);
    font-size: 0.88rem;
}

.plugin-summary-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.expand-label {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: var(--space-2);
    color: var(--text-primary);
    font-size: 0.76rem;
    font-weight: 800;
}

.expand-label .icon {
    width: 16px;
    height: 16px;
    transition: transform var(--transition-base);
}

details[open] .expand-label .icon {
    transform: rotate(180deg);
}

.plugin-details {
    padding: 0 var(--space-6) var(--space-6);
    color: var(--text-secondary);
    font-size: 0.88rem;
}

.plugin-details-inner {
    padding-top: var(--space-5);
    border-top: 1px solid var(--border-soft);
}

.plugin-details h3 {
    margin-bottom: var(--space-3);
    color: var(--text-primary);
    font-size: 0.82rem;
}

.plugin-details ul {
    margin: 0;
    padding-left: 1.1rem;
}

.plugin-details li + li {
    margin-top: 0.4rem;
}

.empty-state {
    display: none;
    padding: clamp(2rem, 6vw, 4rem);
    border: 1px dashed var(--border-strong);
    border-radius: var(--radius-lg);
    text-align: center;
}

.empty-state.is-visible {
    display: block;
}

.empty-state .icon {
    width: 40px;
    height: 40px;
    margin: 0 auto var(--space-4);
    color: var(--text-muted);
}

/* Advanced plugin directory */
.plugin-hero {
    text-align: left;
}

.plugin-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr);
    align-items: center;
    gap: clamp(2.5rem, 7vw, 7rem);
}

.plugin-hero .eyebrow,
.plugin-hero .display-title,
.plugin-hero .lead {
    margin-inline: 0;
}

.plugin-hero .display-title {
    max-width: 13ch;
}

.plugin-hero-stats {
    display: grid;
    padding: clamp(1rem, 3vw, 1.5rem);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-radius: var(--radius-xl);
}

.plugin-hero-stats > div {
    min-width: 0;
    padding: clamp(1rem, 3vw, 1.5rem);
    border-right: 1px solid var(--border-soft);
}

.plugin-hero-stats > div:last-child {
    border-right: 0;
}

.plugin-hero-stats strong,
.plugin-hero-stats span {
    display: block;
}

.plugin-hero-stats strong {
    margin-bottom: var(--space-3);
    color: var(--accent-primary-strong);
    font-size: clamp(2rem, 5vw, 3.3rem);
    letter-spacing: -0.055em;
    line-height: 1;
}

.plugin-hero-stats span {
    color: var(--text-muted);
    font-size: 0.66rem;
    line-height: 1.45;
}

.plugin-directory-section {
    scroll-margin-top: calc(var(--nav-height) + 1.5rem);
}

.directory-toolbar--advanced {
    position: sticky;
    z-index: 8;
    top: calc(var(--nav-height) + 1.4rem);
    padding: 0.65rem;
    grid-template-columns: minmax(240px, 1fr) minmax(190px, 0.34fr) auto;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-lg);
    background: rgba(5, 10, 18, 0.9);
    box-shadow: 0 15px 42px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    -webkit-backdrop-filter: blur(20px) saturate(135%);
    backdrop-filter: blur(20px) saturate(135%);
}

.sort-field {
    position: relative;
}

.sort-field .icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 0.85rem;
    width: 18px;
    height: 18px;
    color: var(--text-muted);
    transform: translateY(-50%);
    pointer-events: none;
}

.sort-field select {
    width: 100%;
    min-height: 50px;
    padding: 0.7rem 2.2rem 0.7rem 2.65rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    outline: 0;
    appearance: none;
    background: rgba(2, 7, 13, 0.5);
    color: var(--text-primary);
    cursor: pointer;
    font-size: 0.78rem;
}

.sort-field::after {
    position: absolute;
    top: 50%;
    right: 0.9rem;
    width: 7px;
    height: 7px;
    content: "";
    border-right: 1px solid var(--text-muted);
    border-bottom: 1px solid var(--text-muted);
    transform: translateY(-70%) rotate(45deg);
    pointer-events: none;
}

.sort-field select:focus {
    border-color: var(--accent-primary);
    box-shadow: var(--shadow-focus);
}

.filter-reset {
    display: inline-flex;
    min-height: 50px;
    padding: 0.65rem 0.85rem;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.045);
    color: var(--text-secondary);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 800;
}

.filter-reset:hover {
    border-color: var(--border-active);
    color: var(--text-primary);
}

.filter-reset .icon {
    width: 16px;
    height: 16px;
}

.directory-status {
    display: flex;
    margin: -1.1rem 0 var(--space-5);
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
}

.directory-status p {
    margin: 0;
}

.directory-hint {
    color: var(--text-muted);
    font-size: 0.66rem;
}

.empty-state .btn {
    margin-top: var(--space-5);
}

.plugin-standards {
    display: grid;
    padding: clamp(1.5rem, 5vw, 4rem);
    grid-template-columns: minmax(0, 0.8fr) minmax(420px, 1.2fr);
    align-items: center;
    gap: clamp(2rem, 6vw, 6rem);
    border-radius: var(--radius-xl);
}

.plugin-standards header .section-title {
    margin: var(--space-4) 0 var(--space-5);
}

.standard-list {
    display: grid;
    margin: 0;
    padding: 0;
    gap: var(--space-3);
    list-style: none;
}

.standard-list li {
    display: grid;
    padding: var(--space-4);
    grid-template-columns: 42px minmax(0, 1fr);
    gap: var(--space-4);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.027);
}

.standard-list > li > span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(79, 217, 255, 0.16);
    border-radius: 13px;
    background: rgba(79, 217, 255, 0.06);
    color: var(--accent-primary-strong);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.62rem;
    font-weight: 850;
}

.standard-list strong {
    font-size: 0.86rem;
}

.standard-list p {
    margin-top: 0.3rem;
    color: var(--text-muted);
    font-size: 0.72rem;
}

/* Discord community gateway */
.discord-experience {
    position: relative;
    display: flex;
    min-height: 100svh;
    padding: clamp(7.5rem, 10vw, 9.5rem) clamp(0.75rem, 2vw, 2rem) clamp(2rem, 5vw, 4rem);
    align-items: center;
    isolation: isolate;
}

.discord-experience::before {
    position: fixed;
    z-index: -1;
    inset: 0;
    content: "";
    background: radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgba(88, 101, 242, 0.14), transparent 22rem);
    pointer-events: none;
}

.discord-console {
    position: relative;
    width: min(100%, 1280px);
    margin-inline: auto;
    overflow: hidden;
    border-color: rgba(147, 190, 255, 0.18);
    border-radius: clamp(22px, 3vw, 36px);
    background:
        linear-gradient(145deg, rgba(13, 21, 36, 0.9), rgba(5, 9, 18, 0.78)),
        rgba(5, 9, 16, 0.82);
    box-shadow: 0 34px 120px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.11);
}

.discord-console::before {
    position: absolute;
    top: -1px;
    left: 8%;
    width: 54%;
    height: 1px;
    content: "";
    background: linear-gradient(90deg, transparent, rgba(79, 217, 255, 0.85), rgba(88, 101, 242, 0.8), transparent);
    box-shadow: 0 0 28px rgba(79, 217, 255, 0.4);
}

.console-topbar {
    display: flex;
    min-height: 64px;
    padding: 0.9rem clamp(1.2rem, 3vw, 2rem);
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    border-bottom: 1px solid rgba(255, 255, 255, 0.075);
    background: rgba(2, 6, 13, 0.32);
}

.console-route {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: var(--space-4);
}

.route-kicker,
.route-address,
.control-kicker {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    letter-spacing: 0.08em;
}

.route-kicker {
    color: var(--accent-primary-strong);
    font-size: 0.66rem;
    font-weight: 800;
}

.route-address {
    position: relative;
    padding-left: var(--space-4);
    overflow: hidden;
    color: var(--text-muted);
    font-size: 0.66rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.route-address::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 1rem;
    content: "";
    background: var(--border-strong);
    transform: translateY(-50%);
}

.network-status {
    display: inline-flex;
    min-height: 32px;
    padding: 0.35rem 0.7rem;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.55rem;
    border: 1px solid rgba(57, 229, 140, 0.16);
    border-radius: var(--radius-pill);
    background: rgba(57, 229, 140, 0.055);
    color: #a9f7cf;
    font-size: 0.68rem;
    font-weight: 800;
}

.network-indicator {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent-green);
    box-shadow: 0 0 0 4px rgba(57, 229, 140, 0.1), 0 0 14px rgba(57, 229, 140, 0.7);
    animation: network-pulse 2.2s ease-in-out infinite;
}

.network-status.is-offline {
    border-color: rgba(255, 184, 77, 0.2);
    background: rgba(255, 184, 77, 0.07);
    color: #ffd69b;
}

.network-status.is-offline .network-indicator {
    background: var(--accent-amber);
    box-shadow: 0 0 0 4px rgba(255, 184, 77, 0.1), 0 0 14px rgba(255, 184, 77, 0.45);
    animation: none;
}

.discord-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(340px, 0.82fr);
}

.discord-main {
    position: relative;
    min-width: 0;
    padding: clamp(2rem, 5vw, 4.5rem);
    overflow: hidden;
}

.discord-main::after {
    position: absolute;
    z-index: -1;
    top: 4rem;
    left: -16rem;
    width: 34rem;
    aspect-ratio: 1;
    content: "";
    border-radius: 50%;
    background: rgba(79, 217, 255, 0.055);
    filter: blur(80px);
    pointer-events: none;
}

.redirect-brand-lockup {
    display: flex;
    margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
    align-items: center;
    gap: var(--space-4);
}

.redirect-logo,
.discord-mark {
    position: relative;
    display: grid;
    width: 70px;
    height: 70px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--border-soft);
    border-radius: 21px;
    background: rgba(255, 255, 255, 0.055);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 15px 34px rgba(0, 0, 0, 0.28);
}

.redirect-logo::after,
.discord-mark::after {
    position: absolute;
    inset: -5px;
    content: "";
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 25px;
    pointer-events: none;
}

.redirect-logo img {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    object-fit: cover;
}

.discord-mark {
    border-color: rgba(126, 139, 255, 0.2);
    background: linear-gradient(145deg, rgba(88, 101, 242, 0.2), rgba(88, 101, 242, 0.07));
}

.connector-line {
    position: relative;
    width: clamp(54px, 8vw, 94px);
    height: 2px;
    overflow: visible;
    background: linear-gradient(90deg, rgba(79, 217, 255, 0.25), rgba(79, 217, 255, 0.8), rgba(88, 101, 242, 0.8), rgba(88, 101, 242, 0.25));
    box-shadow: 0 0 16px rgba(94, 163, 255, 0.34);
}

.connector-line i {
    position: absolute;
    top: 50%;
    left: 0;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #dffaff;
    box-shadow: 0 0 10px var(--accent-primary);
    transform: translate(-50%, -50%);
    animation: packet-travel 2.4s linear infinite;
}

.connector-line i:nth-child(2) { animation-delay: -0.8s; }
.connector-line i:nth-child(3) { animation-delay: -1.6s; }

.discord-main h1 {
    max-width: 760px;
    margin-bottom: var(--space-5);
    font-size: clamp(2.45rem, 5.5vw, 4.75rem);
    line-height: 0.99;
    letter-spacing: -0.055em;
    text-wrap: balance;
}

.discord-main > .lead {
    max-width: 670px;
    margin-bottom: var(--space-6);
    font-size: clamp(1rem, 1.5vw, 1.12rem);
}

.connection-trust {
    display: flex;
    margin: 0 0 var(--space-8);
    padding: 0;
    flex-wrap: wrap;
    gap: var(--space-2);
    list-style: none;
}

.connection-trust li {
    display: inline-flex;
    min-height: 34px;
    padding: 0.38rem 0.66rem;
    align-items: center;
    gap: 0.45rem;
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.035);
    color: var(--text-secondary);
    font-size: 0.68rem;
    font-weight: 750;
}

.connection-trust .icon {
    width: 14px;
    height: 14px;
    color: var(--accent-primary-strong);
}

.redirect-control {
    position: relative;
    margin-bottom: var(--space-5);
    padding: clamp(1.1rem, 3vw, 1.6rem);
    overflow: hidden;
    border: 1px solid rgba(131, 176, 255, 0.14);
    border-radius: var(--radius-lg);
    background: linear-gradient(145deg, rgba(13, 21, 35, 0.74), rgba(3, 7, 14, 0.56));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 22px 52px rgba(0, 0, 0, 0.22);
}

.redirect-control::before {
    position: absolute;
    inset: 0;
    content: "";
    opacity: 0.05;
    background-image:
        linear-gradient(rgba(140, 233, 255, 0.35) 1px, transparent 1px),
        linear-gradient(90deg, rgba(140, 233, 255, 0.35) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(90deg, #000, transparent 70%);
    pointer-events: none;
}

.redirect-control > * {
    position: relative;
}

.countdown-header {
    display: flex;
    margin-bottom: var(--space-5);
    align-items: center;
    justify-content: space-between;
    gap: var(--space-5);
}

.control-kicker {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--text-muted);
    font-size: 0.61rem;
    text-transform: uppercase;
}

.countdown-header h2 {
    margin: 0;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    letter-spacing: -0.02em;
}

.countdown-dial {
    display: grid;
    width: 90px;
    aspect-ratio: 1;
    flex: 0 0 auto;
    padding: 4px;
    place-items: center;
    border-radius: 50%;
    background: conic-gradient(from -90deg, var(--accent-primary) 0turn, var(--discord) calc(var(--redirect-progress) * 1turn), rgba(255, 255, 255, 0.07) 0);
    box-shadow: 0 0 28px rgba(88, 101, 242, 0.16);
}

.countdown-dial-inner {
    display: grid;
    width: 100%;
    height: 100%;
    place-content: center;
    border: 1px solid rgba(255, 255, 255, 0.065);
    border-radius: 50%;
    background: rgba(4, 8, 15, 0.94);
    text-align: center;
}

.countdown-dial strong {
    color: var(--text-primary);
    font-size: 1.2rem;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    font-weight: 850;
}

.countdown-dial small {
    margin-top: 0.2rem;
    color: var(--text-muted);
    font-size: 0.55rem;
    line-height: 1;
    text-transform: uppercase;
}

.progress-track {
    height: 7px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.055);
    border-radius: var(--radius-pill);
    background: rgba(0, 0, 0, 0.42);
}

.progress-bar {
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent-primary), #6bbcff 48%, var(--discord));
    box-shadow: 0 0 16px rgba(88, 101, 242, 0.52);
    transform-origin: left center;
    will-change: transform;
}

.redirect-control[data-state="paused"] .progress-bar,
.redirect-control[data-state="offline"] .progress-bar {
    background: linear-gradient(90deg, var(--accent-amber), #ffcf87);
    box-shadow: 0 0 14px rgba(255, 184, 77, 0.28);
}

.connection-steps {
    display: grid;
    margin: var(--space-5) 0 0;
    padding: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-3);
    list-style: none;
}

.connection-steps li {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.65rem;
    color: var(--text-muted);
}

.step-index {
    display: grid;
    width: 29px;
    height: 29px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--border-soft);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.025);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.58rem;
    font-weight: 800;
}

.step-index .icon {
    width: 15px;
    height: 15px;
}

.connection-steps strong,
.connection-steps small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.connection-steps strong {
    color: var(--text-secondary);
    font-size: 0.7rem;
}

.connection-steps small {
    margin-top: 0.08rem;
    font-size: 0.58rem;
}

.connection-steps .is-complete .step-index {
    border-color: rgba(57, 229, 140, 0.25);
    background: rgba(57, 229, 140, 0.09);
    color: var(--accent-green);
}

.connection-steps .is-active .step-index {
    border-color: rgba(79, 217, 255, 0.35);
    background: rgba(79, 217, 255, 0.1);
    color: var(--accent-primary-strong);
    box-shadow: 0 0 18px rgba(79, 217, 255, 0.11);
}

.connection-steps .is-active strong {
    color: var(--text-primary);
}

.redirect-message {
    min-height: 1.4rem;
    margin: var(--space-4) 0 0;
    color: var(--text-muted);
    font-size: 0.73rem;
}

.redirect-actions {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: var(--space-3);
}

.btn-large {
    min-height: 54px;
}

.btn-discord .icon-arrow {
    margin-left: auto;
    transition: transform var(--transition-base);
}

.btn-discord:hover .icon-arrow {
    transform: translateX(3px);
}

.control-icon--resume {
    display: none;
}

[data-cancel-redirect].is-resume .control-icon--pause {
    display: none;
}

[data-cancel-redirect].is-resume .control-icon--resume {
    display: block;
}

.invite-copy {
    display: flex;
    min-height: 58px;
    margin-top: var(--space-3);
    padding: 0.65rem 0.75rem 0.65rem 1rem;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    border: 1px solid rgba(255, 255, 255, 0.075);
    border-radius: var(--radius-md);
    background: rgba(0, 0, 0, 0.18);
}

.invite-copy > span {
    display: grid;
    min-width: 0;
}

.invite-copy small {
    color: var(--text-muted);
    font-size: 0.6rem;
}

.invite-copy code {
    overflow: hidden;
    color: var(--text-secondary);
    font-size: 0.72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invite-copy button,
.widget-refresh {
    display: inline-flex;
    min-height: 44px;
    padding: 0.5rem 0.75rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.045);
    color: var(--text-secondary);
    cursor: pointer;
    font-size: 0.68rem;
    font-weight: 800;
    transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
}

.invite-copy button:hover,
.widget-refresh:hover {
    border-color: var(--border-active);
    background: rgba(79, 217, 255, 0.075);
    color: var(--text-primary);
}

.invite-copy button.is-copied {
    border-color: rgba(57, 229, 140, 0.28);
    color: #a9f7cf;
}

.invite-copy .icon,
.widget-refresh .icon {
    width: 15px;
    height: 15px;
}

.return-link {
    margin-top: var(--space-3);
}

.discord-side {
    min-width: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.075);
    background: rgba(2, 6, 13, 0.22);
}

.side-module {
    padding: clamp(1.5rem, 3vw, 2.35rem);
}

.side-module + .side-module {
    border-top: 1px solid rgba(255, 255, 255, 0.075);
}

.module-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
}

.side-module h2 {
    margin-bottom: var(--space-2);
    font-size: clamp(1.2rem, 2.2vw, 1.5rem);
    letter-spacing: -0.025em;
}

.module-copy {
    color: var(--text-muted);
    font-size: 0.78rem;
}

.live-label {
    display: inline-flex;
    min-height: 26px;
    padding: 0.25rem 0.55rem;
    align-items: center;
    gap: 0.4rem;
    border: 1px solid rgba(57, 229, 140, 0.18);
    border-radius: var(--radius-pill);
    background: rgba(57, 229, 140, 0.055);
    color: #a9f7cf;
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.live-label i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-green);
    box-shadow: 0 0 9px rgba(57, 229, 140, 0.65);
}

.live-label.is-fallback {
    border-color: rgba(255, 184, 77, 0.2);
    background: rgba(255, 184, 77, 0.06);
    color: #ffd69b;
}

.live-label.is-fallback i {
    background: var(--accent-amber);
    box-shadow: none;
}

.widget-state {
    display: flex;
    min-height: 92px;
    margin-top: var(--space-5);
    padding: var(--space-4);
    align-items: center;
    gap: var(--space-3);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    background: rgba(0, 0, 0, 0.2);
    color: var(--text-secondary);
    font-size: 0.78rem;
}

.widget-state > span:last-child,
.widget-state > div {
    min-width: 0;
}

.widget-state strong,
.widget-state p {
    display: block;
    margin: 0;
}

.widget-state p {
    margin-top: 0.25rem;
    color: var(--text-muted);
    font-size: 0.72rem;
}

.widget-state .spinner {
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 auto;
    border: 2px solid rgba(255, 255, 255, 0.12);
    border-top-color: var(--discord);
    border-radius: 50%;
    animation: spin 800ms linear infinite;
}

.widget-overview {
    display: grid;
    margin-top: var(--space-5);
    padding: var(--space-4);
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: var(--space-3);
    border: 1px solid rgba(126, 139, 255, 0.13);
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, rgba(88, 101, 242, 0.105), rgba(255, 255, 255, 0.025));
}

.widget-server-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 14px;
    background: rgba(88, 101, 242, 0.15);
    overflow: hidden;
}

.widget-server-icon img {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    object-fit: cover;
}

.widget-overview strong,
.widget-overview small {
    display: block;
}

.widget-overview strong {
    overflow: hidden;
    font-size: 0.83rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.widget-overview small {
    margin-top: 0.2rem;
    color: var(--text-muted);
    font-size: 0.66rem;
}

.widget-metrics {
    display: grid;
    margin-top: var(--space-3);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2);
}

.widget-metric {
    padding: 0.75rem;
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.025);
}

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

.widget-metric strong {
    color: var(--text-primary);
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
}

.widget-metric span {
    color: var(--text-muted);
    font-size: 0.59rem;
}

.member-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin: var(--space-5) 0 var(--space-2);
    padding: 0 0.15rem;
    color: var(--text-primary);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.member-heading-title {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.member-heading-live {
    width: 0.52rem;
    height: 0.52rem;
    border: 2px solid rgba(57, 229, 140, 0.42);
    border-radius: 50%;
    background: var(--accent-green);
    box-shadow: 0 0 0 4px rgba(57, 229, 140, 0.08), 0 0 16px rgba(57, 229, 140, 0.55);
    animation: member-presence-pulse 2.8s ease-out infinite;
}

.member-visible-count {
    padding: 0.34rem 0.58rem;
    border: 1px solid rgba(79, 217, 255, 0.18);
    border-radius: var(--radius-pill);
    background: rgba(79, 217, 255, 0.065);
    color: #89e6ff;
    font-family: var(--font-display);
    font-size: 0.59rem;
    letter-spacing: 0.08em;
    white-space: nowrap;
}

.member-list {
    display: grid;
    margin: 0;
    padding: 0;
    gap: 0.58rem;
    list-style: none;
}

.member-item {
    --member-accent: #54d9ff;
    --member-accent-rgb: 84, 217, 255;
    --member-glow-x: 12%;
    --member-glow-y: 18%;
    --member-angle: 132deg;
    position: relative;
    isolation: isolate;
    display: grid;
    min-width: 0;
    min-height: 4.8rem;
    padding: 0.68rem 3.15rem 0.68rem 0.68rem;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
    overflow: hidden;
    border: 1px solid rgba(var(--member-accent-rgb), 0.2);
    border-radius: 14px;
    background:
        radial-gradient(circle at var(--member-glow-x) var(--member-glow-y), rgba(var(--member-accent-rgb), 0.2), transparent 46%),
        linear-gradient(var(--member-angle), rgba(var(--member-accent-rgb), 0.075), rgba(4, 10, 18, 0.82) 52%, rgba(7, 13, 23, 0.96));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 12px 32px rgba(0, 0, 0, 0.16);
    animation: member-card-enter 0.48s var(--ease-out) both;
    animation-delay: calc(var(--member-order) * 55ms);
    transition:
        transform var(--transition-fast),
        border-color var(--transition-fast),
        box-shadow var(--transition-fast),
        filter var(--transition-fast);
}

.member-item::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background:
        linear-gradient(90deg, transparent 0 46%, rgba(var(--member-accent-rgb), 0.06) 46% 46.5%, transparent 46.5%),
        linear-gradient(0deg, transparent 0 64%, rgba(var(--member-accent-rgb), 0.045) 64% 65%, transparent 65%);
    content: '';
    pointer-events: none;
}

.member-item::after {
    position: absolute;
    z-index: 0;
    top: 0;
    left: -70%;
    width: 45%;
    height: 100%;
    transform: skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(var(--member-accent-rgb), 0.12), transparent);
    content: '';
    opacity: 0;
    pointer-events: none;
    transition: left 0.7s var(--ease-out), opacity 0.25s ease;
}

.member-item:hover {
    z-index: 2;
    transform: translate3d(3px, -2px, 0);
    border-color: rgba(var(--member-accent-rgb), 0.58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 18px 42px rgba(0, 0, 0, 0.25),
        0 0 28px rgba(var(--member-accent-rgb), 0.13);
}

.member-item:hover::after {
    left: 130%;
    opacity: 1;
}

.member-avatar-shell {
    position: relative;
    z-index: 2;
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid rgba(var(--member-accent-rgb), 0.55);
    border-radius: 15px;
    background: linear-gradient(145deg, rgba(var(--member-accent-rgb), 0.2), rgba(5, 10, 18, 0.92));
    box-shadow:
        0 0 0 4px rgba(var(--member-accent-rgb), 0.055),
        0 9px 24px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    transform: rotate(-2deg);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}

.member-item:nth-child(even) .member-avatar-shell {
    transform: rotate(2deg);
    border-radius: 50%;
}

.member-item:hover .member-avatar-shell {
    transform: rotate(0) scale(1.055);
    box-shadow:
        0 0 0 4px rgba(var(--member-accent-rgb), 0.09),
        0 0 24px rgba(var(--member-accent-rgb), 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.member-avatar-shell img,
.member-avatar-fallback {
    width: 42px;
    height: 42px;
    border-radius: 11px;
    object-fit: cover;
}

.member-item:nth-child(even) .member-avatar-shell img,
.member-item:nth-child(even) .member-avatar-fallback {
    border-radius: 50%;
}

.member-avatar-fallback {
    display: grid;
    place-items: center;
    border: 1px solid rgba(var(--member-accent-rgb), 0.25);
    background: rgba(var(--member-accent-rgb), 0.1);
    color: var(--member-accent);
    font-size: 0.7rem;
    font-weight: 900;
}

.member-presence-dot {
    position: absolute;
    right: -0.2rem;
    bottom: -0.16rem;
    width: 0.72rem;
    height: 0.72rem;
    border: 3px solid #07101b;
    border-radius: 50%;
    background: #39e58c;
    box-shadow: 0 0 13px rgba(57, 229, 140, 0.65);
}

.member-item--idle .member-presence-dot {
    background: var(--accent-amber);
    box-shadow: 0 0 13px rgba(255, 184, 77, 0.62);
}

.member-item--dnd .member-presence-dot {
    background: #ff647c;
    box-shadow: 0 0 13px rgba(255, 100, 124, 0.62);
}

.member-identity {
    position: relative;
    z-index: 2;
    display: grid;
    min-width: 0;
    gap: 0.36rem;
}

.member-name-row {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.48rem;
}

.member-name {
    min-width: 0;
    overflow: hidden;
    color: var(--text-primary);
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: -0.015em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.member-status {
    display: inline-flex;
    min-height: 1.28rem;
    flex: 0 0 auto;
    align-items: center;
    padding: 0.15rem 0.42rem;
    border: 1px solid rgba(57, 229, 140, 0.16);
    border-radius: var(--radius-pill);
    background: rgba(57, 229, 140, 0.07);
    color: #75eca8;
    font-size: 0.55rem;
    font-weight: 800;
    letter-spacing: 0.035em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.member-item--idle .member-status {
    border-color: rgba(255, 184, 77, 0.18);
    background: rgba(255, 184, 77, 0.07);
    color: #ffc970;
}

.member-item--dnd .member-status {
    border-color: rgba(255, 100, 124, 0.2);
    background: rgba(255, 100, 124, 0.075);
    color: #ff8fa1;
}

.member-activity {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.42rem;
    color: var(--text-muted);
    font-size: 0.64rem;
    font-weight: 650;
}

.member-activity-signal {
    width: 1.1rem;
    height: 2px;
    flex: 0 0 auto;
    border-radius: var(--radius-pill);
    background: linear-gradient(90deg, var(--member-accent), transparent);
    box-shadow: 0 0 8px rgba(var(--member-accent-rgb), 0.42);
}

.member-activity-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.member-index {
    position: absolute;
    z-index: 1;
    top: 0.45rem;
    right: 0.65rem;
    color: rgba(var(--member-accent-rgb), 0.32);
    font-family: var(--font-display);
    font-size: 1.32rem;
    font-weight: 900;
    letter-spacing: -0.08em;
    line-height: 1;
}

.member-card-decor {
    position: absolute;
    z-index: 1;
    right: 0.66rem;
    bottom: 0.58rem;
    display: flex;
    height: 0.86rem;
    align-items: end;
    gap: 2px;
    opacity: 0.48;
}

.member-card-decor i {
    display: block;
    width: 2px;
    border-radius: var(--radius-pill);
    background: var(--member-accent);
    box-shadow: 0 0 7px rgba(var(--member-accent-rgb), 0.45);
}

.member-card-decor i:nth-child(1) {
    height: 38%;
}

.member-card-decor i:nth-child(2) {
    height: 100%;
}

.member-card-decor i:nth-child(3) {
    height: 66%;
}

.member-item--theme-1::before,
.member-item--theme-5::before {
    transform: scaleX(-1);
}

.member-item--theme-2 .member-avatar-shell,
.member-item--theme-6 .member-avatar-shell {
    border-radius: 50% 50% 12px 50%;
}

.member-item--theme-3 .member-index,
.member-item--theme-7 .member-index {
    font-style: italic;
    transform: skewX(-8deg);
}

.member-item--theme-4 .member-card-decor,
.member-item--theme-6 .member-card-decor {
    transform: rotate(90deg) translate(-0.1rem, -0.1rem);
    transform-origin: right bottom;
}

@keyframes member-card-enter {
    from {
        transform: translate3d(0, 12px, 0) scale(0.985);
        opacity: 0;
    }

    to {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 1;
    }
}

@keyframes member-presence-pulse {
    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    52% {
        transform: scale(0.74);
        opacity: 0.56;
    }
}

.widget-note {
    margin: var(--space-4) 0 0;
    color: var(--text-muted);
    font-size: 0.61rem;
}

.widget-refresh {
    width: 100%;
    margin-top: var(--space-3);
}

.widget-refresh[hidden] {
    display: none;
}

.community-benefits {
    display: grid;
    margin: var(--space-5) 0 0;
    padding: 0;
    gap: var(--space-3);
    list-style: none;
}

.community-benefits li {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: var(--space-3);
}

.benefit-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid rgba(79, 217, 255, 0.12);
    border-radius: 12px;
    background: rgba(79, 217, 255, 0.055);
    color: var(--accent-primary-strong);
}

.benefit-icon .icon {
    width: 18px;
    height: 18px;
}

.community-benefits strong,
.community-benefits small {
    display: block;
}

.community-benefits strong {
    font-size: 0.76rem;
}

.community-benefits small {
    margin-top: 0.1rem;
    color: var(--text-muted);
    font-size: 0.66rem;
    line-height: 1.45;
}

.console-footer {
    display: flex;
    min-height: 56px;
    padding: 0.9rem clamp(1.2rem, 3vw, 2rem);
    align-items: center;
    justify-content: space-between;
    gap: var(--space-5);
    border-top: 1px solid rgba(255, 255, 255, 0.075);
    background: rgba(2, 6, 13, 0.32);
    color: var(--text-muted);
    font-size: 0.62rem;
}

.console-footer span:first-child {
    max-width: 720px;
}

.signal-field {
    position: absolute;
    z-index: -1;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.signal-orbit,
.signal-node,
.signal-beam {
    position: absolute;
}

.signal-orbit {
    border: 1px solid rgba(126, 139, 255, 0.1);
    border-radius: 50%;
}

.signal-orbit::before {
    position: absolute;
    top: 50%;
    left: -3px;
    width: 6px;
    height: 6px;
    content: "";
    border-radius: 50%;
    background: var(--accent-primary);
    box-shadow: 0 0 14px rgba(79, 217, 255, 0.75);
}

.signal-orbit--one {
    top: 4%;
    right: -7rem;
    width: 26rem;
    aspect-ratio: 1;
    animation: orbit-spin 28s linear infinite;
}

.signal-orbit--two {
    bottom: -12rem;
    left: -8rem;
    width: 32rem;
    aspect-ratio: 1;
    animation: orbit-spin 34s linear infinite reverse;
}

.signal-node {
    width: 8px;
    height: 8px;
    border: 1px solid rgba(79, 217, 255, 0.35);
    border-radius: 2px;
    background: rgba(79, 217, 255, 0.15);
    box-shadow: 0 0 18px rgba(79, 217, 255, 0.35);
    transform: rotate(45deg);
}

.signal-node--one { top: 22%; left: 5%; }
.signal-node--two { top: 67%; right: 4%; }
.signal-node--three { bottom: 8%; left: 32%; }

.signal-beam {
    top: 14%;
    left: -20%;
    width: 42%;
    height: 1px;
    opacity: 0.5;
    background: linear-gradient(90deg, transparent, var(--accent-primary), transparent);
    box-shadow: 0 0 12px rgba(79, 217, 255, 0.4);
    animation: signal-scan 9s ease-in-out infinite;
}

@keyframes packet-travel {
    from { left: 0; opacity: 0; }
    12%, 88% { opacity: 1; }
    to { left: 100%; opacity: 0; }
}

@keyframes network-pulse {
    50% { box-shadow: 0 0 0 7px rgba(57, 229, 140, 0), 0 0 18px rgba(57, 229, 140, 0.75); }
}

@keyframes orbit-spin {
    to { transform: rotate(360deg); }
}

@keyframes signal-scan {
    0%, 15% { transform: translateX(0) rotate(8deg); opacity: 0; }
    35%, 70% { opacity: 0.48; }
    85%, 100% { transform: translateX(340%) rotate(8deg); opacity: 0; }
}

.js .reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity var(--transition-slow), transform var(--transition-slow);
}

.js .reveal.is-visible {
    opacity: 1;
    transform: none;
}

.reveal-delay-1 { transition-delay: 80ms !important; }
.reveal-delay-2 { transition-delay: 160ms !important; }

@media (max-width: 1120px) {
    .desktop-nav .nav-link {
        padding-inline: 0.58rem;
        font-size: 0.78rem;
    }

    .nav-shell > .btn {
        padding-inline: 0.85rem;
    }

    .nav-actions .btn span {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
    }

    .nav-actions .btn {
        width: 46px;
        padding-inline: 0;
    }

    .nav-launch {
        min-width: 106px;
        padding-inline: 0.55rem;
    }

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

    .world-hero {
        grid-template-columns: minmax(0, 1fr) minmax(360px, 0.75fr);
    }

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

@media (max-width: 960px) {
    .desktop-nav,
    .nav-shell > .btn,
    .nav-actions {
        display: none;
    }

    .mobile-toggle {
        display: inline-flex;
    }

    .mobile-menu {
        position: fixed;
        z-index: var(--z-menu);
        inset: 0;
        display: grid;
        padding: calc(var(--nav-height) + 3.5rem) 1rem 2rem;
        align-content: start;
        overflow-y: auto;
        visibility: hidden;
        background: rgba(4, 8, 15, 0.88);
        opacity: 0;
        -webkit-backdrop-filter: blur(26px) saturate(135%);
        backdrop-filter: blur(26px) saturate(135%);
        pointer-events: none;
        transition: visibility var(--transition-base), opacity var(--transition-base);
    }

    .mobile-menu.is-open {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }

    .mobile-menu-inner {
        display: grid;
        width: min(100%, 560px);
        margin-inline: auto;
        gap: var(--space-2);
    }

    .mobile-menu .nav-link {
        min-height: 54px;
        padding-inline: var(--space-5);
        border: 1px solid var(--border-soft);
        background: rgba(255, 255, 255, 0.035);
        font-size: 1rem;
    }

    .mobile-launch-link {
        justify-content: space-between;
        border-color: rgba(79, 217, 255, 0.18) !important;
        background: linear-gradient(135deg, rgba(79, 217, 255, 0.085), rgba(22, 140, 255, 0.025)) !important;
    }

    .mobile-launch-link strong {
        color: var(--accent-primary-strong);
        font-family: "SFMono-Regular", Consolas, monospace;
        font-size: 0.75rem;
        letter-spacing: 0.04em;
    }

    .mobile-menu .btn {
        margin-top: var(--space-4);
    }

    .mobile-menu-actions .btn {
        margin-top: 0;
    }

    .hero {
        min-height: auto;
    }

    .hero-grid,
    .fair-panel {
        grid-template-columns: 1fr;
    }

    .hero-grid {
        gap: var(--space-10);
    }

    .hero-visual {
        width: min(100%, 620px);
        min-height: 500px;
        margin-inline: auto;
    }

    .hero-launch-visual {
        min-height: 640px;
    }

    .launch-manifest {
        grid-template-columns: 1fr;
        gap: var(--space-9);
    }

    .launch-manifest-copy .section-title {
        max-width: 16ch;
    }

    .launch-monument {
        min-height: 290px;
    }

    .pillar-grid {
        grid-template-columns: 1fr;
    }

    .pillar-card {
        min-height: auto;
    }

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

    .signal-item:nth-child(2) {
        border-right: 0;
    }

    .signal-item:nth-child(-n + 2) {
        border-bottom: 1px solid var(--border-soft);
    }

    .world-preview-shell,
    .plugin-hero-grid,
    .plugin-standards {
        grid-template-columns: 1fr;
    }

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

    .community-cta {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .community-cta > .btn {
        grid-column: 1 / -1;
        width: 100%;
    }

    .world-hero {
        min-height: auto;
        grid-template-columns: 1fr;
    }

    .world-core {
        width: min(100%, 680px);
        margin-inline: auto;
    }

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

    .world-facts > div:nth-child(2) {
        border-right: 0;
    }

    .world-facts > div:nth-child(-n + 2) {
        border-bottom: 1px solid var(--border-soft);
    }

    .world-story {
        grid-template-columns: 1fr;
    }

    .chapter-nav {
        position: relative;
        top: auto;
    }

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

    .discord-layout {
        grid-template-columns: 1fr;
    }

    .discord-side {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-top: 1px solid rgba(255, 255, 255, 0.075);
        border-left: 0;
    }

    .side-module + .side-module {
        border-top: 0;
        border-left: 1px solid rgba(255, 255, 255, 0.075);
    }
}

@media (max-width: 700px) {
    :root {
        --nav-height: 64px;
        --blur-sm: 14px;
        --blur-md: 18px;
        --blur-lg: 20px;
    }

    .container,
    .container-wide {
        width: min(calc(100% - 1.25rem), var(--container));
    }

    .discord-page .site-backdrop {
        background-position: 22% center;
    }

    .site-header {
        padding: 0.6rem;
    }

    .nav-shell {
        min-height: var(--nav-height);
        padding: 0.45rem 0.55rem 0.45rem 0.7rem;
        border-radius: 1rem;
    }

    .brand img {
        width: 36px;
        height: 36px;
    }

    .brand-text {
        font-size: 0.94rem;
    }

    .hero {
        padding-top: 7.5rem;
    }

    .display-title {
        font-size: clamp(2.45rem, 13vw, 4.3rem);
    }

    .btn-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .mobile-launch-summary {
        display: flex;
        min-height: 58px;
        margin-top: var(--space-5);
        padding: 0.65rem 0.8rem;
        align-items: center;
        justify-content: space-between;
        gap: var(--space-3);
        border: 1px solid rgba(79, 217, 255, 0.18);
        border-radius: var(--radius-md);
        background: linear-gradient(135deg, rgba(79, 217, 255, 0.09), rgba(22, 140, 255, 0.025));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
    }

    .mobile-launch-summary span,
    .mobile-launch-summary small,
    .mobile-launch-summary strong {
        display: block;
    }

    .mobile-launch-summary small {
        color: var(--text-muted);
        font-size: 0.54rem;
        font-weight: 800;
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }

    .mobile-launch-summary strong {
        margin-top: 0.1rem;
        font-size: 0.75rem;
    }

    .mobile-launch-summary strong span {
        display: inline;
    }

    .mobile-launch-summary i {
        color: var(--accent-primary-strong);
        font-family: "SFMono-Regular", Consolas, monospace;
        font-size: 0.95rem;
        font-style: normal;
    }

    .mobile-launch-summary > b {
        color: var(--accent-primary-strong);
        font-family: "SFMono-Regular", Consolas, monospace;
        font-size: 0.75rem;
        font-variant-numeric: tabular-nums;
        letter-spacing: 0.035em;
        white-space: nowrap;
    }

    .btn-row .btn {
        width: 100%;
    }

    .hero-visual {
        min-height: 390px;
    }

    .hero-launch-visual {
        min-height: 590px;
    }

    .launch-core {
        padding: 0.9rem;
        border-radius: var(--radius-lg);
    }

    .launch-core-top,
    .launch-core-footer {
        font-size: 0.5rem;
    }

    .launch-emblem {
        width: 118px;
        margin-top: 0.25rem;
    }

    .launch-emblem::before { inset: -12px; }
    .launch-emblem::after { inset: -22px; }

    .launch-date {
        font-size: clamp(1.85rem, 10.5vw, 2.7rem);
    }

    .launch-tminus strong {
        font-size: clamp(2.45rem, 15vw, 3.6rem);
    }

    .launch-clock {
        width: min(100%, 310px);
        gap: 0.3rem;
    }

    .launch-clock > div {
        padding: 0.5rem 0.3rem;
    }

    .launch-manifest {
        padding: 1.25rem;
        gap: var(--space-8);
        border-radius: var(--radius-lg);
    }

    .launch-manifest-copy .btn-row {
        display: grid;
    }

    .launch-manifest-copy .btn {
        width: 100%;
    }

    .launch-monument {
        min-height: 245px;
        padding: 1rem;
        border-radius: var(--radius-lg);
    }

    .launch-monument::before {
        width: 220px;
    }

    .launch-monument time strong {
        font-size: clamp(2.2rem, 13.2vw, 3.4rem);
    }

    .launch-rail {
        grid-template-columns: 1fr;
        gap: var(--space-3);
    }

    .launch-rail-track {
        width: 1px;
        height: 54px;
        margin-left: 4px;
    }

    .launch-rail-track i {
        background: linear-gradient(180deg, var(--accent-green), var(--accent-primary));
    }

    .launch-rail-track b {
        top: 0;
        left: -3px;
        animation: launch-packet-vertical 4s ease-in-out infinite;
    }

    .logo-stage {
        inset: 2.2rem 0 3.5rem;
    }

    .floating-panel {
        min-width: 165px;
        padding: 0.75rem 0.85rem;
    }

    .floating-panel--top { right: 0.25rem; }
    .floating-panel--bottom { left: 0.25rem; }

    .principle-list,
    .plugin-grid,
    .footer-panel,
    .footer-links {
        grid-template-columns: 1fr;
    }

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

    .cta-panel .btn {
        width: 100%;
    }

    .footer-bottom {
        flex-direction: column;
    }

    .directory-toolbar {
        grid-template-columns: 1fr;
    }

    .result-count {
        white-space: normal;
    }

    .plugin-card summary {
        min-height: 0;
    }

    .project-signal,
    .system-category-grid,
    .roadmap-grid,
    .plugin-hero-stats,
    .world-facts,
    .world-definition-list {
        grid-template-columns: 1fr;
    }

    .signal-item,
    .signal-item:nth-child(2),
    .world-facts > div,
    .world-facts > div:nth-child(2),
    .plugin-hero-stats > div {
        border-right: 0;
        border-bottom: 1px solid var(--border-soft);
    }

    .signal-item:last-child,
    .world-facts > div:last-child,
    .plugin-hero-stats > div:last-child {
        border-bottom: 0;
    }

    .world-preview-shell {
        padding: 1.25rem;
        gap: var(--space-8);
    }

    .systems-footer,
    .community-cta,
    .login-dialog-actions,
    .directory-status {
        align-items: stretch;
        flex-direction: column;
    }

    .systems-footer {
        display: flex;
    }

    .systems-footer .btn,
    .login-dialog-actions .btn {
        width: 100%;
    }

    .community-cta {
        display: grid;
        grid-template-columns: 1fr;
        text-align: center;
    }

    .community-cta .section-label,
    .community-signal {
        margin-inline: auto;
    }

    .community-signal {
        width: 92px;
    }

    .community-signal img {
        width: 60px;
        height: 60px;
    }

    .login-safety {
        border-radius: var(--radius-md);
        text-align: left;
    }

    .world-hero {
        padding-top: 7.5rem;
    }

    .world-hero h1 {
        font-size: clamp(3rem, 15vw, 4.8rem);
    }

    .world-core {
        min-height: 420px;
    }

    .core-label {
        min-width: 108px;
        padding: 0.55rem 0.65rem;
    }

    .chapter-nav nav {
        grid-template-columns: 1fr;
    }

    .world-chapter blockquote {
        padding: var(--space-4);
    }

    .world-final-actions {
        display: grid;
    }

    .world-final-actions .btn {
        width: 100%;
    }

    .directory-toolbar--advanced {
        position: relative;
        top: auto;
        grid-template-columns: 1fr;
    }

    .directory-status {
        display: flex;
        margin-top: -0.75rem;
    }

    .filter-reset {
        width: 100%;
    }

    .plugin-standards {
        padding: 1.25rem;
    }

    .standard-list li {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .standard-list > li > span {
        width: 38px;
        height: 38px;
    }

    .discord-experience {
        min-height: auto;
        padding: 5.6rem 0.55rem 1rem;
        align-items: flex-start;
    }

    .discord-console {
        border-radius: 22px;
    }

    .console-topbar {
        min-height: 54px;
        padding: 0.75rem 1rem;
    }

    .route-address {
        display: none;
    }

    .network-status {
        padding-inline: 0.55rem;
    }

    .discord-main {
        padding: 1.5rem 1rem 1.7rem;
    }

    .discord-main h1 {
        font-size: clamp(2.35rem, 12.5vw, 3.7rem);
    }

    .connection-trust {
        display: grid;
        grid-template-columns: 1fr;
        margin-bottom: var(--space-6);
    }

    .connection-trust li {
        width: 100%;
    }

    .countdown-header {
        align-items: flex-start;
    }

    .countdown-dial {
        width: 78px;
    }

    .connection-steps {
        grid-template-columns: 1fr;
    }

    .connection-steps strong,
    .connection-steps small {
        white-space: normal;
    }

    .redirect-actions {
        grid-template-columns: 1fr;
    }

    .invite-copy {
        align-items: stretch;
        flex-direction: column;
    }

    .invite-copy button {
        width: 100%;
    }

    .discord-side {
        grid-template-columns: 1fr;
    }

    .side-module {
        padding: 1.4rem 1rem;
    }

    .side-module + .side-module {
        border-top: 1px solid rgba(255, 255, 255, 0.075);
        border-left: 0;
    }

    .console-footer {
        padding: 1rem;
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-2);
    }

    .redirect-logo,
    .discord-mark {
        width: 56px;
        height: 56px;
        border-radius: var(--radius-md);
    }

    .redirect-logo img {
        width: 44px;
        height: 44px;
    }

    .connector-line {
        width: 36px;
    }
}

@media (max-width: 380px) {
    .hero-chips .chip {
        width: 100%;
    }

    .floating-panel {
        min-width: 150px;
    }

    .hero-launch-visual {
        min-height: 560px;
    }

    .launch-core {
        padding-inline: 0.7rem;
    }

    .launch-core-top > span {
        max-width: 17ch;
    }

    .launch-emblem {
        width: 102px;
    }

    .launch-core-message {
        font-size: 0.64rem;
    }

    .launch-monument time {
        gap: 0.2rem;
    }

    .launch-monument time strong {
        font-size: clamp(1.95rem, 13vw, 2.85rem);
    }

    .section {
        padding-block: 4rem;
    }

    .world-core {
        min-height: 360px;
    }

    .core-label--two,
    .core-label--four {
        display: none;
    }

    .world-chapter {
        padding: 1.15rem;
        border-radius: var(--radius-lg);
    }

    .route-kicker {
        font-size: 0.58rem;
    }

    .network-status [data-network-label] {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
    }

    .network-status {
        min-width: 32px;
        padding: 0;
        justify-content: center;
    }

    .redirect-brand-lockup {
        gap: var(--space-2);
    }

    .discord-main h1 {
        font-size: 2.2rem;
    }

    .countdown-header {
        gap: var(--space-3);
    }

    .countdown-dial {
        width: 70px;
    }
}

@keyframes launch-packet-vertical {
    0% { top: 0; opacity: 0; }
    12% { opacity: 1; }
    88% { opacity: 1; }
    100% { top: calc(100% - 7px); opacity: 0; }
}

/* KRONMC Core — owners and live Minecraft skin presentation */
.kronmc-core-section {
    isolation: isolate;
    padding-top: clamp(5rem, 10vw, 9rem);
    overflow: hidden;
}

.kronmc-core-section::before,
.kronmc-core-section::after {
    position: absolute;
    z-index: -2;
    content: "";
    pointer-events: none;
}

.kronmc-core-section::before {
    top: 7%;
    left: 50%;
    width: min(1120px, 92vw);
    height: 86%;
    border: 1px solid rgba(79, 217, 255, 0.055);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(22, 140, 255, 0.08), transparent 64%);
    filter: blur(0.2px);
    transform: translateX(-50%);
}

.kronmc-core-section::after {
    top: 22%;
    right: 0;
    bottom: 8%;
    left: 0;
    background: linear-gradient(90deg, transparent, rgba(79, 217, 255, 0.035) 35%, rgba(57, 229, 140, 0.035) 65%, transparent);
    mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent);
}

.kronmc-core-grid {
    position: absolute;
    z-index: -1;
    inset: 10% -8% 0;
    opacity: 0.18;
    background-image:
        linear-gradient(rgba(79, 217, 255, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(79, 217, 255, 0.12) 1px, transparent 1px);
    background-size: 62px 62px;
    mask-image: radial-gradient(ellipse at center, #000 15%, transparent 72%);
    transform: perspective(850px) rotateX(61deg) translateY(12%);
    transform-origin: center bottom;
    animation: core-grid-drift 14s linear infinite;
}

.kronmc-core-ambient {
    position: absolute;
    z-index: -1;
    width: min(34rem, 70vw);
    aspect-ratio: 1;
    border-radius: 50%;
    opacity: 0.11;
    filter: blur(110px);
    pointer-events: none;
}

.kronmc-core-ambient--cyan {
    top: 26%;
    left: -15rem;
    background: var(--accent-primary);
}

.kronmc-core-ambient--green {
    right: -15rem;
    bottom: 3%;
    background: var(--accent-green);
}

.kronmc-core-heading {
    max-width: 830px;
    margin-bottom: clamp(2.6rem, 6vw, 4.5rem);
}

.kronmc-core-heading .section-label {
    align-items: center;
    gap: 0.65rem;
}

.section-anchor-alias {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}

.core-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent-green);
    box-shadow: 0 0 0 5px rgba(57, 229, 140, 0.08), 0 0 18px rgba(57, 229, 140, 0.7);
    animation: core-live-pulse 2.4s ease-in-out infinite;
}

.kronmc-core-stage {
    --stage-edge: 1.75rem;
    position: relative;
    display: grid;
    min-height: 1060px;
    padding: 4.8rem var(--stage-edge) 4.1rem;
    grid-template-areas:
        "hub hub hub"
        "owner-one owner-two member-three";
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: clamp(1.2rem, 2.5vw, 2.3rem);
    overflow: hidden;
    border-color: rgba(120, 224, 255, 0.18);
    border-radius: clamp(24px, 3vw, 38px);
    background:
        radial-gradient(circle at 50% 45%, rgba(22, 140, 255, 0.13), transparent 27%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.02)),
        rgba(3, 8, 15, 0.82);
    box-shadow:
        0 38px 120px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 0 90px rgba(79, 217, 255, 0.025);
}

.kronmc-core-stage::before {
    position: absolute;
    inset: 0;
    content: "";
    opacity: 0.1;
    background-image: radial-gradient(rgba(255, 255, 255, 0.8) 0.65px, transparent 0.8px);
    background-size: 5px 5px;
    mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
    pointer-events: none;
}

.kronmc-core-stage::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: -18%;
    width: 22%;
    content: "";
    opacity: 0.38;
    background: linear-gradient(90deg, transparent, rgba(117, 229, 255, 0.12), transparent);
    filter: blur(22px);
    transform: skewX(-14deg);
    animation: core-stage-light 10s ease-in-out infinite;
    pointer-events: none;
}

.core-stage-topbar,
.core-stage-footer {
    position: absolute;
    z-index: 8;
    right: var(--stage-edge);
    left: var(--stage-edge);
    display: flex;
    align-items: center;
    color: rgba(174, 186, 203, 0.66);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.13em;
}

.core-stage-topbar {
    top: 1.4rem;
    justify-content: space-between;
}

.core-stage-topbar-status {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    color: rgba(188, 255, 222, 0.72);
}

.core-stage-topbar-status i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-green);
    box-shadow: 0 0 12px rgba(57, 229, 140, 0.68);
}

.core-stage-footer {
    bottom: 1.35rem;
    justify-content: center;
    gap: 1rem;
}

.core-stage-footer i {
    width: 34px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(79, 217, 255, 0.65), transparent);
}

.owner-pod {
    --owner-accent: var(--accent-primary);
    --owner-accent-rgb: 79, 217, 255;
    position: relative;
    z-index: 4;
    display: grid;
    min-width: 0;
    min-height: 590px;
    grid-template-rows: auto minmax(390px, 1fr) auto auto;
    overflow: hidden;
    border: 1px solid rgba(var(--owner-accent-rgb), 0.18);
    border-radius: 25px;
    background:
        linear-gradient(145deg, rgba(var(--owner-accent-rgb), 0.075), transparent 34%),
        linear-gradient(180deg, rgba(13, 25, 40, 0.8), rgba(4, 9, 17, 0.92));
    box-shadow:
        0 28px 72px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.09),
        inset 0 0 70px rgba(var(--owner-accent-rgb), 0.025);
    transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}

.owner-pod--one {
    grid-area: owner-one;
}

.owner-pod--two {
    grid-area: owner-two;
}

.owner-pod--three {
    grid-area: member-three;
}

.owner-pod--blue {
    --owner-accent: #2f9dff;
    --owner-accent-rgb: 47, 157, 255;
}

.owner-pod--pink {
    --owner-accent: #cf5d97;
    --owner-accent-rgb: 207, 93, 151;
}

.owner-pod--purple {
    --owner-accent: #a77bff;
    --owner-accent-rgb: 167, 123, 255;
}

.owner-pod--owner {
    border-color: rgba(var(--owner-accent-rgb), 0.3);
    box-shadow:
        0 30px 78px rgba(0, 0, 0, 0.4),
        0 0 42px rgba(var(--owner-accent-rgb), 0.055),
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        inset 0 0 76px rgba(var(--owner-accent-rgb), 0.035);
}

.owner-pod--owner .owner-pod-header strong {
    color: var(--owner-accent);
}

.owner-pod--management {
    background:
        linear-gradient(145deg, rgba(var(--owner-accent-rgb), 0.075), transparent 34%),
        linear-gradient(180deg, rgba(18, 24, 34, 0.82), rgba(5, 9, 16, 0.93));
}

.owner-pod:hover,
.owner-pod:focus-within {
    border-color: rgba(var(--owner-accent-rgb), 0.42);
    box-shadow:
        0 34px 90px rgba(0, 0, 0, 0.45),
        0 0 55px rgba(var(--owner-accent-rgb), 0.075),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    transform: translateY(-5px);
}

.owner-pod::before,
.owner-pod::after {
    position: absolute;
    z-index: 2;
    content: "";
    pointer-events: none;
}

.owner-pod::before {
    inset: 0;
    border-radius: inherit;
    background:
        linear-gradient(90deg, var(--owner-accent) 0 24px, transparent 24px calc(100% - 24px), var(--owner-accent) calc(100% - 24px)) top / 100% 1px no-repeat,
        linear-gradient(90deg, var(--owner-accent) 0 24px, transparent 24px calc(100% - 24px), var(--owner-accent) calc(100% - 24px)) bottom / 100% 1px no-repeat;
    opacity: 0.46;
}

.owner-pod::after {
    top: -20%;
    right: 10%;
    width: 110px;
    height: 140%;
    opacity: 0.08;
    background: linear-gradient(90deg, transparent, var(--owner-accent), transparent);
    filter: blur(18px);
    transform: rotate(17deg);
}

.owner-pod-header,
.owner-pod-footer {
    position: relative;
    z-index: 5;
    display: flex;
    min-height: 48px;
    padding: 0.75rem 0.9rem;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    border-color: rgba(255, 255, 255, 0.07);
    color: var(--text-muted);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.55rem;
    font-weight: 800;
    letter-spacing: 0.1em;
}

.owner-pod-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.owner-pod-header > span {
    color: var(--owner-accent);
}

.owner-pod-header strong {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(174, 186, 203, 0.68);
    font-size: inherit;
}

.owner-pod-header strong i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--owner-accent);
    box-shadow: 0 0 12px rgba(var(--owner-accent-rgb), 0.74);
}

.owner-viewport {
    position: relative;
    z-index: 3;
    min-height: 390px;
    overflow: hidden;
    background:
        linear-gradient(rgba(var(--owner-accent-rgb), 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--owner-accent-rgb), 0.045) 1px, transparent 1px),
        radial-gradient(ellipse at 50% 78%, rgba(var(--owner-accent-rgb), 0.12), transparent 42%);
    background-size: 28px 28px, 28px 28px, auto;
    perspective: 1500px;
    perspective-origin: 50% 48%;
    cursor: grab;
    touch-action: pan-y;
    outline-offset: -3px;
}

.owner-viewport:active,
.owner-viewport.is-dragging {
    cursor: grabbing;
}

.owner-viewport::before,
.owner-viewport::after {
    position: absolute;
    content: "";
    pointer-events: none;
}

.owner-viewport::before {
    top: 7%;
    left: 50%;
    width: 76%;
    height: 80%;
    border: 1px solid rgba(var(--owner-accent-rgb), 0.12);
    border-top-color: rgba(var(--owner-accent-rgb), 0.28);
    border-radius: 46% 46% 18% 18%;
    box-shadow: inset 0 0 54px rgba(var(--owner-accent-rgb), 0.045);
    transform: translateX(-50%);
}

.owner-viewport::after {
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    opacity: 0.22;
    background: linear-gradient(transparent, var(--owner-accent) 22%, var(--owner-accent) 78%, transparent);
}

.owner-scanline {
    position: absolute;
    z-index: 7;
    top: -8%;
    right: 0;
    left: 0;
    height: 44px;
    opacity: 0.42;
    background: linear-gradient(transparent, rgba(var(--owner-accent-rgb), 0.15), rgba(var(--owner-accent-rgb), 0.42), transparent);
    filter: blur(1px);
    animation: owner-scan 6.8s ease-in-out infinite;
    pointer-events: none;
}

.owner-coordinate {
    position: absolute;
    z-index: 6;
    display: flex;
    align-items: center;
    color: rgba(var(--owner-accent-rgb), 0.5);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.48rem;
    font-weight: 800;
}

.owner-coordinate i {
    display: block;
    background: currentColor;
}

.owner-coordinate--top {
    top: 1.1rem;
    left: 1rem;
    gap: 0.4rem;
}

.owner-coordinate--top i {
    width: 42px;
    height: 1px;
}

.owner-coordinate--side {
    top: 4.2rem;
    right: 0.8rem;
    flex-direction: column;
    gap: 0.35rem;
}

.owner-coordinate--side i {
    width: 1px;
    height: 40px;
}

.skin-loading {
    position: absolute;
    z-index: 5;
    inset: 0;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 1rem;
    color: rgba(var(--owner-accent-rgb), 0.72);
    font-family: "SFMono-Regular", Consolas, monospace;
    letter-spacing: 0.12em;
    transition: opacity 420ms ease, visibility 420ms ease;
}

.skin-loading > span {
    width: 52px;
    aspect-ratio: 1;
    border: 1px solid rgba(var(--owner-accent-rgb), 0.18);
    border-top-color: var(--owner-accent);
    border-radius: 50%;
    box-shadow: 0 0 24px rgba(var(--owner-accent-rgb), 0.1);
    animation: core-spin 1.1s linear infinite;
}

.skin-loading small {
    font-size: 0.5rem;
    font-weight: 800;
}

.owner-pod.is-loaded .skin-loading,
.owner-pod.is-fallback .skin-loading {
    visibility: hidden;
    opacity: 0;
}

.skin-avatar {
    position: absolute;
    z-index: 4;
    inset: 0;
    display: grid;
    place-items: center;
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 600ms ease, transform 700ms cubic-bezier(0.2, 0.8, 0.2, 1), filter 320ms ease;
    pointer-events: auto;
}

.owner-pod.is-loaded .skin-avatar,
.owner-pod.is-fallback .skin-avatar {
    opacity: 1;
    transform: translateY(0);
}

.owner-pod.is-fallback .skin-avatar {
    filter: saturate(0.72) contrast(0.96);
}

.skin-canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
    cursor: grab;
    touch-action: pan-y;
    filter: drop-shadow(0 18px 24px rgba(0, 0, 0, 0.28));
    outline: none;
}

.skin-canvas:active {
    cursor: grabbing;
}

.owner-platform {
    position: absolute;
    z-index: 2;
    bottom: 15px;
    left: 50%;
    width: min(240px, 72%);
    height: 92px;
    border: 1px solid rgba(var(--owner-accent-rgb), 0.36);
    border-radius: 50%;
    background:
        radial-gradient(ellipse, rgba(var(--owner-accent-rgb), 0.2), rgba(var(--owner-accent-rgb), 0.045) 46%, transparent 70%);
    box-shadow: 0 0 46px rgba(var(--owner-accent-rgb), 0.12), inset 0 0 30px rgba(var(--owner-accent-rgb), 0.08);
    transform: translateX(-50%) rotateX(66deg);
}

.owner-platform::before,
.owner-platform::after,
.owner-platform span,
.owner-platform i {
    position: absolute;
    content: "";
    border-radius: 50%;
}

.owner-platform::before { inset: 12%; border: 1px dashed rgba(var(--owner-accent-rgb), 0.46); animation: core-spin 14s linear infinite; }
.owner-platform::after { inset: 28%; background: rgba(var(--owner-accent-rgb), 0.12); box-shadow: 0 0 30px rgba(var(--owner-accent-rgb), 0.18); }
.owner-platform span { inset: -5%; border: 1px solid rgba(var(--owner-accent-rgb), 0.1); }
.owner-platform i { inset: 42%; background: var(--owner-accent); box-shadow: 0 0 18px var(--owner-accent); }

.owner-interaction-hint {
    position: absolute;
    z-index: 8;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    margin: 0;
    padding: 0.6rem;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    color: rgba(174, 186, 203, 0.6);
    font-size: 0.57rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: opacity var(--transition-base);
    pointer-events: none;
}

.owner-interaction-hint span {
    width: 14px;
    height: 9px;
    border: 1px solid currentColor;
    border-radius: 5px;
}

.owner-interaction-hint span::before {
    display: block;
    width: 2px;
    height: 3px;
    margin: 1px auto 0;
    content: "";
    border-radius: 2px;
    background: currentColor;
}

.owner-viewport:focus .owner-interaction-hint,
.owner-viewport:hover .owner-interaction-hint {
    color: rgba(var(--owner-accent-rgb), 0.9);
}

.owner-identity {
    position: relative;
    z-index: 5;
    display: flex;
    min-height: 92px;
    padding: 1rem 1.15rem 0.9rem;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    border-top: 1px solid rgba(255, 255, 255, 0.075);
    background: linear-gradient(180deg, rgba(5, 10, 18, 0.4), rgba(5, 10, 18, 0.88));
}

.owner-role {
    display: block;
    margin-bottom: 0.2rem;
    color: var(--owner-accent);
    font-size: 0.61rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.owner-identity h3 {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: clamp(1.45rem, 2.4vw, 2rem);
    letter-spacing: -0.045em;
    line-height: 1;
}

.owner-index {
    color: rgba(var(--owner-accent-rgb), 0.13);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 3.35rem;
    font-weight: 900;
    letter-spacing: -0.08em;
    line-height: 0.8;
}

.owner-pod-footer {
    min-height: 52px;
    border-top: 1px solid rgba(255, 255, 255, 0.065);
}

.skin-sync-status {
    display: flex;
    min-width: 0;
    margin: 0;
    align-items: center;
    gap: 0.5rem;
    overflow: hidden;
    color: rgba(174, 186, 203, 0.7);
    font-size: 0.5rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.skin-sync-status > span {
    width: 6px;
    height: 6px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--text-muted);
    box-shadow: 0 0 0 4px rgba(127, 143, 166, 0.07);
}

.owner-pod.is-loaded .skin-sync-status > span {
    background: var(--accent-green);
    box-shadow: 0 0 0 4px rgba(57, 229, 140, 0.075), 0 0 12px rgba(57, 229, 140, 0.52);
}

.owner-pod.is-fallback .skin-sync-status > span {
    background: var(--accent-amber);
    box-shadow: 0 0 0 4px rgba(255, 184, 77, 0.075), 0 0 12px rgba(255, 184, 77, 0.42);
}

.skin-controls {
    display: flex;
    flex: 0 0 auto;
    gap: 0.4rem;
}

.skin-control {
    display: grid;
    width: 44px;
    height: 44px;
    padding: 0;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--text-secondary);
    cursor: pointer;
    transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast), transform var(--transition-fast);
}

.skin-control:hover,
.skin-control[aria-pressed="true"] {
    border-color: rgba(var(--owner-accent-rgb), 0.32);
    background: rgba(var(--owner-accent-rgb), 0.08);
    color: var(--owner-accent);
}

.skin-control:active {
    transform: scale(0.94);
}

.skin-control svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.core-hub {
    position: relative;
    z-index: 5;
    display: grid;
    grid-area: hub;
    min-width: 0;
    min-height: 320px;
    align-content: center;
    justify-items: center;
    text-align: center;
}

.core-hub::before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(420px, 90vw);
    aspect-ratio: 1;
    content: "";
    border-radius: 50%;
    background: radial-gradient(circle, rgba(79, 217, 255, 0.13), transparent 66%);
    filter: blur(16px);
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.core-hub-rings,
.core-hub-orbit {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(260px, 112%);
    aspect-ratio: 1;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.core-hub-rings span {
    position: absolute;
    border-radius: 50%;
}

.core-hub-rings span:nth-child(1) { inset: 0; border: 1px solid rgba(79, 217, 255, 0.19); border-right-color: rgba(79, 217, 255, 0.68); animation: core-ring-rotate 19s linear infinite; }
.core-hub-rings span:nth-child(2) { inset: 12%; border: 1px dashed rgba(57, 229, 140, 0.26); animation: core-ring-rotate 13s linear infinite reverse; }
.core-hub-rings span:nth-child(3) { inset: 25%; border: 1px solid rgba(79, 217, 255, 0.17); border-top-color: rgba(79, 217, 255, 0.72); animation: core-ring-rotate 8s linear infinite; }

.core-hub-orbit {
    width: min(292px, 126%);
    border: 1px solid rgba(255, 255, 255, 0.045);
    animation: core-orbit-rotate 23s linear infinite;
}

.core-hub-orbit i {
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent-primary);
    box-shadow: 0 0 18px rgba(79, 217, 255, 0.74);
}

.core-hub-orbit i:first-child { top: 50%; left: -4px; }
.core-hub-orbit i:last-child { top: 12%; right: 12%; width: 5px; height: 5px; background: var(--accent-green); box-shadow: 0 0 16px rgba(57, 229, 140, 0.68); }

.core-hub-emblem {
    position: relative;
    z-index: 2;
    display: grid;
    width: clamp(118px, 12vw, 154px);
    aspect-ratio: 1;
    margin-bottom: 1.3rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(79, 217, 255, 0.26);
    border-radius: 34%;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.1), transparent 40%),
        rgba(5, 12, 21, 0.82);
    box-shadow:
        0 0 0 9px rgba(79, 217, 255, 0.035),
        0 0 54px rgba(79, 217, 255, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.13);
    transform: rotate(45deg);
}

.core-hub-emblem img {
    width: 84%;
    height: 84%;
    object-fit: contain;
    filter: drop-shadow(0 12px 24px rgba(79, 217, 255, 0.2));
    transform: rotate(-45deg);
}

.core-hub-scan {
    position: absolute;
    z-index: 2;
    top: -30%;
    left: 0;
    width: 100%;
    height: 28%;
    background: linear-gradient(transparent, rgba(79, 217, 255, 0.36), transparent);
    animation: hub-scan 4.8s ease-in-out infinite;
}

.core-hub > p,
.core-hub > strong,
.core-hub-data {
    position: relative;
    z-index: 2;
}

.core-hub > p {
    margin: 0 0 0.35rem;
    color: var(--accent-primary-strong);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.13em;
}

.core-hub > strong {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--text-primary);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
}

.core-hub > strong span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-green);
    box-shadow: 0 0 14px rgba(57, 229, 140, 0.72);
}

.core-hub-data {
    display: flex;
    width: min(330px, 90%);
    margin-top: 1.2rem;
    align-items: center;
    gap: 0.75rem;
    color: rgba(174, 186, 203, 0.5);
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.52rem;
    font-weight: 800;
}

.core-hub-data i {
    position: relative;
    height: 1px;
    flex: 1;
    overflow: hidden;
    background: rgba(79, 217, 255, 0.15);
}

.core-hub-data i::after {
    position: absolute;
    top: 0;
    left: -30%;
    width: 28%;
    height: 100%;
    content: "";
    background: linear-gradient(90deg, transparent, var(--accent-primary), transparent);
    animation: core-data-pass 2.8s linear infinite;
}

.core-connection {
    --connection-accent: 47, 157, 255;
    position: absolute;
    z-index: 3;
    top: 334px;
    width: 1px;
    height: 90px;
    pointer-events: none;
}

.core-connection--one { left: 17.4%; --connection-accent: 47, 157, 255; }
.core-connection--two { left: 50%; --connection-accent: 207, 93, 151; }
.core-connection--three { left: 82.6%; --connection-accent: 167, 123, 255; }

.core-connection > span {
    position: absolute;
    left: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(180deg, rgba(var(--connection-accent), 0.07), rgba(var(--connection-accent), 0.66), rgba(var(--connection-accent), 0.2));
}

.core-connection > b {
    position: absolute;
    top: 0;
    left: -3px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgb(var(--connection-accent));
    box-shadow: 0 0 14px rgba(var(--connection-accent), 0.72);
    animation: core-packet 3.6s ease-in-out infinite;
}

.core-connection--two > b { animation-delay: -1.2s; }
.core-connection--three > b { animation-delay: -2.4s; }

@keyframes core-grid-drift {
    to { background-position: 62px 62px, 62px 62px; }
}

@keyframes core-live-pulse {
    50% { box-shadow: 0 0 0 8px rgba(57, 229, 140, 0), 0 0 22px rgba(57, 229, 140, 0.8); }
}

@keyframes core-stage-light {
    0%, 12% { transform: translateX(0) skewX(-14deg); opacity: 0; }
    34%, 70% { opacity: 0.38; }
    88%, 100% { transform: translateX(590%) skewX(-14deg); opacity: 0; }
}

@keyframes owner-scan {
    0%, 12% { transform: translateY(0); opacity: 0; }
    30%, 72% { opacity: 0.42; }
    88%, 100% { transform: translateY(470px); opacity: 0; }
}

@keyframes core-spin {
    to { transform: rotate(360deg); }
}

@keyframes core-ring-rotate {
    to { transform: rotate(360deg); }
}

@keyframes core-orbit-rotate {
    from { transform: translate(-50%, -50%) rotate(0); }
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes hub-scan {
    0%, 15% { top: -30%; opacity: 0; }
    32%, 72% { opacity: 0.65; }
    90%, 100% { top: 105%; opacity: 0; }
}

@keyframes core-data-pass {
    to { left: 108%; }
}

@keyframes core-packet {
    0% { top: 0; opacity: 0; }
    16%, 84% { opacity: 1; }
    100% { top: calc(100% - 8px); opacity: 0; }
}

@media (max-width: 1100px) {
    .kronmc-core-stage {
        --stage-edge: 1.35rem;
        min-height: auto;
        padding-top: 4.4rem;
        grid-template-areas:
            "hub hub"
            "owner-one owner-two"
            "member-three member-three";
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }

    .core-hub {
        min-height: 330px;
    }

    .owner-pod--three {
        width: min(100%, 520px);
        justify-self: center;
    }

    .core-hub-rings { width: 248px; }
    .core-hub-orbit { width: 278px; }
    .core-connection { display: none; }
}

@media (max-width: 700px) {
    .kronmc-core-section {
        padding-top: 4.5rem;
    }

    .kronmc-core-section::before {
        width: 150vw;
    }

    .kronmc-core-grid {
        opacity: 0.11;
        background-size: 46px 46px;
    }

    .kronmc-core-stage {
        --stage-edge: 0.8rem;
        padding: 4.15rem 0.72rem 3.85rem;
        grid-template-areas:
            "hub"
            "owner-one"
            "owner-two"
            "member-three";
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
        border-radius: var(--radius-lg);
        -webkit-backdrop-filter: blur(var(--blur-sm)) saturate(125%);
        backdrop-filter: blur(var(--blur-sm)) saturate(125%);
    }

    .core-stage-topbar {
        top: 1.15rem;
        justify-content: center;
    }

    .core-stage-topbar-status {
        display: none;
    }

    .core-stage-footer {
        bottom: 1.15rem;
        gap: 0.48rem;
        font-size: 0.45rem;
        letter-spacing: 0.08em;
        flex-wrap: wrap;
        row-gap: 0.3rem;
    }

    .core-stage-footer i {
        width: 12px;
    }

    .core-hub {
        min-height: 290px;
    }

    .core-hub-rings { width: 224px; }
    .core-hub-orbit { width: 254px; }

    .owner-pod {
        min-height: 570px;
        grid-template-rows: auto minmax(370px, 1fr) auto auto;
        border-radius: 20px;
    }

    .owner-pod--three {
        width: 100%;
    }

    .owner-viewport {
        min-height: 370px;
    }

    .owner-pod:hover,
    .owner-pod:focus-within {
        transform: none;
    }

    .owner-identity {
        min-height: 88px;
        padding-inline: 1rem;
    }
}

@media (max-width: 380px) {
    .owner-pod-header strong {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
    }

    .skin-sync-status {
        max-width: 155px;
        font-size: 0.45rem;
    }

    .owner-identity h3 {
        font-size: 1.35rem;
    }

    .owner-index {
        font-size: 2.85rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .js .reveal {
        opacity: 1;
        transform: none;
    }

}

@media print {
    .site-header,
    .site-backdrop,
    .mobile-menu,
    .btn-row,
    .filter-group,
    .search-field {
        display: none !important;
    }

    .launch-clock,
    .launch-rail-track,
    .nav-launch {
        display: none !important;
    }

    body {
        background: #fff;
        color: #111;
    }

    .glass,
    .glass-soft,
    .glass-strong {
        border: 1px solid #bbb;
        background: #fff;
        box-shadow: none;
        color: #111;
    }
}