<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>NEXUS | System Overview</title>
    <link rel="shortcut icon" href="{{ asset('images/logo-sm.png') }}">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=IBM+Plex+Mono:wght@300;400;500&family=DM+Sans:wght@300;400;500&display=swap" rel="stylesheet">

    <style>
        *,
        *::before,
        *::after {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        :root {
            --black: #0a0a0a;
            --surface: #141414;
            --line: #222222;
            --line2: #2e2e2e;
            --orange: #e8842a;
            --orange-dim: rgba(232, 132, 42, 0.08);
            --white: #f5f5f5;
            --grey: #999999;
            --grey-dim: #7a7a7a;
            --green: #00aa00;
            --green-dim: rgba(0, 170, 0, 0.10);
            --yellow: #ccaa00;
            --yellow-dim: rgba(204, 170, 0, 0.10);
            --red: #cc0000;
            --red-dim: rgba(204, 0, 0, 0.10);

            --font-display: 'Bebas Neue', sans-serif;
            --font-body: 'DM Sans', sans-serif;
            --font-mono: 'IBM Plex Mono', monospace;
        }

        html,
        body {
            min-height: 100%;
            background: var(--black);
            color: var(--white);
            font-family: var(--font-body);
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        body {
            display: flex;
            flex-direction: column;
        }

        /* ─── TOP SYSTEM BAR ─── */
        .sys-bar {
            width: 100%;
            height: 32px;
            background: var(--black);
            border-bottom: 1px solid var(--line);
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 28px;
            flex-shrink: 0;
            position: sticky;
            top: 0;
            z-index: 100;
        }

        .sys-bar-left {
            display: flex;
            align-items: center;
            gap: 16px;
        }

        a.sys-bar-mark {
            width: 18px;
            height: 18px;
            border: 1px solid var(--orange);
            border-radius: 3px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            text-decoration: none;
            transition: background 0.15s, box-shadow 0.15s;
        }

        a.sys-bar-mark:hover {
            background: rgba(232, 132, 42, 0.15);
            box-shadow: 0 0 8px rgba(232, 132, 42, 0.25);
        }

        a.sys-bar-mark span {
            font-family: var(--font-display);
            font-size: 11px;
            color: var(--orange);
            line-height: 1;
        }

        .sys-bar-item {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1.5px;
            text-transform: uppercase;
            color: var(--grey-dim);
        }

        .sys-bar-item.live {
            color: var(--orange);
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .sys-bar-item.live::before {
            content: '';
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: var(--green);
            animation: blink 2s ease infinite;
        }

        .sys-bar-right {
            display: flex;
            align-items: center;
            gap: 20px;
        }

        .sys-bar-right span {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1.5px;
            color: var(--grey-dim);
        }

        .btn-disconnect {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 2px;
            text-transform: uppercase;
            color: var(--grey);
            background: none;
            border: 1px solid var(--grey-dim);
            border-radius: 4px;
            padding: 3px 10px;
            cursor: pointer;
            transition: border-color 0.15s, color 0.15s;
        }

        .btn-disconnect:hover {
            border-color: var(--red);
            color: var(--red);
        }

        /* ─── MAIN CONTENT ─── */
        .main {
            flex: 1;
            max-width: 1100px;
            width: 100%;
            margin: 0 auto;
            padding: 0 28px 40px;
        }

        /* ─── PAGE HEADER ROW ─── */
        .page-header {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            padding: 28px 0 0;
            margin-bottom: 0;
            border-bottom: 1px solid var(--line);
            padding-bottom: 20px;
        }

        .page-header-left h1 {
            font-family: var(--font-display);
            font-size: 32px;
            letter-spacing: 5px;
            line-height: 1;
            color: var(--white);
        }

        .page-header-left h1 em {
            font-style: normal;
            color: var(--orange);
        }

        .page-header-left p {
            font-family: var(--font-body);
            font-size: 11px;
            letter-spacing: 0.5px;
            color: var(--grey-dim);
            margin-top: 6px;
            font-weight: 300;
        }

        .page-header-right {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 6px;
        }

        .phase-label {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 2px;
            text-transform: uppercase;
            color: var(--grey-dim);
        }

        .phase-value {
            display: flex;
            align-items: center;
            gap: 8px;
            border: 1px solid var(--yellow);
            border-radius: 4px;
            padding: 5px 14px;
            background: var(--yellow-dim);
        }

        .phase-dot {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--yellow);
            animation: blink 1.8s ease infinite;
        }

        .phase-text {
            font-family: var(--font-mono);
            font-size: 10px;
            letter-spacing: 2px;
            text-transform: uppercase;
            color: var(--yellow);
        }

        /* ─── SYSTEM READOUT ─── */
        /* Three column stat strip -- top level system numbers */
        .stat-strip {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            border-bottom: 1px solid var(--line);
        }

        .stat-cell {
            padding: 16px 20px;
            border-right: 1px solid var(--line);
        }

        .stat-cell:last-child {
            border-right: none;
        }

        .stat-cell-label {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1.5px;
            text-transform: uppercase;
            color: var(--grey-dim);
            margin-bottom: 6px;
        }

        .stat-cell-value {
            font-family: var(--font-mono);
            font-size: 20px;
            letter-spacing: 1px;
            color: var(--white);
            line-height: 1;
        }

        .stat-cell-value.orange {
            color: var(--orange);
        }

        .stat-cell-value.green {
            color: var(--green);
            font-size: 13px;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .stat-cell-value.green::before {
            content: '';
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--green);
            animation: blink 2s ease infinite;
        }

        /* ─── BUILD PROGRESS ROW ─── */
        .build-row {
            display: flex;
            align-items: center;
            border-bottom: 1px solid var(--line);
            padding: 14px 20px;
            gap: 24px;
        }

        .build-row-label {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 2px;
            text-transform: uppercase;
            color: var(--grey-dim);
            white-space: nowrap;
            width: 120px;
            flex-shrink: 0;
        }

        .build-track {
            flex: 1;
            height: 2px;
            background: var(--line2);
            position: relative;
        }

        .build-fill {
            height: 100%;
            width: 0;
            background: var(--orange);
            transition: width 1.6s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
        }

        .build-fill::after {
            content: '';
            position: absolute;
            right: -1px;
            top: 50%;
            transform: translateY(-50%);
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--orange);
            box-shadow: 0 0 8px var(--orange);
        }

        .build-pct {
            font-family: var(--font-display);
            font-size: 28px;
            letter-spacing: 2px;
            color: var(--orange);
            line-height: 1;
            width: 60px;
            text-align: right;
            flex-shrink: 0;
        }

        .build-meta {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1.5px;
            color: var(--grey-dim);
            white-space: nowrap;
            flex-shrink: 0;
        }

        /* ─── STATUS NOTE ROW ─── */
        .status-note {
            display: flex;
            align-items: flex-start;
            gap: 0;
            border-bottom: 1px solid var(--line);
        }

        .status-note-tag {
            width: 120px;
            flex-shrink: 0;
            padding: 14px 20px;
            border-right: 1px solid var(--line);
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 2px;
            text-transform: uppercase;
            color: var(--orange);
        }

        .status-note-text {
            padding: 14px 20px;
            font-family: var(--font-body);
            font-size: 13px;
            color: var(--grey);
            line-height: 1.7;
            font-weight: 300;
        }

        /* ─── SECTION HEADER ─── */
        .section-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 10px 20px;
            background: var(--surface);
            border-bottom: 1px solid var(--line);
            border-top: 1px solid var(--line);
            margin-top: 24px;
        }

        .section-header-label {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 2.5px;
            text-transform: uppercase;
            color: var(--grey-dim);
        }

        .section-header-right {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1.5px;
            color: var(--grey-dim);
        }

        /* ─── MODULE TABLE ─── */
        /* Each module is a dense table row, not a card */
        .module-table {
            width: 100%;
            border-collapse: collapse;
        }

        .module-row {
            display: grid;
            grid-template-columns: 48px 1fr 180px 100px;
            border-bottom: 1px solid var(--line);
            transition: background 0.1s;
        }

        .module-row:hover {
            background: var(--surface);
        }

        .module-row.active-row {
            background: var(--orange-dim);
            border-left: 2px solid var(--orange);
        }

        .module-col {
            padding: 12px 16px;
            display: flex;
            align-items: center;
            border-right: 1px solid var(--line);
        }

        .module-col:last-child {
            border-right: none;
        }

        .col-num {
            font-family: var(--font-display);
            font-size: 18px;
            letter-spacing: 1px;
            color: var(--grey-dim);
            justify-content: center;
        }

        .col-info {
            flex-direction: column;
            align-items: flex-start;
            justify-content: center;
        }

        .col-name {
            font-family: var(--font-mono);
            font-size: 11px;
            letter-spacing: 1.5px;
            text-transform: uppercase;
            color: var(--white);
            margin-bottom: 3px;
        }

        .col-desc {
            font-family: var(--font-body);
            font-size: 11px;
            color: var(--grey);
            letter-spacing: 0.2px;
            font-weight: 300;
        }

        .col-components {
            flex-direction: column;
            align-items: flex-start;
            gap: 2px;
        }

        .component-tag {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 0.5px;
            color: var(--grey-dim);
            line-height: 1.5;
        }

        .col-status {
            justify-content: center;
        }

        .chip {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1.5px;
            text-transform: uppercase;
            padding: 4px 10px;
            border: 1px solid;
            border-radius: 3px;
        }

        .chip-deployed {
            color: var(--green);
            border-color: rgba(0, 170, 0, 0.4);
            background: var(--green-dim);
        }

        .chip-active {
            color: var(--orange);
            border-color: rgba(232, 132, 42, 0.4);
            background: var(--orange-dim);
        }

        .chip-pending {
            color: var(--grey-dim);
            border-color: var(--line2);
            background: transparent;
        }

        .chip-parked {
            color: var(--grey-dim);
            border-style: dashed;
            border-color: var(--line2);
            background: transparent;
        }

        .chip-preview {
            color: var(--orange);
            border-color: rgba(232, 132, 42, 0.4);
            background: var(--orange-dim);
        }

        .chip-completed {
            color: var(--green);
            border-color: rgba(0, 170, 0, 0.4);
            background: var(--green-dim);
        }

        .btn-preview {
            display: inline-block;
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 2px;
            text-transform: uppercase;
            text-decoration: none;
            color: var(--orange);
            border: 1px solid rgba(232, 132, 42, 0.4);
            border-radius: 4px;
            padding: 6px 14px;
            transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
        }

        .btn-preview:hover {
            background: rgba(232, 132, 42, 0.12);
            border-color: var(--orange);
            box-shadow: 0 0 12px rgba(232, 132, 42, 0.15);
            text-decoration: none;
        }

        /* ─── PROJECT PIPELINE ─── */
        .pipeline-card {
            border-bottom: 1px solid var(--line);
            padding: 16px 20px;
            display: grid;
            grid-template-columns: 1fr auto;
            gap: 12px;
            align-items: start;
            transition: background 0.15s;
        }

        .pipeline-card:hover {
            background: var(--orange-dim);
        }

        .pipeline-card-info {
            display: flex;
            flex-direction: column;
            gap: 6px;
        }

        .pipeline-card-title {
            font-family: var(--font-display);
            font-size: 18px;
            letter-spacing: 3px;
            color: var(--white);
            line-height: 1;
        }

        .pipeline-card-title em {
            font-style: normal;
            color: var(--orange);
        }

        .pipeline-card-desc {
            font-family: var(--font-body);
            font-size: 11px;
            font-weight: 300;
            color: var(--grey);
            line-height: 1.5;
        }

        .pipeline-card-meta {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1px;
            color: var(--grey-dim);
            display: flex;
            gap: 12px;
            flex-wrap: wrap;
        }

        .pipeline-card-right {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 8px;
            min-width: 120px;
        }

        .pipeline-progress {
            display: flex;
            align-items: center;
            gap: 10px;
            width: 100%;
        }

        .pipeline-progress-track {
            flex: 1;
            height: 2px;
            background: var(--line2);
            border-radius: 1px;
        }

        .pipeline-progress-fill {
            height: 2px;
            background: var(--orange);
            border-radius: 1px;
            transition: width 1s ease;
        }

        .pipeline-progress-pct {
            font-family: var(--font-mono);
            font-size: 14px;
            color: var(--orange);
            min-width: 36px;
            text-align: right;
        }

        /* ─── DASHBOARD ACCESS ─── */
        .dashboard-access {
            margin-top: 32px;
            padding: 0 20px 0;
            text-align: center;
        }

        .btn-dashboard {
            display: inline-block;
            font-family: var(--font-display);
            font-size: 18px;
            letter-spacing: 6px;
            text-transform: uppercase;
            text-decoration: none;
            color: var(--black);
            background: var(--orange);
            padding: 16px 48px;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
            box-shadow: 0 2px 16px rgba(232, 132, 42, 0.25);
        }

        .btn-dashboard:hover {
            background: #d4771e;
            transform: translateY(-1px);
            box-shadow: 0 4px 24px rgba(232, 132, 42, 0.35);
            text-decoration: none;
        }

        .btn-dashboard:active {
            background: #bf6b1a;
            transform: translateY(0);
            box-shadow: 0 2px 12px rgba(232, 132, 42, 0.2);
        }

        /* ─── BOTTOM BAR ─── */
        .bottom-bar {
            border-top: 1px solid var(--line);
            padding: 14px 28px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
        }

        .bottom-bar span {
            font-family: var(--font-mono);
            font-size: 9px;
            letter-spacing: 1.5px;
            text-transform: uppercase;
            color: var(--grey-dim);
        }

        .bottom-bar span.orange {
            color: var(--orange);
        }

        /* ─── ANIMATIONS ─── */
        @keyframes blink {

            0%,
            100% {
                opacity: 1;
            }

            50% {
                opacity: 0.2;
            }
        }

        /* ─── RESPONSIVE ─── */
        @media (max-width: 900px) {
            .col-components {
                display: none;
            }

            .module-row {
                grid-template-columns: 40px 1fr 90px;
            }
        }

        @media (max-width: 768px) {
            .sys-bar {
                padding: 0 16px;
            }

            .sys-bar-right span:not(.btn-disconnect) {
                display: none;
            }

            .main {
                padding: 0 16px 32px;
            }

            .stat-strip {
                grid-template-columns: 1fr 1fr;
            }

            .stat-cell {
                padding: 12px 14px;
            }

            .page-header {
                flex-direction: column;
                align-items: flex-start;
                gap: 12px;
                padding-bottom: 16px;
            }

            .build-row {
                padding: 12px 16px;
                gap: 12px;
            }

            .build-pct {
                font-size: 22px;
            }

            .status-note {
                flex-direction: column;
            }

            .status-note-tag {
                width: 100%;
                border-right: none;
                border-bottom: 1px solid var(--line);
                padding: 10px 16px;
            }

            .status-note-text {
                padding: 12px 16px;
            }

            .section-header {
                padding: 8px 16px;
                flex-direction: column;
                align-items: flex-start;
                gap: 4px;
            }

            .bottom-bar {
                padding: 12px 16px;
                flex-direction: column;
                gap: 6px;
                text-align: center;
            }

            .dashboard-access {
                margin-top: 24px;
                padding: 0 16px;
            }

            .pipeline-card {
                grid-template-columns: 1fr;
                padding: 14px 16px;
            }

            .pipeline-card-right {
                flex-direction: row;
                align-items: center;
                min-width: auto;
            }

            .btn-dashboard {
                display: block;
                width: 100%;
                padding: 16px 20px;
                font-size: 16px;
                letter-spacing: 4px;
                border-radius: 8px;
            }
        }

        @media (max-width: 480px) {
            .stat-strip {
                grid-template-columns: 1fr 1fr;
            }

            .stat-cell-value {
                font-size: 16px;
            }

            .build-meta {
                display: none;
            }

            .btn-dashboard {
                font-size: 14px;
                letter-spacing: 3px;
                padding: 12px 16px;
            }

            .module-row {
                grid-template-columns: 32px 1fr 80px;
            }

            .col-num {
                font-size: 14px;
                padding: 10px 8px;
            }

            .module-col {
                padding: 10px 10px;
            }

            .col-name {
                font-size: 10px;
            }

            .col-desc {
                font-size: 9px;
            }

            .chip {
                font-size: 8px;
                padding: 3px 7px;
            }

            .page-header-left h1 {
                font-size: 22px;
                letter-spacing: 3px;
            }

            .sys-bar {
                padding: 0 12px;
            }
        }
    </style>
</head>

<body>

    {{-- TOP SYSTEM BAR --}}
    <div class="sys-bar">
        <div class="sys-bar-left">
            <a href="/nexus/dashboard" class="sys-bar-mark" title="Enter Dashboard"><span>N</span></a>
            <span class="sys-bar-item live">GE-AS NEXUS</span>
            <span class="sys-bar-item">SYSTEM OVERVIEW</span>
        </div>
        <div class="sys-bar-right">
            <span>{{ auth('nexus')->user()->name }}</span>
            <span id="sysTime">--:--:-- UTC</span>
            <form method="POST" action="{{ route('nexus.logout') }}" style="display:inline;">
                @csrf
                <button type="submit" class="btn-disconnect">DISCONNECT</button>
            </form>
        </div>
    </div>

    {{-- MAIN --}}
    <main class="main">

        {{-- PAGE HEADER --}}
        <div class="page-header">
            <div class="page-header-left">
                <h1>SYSTEM <em>OVERVIEW</em></h1>
                <p>nexus.ge-as.com &nbsp;&bull;&nbsp; Neural Exchange & Unified System &nbsp;&bull;&nbsp; {{ now()->format('D d M Y') }}</p>
            </div>
            <div class="page-header-right">
                <span class="phase-label">Current Phase</span>
                <div class="phase-value">
                    <span class="phase-dot"></span>
                    <span class="phase-text">Phase 11 Go-Live</span>
                </div>
            </div>
        </div>

        {{-- STAT STRIP --}}
        <div class="stat-strip">
            <div class="stat-cell">
                <div class="stat-cell-label">System Status</div>
                <div class="stat-cell-value green">Operational</div>
            </div>
            <div class="stat-cell">
                <div class="stat-cell-label">Phase Complete</div>
                <div class="stat-cell-value">10 <span style="font-size:11px; color:var(--grey-dim);">of 11</span></div>
            </div>
            <div class="stat-cell">
                <div class="stat-cell-label">Sessions / Day</div>
                <div class="stat-cell-value">3</div>
            </div>
            <div class="stat-cell">
                <div class="stat-cell-label">Target Go-Live</div>
                <div class="stat-cell-value" style="font-size:13px; letter-spacing:1px;">20 MAR 2026</div>
            </div>
        </div>

        {{-- BUILD PROGRESS ROW --}}
        <div class="build-row">
            <span class="build-row-label">Build Progress</span>
            <div class="build-track">
                <div class="build-fill" id="buildFill"></div>
            </div>
            <div class="build-pct" id="buildPct">0%</div>
            <span class="build-meta">All modules deployed. Awaiting go-live activation March 20</span>
        </div>

        {{-- STATUS NOTE --}}
        <div class="status-note">
            <div class="status-note-tag">Status</div>
            <div class="status-note-text">
                All 11 NEXUS modules are deployed to the live server. Trader experience (Module 07) includes session countdown banner, 3-field sell form with live price calculator, wallet selector integration, and session-gated bid flow. ICTP integration (Module 09) includes sell settlement routing, wallet source tracking, and dashboard analytics with per-user bid breakdown. Integration testing (Phase 10) completed March 11, 2026 with zero code bugs. All 9 engine classes, 5 scheduler commands, 6 dashboard pages, and 27 API routes verified. User-facing pages are deployed behind access gates until go-live activation. Go-live (Phase 11) is scheduled for March 20, 2026.
            </div>
        </div>

        {{-- MODULE DEPLOYMENT REGISTER --}}
        <div class="section-header">
            <span class="section-header-label">Module Deployment Register</span>
            <span class="section-header-right">11 Modules &nbsp;&bull;&nbsp; 11 Deployed &nbsp;&bull;&nbsp; 0 In Build &nbsp;&bull;&nbsp; 0 Pending &nbsp;&bull;&nbsp; 0 Parked</span>
        </div>

        <div class="module-table">

            <div class="module-row">
                <div class="module-col col-num">00</div>
                <div class="module-col col-info">
                    <div class="col-name">Login & Security</div>
                    <div class="col-desc">Controls who can access the NEXUS dashboard</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Admin login</span>
                    <span class="component-tag">Access control</span>
                    <span class="component-tag">Activity logging</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">01</div>
                <div class="module-col col-info">
                    <div class="col-name">Data Storage</div>
                    <div class="col-desc">Where all engine and trading data is stored</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">5 database tables</span>
                    <span class="component-tag">Config storage</span>
                    <span class="component-tag">Audit trail</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">02</div>
                <div class="module-col col-info">
                    <div class="col-name">Data Layer</div>
                    <div class="col-desc">How the engine reads and writes trading information</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Session model</span>
                    <span class="component-tag">Config model</span>
                    <span class="component-tag">Metrics model</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">03</div>
                <div class="module-col col-info">
                    <div class="col-name">Trading Engine</div>
                    <div class="col-desc">The algorithm that evaluates every sell and determines outcomes</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Sell evaluator</span>
                    <span class="component-tag">Session manager</span>
                    <span class="component-tag">Trade settler</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">04</div>
                <div class="module-col col-info">
                    <div class="col-name">Automated Scheduling</div>
                    <div class="col-desc">Engine runs autonomously across 3 daily sessions</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Session monitor</span>
                    <span class="component-tag">Sell processor</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">05</div>
                <div class="module-col col-info">
                    <div class="col-name">Analytics & Reports</div>
                    <div class="col-desc">Real-time data powering the dashboard you are viewing</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Dashboard data</span>
                    <span class="component-tag">API endpoints</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">06</div>
                <div class="module-col col-info">
                    <div class="col-name">Admin Dashboard</div>
                    <div class="col-desc">Command centre with intelligence layer for monitoring, analysis, and control</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">5 page layouts</span>
                    <span class="component-tag">Historical data access</span>
                    <span class="component-tag">Interactive filtering</span>
                    <span class="component-tag">Session drill-down</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">07</div>
                <div class="module-col col-info">
                    <div class="col-name">Trader Experience</div>
                    <div class="col-desc">Session countdown banner, NEXUS 3-field sell form, wallet selector integration, and session-gated bid flow</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Session countdown</span>
                    <span class="component-tag">3-field sell form</span>
                    <span class="component-tag">Wallet selector</span>
                    <span class="component-tag">Session gate</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">08</div>
                <div class="module-col col-info">
                    <div class="col-name">AI Bot Governance</div>
                    <div class="col-desc">Profit governance, capital-weighted success rates, and full bot oversight dashboard</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Profit governor</span>
                    <span class="component-tag">Capital weighting</span>
                    <span class="component-tag">Settlement pipeline</span>
                    <span class="component-tag">Bot dashboard</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">09</div>
                <div class="module-col col-info">
                    <div class="col-name">ICTP Integration</div>
                    <div class="col-desc">Wallet source tracking, ICTP sell settlement routing, and dashboard analytics for house capital trading</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">Sell routing</span>
                    <span class="component-tag">Wallet tracking</span>
                    <span class="component-tag">Dashboard analytics</span>
                    <span class="component-tag">CSV export</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

            <div class="module-row">
                <div class="module-col col-num">10</div>
                <div class="module-col col-info">
                    <div class="col-name">Integration Testing</div>
                    <div class="col-desc">Full system verification against live server. Zero code bugs. 3 config issues caught and fixed.</div>
                </div>
                <div class="module-col col-components">
                    <span class="component-tag">9 test sections</span>
                    <span class="component-tag">Schema verification</span>
                    <span class="component-tag">Pre-flight passed</span>
                </div>
                <div class="module-col col-status">
                    <span class="chip chip-deployed">Deployed</span>
                </div>
            </div>

        </div>

        {{-- PROJECT PIPELINE --}}
        <div class="section-header" style="margin-top: 28px;">
            <span class="section-header-label">Project Pipeline</span>
            <span class="section-header-right">Active &amp; Upcoming Deliverables</span>
        </div>

        <div class="module-table">

            {{-- NEXUS ENGINE --}}
            <div class="pipeline-card">
                <div class="pipeline-card-info">
                    <div class="pipeline-card-title">NEXUS <em>ENGINE</em></div>
                    <div class="pipeline-card-desc">Centralized trading algorithm. 3 daily sessions, 9-step sell evaluation, AI bot governance with capital-weighted success rates, ICTP wallet integration.</div>
                    <div class="pipeline-card-meta">
                        <span>11 Modules</span>
                        <span>11 Deployed</span>
                        <span>27 API Routes</span>
                        <span>6 Dashboard Pages</span>
                        <span>Go-live: 20 Mar 2026</span>
                    </div>
                </div>
                <div class="pipeline-card-right">
                    <span class="chip chip-completed">Pre-Launch</span>
                    <div class="pipeline-progress">
                        <div class="pipeline-progress-track">
                            <div class="pipeline-progress-fill" style="width: 98%;"></div>
                        </div>
                        <span class="pipeline-progress-pct">98%</span>
                    </div>
                </div>
            </div>

            {{-- NEXUS DOCUMENTATION --}}
            <div class="pipeline-card">
                <div class="pipeline-card-info">
                    <div class="pipeline-card-title">NEXUS <em>DOCUMENTATION</em></div>
                    <div class="pipeline-card-desc">VitePress manual at manual.ge-as.com. Trading guide for users, admin operations guide for dashboard operators. Built-in search, dark mode, mobile responsive.</div>
                    <div class="pipeline-card-meta">
                        <span>2 Live Sections</span>
                        <span>Trading Guide (public)</span>
                        <span>Admin Guide (restricted)</span>
                        <span>15 Pages</span>
                    </div>
                    <div style="margin-top: 8px; display: flex; gap: 8px;">
                        <a href="https://manual.ge-as.com" target="_blank" class="btn-preview">TRADING MANUAL</a>
                        <a href="https://manual.ge-as.com/admin/" target="_blank" class="btn-preview">ADMIN MANUAL</a>
                    </div>
                </div>
                <div class="pipeline-card-right">
                    <span class="chip chip-deployed">Deployed</span>
                    <div class="pipeline-progress">
                        <div class="pipeline-progress-track">
                            <div class="pipeline-progress-fill" style="width: 100%;"></div>
                        </div>
                        <span class="pipeline-progress-pct">100%</span>
                    </div>
                </div>
            </div>


            {{-- NEXUS LIVE TERMINAL --}}
            <div class="pipeline-card">
                <div class="pipeline-card-info">
                    <div class="pipeline-card-title">NEXUS <em>LIVE TERMINAL</em></div>
                    <div class="pipeline-card-desc">Dual terminal system. Admin command terminal with hero chart, trade feed, system gauges, bot governance, session schedule, audit events. User-facing live terminal with anonymized feed, AI plan showcase, profit sparklines, session countdown. Both run simulation on load, overlay real data via 5s polling, auto-transition to live mode on engine activation.</div>
                    <div class="pipeline-card-meta">
                        <span>2 Terminals</span>
                        <span>Admin: 1324 lines JS</span>
                        <span>User: 933 lines JS</span>
                        <span>7 Layers of Life</span>
                        <span>4 Cascade Transitions</span>
                        <span>Go-live: 20 Mar 2026</span>
                    </div>
                    <div style="margin-top: 8px; display: flex; gap: 8px;">
                        <a href="/nexus/terminal" target="_blank" class="btn-preview">ADMIN TERMINAL</a>
                        <a href="/live" target="_blank" class="btn-preview">USER TERMINAL</a>
                    </div>
                </div>
                <div class="pipeline-card-right">
                    <span class="chip chip-completed">Pre-Launch</span>
                    <div class="pipeline-progress">
                        <div class="pipeline-progress-track">
                            <div class="pipeline-progress-fill" style="width: 95%;"></div>
                        </div>
                        <span class="pipeline-progress-pct">95%</span>
                    </div>
                </div>
            </div>

        </div>

        {{-- DASHBOARD ACCESS --}}
        <div class="dashboard-access">
            <a href="/nexus/dashboard" class="btn-dashboard">ENTER DASHBOARD</a>
        </div>

    </main>

    {{-- BOTTOM BAR --}}
    <div class="bottom-bar">
        <span>&copy; {{ date('Y') }} GE-AS.COM -- Internal system. Restricted access.</span>
        <span>NEXUS ENGINE &nbsp;&bull;&nbsp; v<span class="orange">1.0</span> &nbsp;&bull;&nbsp; Target go-live: <span class="orange">20 MAR 2026</span></span>
    </div>

    <script>
        // Live UTC clock
        function updateTime() {
            const now = new Date();
            const h = String(now.getUTCHours()).padStart(2, '0');
            const m = String(now.getUTCMinutes()).padStart(2, '0');
            const s = String(now.getUTCSeconds()).padStart(2, '0');
            document.getElementById('sysTime').textContent = h + ':' + m + ':' + s + ' UTC';
        }
        updateTime();
        setInterval(updateTime, 1000);

        // Animate build progress
        const TARGET = 98;
        window.addEventListener('load', function() {
            setTimeout(function() {
                document.getElementById('buildFill').style.width = TARGET + '%';
            }, 300);

            let count = 0;
            const el = document.getElementById('buildPct');
            const interval = setInterval(function() {
                count++;
                el.textContent = count + '%';
                if (count >= TARGET) clearInterval(interval);
            }, 80);
        });
    </script>

</body>

</html>