        :root {
            color-scheme: dark;
            --void: #030503;
            --black: #070907;
            --panel: #0b100d;
            --panel-2: #101714;
            --line: rgba(171, 255, 212, 0.2);
            --line-strong: rgba(83, 255, 151, 0.48);
            --text: #f1fff7;
            --muted: #92a99b;
            --soft: #c8d8cf;
            --acid: #40ff88;
            --cyan: #41d6ff;
            --amber: #ffbf3f;
            --red: #ff4d5c;
            --shadow: rgba(0, 0, 0, 0.45);
            --radius: 8px;
        }

        * {
            box-sizing: border-box;
            letter-spacing: 0;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            margin: 0;
            min-height: 100vh;
            font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.05) 1px, transparent 1px),
                linear-gradient(0deg, rgba(65, 214, 255, 0.04) 1px, transparent 1px),
                linear-gradient(180deg, #030503 0%, #090d0a 48%, #030503 100%);
            background-size: 72px 72px, 72px 72px, auto;
            color: var(--text);
        }

        body::before {
            content: "";
            position: fixed;
            inset: 0;
            z-index: -1;
            pointer-events: none;
            background:
                repeating-linear-gradient(
                    180deg,
                    rgba(255, 255, 255, 0.035) 0,
                    rgba(255, 255, 255, 0.035) 1px,
                    transparent 1px,
                    transparent 5px
                );
            opacity: 0.5;
        }

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

        code {
            color: var(--acid);
            font-family: "Courier New", monospace;
        }

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

        .site-header {
            position: sticky;
            top: 0;
            z-index: 20;
            border-bottom: 1px solid var(--line);
            background: rgba(3, 5, 3, 0.9);
            backdrop-filter: blur(16px);
        }

        .topbar {
            width: min(1280px, calc(100% - 32px));
            margin: 0 auto;
            min-height: 76px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
        }

        .prealpha-strip {
            border-top: 1px solid rgba(255, 191, 63, 0.22);
            background:
                linear-gradient(90deg, rgba(255, 191, 63, 0.16), rgba(64, 255, 136, 0.055)),
                rgba(7, 9, 7, 0.94);
        }

        .prealpha-strip .section-inner {
            display: flex;
            align-items: center;
            gap: 10px;
            min-height: 38px;
            padding: 8px 0;
        }

        .prealpha-strip strong {
            flex: 0 0 auto;
            color: var(--amber);
            font: 900 12px/1.2 "Courier New", monospace;
        }

        .prealpha-strip span {
            color: var(--soft);
            font-size: 13px;
            line-height: 1.35;
        }

        .server-unavailable-strip {
            border-top: 1px solid rgba(255, 77, 92, 0.36);
            background:
                linear-gradient(90deg, rgba(255, 77, 92, 0.28), rgba(255, 77, 92, 0.08)),
                rgba(31, 5, 8, 0.96);
        }

        .server-unavailable-strip .section-inner {
            display: flex;
            align-items: center;
            gap: 10px;
            min-height: 38px;
            padding: 8px 0;
        }

        .server-unavailable-strip strong {
            flex: 0 0 auto;
            color: var(--red);
            font: 900 12px/1.2 "Courier New", monospace;
        }

        .server-unavailable-strip span {
            color: var(--text);
            font-size: 13px;
            line-height: 1.35;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            flex: 0 0 auto;
        }

        .brand-logo {
            display: block;
            width: min(330px, 42vw);
            height: auto;
            max-height: 42px;
            object-fit: contain;
            filter: drop-shadow(0 0 14px rgba(64, 255, 136, 0.22));
        }

        .nav {
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-end;
            gap: 6px;
        }

        .nav a {
            border: 1px solid transparent;
            border-radius: 6px;
            color: var(--soft);
            padding: 9px 10px;
            font-size: 14px;
        }

        .nav a:hover,
        .nav a.is-active {
            border-color: var(--line-strong);
            background: rgba(64, 255, 136, 0.12);
            color: var(--text);
        }

        .language-switch {
            display: inline-flex;
            gap: 4px;
            border: 1px solid var(--line);
            border-radius: 6px;
            padding: 3px;
            background: rgba(7, 9, 7, 0.72);
        }

        .language-switch a {
            border-radius: 4px;
            color: var(--muted);
            font-family: "Courier New", monospace;
            font-size: 12px;
            font-weight: 700;
            padding: 7px 8px;
            text-transform: uppercase;
        }

        .language-switch a:hover,
        .language-switch a.is-active {
            background: rgba(64, 255, 136, 0.14);
            color: var(--text);
        }

        .menu-toggle {
            display: none;
            width: 44px;
            min-height: 44px;
            flex: 0 0 44px;
            padding: 0;
            border-color: rgba(65, 214, 255, 0.42);
            background: rgba(65, 214, 255, 0.1);
        }

        .menu-toggle:hover,
        .menu-toggle:focus-visible {
            border-color: var(--line-strong);
            background: rgba(64, 255, 136, 0.18);
        }

        .menu-toggle-icon {
            display: grid;
            gap: 5px;
            width: 20px;
        }

        .menu-toggle-icon span {
            display: block;
            height: 2px;
            border-radius: 999px;
            background: var(--text);
            box-shadow: 0 0 10px rgba(64, 255, 136, 0.34);
            transition: transform 0.16s ease, opacity 0.16s ease;
        }

        .site-header.is-menu-open .menu-toggle-icon span:nth-child(1) {
            transform: translateY(7px) rotate(45deg);
        }

        .site-header.is-menu-open .menu-toggle-icon span:nth-child(2) {
            opacity: 0;
        }

        .site-header.is-menu-open .menu-toggle-icon span:nth-child(3) {
            transform: translateY(-7px) rotate(-45deg);
        }

        .hero {
            position: relative;
            min-height: 78vh;
            overflow: hidden;
            border-bottom: 1px solid var(--line);
            isolation: isolate;
        }

        .hero-canvas,
        .hero-noise,
        .hero-shade {
            position: absolute;
            inset: 0;
        }

        .hero-canvas {
            width: 100%;
            height: 100%;
            z-index: -3;
            background: #030503;
        }

        .hero-noise {
            z-index: -2;
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.12), transparent 40%, rgba(255, 77, 92, 0.08) 100%),
                repeating-linear-gradient(90deg, transparent 0, transparent 54px, rgba(64, 255, 136, 0.05) 55px, transparent 56px);
            mix-blend-mode: screen;
            opacity: 0.38;
        }

        .hero-shade {
            z-index: -1;
            background:
                linear-gradient(90deg, rgba(3, 5, 3, 0.88) 0%, rgba(3, 5, 3, 0.58) 34%, rgba(3, 5, 3, 0.12) 62%, rgba(3, 5, 3, 0.02) 100%),
                linear-gradient(180deg, rgba(3, 5, 3, 0.04) 0%, rgba(3, 5, 3, 0.34) 100%);
        }

        .hero-inner {
            width: min(1280px, calc(100% - 32px));
            min-height: 78vh;
            margin: 0 auto;
            display: flex;
            align-items: center;
            padding: 48px 0 56px;
        }

        .hero-copy {
            width: min(720px, 100%);
        }

        .eyebrow {
            margin: 0 0 12px;
            color: var(--acid);
            font-family: "Courier New", monospace;
            font-size: 13px;
            text-transform: uppercase;
        }

        .eyebrow-caret {
            display: inline-block;
            margin-left: 2px;
            color: inherit;
            font-weight: 700;
            animation: blinkCaret 0.85s steps(2, start) infinite;
        }

        .season-badge {
            position: absolute;
            z-index: 3;
            top: 34px;
            right: max(24px, calc((100vw - 1280px) / 2 + 24px));
            display: grid;
            gap: 6px;
            min-width: 188px;
            border: 1px solid rgba(255, 191, 63, 0.58);
            border-radius: 2px;
            background:
                linear-gradient(135deg, rgba(255, 191, 63, 0.22), rgba(64, 255, 136, 0.08)),
                rgba(7, 9, 7, 0.78);
            color: var(--amber);
            padding: 12px 14px;
            font-family: "Courier New", monospace;
            text-transform: uppercase;
            clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
            box-shadow:
                inset 0 0 0 1px rgba(255, 255, 255, 0.05),
                0 0 34px rgba(255, 191, 63, 0.18);
        }

        .season-badge::before {
            content: "";
            width: 42px;
            height: 2px;
            background: currentColor;
            box-shadow: 52px 0 0 rgba(64, 255, 136, 0.55);
        }

        .season-badge strong,
        .season-badge span {
            display: block;
        }

        .season-badge strong {
            color: var(--text);
            font-size: 18px;
            line-height: 1;
        }

        .season-badge span {
            color: var(--amber);
            font-size: 11px;
            font-weight: 800;
            line-height: 1;
            letter-spacing: 0.08em;
        }

        .hero h1,
        .page-hero h1 {
            margin: 0;
            font-size: 68px;
            line-height: 0.95;
            text-transform: uppercase;
            text-shadow: 0 0 18px rgba(64, 255, 136, 0.22);
        }

        .hero-logo {
            display: block;
            width: min(760px, 100%);
            height: auto;
            filter:
                drop-shadow(0 0 20px rgba(64, 255, 136, 0.2))
                drop-shadow(0 0 42px rgba(65, 214, 255, 0.1));
        }

        .hero-lead,
        .page-lead {
            margin: 20px 0 0;
            color: var(--soft);
            font-size: 19px;
            line-height: 1.65;
            max-width: 760px;
        }

        .manifest-quote {
            width: 100%;
            margin: 24px 0 0;
            border-left: 3px solid var(--acid);
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.14), rgba(65, 214, 255, 0.04)),
                rgba(7, 9, 7, 0.62);
            padding: 18px 20px;
            box-shadow: 0 22px 54px rgba(0, 0, 0, 0.24);
        }

        .manifest-quote blockquote {
            margin: 0;
            color: var(--text);
            font-size: 18px;
            font-style: italic;
            font-weight: 600;
            line-height: 1.55;
        }

        .manifest-quote blockquote::before {
            content: "“";
        }

        .manifest-quote blockquote::after {
            content: "”";
        }

        .manifest-quote figcaption {
            margin-top: 12px;
            color: var(--acid);
            font-family: "Courier New", monospace;
            font-size: 13px;
            font-weight: 700;
            text-transform: uppercase;
        }

        .manifest-quote figcaption::before {
            content: "- ";
        }

        .manifest-document-section {
            background:
                linear-gradient(180deg, rgba(3, 5, 3, 0.78), rgba(3, 5, 3, 0.96)),
                linear-gradient(90deg, rgba(64, 255, 136, 0.06) 1px, transparent 1px),
                linear-gradient(0deg, rgba(65, 214, 255, 0.045) 1px, transparent 1px);
            background-size: auto, 64px 64px, 64px 64px;
        }

        .manifest-text-block {
            position: relative;
            width: 100%;
            border: 1px solid var(--line-strong);
            border-radius: var(--radius);
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.12), transparent 34%),
                linear-gradient(180deg, rgba(65, 214, 255, 0.06), transparent 28%),
                rgba(7, 9, 7, 0.9);
            padding: clamp(24px, 4vw, 48px);
            box-shadow:
                0 32px 90px rgba(0, 0, 0, 0.36),
                inset 4px 0 0 rgba(64, 255, 136, 0.72);
        }

        .manifest-text-block::before {
            content: "";
            position: absolute;
            inset: 14px;
            pointer-events: none;
            border: 1px solid rgba(171, 255, 212, 0.08);
        }

        .manifest-text-header,
        .manifest-text-body {
            position: relative;
            z-index: 1;
        }

        .manifest-text-header {
            display: grid;
            gap: 10px;
            border-bottom: 1px solid var(--line);
            padding-bottom: 24px;
            margin-bottom: 26px;
        }

        .manifest-text-header > span {
            color: var(--cyan);
            font: 800 13px/1.25 "Courier New", monospace;
            text-transform: uppercase;
        }

        .manifest-text-header h2 {
            margin: 0;
            color: var(--text);
            font-size: clamp(28px, 4vw, 44px);
            line-height: 1.08;
            text-transform: uppercase;
        }

        .manifest-text-body {
            display: grid;
            gap: 20px;
        }

        .manifest-text-body p {
            margin: 0;
            color: var(--soft);
            font-size: 17px;
            line-height: 1.78;
        }

        .manifest-intro-line {
            color: var(--text) !important;
            font-size: 19px !important;
            line-height: 1.65 !important;
        }

        .manifest-text-section {
            border-top: 1px solid rgba(171, 255, 212, 0.16);
            padding-top: 26px;
            margin-top: 6px;
        }

        .manifest-text-section h3 {
            display: flex;
            align-items: baseline;
            gap: 12px;
            margin: 0 0 14px;
            color: var(--text);
            font-size: clamp(22px, 3vw, 30px);
            line-height: 1.12;
            text-transform: uppercase;
        }

        .manifest-text-section h3 span {
            color: var(--acid);
            font: 900 14px/1 "Courier New", monospace;
        }

        .manifest-text-section p + p {
            margin-top: 13px;
        }

        .manifest-closing-line {
            color: var(--acid) !important;
            font-weight: 800;
        }

        .actions {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 28px;
        }

        .button,
        button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            min-height: 44px;
            border: 1px solid var(--line-strong);
            border-radius: 6px;
            background: rgba(64, 255, 136, 0.16);
            color: var(--text);
            padding: 11px 16px;
            font: 800 14px/1 "Trebuchet MS", Arial, sans-serif;
            cursor: pointer;
            text-transform: uppercase;
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
        }

        .button-icon {
            flex: 0 0 auto;
            font-size: 17px;
            line-height: 1;
        }

        .button:hover,
        button:hover {
            background: rgba(64, 255, 136, 0.25);
        }

        .button-secondary {
            border-color: rgba(65, 214, 255, 0.36);
            background: rgba(65, 214, 255, 0.1);
        }

        .button-secondary:hover {
            background: rgba(65, 214, 255, 0.18);
        }

        .button-warning {
            border-color: rgba(255, 191, 63, 0.48);
            background: rgba(255, 191, 63, 0.12);
        }

        .button-disabled {
            pointer-events: none;
            opacity: 0.48;
        }

        .engine-badge {
            position: absolute;
            z-index: 3;
            right: max(24px, calc((100vw - 1280px) / 2 + 24px));
            bottom: 28px;
            display: inline-flex;
            align-items: center;
            gap: 10px;
            width: fit-content;
            border: 1px solid rgba(255, 255, 255, 0.18);
            border-radius: 6px;
            background: rgba(7, 9, 7, 0.68);
            padding: 8px 12px 8px 8px;
            color: var(--text);
            box-shadow:
                inset 0 0 0 1px rgba(255, 255, 255, 0.04),
                0 0 24px rgba(64, 255, 136, 0.08);
        }

        .engine-mark {
            width: 38px;
            height: 38px;
            flex: 0 0 38px;
            object-fit: contain;
            filter:
                invert(1)
                drop-shadow(0 0 10px rgba(64, 255, 136, 0.18));
        }

        .engine-copy {
            display: grid;
            gap: 3px;
        }

        .engine-kicker,
        .engine-name {
            display: block;
            text-transform: uppercase;
        }

        .engine-kicker {
            color: var(--muted);
            font: 700 10px/1 "Courier New", monospace;
            letter-spacing: 0.12em;
        }

        .engine-name {
            color: var(--text);
            font: 800 15px/1 "Trebuchet MS", Arial, sans-serif;
        }

        .hero-stats {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
            margin-top: 34px;
            max-width: 430px;
        }

        .hero-stats.hero-dashboard-stats {
            grid-template-columns: repeat(2, 150px);
            max-width: 308px;
        }

        .profile-stats {
            grid-template-columns: repeat(5, minmax(0, 1fr));
            max-width: 980px;
        }

        .profile-stats .stat-tile-last-seen {
            grid-column: span 2;
        }

        .match-stats {
            grid-template-columns: repeat(6, minmax(0, 1fr));
            max-width: 1120px;
        }

        .match-stats .stat-tile-match-time {
            grid-column: span 2;
        }

        .stat-tile {
            min-height: 92px;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: rgba(7, 9, 7, 0.72);
            padding: 14px;
        }

        .stat-tile span {
            display: block;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.35;
            text-transform: uppercase;
        }

        .stat-tile strong {
            display: block;
            margin-top: 8px;
            font-size: 30px;
            line-height: 1;
        }

        .stat-tile-last-seen strong {
            font-size: 24px;
            line-height: 1.1;
            white-space: nowrap;
        }

        .stat-tile-match-time strong {
            font-size: 24px;
            line-height: 1.1;
            white-space: nowrap;
        }

        .section {
            border-top: 1px solid var(--line);
            padding: 58px 0;
        }

        .section-dark {
            background: rgba(3, 5, 3, 0.56);
        }

        .section-inner {
            width: min(1280px, calc(100% - 32px));
            margin: 0 auto;
        }

        .section-heading {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 24px;
            margin-bottom: 24px;
        }

        .section-heading h2,
        .panel h2,
        .compact-hero h2 {
            margin: 0;
            font-size: 34px;
            line-height: 1.08;
            text-transform: uppercase;
        }

        .section-heading p,
        .panel p,
        .module p,
        .character-card p {
            color: var(--muted);
            line-height: 1.55;
        }

        .section-heading p {
            margin: 0;
            max-width: 560px;
        }

        .two-column {
            display: grid;
            grid-template-columns: minmax(0, 1.18fr) minmax(320px, 0.82fr);
            gap: 24px;
            align-items: start;
        }

        .video-frame {
            position: relative;
            min-height: 420px;
            aspect-ratio: 16 / 9;
            overflow: hidden;
            border: 1px solid var(--line-strong);
            border-radius: var(--radius);
            background:
                linear-gradient(135deg, rgba(64, 255, 136, 0.08), rgba(255, 77, 92, 0.08)),
                #020402;
            box-shadow: 0 28px 70px var(--shadow);
        }

        .video-frame iframe {
            position: absolute;
            inset: 0;
            z-index: 3;
            width: 100%;
            height: 100%;
            border: 0;
            background: #020402;
        }

        .gameplay-fallback {
            position: absolute;
            inset: 0;
            z-index: 1;
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.11) 1px, transparent 1px),
                linear-gradient(0deg, rgba(65, 214, 255, 0.08) 1px, transparent 1px),
                linear-gradient(135deg, rgba(64, 255, 136, 0.12), transparent 45%, rgba(255, 77, 92, 0.16)),
                #030503;
            background-size: 44px 44px, 44px 44px, auto, auto;
        }

        .gameplay-fallback::before,
        .gameplay-fallback::after {
            content: "";
            position: absolute;
            inset: 11% 9%;
            border: 1px solid rgba(64, 255, 136, 0.42);
            clip-path: polygon(0 0, 26% 0, 26% 2px, 2px 2px, 2px 26%, 0 26%, 0 0, 100% 0, 100% 26%, calc(100% - 2px) 26%, calc(100% - 2px) 2px, 74% 2px, 74% 0, 100% 0, 100% 100%, 74% 100%, 74% calc(100% - 2px), calc(100% - 2px) calc(100% - 2px), calc(100% - 2px) 74%, 100% 74%, 100% 100%, 0 100%, 0 74%, 2px 74%, 2px calc(100% - 2px), 26% calc(100% - 2px), 26% 100%, 0 100%);
        }

        .gameplay-fallback::after {
            inset: 45% 39%;
            border-color: rgba(255, 77, 92, 0.72);
            transform: rotate(45deg);
            animation: pulseCrosshair 1.8s ease-in-out infinite;
        }

        .fallback-hud {
            position: absolute;
            inset: auto 18px 18px 18px;
            z-index: 2;
            display: grid;
            gap: 8px;
            font-family: "Courier New", monospace;
            color: var(--acid);
            text-shadow: 0 0 12px rgba(64, 255, 136, 0.45);
        }

        .hud-line {
            width: min(520px, 100%);
            height: 10px;
            border: 1px solid rgba(64, 255, 136, 0.42);
            background: linear-gradient(90deg, rgba(64, 255, 136, 0.42), transparent 68%);
        }

        .hud-line.short {
            width: min(340px, 70%);
            border-color: rgba(65, 214, 255, 0.4);
            background: linear-gradient(90deg, rgba(65, 214, 255, 0.34), transparent 72%);
        }

        .terminal-panel,
        .panel {
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: rgba(7, 9, 7, 0.78);
            box-shadow: 0 24px 60px var(--shadow);
        }

        .terminal-panel {
            padding: 18px;
            font-family: "Courier New", monospace;
        }

        .terminal-panel header {
            display: flex;
            justify-content: space-between;
            gap: 14px;
            margin-bottom: 14px;
            color: var(--muted);
            font-size: 12px;
            text-transform: uppercase;
        }

        .terminal-list {
            display: grid;
            gap: 10px;
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .terminal-list li {
            color: var(--soft);
            line-height: 1.5;
        }

        .terminal-list li::before {
            content: "> ";
            color: var(--acid);
        }

        .manifest-grid,
        .characters-grid,
        .module-grid {
            display: grid;
            gap: 14px;
        }

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

        .characters-grid {
            align-items: stretch;
            grid-template-columns: repeat(5, minmax(0, 1fr));
        }

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

        .home-ranking-grid {
            grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
        }

        .home-top-players-table {
            width: 100%;
            min-width: 0;
            table-layout: fixed;
        }

        .home-top-players-table th,
        .home-top-players-table td {
            overflow: hidden;
            padding: 10px 8px;
            font-size: 13px;
            text-overflow: ellipsis;
        }

        .home-top-players-table th:nth-child(1),
        .home-top-players-table td:nth-child(1) {
            width: 8%;
        }

        .home-top-players-table th:nth-child(2),
        .home-top-players-table td:nth-child(2) {
            width: 32%;
        }

        .home-top-players-table th:nth-child(3),
        .home-top-players-table td:nth-child(3) {
            width: 24%;
        }

        .home-top-players-table th:nth-child(4),
        .home-top-players-table td:nth-child(4),
        .home-top-players-table th:nth-child(5),
        .home-top-players-table td:nth-child(5) {
            width: 12%;
        }

        .home-top-players-table .player-cell,
        .home-top-players-table .player-name-line,
        .home-top-players-table .level {
            min-width: 0;
        }

        .home-top-players-table .player-name-line {
            flex: 1 1 auto;
        }

        .home-top-players-table .player-avatar {
            flex-basis: 28px;
            width: 28px;
            height: 28px;
            font-size: 13px;
        }

        .home-top-players-table .player-name-line a {
            display: block;
            min-width: 0;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .home-top-players-table .level {
            grid-template-columns: 34px minmax(32px, 1fr);
            gap: 6px;
        }

        .home-top-players-table .level-number {
            width: 34px;
            height: 34px;
            font-size: 13px;
        }

        .module,
        .manifest-item,
        .character-card {
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: rgba(11, 16, 13, 0.88);
            padding: 18px;
        }

        .manifest-item h3,
        .module h3,
        .character-card h3 {
            margin: 0 0 8px;
            font-size: 18px;
        }

        .manifest-item p,
        .module p,
        .character-card p {
            margin: 0;
        }

        .home-feature-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 14px;
        }

        .home-feature-card {
            position: relative;
            min-height: 100%;
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background:
                linear-gradient(135deg, rgba(64, 255, 136, 0.1), transparent 44%),
                linear-gradient(180deg, rgba(65, 214, 255, 0.055), transparent 62%),
                rgba(11, 16, 13, 0.9);
            padding: 20px;
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
        }

        .home-feature-card::after {
            content: "";
            position: absolute;
            inset: auto 16px 0;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(255, 191, 63, 0.6), transparent);
        }

        .home-feature-icon {
            display: grid;
            place-items: center;
            width: 42px;
            height: 42px;
            margin-bottom: 16px;
            border: 1px solid rgba(64, 255, 136, 0.42);
            border-radius: 8px;
            color: var(--acid);
            background: rgba(64, 255, 136, 0.08);
            font-size: 22px;
        }

        .home-feature-card h3 {
            margin: 0 0 9px;
            color: var(--text);
            font-size: 18px;
            line-height: 1.18;
            text-transform: uppercase;
        }

        .home-feature-card p {
            margin: 0;
            color: var(--muted);
            line-height: 1.58;
        }

        .development-progress-list {
            display: grid;
            gap: 14px;
            width: 100%;
        }

        .development-progress-item {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background:
                linear-gradient(90deg, var(--progress-panel, rgba(65, 214, 255, 0.08)), transparent 38%),
                rgba(7, 9, 7, 0.88);
            padding: 18px;
        }

        .development-progress-header {
            display: flex;
            align-items: baseline;
            justify-content: space-between;
            gap: 16px;
            margin-bottom: 12px;
        }

        .development-progress-header h3 {
            margin: 0;
            color: var(--text);
            font-size: 18px;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .development-progress-header span {
            flex: 0 0 auto;
            color: var(--progress-text, var(--acid));
            font: 900 14px/1 "Courier New", monospace;
        }

        .development-progress-meter {
            width: 100%;
            height: 12px;
            overflow: hidden;
            border: 1px solid var(--progress-border, var(--line-strong));
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.055);
            box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.38);
        }

        .development-progress-fill {
            display: block;
            height: 100%;
            border-radius: inherit;
            background: linear-gradient(90deg, var(--progress-fill-start, var(--acid)), var(--progress-fill-end, var(--cyan)));
            box-shadow: 0 0 18px var(--progress-glow, rgba(64, 255, 136, 0.26));
        }

        .development-progress-item p {
            margin: 12px 0 0;
            color: var(--muted);
            line-height: 1.55;
        }

        .development-author {
            display: grid;
            gap: 18px;
        }

        .development-author-copy {
            position: relative;
            display: grid;
            border-color: var(--line-strong);
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.12), transparent 34%),
                linear-gradient(180deg, rgba(65, 214, 255, 0.06), transparent 28%),
                rgba(7, 9, 7, 0.9);
            padding: clamp(24px, 4vw, 48px);
            box-shadow:
                0 32px 90px rgba(0, 0, 0, 0.36),
                inset 4px 0 0 rgba(64, 255, 136, 0.72);
        }

        .development-author-copy::before {
            content: "";
            position: absolute;
            inset: 14px;
            pointer-events: none;
            border: 1px solid rgba(171, 255, 212, 0.08);
        }

        .development-author-header,
        .development-story {
            position: relative;
            z-index: 1;
        }

        .development-author-header {
            display: grid;
            gap: 10px;
            border-bottom: 1px solid var(--line);
            padding-bottom: 24px;
            margin-bottom: 26px;
        }

        .development-author-copy h2 {
            margin: 0;
            color: var(--text);
            font-size: clamp(28px, 4vw, 44px);
            line-height: 1.08;
            text-transform: uppercase;
        }

        .development-author-heading-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .development-author-copy p {
            margin: 0;
            color: var(--soft);
            font-size: 17px;
            line-height: 1.78;
        }

        .development-author-role {
            color: var(--acid) !important;
            font-family: "Courier New", monospace;
            font-size: 13px;
            font-weight: 800;
            text-transform: uppercase;
        }

        .development-author-link {
            flex: 0 0 auto;
        }

        .development-story {
            display: grid;
            gap: 20px;
        }

        .development-story-lead {
            color: var(--text) !important;
            font-size: 19px !important;
            line-height: 1.65 !important;
        }

        .development-story-section {
            border-top: 1px solid rgba(171, 255, 212, 0.16);
            padding-top: 26px;
            margin-top: 6px;
        }

        .development-story-section:first-child {
            border-top: 0;
            padding-top: 0;
            margin-top: 0;
        }

        .development-story-section h3 {
            display: flex;
            align-items: baseline;
            gap: 12px;
            margin: 0 0 14px;
            color: var(--text);
            font-size: clamp(22px, 3vw, 30px);
            line-height: 1.12;
            text-transform: uppercase;
        }

        .development-story-section h3 span {
            color: var(--acid);
            font: 900 14px/1 "Courier New", monospace;
        }

        .development-story-section p + p {
            margin-top: 13px;
        }

        .development-story-punch {
            color: var(--acid) !important;
            font-weight: 800;
        }

        .development-author-gallery {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 14px;
        }

        .development-photo {
            margin: 0;
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: rgba(11, 16, 13, 0.88);
            box-shadow: 0 24px 60px var(--shadow);
            transition: border-color 0.16s ease, transform 0.16s ease, background 0.16s ease;
        }

        .development-photo:hover,
        .development-photo:focus-within {
            border-color: var(--line-strong);
            background: rgba(18, 28, 23, 0.92);
            transform: translateY(-2px);
        }

        .development-photo a {
            display: block;
            color: inherit;
            cursor: zoom-in;
        }

        .development-photo img {
            display: block;
            width: 100%;
            aspect-ratio: 1251 / 828;
            object-fit: cover;
            background: #030503;
        }

        .faq-block {
            margin-top: 42px;
        }

        .faq-block .section-heading {
            margin-bottom: 16px;
        }

        .faq-list {
            display: grid;
            grid-template-columns: 1fr;
            gap: 12px;
        }

        .faq-item {
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background:
                linear-gradient(135deg, rgba(64, 255, 136, 0.07), transparent 52%),
                rgba(11, 16, 13, 0.88);
            padding: 0;
            overflow: hidden;
        }

        .faq-item[open] {
            border-color: rgba(64, 255, 136, 0.38);
            box-shadow: 0 20px 46px rgba(0, 0, 0, 0.18);
        }

        .faq-item summary {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 26px;
            align-items: center;
            gap: 12px;
            min-height: 58px;
            padding: 15px 16px;
            color: var(--text);
            font-weight: 900;
            line-height: 1.25;
            cursor: pointer;
            list-style: none;
        }

        .faq-item summary::-webkit-details-marker {
            display: none;
        }

        .faq-item summary::after {
            content: "+";
            display: grid;
            place-items: center;
            width: 26px;
            height: 26px;
            border: 1px solid var(--line-strong);
            border-radius: 6px;
            color: var(--acid);
            font-family: "Courier New", monospace;
            line-height: 1;
        }

        .faq-item[open] summary::after {
            content: "-";
            border-color: rgba(255, 191, 63, 0.52);
            color: var(--amber);
        }

        .faq-item p {
            margin: 0;
            padding: 0 16px 16px;
            color: var(--muted);
            line-height: 1.55;
        }

        .arena-overview {
            display: grid;
            gap: 16px;
        }

        .arena-overview p {
            margin: 0;
        }

        .arena-specs {
            display: grid;
            gap: 10px;
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .arena-specs li {
            border-left: 2px solid var(--line-strong);
            padding-left: 12px;
            color: var(--soft);
            line-height: 1.45;
        }

        .arena-gallery {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 14px;
        }

        .arena-shot {
            display: grid;
            width: 100%;
            min-height: 0;
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: rgba(11, 16, 13, 0.88);
            color: inherit;
            padding: 0;
            font: inherit;
            text-align: left;
            text-transform: none;
            box-shadow: 0 18px 44px rgba(0, 0, 0, 0.24);
            cursor: zoom-in;
            transition: border-color 0.16s ease, transform 0.16s ease, background 0.16s ease;
        }

        .arena-shot:hover,
        .arena-shot:focus-visible {
            border-color: var(--line-strong);
            background: rgba(18, 28, 23, 0.92);
            transform: translateY(-2px);
        }

        .arena-shot img {
            display: block;
            width: 100%;
            aspect-ratio: 2507 / 1928;
            object-fit: cover;
            background: #030503;
        }

        .arena-shot span {
            padding: 11px 12px;
            color: var(--soft);
            font: 700 12px/1 "Courier New", monospace;
            text-transform: uppercase;
        }

        .image-lightbox {
            position: fixed;
            inset: 0;
            z-index: 100;
            display: grid;
            place-items: center;
            padding: 24px;
            background: rgba(0, 0, 0, 0.88);
            backdrop-filter: blur(10px);
        }

        .image-lightbox[hidden] {
            display: none;
        }

        .lightbox-dialog {
            display: grid;
            gap: 12px;
            width: min(1500px, 100%);
            max-height: calc(100vh - 48px);
        }

        .lightbox-close,
        .lightbox-nav {
            justify-self: end;
            width: 44px;
            min-height: 44px;
            padding: 0;
            border-color: rgba(255, 255, 255, 0.24);
            background: rgba(7, 9, 7, 0.88);
            font-size: 22px;
            line-height: 1;
            cursor: pointer;
        }

        .lightbox-close:hover,
        .lightbox-close:focus-visible,
        .lightbox-nav:hover,
        .lightbox-nav:focus-visible {
            border-color: var(--line-strong);
            background: rgba(64, 255, 136, 0.16);
        }

        .lightbox-media {
            position: relative;
            display: grid;
            place-items: center;
            min-height: 0;
        }

        .lightbox-image {
            display: block;
            width: 100%;
            max-height: calc(100vh - 132px);
            object-fit: contain;
            border: 1px solid var(--line-strong);
            border-radius: var(--radius);
            background: #030503;
            box-shadow: 0 28px 90px rgba(0, 0, 0, 0.62);
        }

        .lightbox-nav {
            position: absolute;
            top: 50%;
            z-index: 2;
            transform: translateY(-50%);
            background: rgba(7, 9, 7, 0.82);
            font-size: 24px;
        }

        .lightbox-prev {
            left: 12px;
        }

        .lightbox-next {
            right: 12px;
        }

        .lightbox-caption {
            margin: 0;
            color: var(--soft);
            font: 700 13px/1.35 "Courier New", monospace;
            text-transform: uppercase;
        }

        body.lightbox-open {
            overflow: hidden;
        }

        .character-card {
            position: relative;
            min-height: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
        }

        .character-card:focus-visible {
            outline: 2px solid var(--line-strong);
            outline-offset: 3px;
        }

        .character-image {
            position: relative;
            height: 228px;
            margin: -2px -2px 16px;
            overflow: hidden;
            border: 1px solid rgba(255, 255, 255, 0.08);
            border-radius: 6px;
            background:
                linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px),
                linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
                linear-gradient(135deg, rgba(64, 255, 136, 0.18), rgba(65, 214, 255, 0.1), rgba(255, 77, 92, 0.1)),
                #050805;
            background-size: 22px 22px, 22px 22px, auto, auto;
        }

        .character-image::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            background:
                radial-gradient(circle at 50% 12%, rgba(255, 255, 255, 0.14), transparent 30%),
                linear-gradient(180deg, transparent 64%, rgba(0, 0, 0, 0.38));
            pointer-events: none;
        }

        .character-image img {
            position: relative;
            z-index: 0;
            display: block;
            width: 100%;
            height: 100%;
            object-fit: contain;
            object-position: center bottom;
            filter: drop-shadow(0 22px 24px rgba(0, 0, 0, 0.46));
        }

        .tone-lime .character-image,
        .tone-lime .meta {
            color: var(--acid);
        }

        .tone-cyan .character-image,
        .tone-cyan .meta {
            color: var(--cyan);
        }

        .tone-amber .character-image,
        .tone-amber .meta {
            color: var(--amber);
        }

        .tone-red .character-image,
        .tone-red .meta {
            color: var(--red);
        }

        .meta {
            margin: 0 0 9px;
            font-family: "Courier New", monospace;
            font-size: 12px;
            text-transform: uppercase;
        }

        .loadout {
            margin-top: 14px;
            color: var(--soft);
            font-size: 13px;
            line-height: 1.45;
        }

        .character-info-switch {
            display: grid;
            flex: 1 1 auto;
            margin-top: 0;
        }

        .character-copy,
        .operator-stats {
            grid-area: 1 / 1;
            min-width: 0;
            transition:
                opacity 0.18s ease,
                transform 0.18s ease,
                visibility 0.18s ease;
        }

        .character-copy {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

        .operator-stats {
            display: grid;
            grid-template-columns: 1fr;
            gap: 8px;
            margin-top: 0;
            opacity: 0;
            visibility: hidden;
            transform: translateY(10px);
            pointer-events: none;
        }

        .character-card:hover .operator-stats,
        .character-card:focus .operator-stats,
        .character-card:focus-within .operator-stats {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
            pointer-events: auto;
        }

        .character-card:hover .character-copy,
        .character-card:focus .character-copy,
        .character-card:focus-within .character-copy {
            opacity: 0;
            visibility: hidden;
            transform: translateY(-8px);
            pointer-events: none;
        }

        .operator-stat {
            display: grid;
            grid-template-columns: 24px minmax(0, 1fr);
            align-items: center;
            gap: 7px;
            min-height: 52px;
            border: 1px solid rgba(171, 255, 212, 0.22);
            border-radius: 6px;
            background:
                linear-gradient(90deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
                rgba(3, 5, 3, 0.56);
            padding: 7px;
        }

        .operator-stat-content {
            display: grid;
            gap: 6px;
            min-width: 0;
        }

        .operator-stat-top {
            display: flex;
            align-items: flex-start;
            flex-direction: column;
            justify-content: center;
            gap: 2px;
            min-width: 0;
        }

        .operator-stat-icon {
            width: 24px;
            height: 24px;
            display: grid;
            place-items: center;
            border: 1px solid currentColor;
            border-radius: 5px;
            color: var(--acid);
            background: rgba(64, 255, 136, 0.08);
        }

        .operator-stat-icon svg {
            width: 14px;
            height: 14px;
            fill: none;
            stroke: currentColor;
            stroke-width: 2;
            stroke-linecap: square;
            stroke-linejoin: miter;
        }

        .operator-stat-icon-hp {
            color: var(--red);
            background: rgba(255, 77, 92, 0.08);
        }

        .operator-stat-icon-damage {
            color: var(--amber);
            background: rgba(255, 191, 63, 0.08);
        }

        .operator-stat-icon-speed {
            color: var(--cyan);
            background: rgba(65, 214, 255, 0.08);
        }

        .operator-stat-icon-fire_rate {
            color: var(--red);
            background: rgba(255, 77, 92, 0.08);
        }

        .operator-stat-icon-range {
            color: var(--acid);
            background: rgba(64, 255, 136, 0.08);
        }

        .operator-stat-icon-jetpack {
            color: var(--amber);
            background: rgba(255, 191, 63, 0.08);
        }

        .operator-stat-label {
            display: block;
            color: var(--muted);
            font-family: "Courier New", monospace;
            font-size: 10px;
            line-height: 1.1;
            text-transform: uppercase;
        }

        .operator-stat-value {
            display: block;
            color: var(--text);
            font-size: 12px;
            font-weight: 800;
            line-height: 1.2;
            white-space: nowrap;
        }

        .operator-stat-bar {
            position: relative;
            display: block;
            height: 10px;
            overflow: hidden;
            border: 1px solid rgba(171, 255, 212, 0.3);
            border-radius: 999px;
            background:
                repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0, rgba(255, 255, 255, 0.08) 1px, transparent 1px, transparent 20%),
                rgba(0, 0, 0, 0.42);
            box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.34);
        }

        .operator-stat-fill {
            display: block;
            height: 100%;
            border-radius: inherit;
            background: linear-gradient(90deg, var(--acid), var(--cyan));
            box-shadow:
                0 0 12px rgba(64, 255, 136, 0.48),
                inset 0 0 8px rgba(255, 255, 255, 0.16);
        }

        .operator-stat-hp .operator-stat-fill {
            background: linear-gradient(90deg, var(--red), var(--amber));
            box-shadow:
                0 0 12px rgba(255, 77, 92, 0.48),
                inset 0 0 8px rgba(255, 255, 255, 0.16);
        }

        .operator-stat-damage .operator-stat-fill {
            background: linear-gradient(90deg, var(--amber), var(--red));
            box-shadow:
                0 0 12px rgba(255, 191, 63, 0.46),
                inset 0 0 8px rgba(255, 255, 255, 0.16);
        }

        .operator-stat-speed .operator-stat-fill {
            background: linear-gradient(90deg, var(--cyan), var(--acid));
            box-shadow:
                0 0 12px rgba(65, 214, 255, 0.44),
                inset 0 0 8px rgba(255, 255, 255, 0.16);
        }

        .operator-stat-fire_rate .operator-stat-fill {
            background: linear-gradient(90deg, var(--red), var(--cyan));
            box-shadow:
                0 0 12px rgba(255, 77, 92, 0.44),
                inset 0 0 8px rgba(255, 255, 255, 0.16);
        }

        .operator-stat-range .operator-stat-fill {
            background: linear-gradient(90deg, var(--acid), var(--cyan));
            box-shadow:
                0 0 12px rgba(64, 255, 136, 0.42),
                inset 0 0 8px rgba(255, 255, 255, 0.16);
        }

        .operator-stat-jetpack .operator-stat-fill {
            background: linear-gradient(90deg, var(--amber), var(--acid));
            box-shadow:
                0 0 12px rgba(255, 191, 63, 0.44),
                inset 0 0 8px rgba(255, 255, 255, 0.16);
        }

        .character-card .character-detail {
            margin-top: 10px;
            color: var(--soft);
        }

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

        .characters-page .character-card {
            padding: 20px;
        }

        .characters-page .operator-stats {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .characters-page .character-image {
            height: clamp(330px, 31vw, 460px);
            margin-bottom: 18px;
        }

        .characters-page .character-card h3 {
            font-size: 24px;
            line-height: 1.1;
        }

        .characters-page .character-card p {
            font-size: 15px;
        }

        .compact-hero,
        .page-hero {
            border-bottom: 1px solid var(--line);
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.12), transparent 42%, rgba(255, 77, 92, 0.12)),
                rgba(3, 5, 3, 0.74);
        }

        .page-hero .section-inner,
        .compact-hero .section-inner {
            padding: 58px 0 46px;
        }

        .panel {
            padding: 24px;
        }

        .form-grid {
            display: grid;
            gap: 14px;
            max-width: 560px;
        }

        .password-reset-request-form {
            margin-top: 14px;
        }

        .panel-divider {
            max-width: 560px;
            margin: 24px 0;
            border-top: 1px solid var(--line);
        }

        .panel-subheading {
            margin: 0 0 8px;
            color: var(--text);
            font-size: 20px;
            line-height: 1.25;
            text-transform: uppercase;
        }

        label {
            display: grid;
            gap: 7px;
            color: var(--muted);
            font-size: 13px;
        }

        .form-help {
            color: var(--soft);
            font-size: 12px;
            line-height: 1.45;
        }

        input,
        textarea {
            width: 100%;
            border: 1px solid var(--line);
            border-radius: 6px;
            background: rgba(2, 4, 2, 0.76);
            color: var(--text);
            padding: 13px 13px;
            font: 15px/1.4 Arial, Helvetica, sans-serif;
            outline: none;
        }

        textarea {
            min-height: 150px;
            resize: vertical;
        }

        input:focus,
        textarea:focus {
            border-color: var(--line-strong);
            box-shadow: 0 0 0 3px rgba(64, 255, 136, 0.12);
        }

        .alert {
            width: min(1280px, calc(100% - 32px));
            margin: 18px auto 0;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            padding: 13px 15px;
            line-height: 1.45;
        }

        .alert-success {
            border-color: rgba(64, 255, 136, 0.42);
            background: rgba(64, 255, 136, 0.1);
            color: var(--acid);
        }

        .alert-error {
            border-color: rgba(255, 77, 92, 0.42);
            background: rgba(255, 77, 92, 0.1);
            color: #ff9aa4;
        }

        .data-wrap {
            overflow-x: auto;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: rgba(7, 9, 7, 0.74);
        }

        .data-tabs {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-bottom: 26px;
            border-bottom: 1px solid var(--line);
            padding-bottom: 12px;
        }

        .data-tabs a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 40px;
            border: 1px solid var(--line);
            border-radius: 6px;
            background: rgba(7, 9, 7, 0.72);
            color: var(--soft);
            padding: 9px 13px;
            font: 800 13px/1 "Courier New", monospace;
            text-transform: uppercase;
        }

        .data-tabs a:hover,
        .data-tabs a.is-active {
            border-color: var(--line-strong);
            background: rgba(64, 255, 136, 0.14);
            color: var(--text);
        }

        .data-section-heading {
            margin-bottom: 18px;
        }

        .data-toolbar {
            display: grid;
            grid-template-columns: minmax(220px, 1fr) auto auto auto;
            align-items: end;
            gap: 10px;
            margin-bottom: 18px;
        }

        .data-toolbar label {
            min-width: 0;
        }

        .data-toolbar button,
        .data-toolbar .button {
            min-height: 47px;
        }

        .data-result-count {
            align-self: center;
            color: var(--muted);
            font: 800 12px/1.2 "Courier New", monospace;
            text-transform: uppercase;
            white-space: nowrap;
        }

        .pagination {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: flex-end;
            gap: 10px;
            margin-top: 18px;
        }

        .pagination span {
            color: var(--muted);
            font: 800 12px/1.2 "Courier New", monospace;
            text-transform: uppercase;
        }

        table {
            width: 100%;
            min-width: 840px;
            border-collapse: collapse;
        }

        th,
        td {
            padding: 13px 14px;
            border-bottom: 1px solid var(--line);
            text-align: left;
            vertical-align: middle;
            font-size: 14px;
        }

        th {
            color: var(--acid);
            font-family: "Courier New", monospace;
            font-size: 12px;
            text-transform: uppercase;
            background: rgba(64, 255, 136, 0.08);
        }

        tr:last-child td {
            border-bottom: 0;
        }

        tr[data-href] {
            cursor: pointer;
        }

        tr[data-href] td {
            transition: background-color 0.16s ease, color 0.16s ease;
        }

        tr[data-href]:hover td,
        tr[data-href]:focus-visible td {
            background: rgba(64, 255, 136, 0.08);
        }

        tr[data-href]:focus-visible {
            outline: 2px solid var(--line-strong);
            outline-offset: -2px;
        }

        .badge {
            display: inline-flex;
            align-items: center;
            min-height: 24px;
            border: 1px solid var(--line);
            border-radius: 999px;
            padding: 3px 9px;
            font-size: 12px;
            font-weight: 800;
            text-transform: uppercase;
        }

        .badge-green {
            border-color: rgba(64, 255, 136, 0.4);
            color: var(--acid);
            background: rgba(64, 255, 136, 0.1);
        }

        .badge-red {
            border-color: rgba(255, 77, 92, 0.44);
            color: #ff9aa4;
            background: rgba(255, 77, 92, 0.1);
        }

        .badge-blue {
            border-color: rgba(65, 214, 255, 0.44);
            color: var(--cyan);
            background: rgba(65, 214, 255, 0.1);
        }

        .player-cell {
            display: flex;
            align-items: center;
            gap: 8px;
            min-width: 220px;
        }

        .player-avatar {
            display: grid;
            place-items: center;
            flex: 0 0 32px;
            width: 32px;
            height: 32px;
            border: 1px solid var(--line-strong);
            border-radius: 6px;
            background: rgba(64, 255, 136, 0.12);
            color: var(--acid);
            font: 900 14px/1 "Courier New", monospace;
        }

        .king-icon {
            display: grid;
            place-items: center;
            flex: 0 0 24px;
            width: 24px;
            height: 24px;
            color: var(--amber);
            font-size: 19px;
            line-height: 1;
            text-shadow: 0 0 14px rgba(255, 191, 63, 0.45);
        }

        .player-name-line {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
            min-width: 0;
        }

        .level {
            display: grid;
            grid-template-columns: 42px minmax(120px, 1fr);
            align-items: center;
            gap: 10px;
            min-width: 190px;
        }

        .level-number,
        .avatar {
            border: 1px solid var(--line-strong);
            border-radius: 6px;
            background: rgba(64, 255, 136, 0.12);
            color: var(--acid);
            display: grid;
            place-items: center;
            font-weight: 900;
        }

        .level-number {
            width: 42px;
            height: 42px;
        }

        .progress {
            height: 10px;
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.06);
        }

        .progress-bar {
            height: 100%;
            border-radius: inherit;
            background: linear-gradient(90deg, var(--acid), var(--cyan), var(--amber));
        }

        .profile-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 18px;
            flex-wrap: wrap;
        }

        .profile-title {
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .avatar {
            width: 58px;
            height: 58px;
            font-size: 24px;
        }

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

        .empty {
            border: 1px dashed var(--line);
            border-radius: var(--radius);
            padding: 26px;
            color: var(--muted);
            text-align: center;
        }

        .download-onboarding {
            background:
                linear-gradient(90deg, rgba(64, 255, 136, 0.08), transparent 42%, rgba(65, 214, 255, 0.06)),
                rgba(3, 5, 3, 0.38);
        }

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

        .onboarding-step {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr);
            gap: 16px;
            align-items: start;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background:
                linear-gradient(135deg, rgba(64, 255, 136, 0.1), transparent 48%),
                rgba(11, 16, 13, 0.88);
            padding: 22px;
            box-shadow: 0 24px 60px var(--shadow);
        }

        .onboarding-step-number {
            display: grid;
            place-items: center;
            width: 42px;
            height: 42px;
            border: 1px solid var(--line-strong);
            border-radius: 8px;
            color: var(--acid);
            background: rgba(64, 255, 136, 0.1);
            font: 900 20px/1 "Courier New", monospace;
        }

        .onboarding-step-copy h3 {
            margin: 5px 0 10px;
            color: var(--text);
            font-size: 24px;
            line-height: 1.08;
            text-transform: uppercase;
        }

        .onboarding-step-copy p:last-child {
            margin: 0;
            color: var(--soft);
            line-height: 1.58;
        }

        .onboarding-step .button {
            grid-column: 2;
            justify-self: start;
            margin-top: 2px;
        }

        .download-requirement {
            display: flex;
            align-items: center;
            gap: 14px;
            margin-top: 14px;
            border: 1px solid rgba(255, 191, 63, 0.34);
            border-radius: var(--radius);
            background: rgba(255, 191, 63, 0.08);
            padding: 14px 16px;
        }

        .download-requirement strong {
            flex: 0 0 auto;
            color: var(--amber);
            font: 900 13px/1.2 "Courier New", monospace;
            text-transform: uppercase;
        }

        .download-requirement span {
            color: var(--soft);
            line-height: 1.5;
        }

        .download-guidance-grid {
            display: grid;
            grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
            gap: 18px;
            align-items: stretch;
        }

        .download-screenshot {
            margin: 0;
            overflow: hidden;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            background: rgba(7, 9, 7, 0.78);
            box-shadow: 0 24px 60px var(--shadow);
        }

        .download-screenshot img {
            display: block;
            width: 100%;
            aspect-ratio: 672 / 626;
            object-fit: cover;
            background: #c91818;
        }

        .download-screenshot figcaption {
            margin: 0;
            padding: 13px 15px;
            color: var(--soft);
            line-height: 1.45;
        }

        .download-screenshot figcaption strong,
        .download-info-panel strong {
            color: var(--text);
        }

        .download-info-panel {
            display: grid;
            align-content: center;
            gap: 14px;
            padding: 24px;
        }

        .download-info-panel h3 {
            margin: 0;
            color: var(--text);
            font-size: 24px;
            line-height: 1.08;
            text-transform: uppercase;
        }

        .download-info-panel p {
            margin: 0;
            color: var(--soft);
            line-height: 1.58;
        }

        .download-note-panel {
            padding: 20px;
        }

        .download-note-panel p {
            margin: 0;
            color: var(--soft);
            font-size: 16px;
            line-height: 1.65;
        }

        .footer {
            border-top: 1px solid var(--line);
            padding: 28px 0;
            color: var(--muted);
            background: #030503;
        }

        .footer .section-inner {
            display: flex;
            justify-content: space-between;
            gap: 18px;
            flex-wrap: wrap;
        }

        @keyframes pulseCrosshair {
            0%,
            100% {
                opacity: 0.45;
                transform: rotate(45deg) scale(0.95);
            }
            50% {
                opacity: 0.9;
                transform: rotate(45deg) scale(1.06);
            }
        }

        @keyframes blinkCaret {
            0%,
            45% {
                opacity: 1;
            }
            46%,
            100% {
                opacity: 0;
            }
        }

        @media (min-width: 721px) and (max-width: 1080px) {
            .topbar {
                align-items: flex-start;
                flex-direction: column;
                padding: 16px 0;
            }

            .nav {
                justify-content: flex-start;
            }

            .brand-logo {
                width: min(300px, 78vw);
            }

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

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

            .manifest-grid,
            .home-feature-grid,
            .faq-list,
            .module-grid,
            .two-column {
                grid-template-columns: 1fr;
            }

            .manifest-text-block {
                padding: 32px;
            }

            .hero h1,
            .page-hero h1 {
                font-size: 52px;
            }
        }

        @media (max-width: 720px) {
            .site-header {
                background: rgba(3, 5, 3, 0.96);
            }

            .topbar {
                width: min(1280px, calc(100% - 24px));
                min-height: 64px;
                display: grid;
                grid-template-columns: minmax(0, 1fr) auto auto;
                align-items: center;
                gap: 8px;
                padding: 10px 0;
            }

            .prealpha-strip .section-inner,
            .server-unavailable-strip .section-inner {
                align-items: flex-start;
                flex-direction: column;
                gap: 3px;
                width: min(1280px, calc(100% - 24px));
            }

            .brand {
                grid-column: 1;
                grid-row: 1;
                min-width: 0;
            }

            .brand-logo {
                width: min(220px, 46vw);
                max-height: 34px;
            }

            .language-switch {
                grid-column: 2;
                grid-row: 1;
                justify-self: end;
            }

            .language-switch a {
                padding: 6px 7px;
            }

            .menu-toggle {
                grid-column: 3;
                grid-row: 1;
                display: inline-flex;
            }

            .nav {
                grid-column: 1 / -1;
                grid-row: 2;
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                justify-content: stretch;
                gap: 8px;
                width: 100%;
                max-height: calc(100vh - 86px);
                margin-top: 4px;
                overflow-y: auto;
                visibility: visible;
                opacity: 1;
                border: 1px solid var(--line);
                border-radius: var(--radius);
                background:
                    linear-gradient(135deg, rgba(64, 255, 136, 0.08), rgba(65, 214, 255, 0.05)),
                    rgba(7, 9, 7, 0.98);
                padding: 8px;
                transform: translateY(0);
                transition: max-height 0.22s ease, opacity 0.16s ease, visibility 0.16s ease, padding 0.16s ease, transform 0.16s ease;
            }

            .site-header.is-menu-ready .nav {
                max-height: 0;
                margin: 0;
                overflow: hidden;
                visibility: hidden;
                opacity: 0;
                border-color: transparent;
                padding: 0 8px;
                transform: translateY(-6px);
            }

            .site-header.is-menu-ready.is-menu-open .nav {
                max-height: calc(100vh - 86px);
                margin-top: 4px;
                overflow-y: auto;
                visibility: visible;
                opacity: 1;
                border-color: var(--line);
                padding: 8px;
                transform: translateY(0);
            }

            .nav a {
                display: flex;
                align-items: center;
                justify-content: center;
                min-height: 42px;
                border-color: rgba(171, 255, 212, 0.14);
                background: rgba(255, 255, 255, 0.035);
                padding: 10px 8px;
                text-align: center;
            }

            .hero,
            .hero-inner {
                min-height: 76vh;
            }

            .hero-inner {
                width: min(1280px, calc(100% - 24px));
                padding: 76px 0 42px;
            }

            .hero h1,
            .page-hero h1 {
                font-size: 40px;
                line-height: 1.02;
            }

            .season-badge {
                top: 4px;
                right: 16px;
                min-width: 142px;
                padding: 9px 11px;
            }

            .season-badge strong {
                font-size: 14px;
            }

            .season-badge span {
                font-size: 9px;
            }

            .engine-badge {
                right: 16px;
                bottom: 14px;
                transform: scale(0.86);
                transform-origin: right bottom;
            }

            .hero-lead,
            .page-lead {
                font-size: 16px;
            }

            .manifest-quote {
                padding: 15px 16px;
            }

            .manifest-quote blockquote {
                font-size: 16px;
            }

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

            .actions .button {
                width: 100%;
            }

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

            .section {
                padding: 42px 0;
            }

            .section-inner,
            .alert {
                width: min(1280px, calc(100% - 24px));
            }

            .page-hero .section-inner,
            .compact-hero .section-inner {
                padding: 42px 0 34px;
            }

            .section-heading {
                align-items: flex-start;
                flex-direction: column;
            }

            .section-heading h2,
            .panel h2,
            .compact-hero h2 {
                font-size: 28px;
            }

            .manifest-grid,
            .home-feature-grid,
            .module-grid,
            .development-author-gallery,
            .onboarding-steps,
            .download-guidance-grid,
            .two-column {
                grid-template-columns: 1fr;
            }

            .development-progress-header {
                align-items: flex-start;
                flex-direction: column;
                gap: 8px;
            }

            .manifest-text-block {
                padding: 20px;
            }

            .home-top-players-wrap {
                overflow-x: hidden;
            }

            .home-top-players-table th,
            .home-top-players-table td {
                padding: 9px 6px;
                font-size: 12px;
            }

            .home-top-players-table th:nth-child(1),
            .home-top-players-table td:nth-child(1) {
                width: 9%;
            }

            .home-top-players-table th:nth-child(2),
            .home-top-players-table td:nth-child(2) {
                width: 40%;
            }

            .home-top-players-table th:nth-child(3),
            .home-top-players-table td:nth-child(3) {
                width: 31%;
            }

            .home-top-players-table th:nth-child(4),
            .home-top-players-table td:nth-child(4) {
                width: 20%;
            }

            .home-top-players-table th:nth-child(5),
            .home-top-players-table td:nth-child(5),
            .home-top-players-table th:nth-child(6),
            .home-top-players-table td:nth-child(6) {
                display: none;
            }

            .home-top-players-table .player-cell {
                gap: 6px;
            }

            .home-top-players-table .player-avatar {
                flex-basis: 24px;
                width: 24px;
                height: 24px;
                font-size: 11px;
            }

            .home-top-players-table .level {
                grid-template-columns: 28px minmax(20px, 1fr);
                gap: 5px;
            }

            .home-top-players-table .level-number {
                width: 28px;
                height: 28px;
                font-size: 12px;
            }

            .manifest-text-header {
                padding-bottom: 18px;
                margin-bottom: 20px;
            }

            .manifest-intro-line {
                font-size: 17px !important;
            }

            .manifest-text-body p {
                font-size: 15px;
                line-height: 1.68;
            }

            .manifest-text-section {
                padding-top: 22px;
            }

            .manifest-text-section h3 {
                align-items: flex-start;
                flex-direction: column;
                gap: 7px;
            }

            .development-author-copy {
                padding: 20px;
            }

            .development-author-header {
                padding-bottom: 18px;
                margin-bottom: 20px;
            }

            .development-author-heading-row {
                align-items: flex-start;
                flex-direction: column;
                gap: 12px;
            }

            .development-story-lead {
                font-size: 17px !important;
            }

            .development-author-copy p {
                font-size: 15px;
                line-height: 1.68;
            }

            .development-story-section {
                padding-top: 22px;
            }

            .development-story-section h3 {
                align-items: flex-start;
                flex-direction: column;
                gap: 7px;
            }

            .panel {
                padding: 18px;
            }

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

            .characters-page .characters-grid {
                grid-template-columns: 1fr;
            }

            .characters-page .character-image {
                height: min(420px, 94vw);
            }

            .video-frame {
                min-height: 0;
            }

            .onboarding-step {
                grid-template-columns: 1fr;
            }

            .onboarding-step .button {
                grid-column: auto;
                width: 100%;
            }

            .download-requirement {
                align-items: flex-start;
                flex-direction: column;
                gap: 8px;
            }

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

            .data-result-count {
                align-self: start;
            }

            .pagination {
                justify-content: flex-start;
            }

            .arena-gallery {
                grid-template-columns: 1fr;
            }

            .image-lightbox {
                padding: 12px;
            }

            .lightbox-dialog {
                max-height: calc(100vh - 24px);
            }

            .lightbox-image {
                max-height: calc(100vh - 112px);
            }

            .lightbox-nav {
                width: 38px;
                min-height: 38px;
                font-size: 20px;
            }

            .lightbox-prev {
                left: 8px;
            }

            .lightbox-next {
                right: 8px;
            }
        }

        @media (max-width: 420px) {
            .brand-logo {
                width: min(190px, 42vw);
            }

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

            .operator-stats,
            .hero-stats {
                grid-template-columns: 1fr;
            }

            .hero-stats.hero-dashboard-stats {
                grid-template-columns: 150px;
                max-width: 150px;
            }

            .profile-stats .stat-tile-last-seen {
                grid-column: auto;
            }

            .match-stats .stat-tile-match-time {
                grid-column: auto;
            }

            .stat-tile-last-seen strong,
            .stat-tile-match-time strong {
                white-space: normal;
            }

            .stat-tile {
                min-height: 78px;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            html {
                scroll-behavior: auto;
            }

            .gameplay-fallback::after {
                animation: none;
            }

            .eyebrow-caret {
                animation: none;
            }
        }
