* { margin: 0; padding: 0; box-sizing: border-box; }
        html {
            overflow-x: hidden;
            max-width: 100vw;
        }
        body {
            font-family: 'Roboto Mono', -apple-system, BlinkMacSystemFont, monospace;
            background: #0d1117;
            color: #c9d1d9;
            min-height: 100vh;
            font-size: 12px;
            -webkit-tap-highlight-color: transparent;
            overflow-x: hidden;
            max-width: 100vw;
            width: 100%;
        }

        /* === BITMEX-STYLE HEADER === */
        .trading-header {
            display: flex;
            align-items: center;
            padding: 8px 16px;
            background: #161b22;
            border-bottom: 1px solid #30363d;
            gap: 16px;
            flex-wrap: wrap;
            max-width: 100vw;
            overflow-x: hidden;
        }
        .instrument-dropdown {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 4px 8px;
        }
        .instrument-name {
            font-size: 15px;
            font-weight: 700;
            color: #fff;
        }
        .instrument-type {
            font-size: 12px;
            color: #8b949e;
            margin-left: 4px;
        }
        .instrument-badges {
            display: flex;
            gap: 4px;
            margin-left: 8px;
        }
        .instrument-badge {
            font-size: 10px;
            padding: 2px 6px;
            border-radius: 4px;
            font-weight: 600;
            background: rgba(63,185,80,0.2);
            color: #3fb950;
        }
        .badge-sm {
            font-size: 9px;
            padding: 2px 5px;
            border-radius: 2px;
            font-weight: 600;
        }
        .badge-btc { background: #f7931a; color: #000; }
        .badge-leverage { background: #3fb950; color: #000; }
        .price-section {
            display: flex;
            flex-direction: column;
            margin-left: 16px;
        }
        .price-main {
            font-size: 22px;
            font-weight: 700;
            color: #3fb950;
            display: flex;
            align-items: center;
            gap: 4px;
            min-width: 140px; /* Fixed width prevents jumping on price changes */
        }
        .price-main.down { color: #f85149; }
        .price-arrow { font-size: 14px; }
        .price-change {
            font-size: 12px;
            color: #f85149;
        }
        .price-change.positive { color: #3fb950; }
        .header-stats {
            display: flex;
            gap: 20px;
            margin-left: auto;
            font-size: 11px;
        }
        .header-stat {
            display: flex;
            flex-direction: column;
            gap: 1px;
        }
        .header-stat-label {
            color: #8b949e;
            font-size: 10px;
        }
        .header-stat-value {
            color: #c9d1d9;
            font-weight: 500;
        }
        .header-stat-value.positive { color: #3fb950; }
        .header-stat-value.negative { color: #f85149; }

        /* === MAIN TRADING LAYOUT === */
        .trading-main {
            display: grid;
            grid-template-columns: 1fr 340px;
            height: 55vh; /* Fixed height so bots section is visible below */
            min-height: 400px;
            max-height: 550px;
            gap: 1px;
            background: #30363d;
        }
        /* Mobile: Reorder - orderbook+trades side-by-side on top, chart below */
        @media (max-width: 768px) {
            .trading-main {
                grid-template-columns: 1fr;
                height: auto;
                min-height: unset;
                max-height: none;
            }
            .right-panel {
                order: -1;
                display: grid;
                grid-template-columns: 1fr 1fr;
                overflow: visible;
            }
            .panel-section.orderbook-section {
                order: 1;
                min-height: 0;
                max-height: 250px;
                overflow-y: auto;
                border-bottom: none;
            }
            .panel-section.trades-section {
                order: 2;
                min-height: 0;
                max-height: 250px;
                overflow-y: auto;
                border-left: 1px solid #30363d;
            }
            .panel-section.price-to-beat-section {
                order: 3;
                grid-column: 1 / -1;
            }
            .chart-section {
                min-height: 300px;
                height: 350px;
            }
        }
        .chart-section {
            background: #0d1117;
            display: flex;
            flex-direction: column;
            min-height: 0;
            overflow: hidden;
            position: relative;
        }
        /* Mobile chart-section height handled in the trading-main mobile block above */
        .chart-toolbar {
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 4px 8px; /* Tighter padding */
            background: #161b22;
            border-bottom: 1px solid #30363d;
        }
        .period-dropdown {
            position: relative;
        }
        .period-btn {
            background: #21262d;
            border: 1px solid #30363d;
            color: #c9d1d9;
            padding: 6px 12px;
            border-radius: 4px;
            cursor: pointer;
            font-size: 12px;
            display: flex;
            align-items: center;
            gap: 6px;
        }
        .period-btn:hover { background: #30363d; }
        .period-menu {
            position: absolute;
            top: 100%;
            left: 0;
            background: #161b22;
            border: 1px solid #30363d;
            border-radius: 4px;
            z-index: 1000;
            display: none;
            min-width: 100px;
        }
        .period-menu.show { display: block; }
        .period-option {
            padding: 8px 12px;
            cursor: pointer;
            font-size: 12px;
        }
        .period-option:hover { background: #21262d; }
        .period-option.active { color: #00d4ff; }

        /* === OHLC DISPLAY === */
        .ohlc-display {
            flex-shrink: 0;
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 2px 8px; /* Tighter */
            background: #0d1117;
            font-size: 11px;
            font-family: 'JetBrains Mono', monospace;
        }
        .ohlc-item {
            display: flex;
            align-items: center;
            gap: 2px;
        }
        .ohlc-label {
            color: #8b949e;
        }
        .ohlc-value {
            color: #c9d1d9;
        }
        .ohlc-value.up { color: #3fb950; }
        .ohlc-value.down { color: #f85149; }

        /* === BOTTOM PERIOD SELECTOR === */
        .chart-period-bar {
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 3px;
            padding: 3px 8px; /* Tighter */
            background: #161b22;
            border-top: 1px solid #30363d;
            position: relative;
            z-index: 50;
        }
        .chart-period-btn {
            padding: 2px 8px; /* Tighter */
            background: transparent;
            border: 1px solid #30363d;
            border-radius: 3px;
            color: #8b949e;
            font-size: 10px;
            cursor: pointer;
            transition: all 0.15s;
        }
        .chart-period-btn:hover {
            background: #21262d;
            color: #c9d1d9;
        }
        .chart-period-btn.active {
            background: #238636;
            border-color: #238636;
            color: #ffffff;
        }

        .chart-container-pro {
            flex: 1 1 auto;
            min-height: 0;
            position: relative;
        }
        #live-price-chart-container {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            width: 100%;
            height: 100%;
        }

        /* === RIGHT PANEL (ORDERBOOK + TRADES) === */
        .right-panel {
            background: #0d1117;
            display: flex;
            flex-direction: column;
            overflow: hidden;
        }
        /* PRICE TO BEAT section - Polymarket A markets only */
        .panel-section.price-to-beat-section {
            flex: 0 0 auto; /* Fixed size */
            display: flex;
            flex-direction: column;
            border-bottom: 1px solid #30363d;
            background: linear-gradient(135deg, #1a1f28 0%, #0d1117 100%);
        }
        .price-to-beat-section .panel-header {
            background: #1f2937;
            border-bottom: 1px solid #374151;
        }
        /* ORDERBOOK section - fixed height with scrollable content */
        .panel-section.orderbook-section {
            flex: 0 0 auto; /* Fixed size, doesn't shrink */
            display: flex;
            flex-direction: column;
            min-height: 280px; /* Enough for ~15 rows each side */
            max-height: 350px;
            border-bottom: 1px solid #30363d;
            overflow: hidden;
        }
        /* TRADES section - fills remaining space, has scrollbar */
        .panel-section.trades-section {
            flex: 1 1 auto; /* Fills remaining space */
            display: flex;
            flex-direction: column;
            min-height: 0;
            overflow: hidden;
        }
        /* Mobile overrides for right-panel sections (must come after base rules) */
        @media (max-width: 768px) {
            .right-panel {
                display: grid;
                grid-template-columns: 1fr 1fr;
                overflow: visible;
            }
            .panel-section.orderbook-section {
                min-height: 0;
                max-height: 250px;
                overflow-y: auto;
                border-bottom: none;
            }
            .panel-section.trades-section {
                min-height: 0;
                max-height: 250px;
                overflow-y: auto;
            }
        }
        .panel-header {
            flex-shrink: 0;
            padding: 4px 8px; /* Tighter padding */
            background: #161b22;
            font-size: 10px;
            font-weight: 600;
            color: #8b949e;
            text-transform: uppercase;
            border-bottom: 1px solid #30363d;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        /* Orderbook content - scrollable to show all rows */
        .orderbook-section .panel-content {
            flex: 1 1 auto;
            overflow-y: auto; /* Allow scroll if needed */
            overflow-x: hidden;
            padding: 2px;
            min-height: 0;
        }
        /* Trades content - overflow auto, HAS scrollbar */
        .trades-section .panel-content {
            flex: 1 1 auto;
            overflow-y: auto; /* HAS scrollbar */
            overflow-x: hidden;
            padding: 2px;
            min-height: 0;
        }

        /* === ORDERBOOK STYLES === */
        .orderbook-row {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            padding: 1px 4px; /* Tighter */
            font-size: 10px;
            position: relative;
        }
        .orderbook-row.header {
            color: #8b949e;
            font-weight: 500;
            padding: 2px 4px; /* Tighter */
            border-bottom: 1px solid #30363d;
        }
        .orderbook-row.bid .ob-price { color: #3fb950; }
        .orderbook-row.ask .ob-price { color: #f85149; }
        .ob-price { text-align: left; }
        .ob-size { text-align: right; }
        .ob-total { text-align: right; color: #8b949e; }
        .orderbook-row .depth-bar {
            position: absolute;
            top: 0;
            bottom: 0;
            right: 0;
            opacity: 0.15;
        }
        .orderbook-row.bid .depth-bar { background: #3fb950; }
        .orderbook-row.ask .depth-bar { background: #f85149; }
        .spread-row {
            text-align: center;
            padding: 3px; /* Tighter */
            background: #161b22;
            font-size: 10px;
            color: #8b949e;
        }

        /* === RECENT TRADES STYLES === */
        .trade-row {
            display: grid;
            grid-template-columns: 55px 40px 1fr 60px;
            padding: 1px 4px; /* Tighter */
            font-size: 10px;
        }
        .trade-row.header {
            color: #8b949e;
            font-weight: 500;
            padding: 2px 4px; /* Tighter */
            border-bottom: 1px solid #30363d;
        }
        .trade-row.buy .trade-side { color: #3fb950; }
        .trade-row.sell .trade-side { color: #f85149; }
        .trade-time { color: #8b949e; }
        .trade-price { text-align: right; }
        .trade-size { text-align: right; }

        /* === BOTTOM TAB BAR === */
        .tab-bar {
            display: flex;
            background: #161b22;
            border-top: 1px solid #30363d;
            border-bottom: 1px solid #30363d;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            position: relative;
            z-index: 100; /* Ensure tab bar is above chart canvas */
            margin: 0;
            padding: 0;
        }
        .tab-bar::-webkit-scrollbar { height: 0; }
        .tab-item {
            padding: 10px 16px;
            color: #8b949e;
            font-size: 12px;
            font-weight: 500;
            cursor: pointer;
            white-space: nowrap;
            border-bottom: 2px solid transparent;
            transition: all 0.2s;
        }
        .tab-item:hover { color: #c9d1d9; background: rgba(255,255,255,0.05); }
        .tab-item.active { color: #00d4ff; border-bottom-color: #00d4ff; }
        .tab-content { display: none; background: #0d1117; min-height: 200px; margin: 0; padding: 0; }
        .tab-content.active { display: block; }

        /* Error Toast for API failures */
        .error-toast {
            position: fixed;
            top: 20px;
            right: 20px;
            background: rgba(255,82,82,0.95);
            border: 1px solid #ff5252;
            border-radius: 8px;
            padding: 16px 20px;
            color: #fff;
            font-size: 0.95rem;
            max-width: 400px;
            z-index: 10000;
            box-shadow: 0 4px 20px rgba(255,82,82,0.4);
            display: none;
            animation: slideIn 0.3s ease-out;
        }
        .error-toast.show { display: block; }
        .error-toast-title {
            font-weight: 600;
            margin-bottom: 6px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .error-toast-message { opacity: 0.9; font-size: 0.9rem; }
        .error-toast-close {
            position: absolute;
            top: 8px;
            right: 10px;
            background: none;
            border: none;
            color: #fff;
            cursor: pointer;
            font-size: 1.2rem;
            opacity: 0.7;
        }
        .error-toast-close:hover { opacity: 1; }
        @keyframes slideIn {
            from { transform: translateX(100%); opacity: 0; }
            to { transform: translateX(0); opacity: 1; }
        }
        /* JS Error Panel - persistent error log */
        .js-error-panel {
            position: fixed;
            bottom: 20px;
            left: 20px;
            background: rgba(30, 30, 40, 0.98);
            border: 2px solid #ff5252;
            border-radius: 8px;
            padding: 0;
            max-width: 600px;
            max-height: 300px;
            z-index: 10001;
            box-shadow: 0 4px 20px rgba(0,0,0,0.5);
            font-family: monospace;
            font-size: 12px;
        }
        .js-error-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 8px 12px;
            background: #ff5252;
            color: #fff;
            font-weight: bold;
        }
        .js-error-header button {
            background: none;
            border: none;
            color: #fff;
            font-size: 18px;
            cursor: pointer;
        }
        .js-error-list {
            max-height: 250px;
            overflow-y: auto;
            padding: 8px;
        }
        .js-error-entry {
            padding: 4px 0;
            border-bottom: 1px solid #333;
            color: #ff8a80;
        }
        .js-error-entry .error-time { color: #888; margin-right: 8px; }
        .js-error-entry .error-type { color: #ffab40; margin-right: 8px; font-weight: bold; }
        .js-error-entry .error-msg { color: #ff8a80; }
        .js-error-entry .error-loc { color: #666; margin-left: 8px; font-size: 10px; }

        /* === SESSION MANAGEMENT UI === */

        /* Sub-tabs within Your Bots */
        .session-sub-tabs {
            display: flex;
            gap: 0;
            background: #161b22;
            border-bottom: 1px solid #30363d;
            padding: 0 16px;
        }
        .session-sub-tab {
            padding: 12px 20px;
            color: #8b949e;
            font-size: 13px;
            font-weight: 500;
            cursor: pointer;
            border-bottom: 2px solid transparent;
            transition: all 0.2s;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .session-sub-tab:hover {
            color: #c9d1d9;
            background: rgba(255,255,255,0.03);
        }
        .session-sub-tab.active {
            color: #00d4ff;
            border-bottom-color: #00d4ff;
        }
        .session-sub-tab .tab-count-badge {
            background: #30363d;
            color: #8b949e;
            padding: 2px 8px;
            border-radius: 10px;
            font-size: 11px;
            font-weight: 600;
            min-width: 28px; /* Fixed width prevents jumping when count changes */
            text-align: center;
        }
        .session-sub-tab.active .tab-count-badge {
            background: rgba(0,212,255,0.2);
            color: #00d4ff;
        }

        /* Session content panels */
        .session-panel {
            display: none;
            padding: 16px;
            flex-direction: column;
            gap: 12px;
            min-height: 300px;
        }
        .session-panel.active {
            display: flex;
        }

        /* Session toolbar */
        .session-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 8px 0;
        }
        .session-filters {
            display: flex;
            gap: 12px;
            align-items: center;
        }
        .session-toolbar-note {
            color: #8b949e;
            font-size: 12px;
        }
        .session-toolbar-actions {
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .session-filter-select {
            background: #21262d;
            border: 1px solid #30363d;
            color: #c9d1d9;
            padding: 6px 12px;
            border-radius: 4px;
            font-size: 12px;
            cursor: pointer;
        }
        .btn-new-session {
            background: #238636;
            color: #fff;
            border: none;
            padding: 8px 16px;
            border-radius: 6px;
            font-size: 13px;
            font-weight: 500;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 6px;
            transition: all 0.2s;
        }
        .btn-new-session:hover {
            background: #2ea043;
        }
        .account-balances-toolbar {
            padding: 16px;
            margin: 0;
        }
        .account-balances-toolbar-actions {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .account-balances-updated {
            color: #8b949e;
            font-size: 12px;
        }

        /* Mobile: Stack session toolbar vertically so button is always reachable */
        @media (max-width: 768px) {
            .session-toolbar {
                flex-wrap: wrap;
                gap: 8px;
            }
            .session-filters {
                width: 100%;
                flex-wrap: wrap;
            }
            .session-toolbar-actions {
                width: 100%;
            }
            .session-filter-select {
                flex: 1;
                min-width: 0;
            }
            .history-first-page-btn {
                width: 100%;
            }
            .btn-new-session {
                width: 100%;
                justify-content: center;
            }
            .strategy-detail-grid,
            .strategy-param-grid,
            .strategy-live-form-grid,
            .strategy-comparison-grid,
            .strategy-control-row {
                grid-template-columns: 1fr;
            }
            .account-balances-toolbar-actions {
                width: 100%;
                flex-wrap: wrap;
            }
        }

        /* Session cards/rows */
        .session-list {
            display: flex;
            flex-direction: column;
            gap: 8px;
            min-height: 100px; /* Prevent collapse when empty/loading */
        }
        .strategy-instance-card {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        .strategy-card-badges {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 6px;
            flex-wrap: wrap;
        }
        .strategy-live-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 24px;
            padding: 3px 8px;
            border-radius: 999px;
            background: rgba(63,185,80,0.18);
            border: 1px solid rgba(63,185,80,0.45);
            color: #3fb950;
            font-size: 11px;
            font-weight: 700;
            letter-spacing: 0;
        }
        .strategy-instance-card.selected {
            border-color: #58a6ff;
            background: #161f2d;
        }
        .meta-strategy-section {
            margin-top: 12px;
        }
        #panel-strategies.strategy-detail-active > .session-toolbar,
        #panel-strategies.strategy-detail-active > #strategy-instances-list,
        #panel-strategies.strategy-detail-active > .meta-strategy-section {
            display: none !important;
        }
        #panel-strategies.strategy-detail-active > .strategy-detail-panel {
            margin-top: 0;
        }
        .meta-strategy-list {
            margin-top: 12px;
        }
        .meta-strategy-card {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        .meta-strategy-input {
            width: 220px;
        }
        .meta-strategy-nav-input {
            width: 120px;
        }
        .meta-member-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
            border: 1px solid #30363d;
            border-radius: 6px;
            padding: 8px;
            background: #0d1117;
        }
        .meta-member-list {
            display: flex;
            flex-direction: column;
            gap: 6px;
        }
        .meta-member-controls {
            display: flex;
            gap: 8px;
            align-items: center;
            flex-wrap: wrap;
        }
        .strategy-detail-panel {
            display: flex;
            flex-direction: column;
            gap: 12px;
            background: #0d1117;
            border: 1px solid #30363d;
            border-radius: 8px;
            padding: 14px;
            margin-top: 8px;
        }
        .strategy-backtest-session-block {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }
        .strategy-backtest-session-host {
            min-height: 240px;
        }
        .strategy-backtest-session-host #inline-session-detail {
            border: 1px solid #30363d;
            border-radius: 8px;
            background: #0d1117;
            min-height: 0;
            padding: 0;
        }
        .strategy-backtest-session-host #inline-session-detail > .session-toolbar {
            padding: 8px 12px;
            border-bottom: 1px solid #30363d;
            background: #161b22;
        }
        .strategy-backtest-session-host #inline-session-detail .btn-back-to-list {
            display: none;
        }
        .strategy-backtest-session-host .inline-detail-content {
            padding: 12px;
        }
        .strategy-detail-header {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
            flex-wrap: wrap;
        }
        .strategy-detail-title {
            color: #f0f6fc;
            font-size: 16px;
            font-weight: 600;
        }
        .strategy-detail-subtitle {
            color: #8b949e;
            font-size: 12px;
            margin-top: 3px;
            word-break: break-word;
        }
        .strategy-detail-actions,
        .strategy-inline-actions {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }
        .strategy-section {
            border: 1px solid #30363d;
            border-radius: 8px;
            padding: 12px;
            background: #161b22;
        }
        .strategy-section-title {
            color: #c9d1d9;
            font-size: 13px;
            font-weight: 600;
            margin-bottom: 10px;
        }
        .strategy-detail-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(120px, 1fr));
            gap: 8px;
        }
        .strategy-param-grid,
        .strategy-live-form-grid,
        .strategy-comparison-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(160px, 1fr));
            gap: 8px;
        }
        .strategy-kv {
            min-width: 0;
            background: #0d1117;
            border: 1px solid #30363d;
            border-radius: 6px;
            padding: 8px;
        }
        .strategy-kv-label {
            color: #8b949e;
            font-size: 10px;
            text-transform: uppercase;
            margin-bottom: 4px;
        }
        .strategy-kv-value {
            color: #c9d1d9;
            font-size: 12px;
            word-break: break-word;
        }
        .strategy-deployment-card,
        .strategy-run-row {
            border: 1px solid #30363d;
            border-radius: 8px;
            padding: 10px;
            background: #0d1117;
            margin-top: 8px;
        }
        .strategy-deployment-header,
        .strategy-run-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            flex-wrap: wrap;
        }
        .strategy-run-session-card.clickable {
            cursor: pointer;
        }
        .strategy-run-session-card.clickable:hover {
            border-color: #58a6ff;
            background: #111923;
        }
        .strategy-deployment-title,
        .strategy-run-title {
            color: #f0f6fc;
            font-size: 13px;
            font-weight: 600;
        }
        .strategy-muted {
            color: #8b949e;
            font-size: 12px;
        }
        .strategy-cash-flow-list {
            display: grid;
            gap: 4px;
            margin-top: 8px;
        }
        .strategy-cash-flow-row {
            display: grid;
            grid-template-columns: minmax(140px, 1fr) minmax(90px, auto) minmax(120px, 2fr);
            gap: 8px;
            align-items: center;
            color: #c9d1d9;
            font-size: 12px;
            background: #10151d;
            border: 1px solid #30363d;
            border-radius: 6px;
            padding: 6px 8px;
        }
        .strategy-control-row {
            display: grid;
            grid-template-columns: repeat(4, minmax(120px, 1fr));
            gap: 8px;
            align-items: end;
            margin-top: 10px;
        }
        .session-card-header,
        .session-card-footer {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }
        .session-title {
            color: #f0f6fc;
            font-size: 14px;
            font-weight: 600;
        }
        .session-subtitle {
            color: #8b949e;
            font-size: 12px;
            margin-top: 2px;
        }
        .session-metrics-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(120px, 1fr));
            gap: 8px;
        }
        @media (max-width: 900px) {
            .session-metrics-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
            .strategy-detail-grid,
            .strategy-param-grid,
            .strategy-live-form-grid,
            .strategy-comparison-grid,
            .strategy-control-row {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
            .strategy-cash-flow-row {
                grid-template-columns: 1fr;
            }
            .meta-strategy-input,
            .meta-strategy-nav-input {
                width: 100%;
            }
            .session-card-header,
            .session-card-footer {
                align-items: flex-start;
                flex-direction: column;
            }
        }
        .account-balance-list {
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding: 0 16px 16px;
            min-height: 120px;
        }
        .account-balance-card {
            background: #161b22;
            border: 1px solid #30363d;
            border-radius: 10px;
            padding: 16px;
            display: flex;
            flex-direction: column;
            gap: 14px;
        }
        .account-balance-card.account-error {
            border-color: #f85149;
            background: rgba(248,81,73,0.06);
        }
        .account-balance-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 12px;
            flex-wrap: wrap;
        }
        .account-balance-title {
            display: flex;
            flex-direction: column;
            gap: 4px;
            min-width: 0;
        }
        .account-balance-name {
            color: #f0f6fc;
            font-size: 16px;
            font-weight: 600;
        }
        .account-balance-addresses {
            color: #8b949e;
            font-size: 12px;
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
        .account-balance-status {
            padding: 4px 10px;
            border-radius: 999px;
            font-size: 11px;
            font-weight: 600;
            text-transform: uppercase;
        }
        .account-balance-status.ok {
            background: rgba(63,185,80,0.18);
            color: #3fb950;
        }
        .account-balance-status.error {
            background: rgba(248,81,73,0.18);
            color: #f85149;
        }
        .account-balance-metrics {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            gap: 12px;
        }
        .account-balance-metric {
            background: #0d1117;
            border: 1px solid #21262d;
            border-radius: 8px;
            padding: 12px;
            display: flex;
            flex-direction: column;
            gap: 6px;
        }
        .account-balance-metric-label {
            color: #8b949e;
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 0.04em;
        }
        .account-balance-metric-value {
            color: #f0f6fc;
            font-size: 20px;
            font-weight: 600;
        }
        .account-balance-meta {
            color: #8b949e;
            font-size: 12px;
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
        .account-balance-error {
            color: #ffb4b4;
            font-size: 12px;
            line-height: 1.4;
        }
        .session-card {
            display: grid;
            grid-template-columns: 1fr auto auto auto auto;
            gap: 12px;
            align-items: center;
            padding: 12px 16px;
            background: #161b22;
            border: 1px solid #30363d;
            border-radius: 8px;
            transition: background 0.2s, border-color 0.2s;
            min-height: 60px; /* Fixed height prevents layout jumps */
            contain: layout style; /* CSS containment for performance */
        }
        .session-card:hover {
            background: #1c2128;
            border-color: #444c56;
        }
        .session-card.stale-warning {
            border-color: #d29922;
            background: rgba(210,153,34,0.08);
        }
        .session-card.stale-danger {
            border-color: #f85149;
            background: rgba(248,81,73,0.08);
        }
        .session-card.stopping {
            opacity: 0.6;
            pointer-events: none;
        }

        /* Session type color coding */
        .session-card.session-type-live {
            border-left: 3px solid #f0883e;
            background: rgba(240, 136, 62, 0.05);
        }
        .session-card.session-type-live:hover {
            background: rgba(240, 136, 62, 0.10);
        }
        .session-card.session-type-backtest {
            border-left: 3px solid #a371f7;
            background: rgba(163, 113, 247, 0.05);
        }
        .session-card.session-type-backtest:hover {
            background: rgba(163, 113, 247, 0.10);
        }
        .session-card.session-type-test {
            border-left: 3px solid #58a6ff;
            background: rgba(88, 166, 255, 0.05);
        }
        .session-card.session-type-test:hover {
            background: rgba(88, 166, 255, 0.10);
        }
        .session-card.session-type-market {
            border-left: 3px solid #3fb950;
            background: rgba(63, 185, 80, 0.05);
        }
        .session-card.session-type-market:hover {
            background: rgba(63, 185, 80, 0.10);
        }

        .session-info {
            display: flex;
            flex-direction: column;
            gap: 4px;
            min-width: 0;
            overflow: hidden;
        }
        .session-name {
            font-size: 14px;
            font-weight: 600;
            color: #c9d1d9;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
            min-width: 0;
            overflow: hidden;
        }
        .session-name-text {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            flex-shrink: 1;
            min-width: 0;
        }
        .session-name-controls {
            display: flex;
            align-items: center;
            gap: 6px;
            flex-shrink: 0;
        }
        .session-title-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid #30363d;
            background: transparent;
            color: #8b949e;
            border-radius: 999px;
            min-height: 26px;
            padding: 0 10px;
            font-size: 11px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.2s;
        }
        .session-title-btn:hover {
            background: #21262d;
            color: #f0f6fc;
        }
        .session-title-btn:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }
        .session-save-btn {
            min-width: 30px;
            padding: 0;
            font-size: 16px;
            color: #d29922;
        }
        .session-save-btn.active {
            background: rgba(210, 153, 34, 0.16);
            border-color: rgba(210, 153, 34, 0.35);
            color: #f2cc60;
        }
        .session-edit-btn {
            color: #58a6ff;
        }
        .session-meta {
            font-size: 11px;
            color: #8b949e;
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
            align-items: center;
        }
        .session-strategy {
            color: #8b949e;
            font-size: 12px;
        }
        .session-params {
            color: #58a6ff;
            font-size: 11px;
            font-weight: 500;
            background: rgba(88, 166, 255, 0.1);
            padding: 2px 6px;
            border-radius: 4px;
            word-break: break-word;
            max-width: 100%;
        }
        .session-backtest-range {
            color: #d2a8ff;
            font-size: 11px;
            font-family: monospace;
            background: rgba(210, 168, 255, 0.1);
            padding: 2px 6px;
            border-radius: 4px;
        }
        .session-polymarket-account {
            color: #7ee787;
            font-size: 11px;
            font-weight: 600;
            background: rgba(126, 231, 135, 0.12);
            padding: 2px 6px;
            border-radius: 4px;
        }
        .session-market {
            font-size: 12px;
            color: #58a6ff;
            flex-shrink: 0;
            white-space: nowrap;
        }
        .live-data-badge {
            font-size: 10px;
            background: rgba(56, 139, 253, 0.15);
            color: #58a6ff;
            padding: 2px 6px;
            border-radius: 4px;
            margin-left: 8px;
            font-weight: 600;
            animation: pulse-live 2s infinite;
        }
        @keyframes pulse-live {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.6; }
        }
        .session-runtime {
            font-size: 12px;
            color: #8b949e;
            font-family: 'JetBrains Mono', monospace;
            white-space: nowrap;
        }

        /* Heartbeat indicator */
        .heartbeat-indicator {
            display: flex;
            align-items: center;
            gap: 6px;
            font-size: 11px;
            color: #8b949e;
        }
        .heartbeat-icon {
            font-size: 12px;
            animation: heartbeat 1.5s ease-in-out infinite;
        }
        .heartbeat-indicator.healthy .heartbeat-icon {
            color: #3fb950;
        }
        .heartbeat-indicator.warning .heartbeat-icon {
            color: #d29922;
            animation: heartbeat-warning 0.8s ease-in-out infinite;
        }
        .heartbeat-indicator.stale .heartbeat-icon {
            color: #f85149;
            animation: heartbeat-danger 0.5s ease-in-out infinite;
        }
        .heartbeat-indicator.dead .heartbeat-icon {
            color: #484f58;
            animation: none;
        }
        /* Service active indicator for scrapers */
        .heartbeat-indicator.service-active .heartbeat-icon {
            color: #3fb950;
            animation: pulse-service 2s ease-in-out infinite;
        }
        .heartbeat-indicator.service-inactive .heartbeat-icon {
            color: #f85149;
            animation: none;
        }
        @keyframes pulse-service {
            0%, 100% { transform: scale(1); opacity: 1; box-shadow: 0 0 0 0 rgba(63, 185, 80, 0.4); }
            50% { transform: scale(1.15); opacity: 0.9; box-shadow: 0 0 8px 2px rgba(63, 185, 80, 0.3); }
        }
        @keyframes heartbeat {
            0%, 100% { transform: scale(1); opacity: 1; }
            50% { transform: scale(1.1); opacity: 0.8; }
        }
        @keyframes heartbeat-warning {
            0%, 100% { transform: scale(1); opacity: 1; }
            50% { transform: scale(1.15); opacity: 0.7; }
        }
        @keyframes heartbeat-danger {
            0%, 100% { transform: scale(1); opacity: 1; }
            50% { transform: scale(1.2); opacity: 0.6; }
        }
        @keyframes pulse {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.5; }
        }

        /* Session status badge */
        .session-status {
            display: flex;
            align-items: center;
            gap: 6px;
            font-size: 12px;
            padding: 4px 10px;
            border-radius: 12px;
            font-weight: 500;
            white-space: nowrap;
        }
        .session-status.running {
            background: rgba(63,185,80,0.15);
            color: #3fb950;
        }
        .session-status.stopped {
            background: rgba(139,148,158,0.15);
            color: #8b949e;
        }
        .session-status.completed {
            background: rgba(88,166,255,0.15);
            color: #58a6ff;
        }
        .session-status.failed {
            background: rgba(248,81,73,0.15);
            color: #f85149;
        }
        .session-status.created {
            background: rgba(210,153,34,0.15);
            color: #d29922;
        }
        .session-status.stopping {
            background: rgba(240,136,62,0.2);
            color: #f0883e;
        }
        .status-dot {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: currentColor;
        }
        .session-status.running .status-dot {
            animation: pulse 1.5s infinite;
        }

        /* Session metrics */
        .session-metrics-group {
            display: flex;
            gap: 16px;
            align-items: center;
        }
        .session-metric {
            display: flex;
            flex-direction: column;
            gap: 2px;
            text-align: right;
            white-space: nowrap;
        }
        .metric-label {
            color: #8b949e;
            font-size: 10px;
        }
        .metric-value {
            color: #c9d1d9;
            font-size: 13px;
            font-weight: 500;
        }
        .metric-value.positive { color: #3fb950; }
        .metric-value.negative { color: #f85149; }

        /* Session actions */
        .session-actions {
            display: flex;
            gap: 8px;
        }
        .btn-session-action {
            padding: 6px 12px;
            border-radius: 4px;
            font-size: 11px;
            font-weight: 500;
            cursor: pointer;
            border: 1px solid;
            transition: all 0.2s;
        }
        .btn-session-action:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }
        .btn-session-stop {
            background: transparent;
            border-color: #f85149;
            color: #f85149;
        }
        .btn-session-stop:hover {
            background: rgba(248,81,73,0.15);
        }
        .btn-session-restart {
            background: transparent;
            border-color: #f0883e;
            color: #f0883e;
        }
        .btn-session-restart:hover {
            background: rgba(240,136,62,0.15);
        }
        .btn-session-backtest {
            background: transparent;
            border-color: #8b5cf6;
            color: #8b5cf6;
        }
        .btn-session-backtest:hover {
            background: rgba(139,92,246,0.15);
        }
        .btn-session-live {
            background: transparent;
            border-color: #3fb950;
            color: #3fb950;
        }
        .btn-session-live:hover {
            background: rgba(63,185,80,0.15);
        }
        .btn-session-clone {
            background: transparent;
            border-color: #58a6ff;
            color: #58a6ff;
        }
        .btn-session-clone:hover {
            background: rgba(88,166,255,0.15);
        }
        .btn-session-delete {
            background: transparent;
            border-color: #484f58;
            color: #8b949e;
        }
        .btn-session-delete:hover {
            background: rgba(248,81,73,0.15);
            border-color: #f85149;
            color: #f85149;
        }

        /* Empty state */
        .session-empty {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 60px 20px;
            color: #8b949e;
            text-align: center;
        }
        .session-empty-icon {
            font-size: 48px;
            margin-bottom: 16px;
            opacity: 0.5;
        }
        .session-empty-text {
            font-size: 14px;
            margin-bottom: 16px;
        }

        /* History pagination */
        .history-pagination {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 16px;
            padding: 16px;
            border-top: 1px solid #30363d;
            background: #161b22;
        }
        .pagination-btn {
            background: #21262d;
            border: 1px solid #30363d;
            color: #c9d1d9;
            padding: 8px 16px;
            border-radius: 6px;
            cursor: pointer;
            font-size: 13px;
            transition: all 0.2s;
        }
        .pagination-btn:hover:not(:disabled) {
            background: #30363d;
        }
        .pagination-btn:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }
        .history-pagination .pagination-info {
            color: #8b949e;
            font-size: 13px;
        }
        .history-first-page-btn {
            padding: 6px 12px;
            font-size: 12px;
        }

        /* Modal styles */
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.7);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 10000;
        }
        .modal-overlay.active {
            display: flex;
        }
        .modal-content {
            background: #161b22;
            border: 1px solid #30363d;
            border-radius: 12px;
            width: 100%;
            max-width: 500px;
            max-height: 90vh;
            overflow-y: auto;
        }
        .modal-content-wide {
            max-width: 860px;
        }
        .modal-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 16px 20px;
            border-bottom: 1px solid #30363d;
        }
        .modal-title {
            font-size: 16px;
            font-weight: 600;
            color: #c9d1d9;
        }
        .modal-close {
            background: none;
            border: none;
            color: #8b949e;
            font-size: 24px;
            cursor: pointer;
            padding: 0;
            line-height: 1;
        }
        .modal-close:hover {
            color: #c9d1d9;
        }
        .modal-body {
            padding: 20px;
        }
        .modal-footer {
            display: flex;
            justify-content: flex-end;
            gap: 12px;
            padding: 16px 20px;
            border-top: 1px solid #30363d;
        }

        /* Form styles */
        .form-group {
            margin-bottom: 16px;
        }
        .form-label {
            display: block;
            font-size: 12px;
            color: #8b949e;
            margin-bottom: 6px;
            text-transform: uppercase;
        }
        .form-input, .form-select {
            width: 100%;
            background: #0d1117;
            border: 1px solid #30363d;
            color: #c9d1d9;
            padding: 10px 12px;
            border-radius: 6px;
            font-size: 14px;
        }
        .form-input:focus, .form-select:focus {
            outline: none;
            border-color: #58a6ff;
        }
        .form-hint {
            font-size: 11px;
            color: #8b949e;
            margin-top: 4px;
        }
        .form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 12px;
        }
        .backtest-subsecond-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 8px;
            margin-top: 8px;
        }
        .form-label-inline {
            margin-bottom: 4px;
            font-size: 10px;
        }
        .checkbox-label {
            display: flex;
            align-items: center;
            min-height: 36px;
            gap: 8px;
            margin-bottom: 0;
            color: #c9d1d9;
        }

        /* Strategy params container */
        .strategy-params {
            background: #0d1117;
            border: 1px solid #30363d;
            border-radius: 6px;
            padding: 12px;
            margin-top: 8px;
        }
        .strategy-params-title {
            font-size: 11px;
            color: #8b949e;
            text-transform: uppercase;
            margin-bottom: 12px;
        }

        /* Button styles for modal */
        .btn-modal {
            padding: 10px 20px;
            border-radius: 6px;
            font-size: 14px;
            font-weight: 500;
            cursor: pointer;
            border: none;
            transition: all 0.2s;
        }
        .btn-modal-cancel {
            background: #21262d;
            color: #c9d1d9;
        }
        .btn-modal-cancel:hover {
            background: #30363d;
        }
        .btn-modal-create {
            background: #238636;
            color: #fff;
        }
        .btn-modal-create:hover {
            background: #2ea043;
        }
        .btn-modal-create:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }


        /* Responsive adjustments for session cards */
        @media (max-width: 1200px) {
            .session-card .heartbeat-indicator {
                display: none;
            }
            .session-metrics-group {
                gap: 10px;
            }
        }
        @media (max-width: 900px) {
            .session-card {
                grid-template-columns: 1fr auto;
                gap: 8px;
            }
            .session-metrics-group {
                grid-column: span 2;
                gap: 12px;
            }
            .session-actions {
                grid-column: span 2;
                justify-content: flex-end;
            }
        }
        @media (max-width: 600px) {
            .session-card {
                grid-template-columns: 1fr;
            }
            .session-metrics-group {
                grid-column: span 1;
                flex-wrap: wrap;
                gap: 8px;
            }
            .session-actions {
                grid-column: span 1;
            }
        }

        /* === INLINE SESSION DETAIL VIEW === */
        .btn-back-to-list {
            background: transparent;
            border: 1px solid #30363d;
            color: #58a6ff;
            padding: 6px 12px;
            border-radius: 6px;
            cursor: pointer;
            font-size: 13px;
        }
        .btn-back-to-list:hover {
            background: #21262d;
        }
        .inline-detail-actions {
            display: flex;
            gap: 8px;
        }
        .inline-detail-content {
            padding: 12px;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
            gap: 12px;
        }
        .inline-detail-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-wrap: wrap;
            gap: 12px;
            margin-bottom: 8px;
        }
        .inline-session-title-row {
            display: flex;
            align-items: center;
            gap: 8px;
            min-width: 0;
        }
        .inline-detail-header h3 {
            margin: 0;
            color: #f0f6fc;
            font-size: 16px;
        }
        .inline-session-save-btn {
            min-width: 34px;
            min-height: 30px;
            font-size: 18px;
        }
        .inline-session-edit-btn {
            min-height: 30px;
            padding: 0 12px;
        }
        .inline-session-status {
            padding: 2px 8px;
            border-radius: 12px;
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
        }
        .inline-session-status.running { background: #238636; color: #fff; }
        .inline-session-status.stopped { background: #6e7681; color: #fff; }
        .inline-session-status.completed { background: #1f6feb; color: #fff; }
        .inline-session-status.failed { background: #da3633; color: #fff; }
        .inline-detail-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 8px 16px;
            color: #8b949e;
            font-size: 12px;
            margin-bottom: 16px;
        }
        @media (max-width: 768px) {
            .inline-detail-actions {
                flex-wrap: wrap;
            }
            .inline-session-title-row {
                width: 100%;
                flex-wrap: wrap;
            }
            .inline-detail-header h3 {
                word-break: break-word;
            }
            #inline-session-params,
            #inline-session-backtest-range {
                flex: 0 0 100%;
                word-break: break-word;
                white-space: normal;
            }
        }
        .inline-metrics-grid {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 8px;
            margin-bottom: 16px;
        }
        @media (max-width: 900px) {
            .inline-metrics-grid {
                grid-template-columns: repeat(3, 1fr);
            }
        }
        @media (max-width: 640px) {
            .inline-metrics-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        .inline-metric {
            background: #21262d;
            padding: 10px;
            border-radius: 6px;
            text-align: center;
        }
        .inline-metric-label {
            display: block;
            color: #8b949e;
            font-size: 10px;
            text-transform: uppercase;
            margin-bottom: 4px;
        }
        .inline-metric-value {
            display: block;
            color: #f0f6fc;
            font-size: 14px;
            font-weight: 600;
        }
        .inline-metric-value.positive { color: #3fb950; }
        .inline-metric-value.negative { color: #f85149; }
        .inline-artifacts-section {
            background: #161b22;
            border-radius: 8px;
            margin-bottom: 16px;
        }
        .inline-artifacts-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 10px 12px;
            border-bottom: 1px solid #30363d;
        }
        .inline-artifacts-header h4 {
            margin: 0;
            color: #8b949e;
            font-size: 11px;
            text-transform: uppercase;
        }
        .inline-artifacts-header span {
            color: #8b949e;
            font-size: 11px;
            font-family: monospace;
        }
        .inline-artifacts-list {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            gap: 0;
        }
        .inline-artifacts-list .inline-empty {
            grid-column: 1 / -1;
            padding: 10px 12px;
        }
        @media (max-width: 900px) {
            .inline-artifacts-list {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }
        .inline-artifact-item {
            padding: 10px 12px;
            border-right: 1px solid #21262d;
            min-width: 0;
        }
        .inline-artifact-item:last-child {
            border-right: none;
        }
        .inline-artifact-name {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            color: #f0f6fc;
            font-size: 12px;
            font-weight: 600;
            margin-bottom: 6px;
        }
        .inline-artifact-status {
            border-radius: 10px;
            font-size: 10px;
            line-height: 1;
            padding: 3px 6px;
            text-transform: uppercase;
            white-space: nowrap;
        }
        .inline-artifact-status.local { background: rgba(63, 185, 80, 0.16); color: #3fb950; }
        .inline-artifact-status.remote { background: rgba(88, 166, 255, 0.16); color: #58a6ff; }
        .inline-artifact-status.missing { background: rgba(248, 81, 73, 0.14); color: #f85149; }
        .inline-artifact-status.optional { background: rgba(139, 148, 158, 0.14); color: #8b949e; }
        .inline-artifact-meta {
            color: #8b949e;
            font-family: monospace;
            font-size: 11px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        /* Three-column layout: Equity chart left, Trades + Canonical History right */
        .inline-equity-trades-row {
            display: grid;
            grid-template-columns: 2fr 1fr 1fr;
            gap: 12px;
            margin-bottom: 16px;
        }
        @media (max-width: 768px) {
            .inline-equity-trades-row {
                grid-template-columns: 1fr;
            }
        }
        .inline-equity-section {
            background: #161b22;
            border-radius: 8px;
            padding: 12px;
            min-height: 200px;
        }
        .inline-equity-section h4 {
            margin: 0 0 8px 0;
            color: #8b949e;
            font-size: 11px;
            text-transform: uppercase;
        }
        .inline-trades-section,
        .inline-canonical-section {
            background: #161b22;
            border-radius: 8px;
            display: flex;
            flex-direction: column;
            max-height: 250px;
        }
        .inline-trades-section h4,
        .inline-canonical-section h4 {
            margin: 0;
            padding: 10px 12px;
            color: #8b949e;
            font-size: 11px;
            text-transform: uppercase;
            border-bottom: 1px solid #30363d;
            flex-shrink: 0;
        }
        .inline-canonical-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 10px 12px;
            border-bottom: 1px solid #30363d;
            flex-shrink: 0;
        }
        .inline-canonical-header h4 {
            padding: 0;
            border-bottom: none;
        }
        .inline-trades-list {
            font-family: monospace;
            font-size: 11px;
            overflow-y: auto;
            flex: 1;
        }
        .inline-canonical-list {
            font-family: monospace;
            font-size: 11px;
            overflow-y: auto;
            flex: 1;
        }
        .inline-trade-row {
            display: grid;
            grid-template-columns: 70px 45px 70px 50px 70px;
            gap: 6px;
            padding: 5px 10px;
            border-bottom: 1px solid #21262d;
        }
        .inline-trade-row:nth-child(even) { background: rgba(255,255,255,0.02); }
        .inline-canonical-row {
            display: grid;
            grid-template-columns: 70px 72px 56px 56px 1fr;
            gap: 6px;
            padding: 5px 10px;
            border-bottom: 1px solid #21262d;
        }
        .inline-canonical-row:nth-child(even) { background: rgba(255,255,255,0.02); }
        .inline-canonical-type {
            color: #8b949e;
            font-weight: 600;
        }
        .inline-canonical-detail {
            color: #c9d1d9;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .inline-canonical-type.buy-up { color: #3fb950; }
        .inline-canonical-type.buy-down { color: #58a6ff; }
        .inline-canonical-type.sell-up { color: #f85149; }
        .inline-canonical-type.sell-down { color: #d2a8ff; }
        .inline-canonical-type.redeem { color: #00bcd4; }
        .inline-canonical-type.split,
        .inline-canonical-type.merge,
        .inline-canonical-type.conversion { color: #d29922; }
        .inline-canonical-type.reward,
        .inline-canonical-type.maker-rebate { color: #3fb950; }
        .inline-trade-row.new-trade {
            animation: flash-new-trade 1s ease-out;
        }
        @keyframes flash-new-trade {
            0% { background: rgba(63, 185, 80, 0.4); }
            100% { background: transparent; }
        }

        /* Logs section - flex to fill remaining space */
        .inline-logs-section {
            background: #161b22;
            border-radius: 8px;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
            min-height: 200px;
        }
        .inline-logs-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 10px 12px;
            border-bottom: 1px solid #30363d;
            flex-shrink: 0;
        }
        .inline-logs-section h4 {
            margin: 0;
            color: #8b949e;
            font-size: 11px;
            text-transform: uppercase;
            border-bottom: none;
            padding: 0;
            flex-shrink: 0;
        }
        .inline-logs-actions {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
            justify-content: flex-end;
        }
        .inline-log-download-btn {
            background: #21262d;
            border: 1px solid #30363d;
            color: #c9d1d9;
            font-size: 11px;
            padding: 4px 8px;
            border-radius: 6px;
            cursor: pointer;
            line-height: 1.2;
        }
        .inline-log-download-btn:hover {
            background: #30363d;
        }
        .inline-log-download-btn:disabled {
            opacity: 0.6;
            cursor: default;
        }
        .inline-logs-list {
            font-family: monospace;
            font-size: 11px;
            padding: 8px 12px;
            flex-grow: 1;
        }
        .strategy-backtest-session-host .inline-logs-section {
            flex-grow: 0;
            min-height: 0;
        }
        .strategy-backtest-session-host .inline-logs-list {
            flex: 0 0 auto;
            max-height: 180px;
            min-height: 96px;
            overflow-y: auto;
        }
        .inline-log-row {
            padding: 4px 0;
            border-bottom: 1px solid #21262d;
            word-break: break-word;
            overflow-wrap: anywhere;
            white-space: normal;
        }
        .inline-log-row:last-child { border-bottom: none; }
        .inline-log-row.error { color: #f85149; }
        .inline-log-row.warn { color: #d29922; }
        .inline-log-row.info { color: #58a6ff; }
        .inline-log-row.trade-leg-buy-up { background: rgba(63, 185, 80, 0.08); }
        .inline-log-row.trade-leg-buy-down { background: rgba(88, 166, 255, 0.08); }
        .inline-log-row.trade-leg-sell-up { background: rgba(248, 81, 73, 0.08); }
        .inline-log-row.trade-leg-sell-down { background: rgba(210, 168, 255, 0.08); }
        .trading-leg-badge {
            border-radius: 4px;
            font-weight: 600;
            margin-right: 4px;
            padding: 1px 5px;
        }
        .trading-leg-badge.trade-leg-buy-up {
            color: #3fb950;
            background: rgba(63, 185, 80, 0.15);
            border: 1px solid rgba(63, 185, 80, 0.35);
        }
        .trading-leg-badge.trade-leg-buy-down {
            color: #58a6ff;
            background: rgba(88, 166, 255, 0.15);
            border: 1px solid rgba(88, 166, 255, 0.35);
        }
        .trading-leg-badge.trade-leg-sell-up {
            color: #f85149;
            background: rgba(248, 81, 73, 0.15);
            border: 1px solid rgba(248, 81, 73, 0.35);
        }
        .trading-leg-badge.trade-leg-sell-down {
            color: #d2a8ff;
            background: rgba(210, 168, 255, 0.15);
            border: 1px solid rgba(210, 168, 255, 0.35);
        }
        .inline-log-row.new-log {
            animation: flash-new-log 1s ease-out;
        }
        @keyframes flash-new-log {
            0% { background: rgba(88, 166, 255, 0.3); }
            100% { background: transparent; }
        }
        .inline-empty {
            color: #6e7681;
            text-align: center;
            padding: 24px;
        }
        /* Skeleton / shimmer loading placeholders */
        @keyframes shimmer {
            0% { background-position: -200% 0; }
            100% { background-position: 200% 0; }
        }
        .skeleton {
            background: linear-gradient(90deg, #21262d 25%, #30363d 50%, #21262d 75%);
            background-size: 200% 100%;
            animation: shimmer 1.5s ease-in-out infinite;
            border-radius: 4px;
        }
        .skeleton-text {
            height: 14px;
            width: 60px;
            display: inline-block;
            vertical-align: middle;
        }
        .skeleton-metric-value {
            height: 18px;
            width: 70%;
            margin: 0 auto;
            display: block;
        }
        .skeleton-chart {
            height: 100%;
            width: 100%;
            min-height: 160px;
            border-radius: 6px;
        }
        .skeleton-trade-row {
            display: grid;
            grid-template-columns: 70px 45px 70px 50px 70px;
            gap: 6px;
            padding: 5px 10px;
            border-bottom: 1px solid #21262d;
        }
        .skeleton-trade-row span {
            height: 12px;
            border-radius: 3px;
        }
        .skeleton-log-row {
            padding: 6px 0;
            border-bottom: 1px solid #21262d;
        }
        .skeleton-log-row span {
            height: 12px;
            border-radius: 3px;
            display: inline-block;
        }
        /* Make session cards clickable */
        .session-card.clickable {
            cursor: pointer;
        }
        .session-card.clickable:hover {
            border-color: #58a6ff;
        }

        /* === FOOTER === */
        .dashboard-footer {
            margin-top: 40px;
            padding: 24px 16px;
            background: #161b22;
            border-top: 1px solid #30363d;
            text-align: center;
            color: #8b949e;
            font-size: 12px;
        }
        .footer-content {
            display: flex;
            flex-direction: column;
            gap: 8px;
            align-items: center;
        }
        .footer-logo {
            font-size: 16px;
            font-weight: 600;
            color: #c9d1d9;
        }
        .footer-links {
            display: flex;
            gap: 16px;
            flex-wrap: wrap;
            justify-content: center;
        }
        .footer-links a {
            color: #58a6ff;
            text-decoration: none;
        }
        .footer-links a:hover {
            text-decoration: underline;
        }
        .footer-copyright {
            margin-top: 8px;
            font-size: 11px;
            color: #6e7681;
        }

        /* === SCRAPER HEALTH === */
        .scraper-health-toolbar {
            gap: 12px;
            flex-wrap: wrap;
        }
        .scraper-health-updated {
            color: #8b949e;
            font-size: 12px;
            min-width: 120px;
            text-align: right;
        }
        .scraper-health-summary {
            display: grid;
            grid-template-columns: repeat(5, minmax(120px, 1fr));
            gap: 10px;
        }
        .scraper-summary-card {
            background: #161b22;
            border: 1px solid #30363d;
            border-radius: 8px;
            padding: 10px 12px;
            min-height: 64px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 4px;
        }
        .scraper-summary-value {
            color: #f0f6fc;
            font-size: 22px;
            font-weight: 700;
            line-height: 1.1;
        }
        .scraper-summary-value.small {
            font-size: 14px;
            font-weight: 600;
            text-transform: capitalize;
        }
        .scraper-summary-healthy {
            border-color: #1f6f54;
        }
        .scraper-summary-warning {
            border-color: #6b5d00;
        }
        .scraper-summary-critical {
            border-color: #7d2a2a;
        }
        .scraper-health-list {
            gap: 12px;
        }
        .scraper-health-card {
            background: #161b22;
            border: 1px solid #30363d;
            border-radius: 8px;
            padding: 14px;
        }
        .scraper-health-card-warning {
            border-color: #6b5d00;
        }
        .scraper-health-card-critical {
            border-color: #7d2a2a;
        }
        .scraper-health-card-unknown {
            border-color: #444c56;
        }
        .scraper-health-header {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
            margin-bottom: 12px;
        }
        .scraper-health-title-block {
            min-width: 0;
        }
        .scraper-health-title {
            color: #f0f6fc;
            font-size: 15px;
            font-weight: 700;
            line-height: 1.2;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .scraper-health-subtitle {
            color: #8b949e;
            font-size: 12px;
            margin-top: 3px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .scraper-health-badges {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            flex-wrap: wrap;
            gap: 6px;
        }
        .scraper-status {
            font-size: 11px;
            line-height: 1;
            padding: 5px 7px;
            border-radius: 999px;
            text-transform: uppercase;
            border: 1px solid #30363d;
            white-space: nowrap;
        }
        .scraper-status-healthy {
            background: #0f3d2e;
            color: #7ee787;
            border-color: #1f6f54;
        }
        .scraper-status-warning {
            background: #2d2300;
            color: #ffd666;
            border-color: #6b5d00;
        }
        .scraper-status-critical {
            background: #3b1f1f;
            color: #ffa198;
            border-color: #7d2a2a;
        }
        .scraper-status-unknown {
            background: #2a2a2a;
            color: #8b949e;
            border-color: #444c56;
        }
        .scraper-health-meta-grid {
            display: grid;
            grid-template-columns: repeat(6, minmax(0, 1fr));
            gap: 8px 12px;
            margin-bottom: 10px;
        }
        .scraper-health-issue,
        .scraper-market-issue {
            color: #ffa198;
            font-size: 12px;
            line-height: 1.4;
            margin-bottom: 10px;
            word-break: break-word;
        }
        .scraper-market-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }
        .scraper-market-chip {
            background: #0d1117;
            border: 1px solid #30363d;
            border-radius: 8px;
            padding: 9px 10px;
            min-width: 0;
        }
        .scraper-market-warning {
            border-color: #6b5d00;
        }
        .scraper-market-critical {
            border-color: #7d2a2a;
        }
        .scraper-market-unknown {
            border-color: #444c56;
        }
        .scraper-market-top {
            display: flex;
            justify-content: space-between;
            gap: 8px;
            color: #c9d1d9;
            font-size: 12px;
            font-weight: 600;
            margin-bottom: 6px;
        }
        .scraper-market-name {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .scraper-market-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            color: #8b949e;
            font-size: 11px;
            line-height: 1.4;
        }
        .scraper-file-age {
            background: #21262d;
            border: 1px solid #30363d;
            border-radius: 999px;
            padding: 2px 6px;
            white-space: nowrap;
        }
        @media (max-width: 1100px) {
            .scraper-health-summary {
                grid-template-columns: repeat(3, minmax(120px, 1fr));
            }
            .scraper-health-meta-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }
        @media (max-width: 760px) {
            .scraper-health-summary,
            .scraper-health-meta-grid,
            .scraper-market-grid {
                grid-template-columns: 1fr;
            }
            .scraper-health-toolbar,
            .scraper-health-header {
                align-items: stretch;
                flex-direction: column;
            }
            .scraper-health-updated {
                min-width: 0;
                text-align: left;
            }
        }

        /* === TRADING SERVERS === */
        .trading-server-card {
            background: #161b22;
            border: 1px solid #30363d;
            border-radius: 10px;
            padding: 14px;
            margin-bottom: 12px;
        }
        .trading-server-header-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 10px;
        }
        .trading-server-title-row {
            display: flex;
            align-items: center;
            gap: 8px;
            min-width: 0;
        }
        .trading-server-title {
            color: #f0f6fc;
            font-size: 15px;
            font-weight: 600;
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .trading-server-badges {
            display: flex;
            gap: 6px;
            align-items: center;
            flex-wrap: wrap;
        }
        .ts-state, .ts-health {
            font-size: 11px;
            line-height: 1;
            padding: 5px 7px;
            border-radius: 999px;
            text-transform: uppercase;
            border: 1px solid #30363d;
        }
        .ts-provisioning, .ts-health-warning {
            background: #2d2300;
            color: #ffd666;
            border-color: #6b5d00;
        }
        .ts-healthy, .ts-health-healthy {
            background: #0f3d2e;
            color: #7ee787;
            border-color: #1f6f54;
        }
        .ts-draining, .ts-terminating, .ts-health-stale {
            background: #3b1f1f;
            color: #ffa198;
            border-color: #7d2a2a;
        }
        .ts-terminated, .ts-error, .ts-health-terminated {
            background: #2a2a2a;
            color: #8b949e;
            border-color: #444c56;
        }
        .trading-server-meta-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 8px 12px;
            margin-bottom: 8px;
        }
        .meta-label {
            display: block;
            font-size: 11px;
            color: #8b949e;
        }
        .meta-value {
            display: block;
            font-size: 13px;
            color: #c9d1d9;
            word-break: break-all;
        }
        .meta-value.mono {
            font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        }
        .trading-server-running {
            font-size: 13px;
            color: #c9d1d9;
            margin-bottom: 8px;
        }
        .trading-server-error {
            font-size: 12px;
            color: #ffa198;
            margin-bottom: 8px;
            white-space: pre-wrap;
        }
        .trading-server-actions {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
        }
        @media (max-width: 900px) {
            .trading-server-meta-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }