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

    :root {
      --accent: #e65f91;
      --accent-dark: #c83d77;
      --blue: #2563eb;
      --green: #16a34a;
      --red: #dc2626;
      --amber: #d97706;
      --bg: #eef2f7;
      --surface: #ffffff;
      --surface-2: #f7f9fd;
      --border: #d9e1ef;
      --border-strong: #b9c5d8;
      --text: #172033;
      --text-2: #617089;
      --shadow: 0 2px 10px rgba(39,54,83,0.08);
      --shadow-lg: 0 8px 28px rgba(39,54,83,0.13);
      --sb-bg: #111827;
      --sb-border: rgba(255,255,255,0.07);
      --sb-text: rgba(255,255,255,0.63);
      --sb-text-hi: #ffffff;
      --sb-hover: rgba(255,255,255,0.05);
      --sb-active: rgba(230,95,145,0.16);
      --sb-w: 220px;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
      font-size: 15px;
      line-height: 1.5;
      color: var(--text);
    }

    html, body { height: 100%; }
    body { background: var(--bg); }
    button, input, select, textarea { font: inherit; }
    a { color: inherit; text-decoration: none; }
    [hidden] { display: none !important; }

    .auth-screen {
      min-height: 100vh;
      display: grid;
      place-items: center;
      padding: 24px;
      background:
        linear-gradient(135deg, rgba(230,95,145,0.10), rgba(37,99,235,0.08)),
        var(--bg);
    }
    .auth-card {
      width: min(440px, 100%);
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--surface);
      box-shadow: var(--shadow-lg);
      padding: 22px;
    }
    .auth-brand {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 17px;
    }
    .auth-brand h1 {
      font-size: 21px;
      line-height: 1.15;
      letter-spacing: 0;
      margin: 0;
    }
    .auth-brand p {
      margin-top: 2px;
      font-size: 13px;
      color: var(--text-2);
    }
    .auth-form {
      display: grid;
      gap: 10px;
    }
    .auth-actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-top: 4px;
    }
    .auth-note {
      margin-top: 13px;
      font-size: 12px;
      color: var(--text-2);
    }

    .app {
      display: grid;
      grid-template-columns: var(--sb-w) 1fr;
      height: 100vh;
      overflow: hidden;
    }

    .sidebar {
      display: flex;
      flex-direction: column;
      background: var(--sb-bg);
      border-right: 1px solid var(--sb-border);
      overflow-y: auto;
      overflow-x: hidden;
    }
    .sb-header {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 17px 14px 13px;
      border-bottom: 1px solid var(--sb-border);
    }
    .logo {
      width: 32px;
      height: 32px;
      border-radius: 7px;
      flex-shrink: 0;
      background: linear-gradient(135deg, var(--accent), #7c3aed);
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 800;
      font-size: 12px;
      color: #fff;
      letter-spacing: 0;
    }
    .sb-brand { font-size: 15px; font-weight: 740; color: var(--sb-text-hi); letter-spacing: 0; }
    .sb-sub { font-size: 11px; color: var(--sb-text); font-weight: 560; }
    .sb-section {
      padding: 13px 14px 5px;
      font-size: 10px;
      font-weight: 760;
      letter-spacing: 0.8px;
      text-transform: uppercase;
      color: rgba(255,255,255,0.28);
    }
    .sb-nav { padding: 5px 7px; display: flex; flex-direction: column; gap: 1px; }
    .nav-btn {
      display: flex;
      align-items: center;
      gap: 9px;
      padding: 8px 9px;
      border-radius: 6px;
      color: var(--sb-text);
      font-size: 13px;
      font-weight: 560;
      cursor: pointer;
      border: none;
      background: transparent;
      width: 100%;
      text-align: left;
      transition: background 110ms ease, color 110ms ease;
    }
    .nav-btn:hover { background: var(--sb-hover); color: rgba(255,255,255,0.86); }
    .nav-btn.active { background: var(--sb-active); color: var(--sb-text-hi); }
    .nav-icon { width: 16px; height: 16px; flex-shrink: 0; opacity: 0.72; }
    .nav-btn.active .nav-icon { opacity: 1; }
    .nav-sub {
      display: grid;
      gap: 1px;
      padding: 1px 0 4px 22px;
    }
    .nav-sub .nav-btn {
      min-height: 30px;
      padding: 6px 9px;
      font-size: 12px;
    }
    .nav-sub .nav-btn::before {
      content: "";
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: currentColor;
      opacity: 0.5;
      flex: 0 0 auto;
    }
    .nav-sub .nav-btn.active::before { opacity: 1; }
    .sb-sep { height: 1px; background: var(--sb-border); margin: 8px 7px; }
    .sb-footer {
      margin-top: auto;
      padding: 10px 7px;
      border-top: 1px solid var(--sb-border);
    }
    .user-chip {
      display: flex;
      align-items: center;
      gap: 9px;
      padding: 7px 9px;
      border-radius: 6px;
    }
    .user-av {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      flex-shrink: 0;
      background: linear-gradient(135deg, #2563eb, #7c3aed);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 11px;
      font-weight: 800;
      color: #fff;
    }
    .user-chip-name { font-size: 12px; font-weight: 650; color: var(--sb-text-hi); line-height: 1.2; }
    .user-chip-role { font-size: 11px; color: var(--sb-text); }

    .main { display: flex; flex-direction: column; overflow: hidden; }
    .topbar {
      display: flex;
      align-items: center;
      gap: 0;
      min-height: 56px;
      padding: 0 14px;
      background: var(--surface);
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
    }
    .menu-btn {
      display: none;
      align-items: center;
      justify-content: center;
      width: 34px;
      height: 34px;
      border-radius: 6px;
      border: 1px solid var(--border);
      background: var(--surface);
      cursor: pointer;
      color: var(--text);
      margin-right: 8px;
    }
    .mode-bar { display: flex; align-items: center; gap: 6px; flex: 1; padding: 0 14px; min-width: 0; }
    .mode-grp { display: flex; align-items: center; gap: 6px; }
    .mode-lbl {
      font-size: 10px;
      font-weight: 760;
      color: var(--text-2);
      text-transform: uppercase;
      letter-spacing: 0.5px;
      white-space: nowrap;
    }
    .mode-div { width: 1px; height: 24px; background: var(--border); margin: 0 4px; }
    .tog-strip {
      display: flex;
      background: var(--surface-2);
      border: 1px solid var(--border);
      border-radius: 6px;
      padding: 2px;
      gap: 1px;
    }
    .tog-btn {
      padding: 4px 11px;
      border-radius: 4px;
      border: none;
      background: transparent;
      color: var(--text-2);
      font-size: 12px;
      font-weight: 650;
      cursor: pointer;
      min-height: 0;
      white-space: nowrap;
    }
    .tog-btn:hover { color: var(--text); }
    .tog-btn.active {
      background: var(--surface);
      color: var(--text);
      box-shadow: 0 1px 3px rgba(0,0,0,0.09);
    }
    .tog-btn.active[data-instrument="futures"] { background: #fff0f6; color: var(--accent-dark); }
    .tog-btn.active[data-instrument="spot"] { background: #e8f8ee; color: var(--green); }
    .tog-btn.active[data-instrument="options"] { background: #eff6ff; color: var(--blue); }
    .live-account-select {
      display: flex;
      align-items: center;
      gap: 6px;
      min-width: 190px;
    }
    .live-account-select select {
      height: 30px;
      min-height: 0;
      min-width: 190px;
      max-width: 260px;
      padding: 0 8px;
      border-radius: 6px;
      border: 1px solid var(--border);
      background: var(--surface);
      color: var(--text);
      font-size: 12px;
      font-weight: 650;
      outline: none;
    }
    .topbar-right { display: flex; align-items: center; gap: 8px; margin-left: auto; }
    .status-dot {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 3px 9px;
      border-radius: 99px;
      font-size: 11px;
      font-weight: 650;
      background: var(--surface-2);
      color: var(--text-2);
      border: 1px solid var(--border);
      white-space: nowrap;
    }
    .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--text-2); }
    .dot.green { background: var(--green); box-shadow: 0 0 0 2px rgba(22,163,74,0.2); }
    .usr-sel {
      height: 32px;
      min-height: 0;
      padding: 0 8px;
      border-radius: 6px;
      border: 1px solid var(--border);
      font-size: 12px;
      font-weight: 650;
      background: var(--surface);
      color: var(--text);
      width: auto;
      outline: none;
    }
    .logout-btn {
      height: 32px;
      min-height: 0;
      padding: 0 10px;
    }

    .page-content { flex: 1; overflow-y: auto; padding: 13px; }
    .page { display: none; }
    .page.active { display: block; }
    .split-layout {
      display: grid;
      grid-template-columns: minmax(0,1fr) clamp(480px, 38vw, 640px);
      gap: 11px;
      align-items: start;
    }
    .split-layout.optimization-layout {
      grid-template-columns: minmax(320px, 0.8fr) minmax(0, 1.35fr);
    }
    .split-layout.live-settings-collapsed {
      grid-template-columns: minmax(210px, 260px) minmax(0, 1fr);
    }
    .settings-col, .analytics-col { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
    .settings-col.live-settings-collapsed {
      position: sticky;
      top: 8px;
    }
    #btPanel, #optPanel, #advisorPanel, #livePanel { min-width: 0; }
    .optimization-layout .analytics-col {
      min-width: 0;
    }
    .optimization-layout #optPanel > .card {
      display: flex;
      flex-direction: column;
      max-height: calc(100vh - 92px);
    }

    .card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 9px;
      box-shadow: var(--shadow);
      overflow: hidden;
    }
    .card-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 11px 14px;
      border-bottom: 1px solid var(--border);
    }
    .card-head h2, .card-head h3 {
      font-size: 14px;
      font-weight: 760;
      color: var(--text);
      letter-spacing: 0;
    }
    .card-head h2 { font-size: 16px; }
    .risk-controls-card {
      background: #fff3b0;
      border-color: #e7cf5a;
    }
    .risk-controls-card .card-head {
      background: rgba(231, 207, 90, 0.22);
    }
    .card-body { padding: 13px 14px; }
    .ch-badge {
      font-size: 10px;
      font-weight: 760;
      padding: 2px 7px;
      border-radius: 99px;
      background: var(--surface-2);
      color: var(--text-2);
      white-space: nowrap;
    }
    .ch-badge.futures { background: #fff0f6; color: var(--accent-dark); }
    .ch-badge.spot { background: #e8f8ee; color: var(--green); }
    .ch-badge.options { background: #eff6ff; color: var(--blue); }
    .ch-badge.live { background: #e8f8ee; color: var(--green); }
    .ch-badge.running { background: #eff6ff; color: var(--blue); }
    .ch-badge.error { background: #fee2e2; color: var(--red); }

    .service-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
      padding: 11px 14px;
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 9px;
      box-shadow: var(--shadow);
    }
    .service-title { font-size: 15px; font-weight: 760; }
    .service-meta { margin-top: 2px; font-size: 12px; color: var(--text-2); font-weight: 600; }
    .service-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
      gap: 10px;
      align-items: start;
    }
    .service-card-body { padding: 13px 14px; display: grid; gap: 10px; }
    .service-card-body p { font-size: 12px; color: var(--text-2); }
    .service-list { display: grid; gap: 6px; }
    .service-list li {
      list-style: none;
      padding: 7px 9px;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--surface-2);
      font-size: 12px;
      color: var(--text);
    }
    .service-list small { display: block; color: var(--text-2); margin-top: 1px; }
    .service-status-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
      gap: 8px;
    }
    .service-status-row {
      min-height: 92px;
      padding: 9px 10px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      display: grid;
      align-content: start;
      gap: 5px;
    }
    .service-status-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }
    .service-status-top strong { font-size: 12px; color: var(--text); }
    .service-status-row small { color: var(--text-2); line-height: 1.35; }
    .service-status-meta { display: flex; flex-wrap: wrap; gap: 5px; }
    .service-status-error { color: var(--red); font-weight: 650; }
    .status-pill {
      border: 1px solid var(--border);
      border-radius: 999px;
      padding: 2px 7px;
      font-size: 10px;
      font-weight: 760;
      color: var(--text-2);
      background: var(--surface);
      white-space: nowrap;
    }
    .status-pill.ok { color: var(--green); background: #e8f8ee; border-color: #bbf7d0; }
    .status-pill.warn { color: #a16207; background: #fef9c3; border-color: #fde68a; }
    .status-pill.error { color: var(--red); background: #fee2e2; border-color: #fecaca; }
    .matrix-table { width: 100%; border-collapse: collapse; min-width: 720px; }
    .matrix-table td:first-child { font-weight: 720; color: var(--text); }
    .pill-row { display: flex; flex-wrap: wrap; gap: 5px; }

    .frow {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
      gap: 9px;
    }
    .frow.cols2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .frow.cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .frow.cols4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .frow + .frow { margin-top: 9px; }
    .field.hidden-by-rule, .chk.hidden-by-rule { display: none; }
    .field label {
      display: block;
      font-size: 11px;
      font-weight: 760;
      color: var(--text-2);
      text-transform: uppercase;
      letter-spacing: 0.4px;
      margin-bottom: 4px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .field input, .field select, .field textarea {
      width: 100%;
      height: 36px;
      min-height: 0;
      padding: 0 9px;
      border: 1px solid var(--border-strong);
      border-radius: 5px;
      background: var(--surface);
      font-size: 13px;
      font-weight: 520;
      color: var(--text);
      outline: none;
    }
    .field textarea {
      height: auto;
      min-height: 86px;
      padding: 8px 9px;
      resize: vertical;
      font-family: ui-monospace, Menlo, Consolas, monospace;
      font-size: 12px;
    }
    .field input:focus, .field select:focus, .field textarea:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(230,95,145,0.11);
    }
    .field-help {
      display: block;
      margin-top: 4px;
      color: var(--text-2);
      font-size: 11px;
      font-weight: 520;
      line-height: 1.3;
      text-transform: none;
      letter-spacing: 0;
      overflow-wrap: anywhere;
    }
    .chk {
      display: flex;
      align-items: flex-start;
      gap: 7px;
      min-height: 36px;
      padding: 7px 9px;
      border: 1px solid var(--border);
      border-radius: 5px;
      background: var(--surface-2);
      font-size: 13px;
      font-weight: 560;
      cursor: pointer;
      line-height: 1.25;
    }
    .chk input[type=checkbox] {
      width: 15px;
      height: 15px;
      min-height: 0;
      padding: 0;
      border: none;
      accent-color: var(--accent);
      flex: 0 0 auto;
      margin-top: 1px;
    }
    .chk-copy {
      display: grid;
      gap: 2px;
      min-width: 0;
    }
    .chk-copy .field-help {
      margin-top: 0;
      font-weight: 500;
    }
    .setting-mode-block {
      min-width: 0;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      padding: 8px;
    }
    .setting-mode-block.setting-mode-wide { grid-column: 1 / -1; }
    .setting-mode-head > .field,
    .setting-mode-head > .chk {
      margin: 0;
      background: var(--surface);
    }
    .setting-mode-head > .field {
      border: 1px solid var(--border);
      border-radius: 6px;
      padding: 7px 8px 8px;
    }
    .setting-mode-body {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      gap: 7px;
      margin-top: 8px;
      padding-top: 8px;
      border-top: 1px solid var(--border);
    }
    .setting-mode-body .field input,
    .setting-mode-body .field select,
    .setting-mode-body .field textarea {
      background: var(--surface);
    }
    .setting-mode-body .chk {
      background: var(--surface);
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      height: 34px;
      padding: 0 13px;
      border-radius: 6px;
      border: 1px solid var(--border);
      background: var(--surface);
      color: var(--text);
      font-size: 12px;
      font-weight: 650;
      cursor: pointer;
      min-height: 0;
      white-space: nowrap;
      text-decoration: none;
    }
    .btn:hover { border-color: var(--border-strong); }
    .btn:disabled {
      cursor: progress;
      opacity: 0.68;
      box-shadow: none;
    }
    .btn.primary {
      border-color: transparent;
      background: linear-gradient(135deg, var(--accent), #7c3aed);
      color: #fff;
      box-shadow: 0 4px 12px rgba(230,95,145,0.25);
    }
    .btn.ghost { background: var(--surface-2); }
    .btn.run {
      border-color: transparent;
      background: linear-gradient(135deg, #16a34a, #047857);
      color: #fff;
      box-shadow: 0 4px 12px rgba(22,163,74,0.25);
    }
    .btn.sm { height: 28px; padding: 0 9px; font-size: 11px; border-radius: 5px; }
    .action-bar {
      display: flex;
      align-items: center;
      gap: 7px;
      flex-wrap: wrap;
      padding: 11px 14px;
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 9px;
      box-shadow: var(--shadow);
    }
    .action-status { font-size: 12px; font-weight: 650; color: var(--text-2); flex: 1; min-width: 80px; }
    .run-name-field {
      display: grid;
      gap: 3px;
      min-width: min(260px, 100%);
      flex: 1 1 220px;
    }
    .run-name-field span {
      font-size: 10px;
      font-weight: 760;
      color: var(--text-2);
      text-transform: uppercase;
      letter-spacing: 0.4px;
    }
    .run-name-field input {
      width: 100%;
      height: 28px;
      border: 1px solid var(--border-strong);
      border-radius: 5px;
      padding: 0 8px;
      font-size: 12px;
      color: var(--text);
      background: var(--surface);
      outline: none;
    }
    .run-name-field input:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(230,95,145,0.11);
    }

    .strategy-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
      gap: 7px;
    }
    .strategy-option {
      display: flex;
      flex-direction: column;
      gap: 5px;
      min-height: 56px;
      padding: 9px 10px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      color: var(--text);
      text-align: left;
      cursor: pointer;
    }
    .strategy-option:hover { border-color: var(--border-strong); }
    .strategy-option.active {
      border-color: var(--accent);
      background: #fff6fb;
      box-shadow: inset 0 0 0 1px rgba(230,95,145,0.15);
    }
    .strategy-option-title {
      font-size: 13px;
      line-height: 1.25;
      font-weight: 780;
      letter-spacing: 0;
    }
    .strategy-option-meta {
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.25;
    }
    .strategy-inline-settings { margin-top: 10px; }

    .kpi-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 7px;
      padding: 12px 14px;
    }
    .kpi {
      background: var(--surface-2);
      border: 1px solid var(--border);
      border-radius: 7px;
      padding: 9px 11px;
    }
    .kpi-lbl {
      font-size: 10px;
      font-weight: 760;
      text-transform: uppercase;
      letter-spacing: 0.45px;
      color: var(--text-2);
      margin-bottom: 3px;
    }
    .kpi-val { font-size: 19px; font-weight: 800; line-height: 1; color: var(--text); font-variant-numeric: tabular-nums; }
    .kpi-val.g { color: var(--green); }
    .kpi-val.r { color: var(--red); }
    .kpi-sub { font-size: 11px; color: var(--text-2); margin-top: 2px; }
    .chart-wrap { padding: 6px 14px 13px; }
    .chart-lbl { font-size: 11px; font-weight: 760; text-transform: uppercase; letter-spacing: 0.35px; color: var(--text-2); margin-bottom: 7px; }
    .eq-svg { width: 100%; height: 80px; display: block; }
    .trades-wrap { padding: 0 14px 12px; }
    .trade-analytics {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 7px;
      margin-bottom: 9px;
    }
    .trade-stat {
      background: var(--surface-2);
      border: 1px solid var(--border);
      border-radius: 7px;
      padding: 8px 9px;
      min-width: 0;
    }
    .trade-stat span {
      display: block;
      color: var(--text-2);
      font-size: 11px;
      font-weight: 720;
      line-height: 1.2;
    }
    .trade-stat strong {
      display: block;
      color: var(--text);
      font-size: 15px;
      line-height: 1.2;
      margin-top: 2px;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .trade-stat strong.g { color: var(--green); }
    .trade-stat strong.r { color: var(--red); }
    .trade-stat small {
      display: block;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.25;
      margin-top: 1px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .trade-list { display: flex; flex-direction: column; gap: 7px; }
    .trade-card {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      padding: 9px;
      font-size: 13px;
      line-height: 1.3;
    }
    .trade-card.win { border-left: 3px solid var(--green); }
    .trade-card.loss { border-left: 3px solid var(--red); }
    .trade-main {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      align-items: center;
      min-width: 0;
    }
    .trade-title {
      display: flex;
      align-items: center;
      gap: 6px;
      min-width: 0;
      flex-wrap: wrap;
    }
    .trade-title strong { font-size: 14px; font-weight: 780; }
    .trade-time { color: var(--text-2); font-variant-numeric: tabular-nums; }
    .t-side { font-weight: 760; font-size: 11px; padding: 2px 6px; border-radius: 3px; display: inline-block; }
    .t-side.long { background: #dcfce7; color: var(--green); }
    .t-side.short { background: #fee2e2; color: var(--red); }
    .trade-result {
      text-align: right;
      min-width: 82px;
      font-variant-numeric: tabular-nums;
    }
    .trade-result small {
      display: block;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.2;
    }
    .t-pnl { font-weight: 800; text-align: right; font-size: 14px; }
    .t-pnl.pos { color: var(--green); }
    .t-pnl.neg { color: var(--red); }
    .trade-route {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
      gap: 7px;
      align-items: center;
      margin: 8px 0 7px;
      color: var(--text);
      font-weight: 700;
      font-variant-numeric: tabular-nums;
    }
    .trade-route span {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .trade-route em {
      height: 1px;
      background: var(--border-strong);
      display: block;
      min-width: 18px;
    }
    .trade-route .exit-price { text-align: right; }
    .trade-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
    }
    .trade-meta span {
      border: 1px solid var(--border);
      background: var(--surface-2);
      border-radius: 999px;
      padding: 3px 7px;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.2;
    }
    .trade-meta b { color: var(--text); font-weight: 760; }
    .trades-footer {
      margin-top: 8px;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.3;
    }
    .bt-metrics-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .bt-section {
      border-top: 1px solid var(--border);
      padding: 12px 0 0;
      margin-top: 12px;
    }
    .bt-section:first-child {
      border-top: 0;
      padding-top: 0;
      margin-top: 0;
    }
    .bt-section-head {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 8px;
    }
    .bt-section-head h4 {
      font-size: 13px;
      line-height: 1.2;
      font-weight: 820;
      color: var(--text);
      margin: 0;
    }
    .bt-section-head span {
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.3;
    }
    .bt-mini-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 7px;
    }
    .bt-mini {
      border: 1px solid var(--border);
      background: var(--surface-2);
      border-radius: 7px;
      padding: 8px 9px;
      min-width: 0;
    }
    .bt-mini span {
      display: block;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.25;
      font-weight: 720;
    }
    .bt-mini strong {
      display: block;
      color: var(--text);
      font-size: 15px;
      line-height: 1.2;
      margin-top: 2px;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .bt-mini small {
      display: block;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.25;
      margin-top: 1px;
      overflow-wrap: anywhere;
    }
    .bt-mini span {
      overflow-wrap: anywhere;
    }
    .bt-mini strong.g, .bt-table .g, .bt-focus-gain { color: var(--green); }
    .bt-mini strong.r, .bt-table .r, .bt-focus-loss { color: var(--red); }
    .bt-mini strong.warn, .bt-table .warn { color: #a16207; }
    .bt-note {
      margin-top: 8px;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .bt-table-wrap {
      overflow: auto;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
    }
    .bt-table {
      width: 100%;
      min-width: 1020px;
      border-collapse: collapse;
      font-size: 12px;
      line-height: 1.3;
    }
    .bt-table th {
      position: sticky;
      top: 0;
      z-index: 1;
      text-align: left;
      color: var(--text-2);
      font-size: 10px;
      text-transform: uppercase;
      letter-spacing: 0.35px;
      background: var(--surface-2);
      border-bottom: 1px solid var(--border);
      padding: 7px 8px;
      white-space: nowrap;
    }
    .bt-table td {
      border-bottom: 1px solid var(--border);
      padding: 8px;
      color: var(--text);
      vertical-align: top;
      font-variant-numeric: tabular-nums;
    }
    .bt-table tr:last-child td { border-bottom: 0; }
    .bt-table small {
      display: block;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.2;
      margin-top: 2px;
      font-variant-numeric: normal;
    }
    .bt-side-pill {
      display: inline-block;
      padding: 2px 6px;
      border-radius: 3px;
      font-size: 11px;
      font-weight: 760;
      line-height: 1.2;
    }
    .bt-side-pill.long { background: #dcfce7; color: var(--green); }
    .bt-side-pill.short { background: #fee2e2; color: var(--red); }
    .bt-focus-panel {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      overflow: hidden;
    }
    .bt-focus-controls {
      display: grid;
      grid-template-columns: minmax(180px, 1.6fr) 120px 120px auto;
      gap: 7px;
      padding: 9px;
      border-bottom: 1px solid var(--border);
      background: var(--surface-2);
      align-items: end;
    }
    .bt-focus-controls label {
      display: grid;
      gap: 4px;
      color: var(--text-2);
      font-size: 11px;
      font-weight: 720;
      line-height: 1.2;
    }
    .bt-focus-controls select,
    .bt-focus-controls input {
      min-height: 34px;
      border: 1px solid var(--border-strong);
      border-radius: 6px;
      background: var(--surface);
      color: var(--text);
      font-size: 13px;
      padding: 6px 8px;
    }
    .bt-focus-toggle {
      display: flex;
      align-items: center;
      gap: 7px;
      min-height: 34px;
      color: var(--text);
      font-size: 12px;
      font-weight: 680;
    }
    .bt-focus-toggle input[type="checkbox"] {
      width: 16px;
      height: 16px;
      min-height: 0;
      flex: 0 0 auto;
      padding: 0;
    }
    .bt-focus-body {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 0;
    }
    .bt-focus-chart {
      min-height: 0;
      padding: 12px;
      border-bottom: 1px solid var(--border);
      display: grid;
      gap: 10px;
    }
    .bt-focus-chart-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }
    .bt-focus-chart-summary {
      display: grid;
      gap: 2px;
      min-width: 0;
    }
    .bt-focus-chart-summary strong {
      color: var(--text);
      font-size: 13px;
      line-height: 1.2;
    }
    .bt-focus-chart-summary span {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.2;
      font-variant-numeric: tabular-nums;
    }
    .bt-focus-chart-legend {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.2;
    }
    .bt-focus-chart-legend span {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      white-space: nowrap;
    }
    .bt-focus-chart-legend i {
      width: 16px;
      height: 0;
      border-top: 2px solid currentColor;
      display: inline-block;
      opacity: 0.95;
    }
    .bt-focus-chart-legend i.sig {
      color: #64748b;
      border-top-style: dashed;
    }
    .bt-focus-chart-legend i.entry {
      color: #16a34a;
    }
    .bt-focus-chart-legend i.exit {
      color: #dc2626;
    }
    .bt-focus-chart-legend i.win {
      color: #22c55e;
      border-top-style: dotted;
    }
    .bt-focus-svg {
      width: 100%;
      height: auto;
      min-height: 360px;
      aspect-ratio: 49 / 17;
      display: block;
      background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
      border: 1px solid var(--border);
      border-radius: 6px;
    }
    .bt-focus-narrative {
      padding: 12px;
      display: grid;
      gap: 10px;
      align-content: start;
      font-size: 12px;
      line-height: 1.35;
      color: var(--text);
    }
    .bt-focus-narrative h5 {
      margin: 0;
      font-size: 13px;
      line-height: 1.25;
    }
    .bt-focus-narrative dl {
      margin: 0;
      display: grid;
      gap: 5px;
    }
    .bt-focus-narrative div {
      display: grid;
      gap: 2px;
    }
    .bt-focus-narrative dt {
      color: var(--text-2);
      font-size: 11px;
      font-weight: 760;
    }
    .bt-focus-narrative dd {
      margin: 0;
      font-variant-numeric: tabular-nums;
    }
    .bt-signal-list {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
      margin-top: 2px;
    }
    .bt-signal-list span {
      padding: 2px 5px;
      border: 1px solid var(--border);
      border-radius: 3px;
      background: var(--surface-2);
      color: var(--text-2);
      font-size: 11px;
    }
    .bt-focus-subsection {
      display: grid;
      gap: 8px;
    }
    .bt-focus-subsection h6 {
      margin: 0;
      color: var(--text);
      font-size: 12px;
      line-height: 1.2;
    }
    .opt-panel-body {
      display: grid;
      gap: 10px;
      padding: 12px 14px 14px;
      min-height: 0;
      overflow: auto;
    }
    .opt-brief {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 7px;
    }
    .opt-baseline {
      border: 1px solid var(--border-strong);
      border-radius: 7px;
      background: #f8fafc;
      padding: 10px;
      display: grid;
      gap: 9px;
    }
    .opt-baseline-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
    }
    .opt-baseline-head h4 {
      margin: 0;
      font-size: 14px;
      line-height: 1.25;
      color: var(--text);
    }
    .opt-baseline-head p {
      margin: 3px 0 0;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .opt-baseline-grid {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 7px;
    }
    .opt-run-note {
      border: 1px dashed var(--border-strong);
      border-radius: 7px;
      background: #fffbeb;
      color: #7c2d12;
      padding: 9px 10px;
      font-size: 13px;
      line-height: 1.35;
    }
    .opt-card {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      padding: 10px;
      display: grid;
      gap: 7px;
    }
    .opt-card h4 {
      margin: 0;
      font-size: 13px;
      line-height: 1.25;
      color: var(--text);
    }
    .opt-card p {
      margin: 0;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .opt-proposals {
      display: grid;
      gap: 8px;
    }
    .opt-proposal {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      padding: 10px;
      display: grid;
      gap: 8px;
    }
    .opt-proposal-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
    }
    .opt-proposal-head h4 {
      margin: 0;
      font-size: 13px;
      line-height: 1.25;
    }
    .opt-proposal-head p {
      margin: 3px 0 0;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .opt-impact {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 6px;
    }
    .opt-impact div {
      border: 1px solid var(--border);
      border-radius: 6px;
      padding: 7px;
      background: var(--surface-2);
    }
    .opt-impact span {
      display: block;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.2;
    }
    .opt-impact strong {
      display: block;
      margin-top: 2px;
      color: var(--text);
      font-size: 14px;
      line-height: 1.2;
      font-variant-numeric: tabular-nums;
    }
    .opt-change-list {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
    }
    .opt-change-list span {
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--surface-2);
      color: var(--text);
      padding: 5px 7px;
      font-size: 12px;
      line-height: 1.25;
    }
    .opt-change-list b {
      color: var(--text-2);
      font-weight: 720;
    }
    .opt-why {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px;
    }
    .opt-why div {
      border: 1px solid var(--border);
      border-radius: 6px;
      background: #fff;
      padding: 7px;
      min-width: 0;
    }
    .opt-why span {
      display: block;
      color: var(--text-2);
      font-size: 11px;
      font-weight: 740;
      line-height: 1.2;
    }
    .opt-why strong {
      display: block;
      color: var(--text);
      font-size: 13px;
      line-height: 1.25;
      margin-top: 2px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .opt-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      align-items: center;
    }
    .opt-proposal-toolbar {
      display: grid;
      grid-template-columns: minmax(220px, 1fr) auto auto;
      gap: 8px;
      align-items: end;
      padding: 10px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
    }
    .opt-proposal-toolbar select {
      width: 100%;
      border: 1px solid var(--border);
      border-radius: 5px;
      padding: 7px 8px;
      background: #fff;
      color: var(--text);
      font-size: 13px;
    }
    .opt-compare {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      overflow: hidden;
    }
    .opt-space {
      border: 1px solid var(--border-strong);
      border-radius: 7px;
      background: var(--surface);
      overflow: hidden;
      min-width: 0;
    }
    .opt-space-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
      padding: 10px;
      border-bottom: 1px solid var(--border);
      background: #f8fafc;
    }
    .opt-space-head h4 {
      margin: 0;
      font-size: 14px;
      line-height: 1.25;
      color: var(--text);
    }
    .opt-space-head p {
      margin: 3px 0 0;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .opt-space-tools {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      justify-content: flex-end;
    }
    .opt-space-summary {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 7px;
      padding: 10px;
      border-bottom: 1px solid var(--border);
    }
    .opt-space-table-wrap {
      max-height: min(62vh, 680px);
      overflow: auto;
      overscroll-behavior: contain;
    }
    .opt-space-table {
      width: max(100%, 1040px);
      border-collapse: collapse;
      font-size: 12px;
    }
    .opt-space-table th {
      position: sticky;
      top: 0;
      z-index: 1;
      background: var(--surface-2);
      color: var(--text-2);
      font-size: 11px;
      text-align: left;
      padding: 7px;
      border-bottom: 1px solid var(--border);
    }
    .opt-space-table td {
      padding: 6px 7px;
      border-bottom: 1px solid var(--border);
      vertical-align: middle;
    }
    .opt-space-table tr.is-disabled {
      opacity: 0.62;
    }
    .opt-group-row th {
      position: sticky;
      top: 31px;
      z-index: 1;
      padding: 8px 10px;
      background: #eef2ff;
      color: var(--text);
      border-bottom: 1px solid var(--border);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.72);
    }
    .opt-group-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      font-size: 12px;
      line-height: 1.2;
    }
    .opt-group-title span {
      color: var(--text-2);
      font-size: 11px;
      font-weight: 650;
      white-space: nowrap;
    }
    .opt-param-name {
      display: grid;
      gap: 2px;
      min-width: 180px;
    }
    .opt-param-name strong {
      color: var(--text);
      font-size: 12px;
      line-height: 1.25;
    }
    .opt-param-name span {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.2;
      font-family: ui-monospace, Menlo, Consolas, monospace;
    }
    .opt-space-table input,
    .opt-space-table select {
      width: 100%;
      min-width: 72px;
      border: 1px solid var(--border);
      border-radius: 5px;
      padding: 5px 6px;
      background: #fff;
      color: var(--text);
      font-size: 12px;
    }
    .opt-space-table input[type="checkbox"] {
      width: auto;
      min-width: 0;
    }
    .opt-values-input {
      min-width: 180px;
      font-family: ui-monospace, Menlo, Consolas, monospace;
    }
    .opt-job-preview {
      margin: 0;
      max-height: 260px;
      overflow: auto;
      border-top: 1px solid var(--border);
      padding: 10px;
      background: #0f172a;
      color: #dbeafe;
      font-size: 11px;
      line-height: 1.45;
      font-family: ui-monospace, Menlo, Consolas, monospace;
      white-space: pre-wrap;
    }
    .opt-queue {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      overflow: hidden;
    }
    .opt-queue-row {
      display: grid;
      grid-template-columns: 1.2fr 88px 100px 1fr;
      gap: 8px;
      align-items: center;
      padding: 9px 10px;
      border-top: 1px solid var(--border);
      font-size: 12px;
    }
    .opt-queue-row:first-child {
      border-top: 0;
    }
    .opt-queue-row strong {
      display: block;
      color: var(--text);
      line-height: 1.25;
    }
    .opt-queue-row span,
    .opt-queue-row code {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.25;
    }
    .opt-queue-row code {
      font-family: ui-monospace, Menlo, Consolas, monospace;
    }
    .opt-ai-layout {
      display: grid;
      grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.4fr);
      gap: 10px;
      padding: 10px;
      border-top: 1px solid var(--border);
    }
    .opt-ai-layout.advisor-results-layout {
      grid-template-columns: minmax(250px, 0.38fr) minmax(0, 1fr);
      align-items: start;
    }
    .advisor-full-layout {
      display: grid;
      gap: 10px;
      padding: 10px;
      border-top: 1px solid var(--border);
      min-width: 0;
    }
    .advisor-job-strip {
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      max-height: 190px;
      padding-bottom: 2px;
    }
    .advisor-full-detail {
      display: grid;
      gap: 8px;
      min-width: 0;
      width: 100%;
    }
    .advisor-full-detail > div:first-child {
      min-width: 0;
    }
    .advisor-full-detail .bt-section,
    .advisor-full-detail .ai-comparison-card,
    .advisor-full-detail .ai-leg-card {
      min-width: 0;
    }
    .advisor-full-detail .bt-table-wrap,
    .advisor-full-detail .ai-decision-table {
      max-width: 100%;
    }
    .advisor-tabs {
      grid-template-columns: repeat(6, minmax(82px, 1fr));
    }
    .advisor-tab-body {
      display: grid;
      gap: 10px;
      padding: 10px;
      min-width: 0;
    }
    .advisor-run-grid {
      display: grid;
      grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.1fr);
      gap: 10px;
      align-items: start;
      min-width: 0;
    }
    .advisor-run-grid .bt-mini-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .advisor-settings-grid,
    .advisor-limits-grid {
      grid-template-columns: 1fr;
      padding: 0;
      border-bottom: 0;
    }
    .opt-assistant-limits.advisor-limits-grid {
      grid-template-columns: 1fr;
    }
    .advisor-log-list,
    .advisor-analysis-list {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .advisor-trade-list,
    .advisor-decision-list {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .advisor-analysis-item,
    .advisor-trade-item,
    .advisor-decision-item,
    .advisor-log-item {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      padding: 9px;
      display: grid;
      gap: 4px;
      min-width: 0;
    }
    .advisor-analysis-item strong,
    .advisor-trade-item strong,
    .advisor-decision-item strong,
    .advisor-log-item strong {
      color: var(--text);
      font-size: 12px;
      line-height: 1.25;
    }
    .advisor-analysis-item span,
    .advisor-trade-item span,
    .advisor-decision-item span,
    .advisor-log-item span {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .advisor-trade-head {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      align-items: flex-start;
      flex-wrap: wrap;
      min-width: 0;
    }
    .advisor-trade-head > div {
      display: grid;
      gap: 3px;
      min-width: 0;
    }
    .advisor-trade-badge {
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--surface-2);
      padding: 3px 7px;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.2;
      white-space: nowrap;
    }
    .advisor-audit-line {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      min-width: 0;
    }
    .advisor-audit-line span {
      border: 1px solid var(--border);
      border-radius: 999px;
      background: #fff;
      padding: 2px 6px;
    }
    .advisor-io-details {
      min-width: 0;
      margin-top: 4px;
    }
    .advisor-io-details > summary {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      width: fit-content;
      max-width: 100%;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: #eef2ff;
      color: #1d4ed8;
      padding: 4px 8px;
      cursor: pointer;
      font-size: 11px;
      line-height: 1.2;
      list-style: none;
      overflow-wrap: anywhere;
    }
    .advisor-io-details > summary::-webkit-details-marker {
      display: none;
    }
    .advisor-io-details > summary::before {
      content: '+';
      color: #2563eb;
      font-weight: 900;
    }
    .advisor-io-details[open] > summary::before {
      content: '-';
    }
    .advisor-io-details > summary small {
      color: var(--text-2);
      font-size: 10px;
      line-height: 1.2;
    }
    .advisor-io-stack {
      display: grid;
      gap: 8px;
      margin-top: 8px;
      min-width: 0;
    }
    .advisor-io-attempt {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: #fff;
      padding: 8px;
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .advisor-io-attempt > strong {
      color: var(--text);
      font-size: 12px;
      line-height: 1.25;
    }
    .advisor-io-block {
      display: grid;
      gap: 4px;
      min-width: 0;
    }
    .advisor-io-block strong {
      color: var(--text);
      font-size: 11px;
      line-height: 1.25;
    }
    .advisor-io-block pre {
      margin: 0;
      max-height: 460px;
      overflow: auto;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: #0f172a;
      color: #e5e7eb;
      padding: 8px;
      font-size: 11px;
      line-height: 1.35;
    }
    .advisor-event-layout {
      display: grid;
      grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.75fr);
      gap: 8px;
      align-items: start;
      min-width: 0;
    }
    .advisor-event-main,
    .advisor-event-side {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .advisor-event-chart {
      position: relative;
      min-height: 230px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background:
        linear-gradient(to bottom, rgba(185,197,216,0.45) 1px, transparent 1px) 0 0 / 100% 25%,
        linear-gradient(to right, rgba(185,197,216,0.34) 1px, transparent 1px) 0 0 / 10% 100%,
        var(--surface);
      overflow: hidden;
    }
    .advisor-event-band {
      position: absolute;
      top: 0;
      bottom: 0;
      border-left: 1px solid rgba(97,112,137,0.25);
      border-right: 1px solid rgba(97,112,137,0.25);
    }
    .advisor-event-band.high { background: rgba(220,38,38,0.10); }
    .advisor-event-band.medium { background: rgba(217,119,6,0.10); }
    .advisor-event-band.low { background: rgba(37,99,235,0.08); }
    .advisor-event-marker {
      position: absolute;
      width: 9px;
      height: 9px;
      border-radius: 50%;
      border: 2px solid #fff;
      box-shadow: 0 0 0 1px rgba(23,32,51,0.25);
      background: var(--accent);
      transform: translate(-50%, -50%);
    }
    .advisor-event-marker.win { background: var(--green); }
    .advisor-event-marker.loss { background: var(--red); }
    .advisor-event-axis {
      position: absolute;
      left: 8px;
      right: 8px;
      bottom: 7px;
      display: flex;
      justify-content: space-between;
      gap: 8px;
      color: var(--text-2);
      font-size: 11px;
      font-variant-numeric: tabular-nums;
      pointer-events: none;
    }
    .advisor-event-legend {
      position: absolute;
      top: 8px;
      right: 8px;
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 4px;
      max-width: 520px;
    }
    .advisor-event-legend span {
      padding: 2px 6px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--surface-2);
      color: var(--text-2);
      font-size: 11px;
      font-weight: 720;
    }
    .advisor-event-tooltip {
      position: absolute;
      left: 8px;
      top: 8px;
      max-width: min(420px, calc(100% - 180px));
      border: 1px solid var(--border);
      border-radius: 7px;
      background: rgba(255,255,255,0.92);
      padding: 7px 8px;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.35;
      pointer-events: none;
    }
    .advisor-event-tooltip strong {
      display: block;
      color: var(--text);
      font-size: 12px;
      line-height: 1.25;
      margin-bottom: 2px;
    }
    .advisor-event-muted {
      border: 1px dashed var(--border-strong);
      border-radius: 7px;
      background: #fffbeb;
      color: #7c2d12;
      padding: 9px 10px;
      font-size: 12px;
      line-height: 1.35;
    }
    @media (max-width: 980px) {
      .advisor-event-layout { grid-template-columns: 1fr; }
    }
    .opt-ai-list {
      display: grid;
      gap: 7px;
      align-content: start;
      max-height: 360px;
      overflow: auto;
    }
    .opt-ai-result {
      width: 100%;
      text-align: left;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      padding: 8px;
      cursor: pointer;
      color: var(--text);
      align-self: start;
    }
    .opt-ai-result.is-active {
      border-color: #2563eb;
      box-shadow: 0 0 0 2px rgba(37,99,235,0.12);
      background: #eff6ff;
    }
    .opt-ai-result strong,
    .opt-ai-detail strong {
      display: block;
      font-size: 12px;
      line-height: 1.25;
    }
    .opt-ai-result span,
    .opt-ai-detail span {
      display: block;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.3;
      margin-top: 2px;
    }
    .opt-ai-detail {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .opt-mode-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      padding: 10px;
      border-top: 1px solid var(--border);
    }
    .opt-mode-card {
      min-width: 0;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      padding: 10px;
      display: grid;
      gap: 9px;
      align-content: start;
    }
    .opt-mode-card h5 {
      margin: 0;
      color: var(--text);
      font-size: 13px;
      line-height: 1.25;
      font-weight: 820;
    }
    .opt-mode-card p {
      margin: 3px 0 0;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .opt-mode-card .bt-mini-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      margin: 0;
    }
    .opt-assistant-limits {
      padding: 0;
      border: 0;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .opt-run-status {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: #f8fafc;
      padding: 9px;
      display: grid;
      gap: 7px;
    }
    .opt-run-status-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: wrap;
    }
    .opt-run-status-head strong {
      display: block;
      color: var(--text);
      font-size: 12px;
      line-height: 1.25;
    }
    .opt-run-status-head span {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.3;
    }
    .opt-run-status-head code {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.25;
      font-family: ui-monospace, Menlo, Consolas, monospace;
      word-break: break-all;
    }
    .opt-run-steps {
      display: grid;
      gap: 5px;
      font-size: 12px;
      color: var(--text-2);
    }
    .opt-run-step {
      display: flex;
      gap: 7px;
      align-items: flex-start;
      line-height: 1.3;
    }
    .opt-run-step::before {
      content: "";
      width: 7px;
      height: 7px;
      margin-top: 4px;
      border-radius: 50%;
      background: var(--border-strong);
      flex: 0 0 auto;
    }
    .opt-run-step.is-active {
      color: var(--text);
      font-weight: 700;
    }
    .opt-run-step.is-active::before {
      background: var(--blue);
      box-shadow: 0 0 0 3px rgba(37,99,235,0.14);
    }
    .opt-run-step.is-done::before {
      background: var(--green);
    }
    .opt-run-step.is-error {
      color: var(--red);
      font-weight: 700;
    }
    .opt-run-step.is-error::before {
      background: var(--red);
    }
    .opt-run-output {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.3;
      border-top: 1px solid var(--border);
      padding-top: 7px;
    }
    .opt-progress {
      display: grid;
      gap: 5px;
      border-top: 1px solid var(--border);
      padding-top: 7px;
    }
    .opt-progress-track {
      height: 8px;
      border-radius: 99px;
      background: #e2e8f0;
      overflow: hidden;
    }
    .opt-progress-fill {
      height: 100%;
      min-width: 6px;
      max-width: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, #2563eb, #16a34a);
      transition: width 180ms ease;
    }
    .opt-progress-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 6px 10px;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.3;
    }
    .ai-leg-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      margin-top: 10px;
      min-width: 0;
    }
    .ai-leg-grid.is-stacked {
      grid-template-columns: 1fr;
    }
    .ai-comparison-card {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: #fff;
      padding: 10px;
      margin-top: 10px;
      display: grid;
      gap: 10px;
      min-width: 0;
    }
    .ai-comparison-head {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      align-items: flex-start;
      flex-wrap: wrap;
      min-width: 0;
    }
    .ai-comparison-head h5 {
      margin: 0;
      font-size: 13px;
      line-height: 1.25;
    }
    .ai-comparison-head span,
    .ai-comparison-note {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.35;
    }
    .ai-comparison-legs {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      min-width: 0;
    }
    .ai-comparison-leg {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      padding: 8px;
      min-width: 0;
    }
    .ai-comparison-leg strong,
    .ai-comparison-leg span {
      display: block;
      line-height: 1.25;
    }
    .ai-comparison-leg strong {
      color: var(--text);
      font-size: 12px;
    }
    .ai-comparison-leg span {
      color: var(--text-2);
      font-size: 11px;
      margin-top: 2px;
    }
    .ai-leg-card {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: #fff;
      padding: 10px;
      min-width: 0;
      display: grid;
      gap: 10px;
    }
    .ai-leg-card > * {
      min-width: 0;
    }
    .ai-leg-head {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      align-items: flex-start;
      flex-wrap: wrap;
    }
    .ai-leg-head h5 {
      margin: 0;
      font-size: 13px;
      line-height: 1.25;
    }
    .ai-leg-head span {
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.3;
    }
    .ai-decision-table {
      max-height: 260px;
      overflow: auto;
      border: 1px solid var(--border);
      border-radius: 7px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
    }
    .ai-decision-table .bt-table {
      min-width: 920px;
    }
    .opt-ai-text {
      max-height: 190px;
      overflow: auto;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: #fff;
      color: var(--text-2);
      padding: 9px;
      font-size: 12px;
      line-height: 1.4;
      white-space: pre-wrap;
    }
    .opt-ai-runs {
      display: grid;
      gap: 6px;
    }
    .opt-ai-run {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
      align-items: center;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--surface-2);
      padding: 7px;
      font-size: 12px;
    }
    .snap-wrap { padding: 0 14px 13px; }
    .snap-wrap textarea {
      width: 100%;
      min-height: 92px;
      max-height: 220px;
      resize: vertical;
      font-family: ui-monospace, Menlo, Consolas, monospace;
      font-size: 11px;
      border: 1px solid var(--border);
      border-radius: 5px;
      padding: 8px;
      background: var(--surface-2);
      color: var(--text-2);
      outline: none;
    }
    .conn-bar {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 9px 12px;
      margin: 11px 14px 0;
      background: var(--surface-2);
      border: 1px solid var(--border);
      border-radius: 7px;
    }
    .conn-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--text-2); flex-shrink: 0; }
    .conn-dot.live { background: var(--green); box-shadow: 0 0 0 2.5px rgba(22,163,74,0.2); }
    .conn-name { font-size: 12px; font-weight: 650; }
    .conn-info { font-size: 11px; color: var(--text-2); margin-left: auto; }
    .live-runtime-strip {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin: 11px 14px 0;
      padding: 10px 12px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
    }
    .live-runtime-strip.active {
      border-color: #bbf7d0;
      background: #f0fdf4;
    }
    .live-runtime-strip.monitoring {
      border-color: #bfdbfe;
      background: #eff6ff;
    }
    .live-runtime-strip.offline {
      border-color: #fecaca;
      background: #fff5f5;
    }
    .live-runtime-strip strong {
      display: block;
      font-size: 13px;
      line-height: 1.2;
    }
    .live-runtime-strip small {
      display: block;
      margin-top: 2px;
      color: var(--text-2);
      font-size: 11px;
    }
    .live-primary-actions {
      border-bottom: 1px solid var(--border);
    }
    .live-position-control {
      display: grid;
      grid-template-columns: minmax(190px, 1.15fr) minmax(260px, 2fr) auto;
      gap: 10px;
      align-items: center;
      padding: 11px 14px;
      border-bottom: 1px solid var(--border);
      background: #fff7fb;
    }
    .live-position-control.empty {
      grid-template-columns: 1fr auto;
      background: var(--surface-2);
    }
    .live-position-control strong {
      display: block;
      font-size: 13px;
      line-height: 1.2;
      overflow-wrap: anywhere;
    }
    .live-position-control small {
      display: block;
      margin-top: 2px;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.3;
    }
    .position-close-main {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }
    .position-close-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(76px, 1fr));
      gap: 5px;
      min-width: 0;
    }
    .position-close-grid span {
      min-width: 0;
      padding: 5px 7px;
      border: 1px solid var(--border);
      border-radius: 5px;
      background: var(--surface);
      color: var(--text);
      font-size: 12px;
      line-height: 1.2;
      font-weight: 720;
      font-variant-numeric: tabular-nums;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .position-close-grid b {
      display: block;
      color: var(--text-2);
      font-size: 9px;
      line-height: 1.1;
      text-transform: uppercase;
      letter-spacing: 0.35px;
      margin-bottom: 2px;
    }
    .position-close-grid em {
      font-style: normal;
      font-weight: 820;
    }
    .position-close-grid .g { color: var(--green); }
    .position-close-grid .r { color: var(--red); }
    .positions-wrap { padding: 10px 14px 4px; }
    .ops-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      padding: 11px 14px;
      border-bottom: 1px solid var(--border);
    }
    .btn.danger {
      border-color: transparent;
      background: #dc2626;
      color: #fff;
      box-shadow: 0 4px 12px rgba(220,38,38,0.22);
    }
    .btn.warn {
      border-color: #f4d48a;
      background: #fff7e6;
      color: #9a5b00;
    }
    .danger-zone {
      margin: 10px 14px 13px;
      padding: 10px;
      border: 1px solid #fecaca;
      border-radius: 7px;
      background: #fff5f5;
    }
    .danger-zone h4 {
      font-size: 12px;
      color: #b91c1c;
      margin-bottom: 8px;
    }
    .ops-list {
      display: grid;
      gap: 6px;
      padding: 0 14px 12px;
    }
    .ops-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
      align-items: center;
      padding: 8px 10px;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--surface-2);
      font-size: 12px;
    }
    .ops-row strong { font-size: 12px; }
    .ops-row small { display: block; color: var(--text-2); margin-top: 1px; }
    .pos-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
    .live-log {
      display: grid;
      gap: 5px;
      padding: 0 14px 12px;
      max-height: 170px;
      overflow: auto;
    }
    .live-log.full {
      max-height: 520px;
      padding-top: 12px;
    }
    .live-log div {
      padding: 6px 8px;
      border: 1px solid var(--border);
      border-radius: 5px;
      background: var(--surface-2);
      font-size: 11px;
      color: var(--text-2);
      line-height: 1.35;
    }
    .live-log div.ok { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
    .live-log div.warn { border-color: #fde68a; background: #fffbeb; color: #92400e; }
    .live-log div.error { border-color: #fecaca; background: #fff5f5; color: #991b1b; }
    .live-log b { color: var(--text); margin-right: 5px; }
    .live-section-body {
      padding: 11px 14px 12px;
      display: grid;
      gap: 9px;
    }
    .live-tab-card { overflow: hidden; min-width: 0; }
    .live-tabs {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
      gap: 6px;
      padding: 9px;
      border-bottom: 1px solid var(--border);
      background: var(--surface-2);
    }
    .live-tab-btn {
      height: 32px;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--surface);
      color: var(--text-2);
      font-size: 12px;
      font-weight: 760;
      cursor: pointer;
    }
    .live-tab-btn:hover { border-color: var(--border-strong); color: var(--text); }
    .live-tab-btn.active {
      border-color: rgba(230,95,145,0.38);
      background: #fff0f6;
      color: var(--accent);
      box-shadow: 0 1px 4px rgba(15,23,42,0.06);
    }
    #btTabs .live-tab-btn {
      height: auto;
      min-height: 40px;
      padding: 6px;
      line-height: 1.15;
      white-space: normal;
    }
    .live-tab-pane { display: none; }
    .live-tab-pane.active { display: block; }
    .live-tab-pane > .card-head { border-top: 0; }
    .live-section-note {
      margin: 0;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .live-split {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 7px;
    }
    .live-mini {
      padding: 9px 10px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      min-width: 0;
    }
    .live-mini h4 {
      font-size: 11px;
      font-weight: 780;
      color: var(--text-2);
      text-transform: uppercase;
      letter-spacing: 0.35px;
      margin-bottom: 4px;
    }
    .live-mini strong {
      display: block;
      font-size: 14px;
      line-height: 1.15;
      overflow-wrap: anywhere;
    }
    .live-mini small {
      display: block;
      margin-top: 3px;
      color: var(--text-2);
      font-size: 11px;
      line-height: 1.3;
    }
    .position-map {
      margin-top: 8px;
      padding: 8px 9px 7px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: #fbfcff;
      max-width: 100%;
      overflow: hidden;
    }
    .position-map.empty {
      margin: 0 0 2px;
      background: var(--surface-2);
      border-style: dashed;
    }
    .position-map-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      color: var(--text-2);
      font-size: 11px;
      font-weight: 700;
    }
    .position-map-head span:last-child { font-variant-numeric: tabular-nums; }
    .position-map-head .g { color: var(--green); }
    .position-map-head .r { color: var(--red); }
    .price-rail {
      position: relative;
      height: 50px;
      margin: 7px 0 3px;
      overflow: hidden;
    }
    .price-rail::before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: 27px;
      height: 7px;
      border-radius: 99px;
      background: linear-gradient(90deg, #fee2e2 0 var(--entry, 50%), #dcfce7 var(--entry, 50%) 100%);
      border: 1px solid rgba(15,23,42,0.08);
    }
    .price-rail.short::before {
      background: linear-gradient(90deg, #dcfce7 0 var(--entry, 50%), #fee2e2 var(--entry, 50%) 100%);
    }
    .price-rail.empty::before {
      background: linear-gradient(90deg, #f1f5f9, #e2e8f0);
    }
    .price-marker {
      position: absolute;
      top: 4px;
      transform: translateX(-50%);
      min-width: 24px;
      text-align: center;
      color: var(--text-2);
      font-size: 10px;
      line-height: 1.1;
      pointer-events: none;
    }
    .price-marker i {
      display: block;
      width: 2px;
      height: 25px;
      margin: 8px auto 0;
      border-radius: 99px;
      background: var(--border-strong);
    }
    .price-marker b,
    .price-marker em {
      display: block;
      white-space: nowrap;
      font-style: normal;
    }
    .price-marker b { display: none; }
    .price-marker em { display: none; }
    .price-marker.entry { color: #334155; }
    .price-marker.entry i { background: #334155; }
    .price-marker.current {
      top: 0;
      color: var(--accent);
      font-weight: 800;
      z-index: 2;
    }
    .price-marker.current i {
      height: 38px;
      width: 3px;
      margin-top: 8px;
      background: var(--accent);
      box-shadow: 0 0 0 3px rgba(230,95,145,0.14);
    }
    .price-marker.sl,
    .price-marker.liq { color: var(--red); }
    .price-marker.sl i,
    .price-marker.liq i { background: var(--red); }
    .price-marker.tp { color: var(--green); }
    .price-marker.tp i { background: var(--green); }
    .price-marker.trail { color: #b45309; }
    .price-marker.trail i { background: #f59e0b; }
    .price-marker.peak { color: #2563eb; }
    .price-marker.peak i { background: #2563eb; }
    .position-map.empty .price-marker { color: var(--text-2); opacity: 0.75; }
    .position-map.empty .price-marker i { background: var(--border-strong); }
    .map-levels {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
      margin-top: 4px;
    }
    .map-chip {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 2px 6px;
      border: 1px solid var(--border);
      border-radius: 99px;
      color: var(--text-2);
      font-size: 10px;
      background: var(--surface-2);
      max-width: 150px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-variant-numeric: tabular-nums;
    }
    .map-chip b { color: var(--text); }
    .pos-action-note {
      display: block;
      color: var(--text-2);
      font-size: 10px;
      line-height: 1.2;
      text-align: right;
      max-width: 100px;
    }
    .live-history-list {
      display: grid;
      gap: 6px;
      padding: 0 14px 12px;
    }
    .live-table-wrap {
      margin: 0 14px 12px;
      border: 1px solid var(--border);
      border-radius: 7px;
      overflow: auto;
      max-height: 520px;
      background: var(--surface);
    }
    .live-table {
      width: 100%;
      min-width: 980px;
      border-collapse: collapse;
      font-size: 11px;
      font-variant-numeric: tabular-nums;
    }
    .live-table th,
    .live-table td {
      padding: 7px 8px;
      border-bottom: 1px solid var(--border);
      text-align: left;
      vertical-align: top;
      white-space: nowrap;
    }
    .live-table th {
      position: sticky;
      top: 0;
      z-index: 1;
      background: var(--surface-2);
      color: var(--text-2);
      font-size: 10px;
      text-transform: uppercase;
      letter-spacing: 0.35px;
    }
    .live-table td.pos { color: var(--green); font-weight: 760; }
    .live-table td.neg { color: var(--red); font-weight: 760; }
    .live-settings-summary .live-section-body {
      padding: 10px;
    }
    .history-row {
      display: grid;
      grid-template-columns: minmax(126px, 0.42fr) minmax(0, 1fr) auto;
      gap: 8px;
      align-items: center;
      padding: 8px 10px;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--surface-2);
      font-size: 12px;
    }
    .history-time {
      color: var(--text-2);
      font-size: 11px;
      font-variant-numeric: tabular-nums;
    }
    .history-time span {
      display: block;
      line-height: 1.35;
    }
    .history-time b {
      color: var(--text);
      font-weight: 700;
    }
    .history-main {
      min-width: 0;
    }
    .history-main strong {
      display: block;
      font-size: 12px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .history-main small {
      display: block;
      margin-top: 2px;
      color: var(--text-2);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .history-pnl {
      text-align: right;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
    }
    .history-pnl.pos { color: var(--green); }
    .history-pnl.neg { color: var(--red); }
    .history-pnl small {
      display: block;
      margin-top: 2px;
      color: var(--text-2);
      font-size: 10px;
      font-weight: 650;
    }

    .strat-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 9px;
      padding: 13px 14px;
    }
    .strat-card {
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 13px;
      background: var(--surface-2);
      cursor: pointer;
      transition: border-color 110ms ease, background 110ms ease;
    }
    .strat-card:hover { border-color: var(--accent); }
    .strat-card.active { border-color: rgba(230,95,145,0.65); background: #fff0f6; }
    .strat-card h4 { font-size: 13px; font-weight: 760; margin-bottom: 4px; }
    .strat-card p { font-size: 12px; color: var(--text-2); }
    .strat-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }
    .tag { padding: 2px 6px; border-radius: 99px; background: #edf2f9; color: #40516b; font-size: 10px; font-weight: 760; }

    .users-layout {
      display: grid;
      grid-template-columns: 260px 1fr;
      gap: 11px;
      align-items: start;
    }
    .user-head-actions { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
    .user-list-items { display: flex; flex-direction: column; gap: 4px; padding: 10px; }
    .user-subhead {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 4px;
    }
    .user-subhead label { margin-bottom: 0; }
    .inline-actions {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 6px;
      flex-wrap: wrap;
    }
    .uli {
      display: flex;
      flex-direction: column;
      padding: 9px 11px;
      border-radius: 6px;
      border: 1px solid var(--border);
      background: var(--surface-2);
      cursor: pointer;
      width: 100%;
      text-align: left;
    }
    .uli.active { border-color: rgba(37,99,235,0.42); background: #eaf1ff; }
    .uli-name { font-size: 13px; font-weight: 760; }
    .uli-meta { font-size: 11px; color: var(--text-2); margin-top: 2px; }
    .uli-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
    .user-form { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; padding: 13px 14px; }
    .user-form .full { grid-column: 1 / -1; }
    .access-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
      gap: 7px;
      padding: 10px;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
    }
    .bybit-account-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 8px;
    }
    .bybit-account-row {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      padding: 10px;
    }
    .bybit-account-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 9px;
    }
    .bybit-account-title {
      display: grid;
      gap: 2px;
      min-width: 0;
    }
    .bybit-account-title strong {
      font-size: 13px;
      font-weight: 760;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .bybit-account-title small {
      color: var(--text-2);
      font-size: 11px;
      font-weight: 560;
    }
    .bybit-account-actions {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .bybit-account-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 8px;
    }
    .bybit-account-grid .wide { grid-column: span 2; }
    .bybit-credentials-actions {
      grid-column: span 2;
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.25;
    }
    .live-account-card {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      border-top: 1px solid var(--border);
      padding: 10px 14px;
      background: var(--surface-2);
      min-width: 0;
    }
    .live-account-card > div { min-width: 0; }
    .live-account-card strong {
      display: block;
      font-size: 13px;
      font-weight: 760;
      overflow-wrap: anywhere;
    }
    .live-account-card small {
      display: block;
      margin-top: 2px;
      color: var(--text-2);
      font-size: 11px;
      overflow-wrap: anywhere;
    }
    .live-account-sessions {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
      padding: 9px 14px 12px;
      border-top: 1px solid var(--border);
      background: var(--surface);
    }
    .form-error {
      margin: 0 14px 13px;
      padding: 9px 10px;
      border: 1px solid #fecaca;
      border-radius: 6px;
      background: #fff5f5;
      color: #b91c1c;
      font-size: 12px;
      font-weight: 650;
    }
    .entity-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
      gap: 9px;
      padding: 13px 14px;
    }
    .entity-card {
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--surface-2);
      padding: 13px;
    }
    .entity-card h4 { font-size: 13px; margin-bottom: 5px; }
    .entity-card p { font-size: 12px; color: var(--text-2); }
    .preset-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 14px;
      border-bottom: 1px solid var(--border);
      font-size: 12px;
    }
    .preset-row:last-child { border-bottom: none; }
    .preset-key { display: grid; gap: 2px; font-weight: 650; flex: 1; min-width: 0; }
    .preset-key small { color: var(--text-2); font-weight: 520; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .preset-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 6px;
      flex-wrap: wrap;
    }
    .preset-actions small {
      color: var(--text-2);
      font-weight: 620;
      margin-right: 2px;
    }
    .empty { padding: 16px 14px; color: var(--text-2); font-size: 13px; }

    .hybrid-table { width: 100%; border-collapse: collapse; min-width: 780px; }
    .table-wrap { overflow-x: auto; }
    .news-layout {
      display: grid;
      grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
      gap: 10px;
      align-items: start;
    }
    .news-type-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
      gap: 8px;
    }
    .news-type-card {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      padding: 9px;
      min-width: 0;
    }
    .news-type-card strong {
      display: block;
      color: var(--text);
      font-size: 13px;
      margin-bottom: 3px;
    }
    .news-type-card span {
      display: block;
      color: var(--text-2);
      font-size: 12px;
    }
    .news-actions {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      align-items: center;
    }
    th, td {
      padding: 10px;
      border-bottom: 1px solid var(--border);
      text-align: left;
      vertical-align: top;
      font-size: 12px;
    }
    th { color: var(--text-2); background: var(--surface-2); font-size: 11px; text-transform: uppercase; letter-spacing: 0.4px; }
    details.inline-details {
      margin-top: 9px;
      border: 1px solid var(--border);
      border-radius: 7px;
      overflow: hidden;
      background: var(--surface);
    }
    details.inline-details summary {
      cursor: pointer;
      padding: 10px 12px;
      font-size: 12px;
      font-weight: 720;
      color: var(--text);
      background: var(--surface-2);
    }
    .settings-intro,
    .hedge-intro {
      display: grid;
      gap: 5px;
      margin-bottom: 10px;
    }
    .settings-note,
    .hedge-note {
      color: var(--text-2);
      font-size: 12px;
      line-height: 1.35;
    }
    .settings-sections,
    .hedge-sections {
      display: grid;
      gap: 10px;
      margin-top: 10px;
    }
    .settings-section,
    .hedge-section {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface-2);
      padding: 10px;
    }
    .settings-section-head,
    .hedge-section-head {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 8px;
    }
    .settings-section-head h4,
    .hedge-section-head h4 {
      margin: 0;
      color: var(--text);
      font-size: 13px;
      line-height: 1.25;
      font-weight: 820;
      letter-spacing: 0;
    }
    .settings-section .field label,
    .hedge-section .field label {
      white-space: normal;
      line-height: 1.25;
    }
    .settings-section .chk span,
    .hedge-section .chk span {
      line-height: 1.25;
    }
    .settings-section-head span,
    .hedge-section-head span {
      color: var(--text-2);
      font-size: 11px;
      font-weight: 720;
    }
    .settings-stage-grid,
    .hedge-stage-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 9px;
    }
    .settings-stage,
    .hedge-stage {
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      padding: 8px;
      min-width: 0;
    }
    .settings-stage h5,
    .hedge-stage h5 {
      margin: 0 0 7px;
      font-size: 12px;
      font-weight: 820;
      color: var(--text);
    }
    .hedge-subsection-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 9px;
    }
    .hedge-subsection {
      min-width: 0;
      border: 1px solid var(--border);
      border-radius: 7px;
      background: var(--surface);
      padding: 9px;
    }
    .hedge-subsection-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 7px;
    }
    .hedge-subsection h5 {
      margin: 0;
      color: var(--text);
      font-size: 12px;
      line-height: 1.25;
      font-weight: 820;
    }
    .hedge-subsection-meta {
      margin: 2px 0 0;
      color: var(--text-2);
      font-size: 11px;
      font-weight: 650;
      line-height: 1.3;
    }
    .hedge-subsection-toggle .chk {
      margin: 0;
      min-height: 30px;
      white-space: nowrap;
      background: var(--surface-2);
    }

    ::-webkit-scrollbar { width: 4px; height: 4px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 99px; }

    @media (max-width: 1080px) {
      .split-layout { grid-template-columns: 1fr; }
      .split-layout.live-settings-collapsed { grid-template-columns: 1fr; }
      .split-layout.live-layout .analytics-col { order: -1; }
      .settings-col.live-settings-collapsed {
        position: static;
        top: auto;
      }
      .split-layout.optimization-layout { grid-template-columns: 1fr; }
      .split-layout.optimization-layout .analytics-col { order: -1; }
      .optimization-layout #optPanel > .card { max-height: none; }
      .optimization-layout .opt-panel-body { overflow: visible; }
    }
    @media (max-width: 760px) {
      .app { grid-template-columns: 1fr; }
      .main { grid-column: 1; min-width: 0; }
      .sidebar {
        position: fixed;
        left: calc(-1 * var(--sb-w));
        top: 0;
        height: 100%;
        z-index: 200;
        transition: left 180ms ease;
        width: var(--sb-w);
      }
      .sidebar.open { left: 0; }
      .menu-btn { display: flex; }
      .topbar { align-items: flex-start; flex-wrap: wrap; height: auto; padding: 10px 14px; gap: 8px; }
      .mode-bar { order: 3; width: 100%; padding: 0; flex-wrap: wrap; }
      .topbar-right { margin-left: auto; }
    }
    @media (max-width: 640px) {
      .page-content { padding: 10px; }
      .frow, .frow.cols2, .frow.cols3, .frow.cols4, .users-layout, .user-form, .bybit-account-grid, .kpi-grid, .bt-metrics-grid, .bt-mini-grid, .live-split, .strategy-grid, .opt-brief, .opt-impact, .opt-why, .opt-baseline-grid, .opt-space-summary, .opt-queue-row, .opt-mode-grid, .opt-assistant-limits {
        grid-template-columns: 1fr;
      }
      .bybit-account-grid .wide, .bybit-credentials-actions { grid-column: auto; }
      .opt-space-head { display: grid; }
      .opt-space-tools { justify-content: flex-start; }
      .opt-ai-layout { grid-template-columns: 1fr; }
      .advisor-tabs { grid-template-columns: 1fr 1fr; }
      .advisor-run-grid { grid-template-columns: 1fr; }
      .opt-proposal-toolbar { grid-template-columns: 1fr; align-items: stretch; }
      .bt-focus-controls, .bt-focus-body { grid-template-columns: 1fr; }
      .bt-focus-chart { border-right: 0; border-bottom: 1px solid var(--border); }
      .bt-focus-svg { min-height: 280px; aspect-ratio: 16 / 10; }
      .settings-stage-grid, .hedge-stage-grid, .hedge-subsection-grid { grid-template-columns: 1fr; }
      .news-layout { grid-template-columns: 1fr; }
      .ai-leg-grid { grid-template-columns: 1fr; }
      .ai-comparison-legs { grid-template-columns: 1fr; }
      .mode-lbl { display: none; }
      .status-dot { display: none; }
      .trade-row { grid-template-columns: 48px 42px 1fr 52px; }
      .trade-row span:nth-child(4) { display: none; }
      .ops-row { grid-template-columns: 1fr; }
      .pos-actions { justify-content: flex-start; }
      .live-position-control,
      .live-position-control.empty {
        grid-template-columns: 1fr;
        align-items: stretch;
      }
      .position-close-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .history-row { grid-template-columns: 1fr; }
      .history-time, .history-pnl { text-align: left; }
      .live-tabs { grid-template-columns: 1fr 1fr; }
      .live-settings-summary .live-section-body {
        grid-template-columns: 1fr;
      }
      .live-runtime-strip,
      .conn-bar,
      .live-account-card {
        align-items: flex-start;
        flex-direction: column;
      }
      .conn-info {
        margin-left: 0;
        max-width: 100%;
        overflow-wrap: anywhere;
      }
      .status-pill {
        max-width: 100%;
        white-space: normal;
      }
      .live-account-card .status-pill {
        align-self: flex-start;
      }
    }