crypto_okx/lib/common/static/instance_theme.css

/* 实例页手机端:与中控一致,桌面专属区块隐藏;下载仅电脑端 */
:root,
html[data-theme="dark"] {
  --inst-label: #8892b0;
  --inst-muted: #9aa3bf;
  --inst-text: #e8ecff;
  --inst-nav-idle: #8fc8ff;
  --inst-nav-active-fg: #dbe4ff;
}

html[data-theme="light"] {
  --inst-label: #4a6078;
  --inst-muted: #5a6f85;
  --inst-text: #142232;
  --inst-nav-idle: #006e9a;
  --inst-nav-active-fg: #004d6e;
}

@media (max-width: 720px) {
  .instance-desktop-only {
    display: none !important;
  }

  a[href^="/export/"] {
    display: none !important;
  }

  button[onclick*="exportDailyBundleMd"],
  button[onclick*="exportWeeklyBundleMd"] {
    display: none !important;
  }

  body {
    padding: 8px 10px !important;
  }

  .header h1 {
    font-size: 1rem !important;
    line-height: 1.35;
  }

  .header-row {
    flex-wrap: wrap;
    gap: 8px;
  }

  .container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible !important;
  }

  .top-nav {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    overflow: visible !important;
    width: 100%;
    max-width: 100%;
    gap: 8px !important;
    margin-bottom: 12px !important;
    padding: 2px 2px 6px;
  }

  .top-nav-links {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto !important;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    gap: 6px;
    scroll-padding-inline: 10px;
    touch-action: pan-x;
    min-width: 0;
  }

  .top-nav-links::-webkit-scrollbar {
    display: none;
  }

  .top-nav-spot-tickers {
    justify-self: stretch;
    align-self: stretch;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
  }

  .top-nav::-webkit-scrollbar {
    display: none;
  }

  .top-nav a {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 8px 12px;
    font-size: 0.78rem;
  }

  .list-window-bar {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  .instance-toolbar-row {
    flex-direction: column;
    align-items: stretch;
  }

  .instance-header-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .instance-header-toolbar-filter {
    flex-wrap: wrap;
  }

  .instance-header-toolbar-end {
    width: 100%;
    justify-content: flex-end;
  }

  .instance-header-theme {
    align-self: auto;
  }

  .instance-header-stats {
    flex-wrap: nowrap;
  }

  .stat-strip-inner {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid {
    gap: 10px;
  }

  .card {
    padding: 12px;
  }

  .form-grid:not(.journal-form-row1):not(.journal-form-row2) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

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

  .stat-box {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dual-panel-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .records-card .table-wrap {
    display: none !important;
  }

  .mobile-record-list {
    display: flex !important;
    flex-direction: column;
    gap: 6px;
  }

  .mobile-record-row-wrap {
    display: flex;
    align-items: stretch;
    gap: 6px;
  }

  .mobile-record-row {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) auto minmax(0, 0.9fr);
    align-items: center;
    gap: 8px;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid rgba(120, 140, 200, 0.28);
    border-radius: 8px;
    background: rgba(18, 24, 42, 0.65);
    color: #e8ecff;
    font-size: 0.82rem;
    text-align: left;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .mobile-record-row:active {
    background: rgba(30, 42, 72, 0.85);
  }

  .mrr-symbol {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mrr-dir {
    justify-self: center;
  }

  .mrr-dir .badge {
    font-size: 0.72rem;
    padding: 2px 8px;
  }

  .mrr-pnl {
    justify-self: end;
    font-weight: 600;
    white-space: nowrap;
  }

  .mrr-muted {
    color: #8892b0;
    font-size: 0.78rem;
  }

  .mobile-record-del {
    flex: 0 0 36px;
    width: 36px;
    border: 1px solid rgba(200, 80, 80, 0.35);
    border-radius: 8px;
    background: rgba(80, 24, 24, 0.35);
    color: #ff9a9a;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
  }

  #journal-list .entry {
    display: none;
  }

  #journal-list .journal-empty-msg {
    color: #8892b0;
    font-size: 0.82rem;
    padding: 8px 4px;
  }

  #detailActions.detail-actions,
  .detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 14px 14px;
    border-top: 1px solid rgba(120, 140, 200, 0.2);
  }

  .detail-actions-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
  }

  .detail-actions .table-del,
  .detail-actions button {
    font-size: 0.78rem !important;
    padding: 6px 10px !important;
  }

  .detail-modal .panel-body.trade-record-detail-wrap {
    white-space: normal;
  }

  .trd-row {
    grid-template-columns: 76px minmax(0, 1fr);
  }
}

@media (min-width: 721px) {
  .mobile-record-list {
    display: none !important;
  }
}

.detail-modal .panel-body.trade-record-detail-wrap {
  white-space: normal;
}

.trade-record-detail {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.trd-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px 12px;
  align-items: center;
  line-height: 1.45;
}

.trd-label {
  color: #8892b0;
  font-size: 0.82rem;
}

.trd-value {
  color: #e5e9ff;
  font-size: 0.86rem;
  text-align: left;
  min-width: 0;
}

.trd-value .badge {
  display: inline-block;
  vertical-align: middle;
}

/* 手机竖屏(含大屏手机) */
@media (max-width: 900px) and (orientation: portrait) {
  .grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .dual-panel-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .form-grid:not(.journal-form-row1):not(.journal-form-row2) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* 平板横屏:双列布局,充分利用宽屏 */
@media (min-width: 721px) and (max-width: 1200px) and (orientation: landscape) {
  body {
    padding: 10px 14px !important;
  }

  .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px;
  }

  .dual-panel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .form-grid:not(.journal-form-row1):not(.journal-form-row2) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

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

  .stat-box {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .records-card,
  .review-card {
    grid-column: 1 / -1;
  }
}

html[data-theme="light"] {
  background: #c8d4de;
  color-scheme: light;
}

html[data-theme="light"] body {
  background: #c8d4de !important;
  color: #142232 !important;
}

html[data-theme="light"] .header h1 {
  color: #142232 !important;
}

html[data-theme="light"] .exchange-tag {
  color: #087a50 !important;
  background: rgba(10, 143, 92, 0.12) !important;
  border-color: rgba(10, 143, 92, 0.35) !important;
}

html[data-theme="light"] .top-nav a {
  background: #fff !important;
  color: var(--inst-nav-idle) !important;
  border-color: rgba(0, 95, 140, 0.22) !important;
}

html[data-theme="light"] .top-nav a:hover,
html[data-theme="light"] .embed-top-nav a:hover,
html[data-theme="light"] .strategy-subnav a:hover {
  background: rgba(0, 110, 154, 0.1) !important;
  color: var(--inst-nav-active-fg) !important;
}

html[data-theme="light"] .top-nav a.active,
html[data-theme="light"] .embed-top-nav a.active {
  background: rgba(0, 110, 154, 0.12) !important;
  color: var(--inst-nav-active-fg) !important;
  border: 1px solid rgba(0, 95, 140, 0.28) !important;
  font-weight: 600;
}

html[data-theme="light"] .stat-item,
html[data-theme="light"] .card,
html[data-theme="light"] .meta-item,
html[data-theme="light"] .list-item,
html[data-theme="light"] .journal-card {
  background: #fff !important;
  border-color: #9eb0c4 !important;
  box-shadow: 0 1px 3px rgba(20, 34, 50, 0.06);
}

html[data-theme="light"] .stat-item .label,
html[data-theme="light"] .status,
html[data-theme="light"] .rule-tip,
html[data-theme="light"] .muted {
  color: #3a5068 !important;
}

html[data-theme="light"] .stat-item .value,
html[data-theme="light"] .card h2 {
  color: #142232 !important;
}

html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  background: #fff !important;
  color: #142232 !important;
  border-color: #9eb0c4 !important;
}

html[data-theme="light"] input[type="checkbox"],
html[data-theme="light"] input[type="radio"] {
  accent-color: #007aa8;
  background: transparent !important;
  border: none !important;
  width: 1rem;
  height: 1rem;
  cursor: pointer;
}

html[data-theme="light"] .mood-grid {
  color: #1a2838 !important;
}

html[data-theme="light"] .mood-grid label {
  color: #1a2838 !important;
}

/* 复盘区次要按钮(内联 #1f3a5a):浅底深字,避免白字看不见 */
html[data-theme="light"] .journal-card .form-row button[type="button"],
html[data-theme="light"] .review-card .form-row button[type="button"][onclick*="export"],
html[data-theme="light"] .review-card-fs-btn,
html[data-theme="light"] .ai-result-toolbar .btn-fs {
  background: #e8eef5 !important;
  background-image: none !important;
  color: #006e9a !important;
  border: 1px solid rgba(0, 95, 140, 0.28) !important;
}

html[data-theme="light"] .journal-card button[type="submit"],
html[data-theme="light"] .review-card .form-row button[onclick="genDaily()"],
html[data-theme="light"] .review-card .form-row button[onclick="genWeekly()"] {
  background: linear-gradient(90deg, #007aa8, #5b4fc7) !important;
  color: #fff !important;
  border: none !important;
}

html[data-theme="light"] .flash {
  background: rgba(0, 110, 154, 0.1) !important;
  color: #006e9a !important;
  border-color: rgba(0, 95, 140, 0.22) !important;
}

html[data-theme="light"] th {
  color: #334155 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] td {
  color: #142232 !important;
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .ai-result,
html[data-theme="light"] .login-box {
  background: #fff !important;
  border-color: #b8c8d8 !important;
  color: #142232 !important;
}

html[data-theme="light"] #chart-wrap {
  background: #f0f4f9 !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .btn {
  background: #fff !important;
  color: #006e9a !important;
  border-color: rgba(0, 95, 140, 0.22) !important;
}

html[data-theme="light"] .btn:hover {
  background: #eef3f8 !important;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border-radius: 8px;
  border: 1px solid #304164;
  background: #151a2a;
}

html[data-theme="light"] .theme-toggle {
  background: #fff;
  border-color: #b8c8d8;
}

.theme-toggle.is-hub-linked {
  display: none !important;
}

.theme-toggle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 30px;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: #8fc8ff;
  cursor: pointer;
}

html[data-theme="light"] .theme-toggle-btn {
  color: #334155;
}

.theme-toggle-btn.is-active {
  color: #dbe4ff;
  background: rgba(79, 121, 255, 0.2);
  box-shadow: inset 0 0 0 1px #304164;
}

html[data-theme="light"] .theme-toggle-btn.is-active {
  color: #004d6e;
  background: rgba(0, 110, 154, 0.16);
  box-shadow: inset 0 0 0 1px #9eb0c4;
}

.header-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 6px;
}

/* ── 统一顶栏面板:状态/筛选 + 统计条 ── */
.instance-header-panel {
  margin-top: 18px;
  margin-bottom: 12px;
  padding: 10px 14px;
}

.instance-header-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
}

.instance-toolbar-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
}

.instance-header-toolbar-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  flex: 1 1 200px;
  min-width: 0;
  font-size: 0.82rem;
}

.instance-header-toolbar-end {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex: 0 1 auto;
  margin-left: auto;
}

.instance-header-toolbar-filter label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--inst-label);
  margin: 0;
}

.instance-header-theme {
  flex: 0 0 auto;
}

.list-window-label {
  color: var(--inst-text);
  font-size: 0.82rem;
  white-space: nowrap;
}

.list-window-hint {
  color: var(--inst-muted);
  font-size: 0.72rem;
  white-space: nowrap;
}

.list-window-apply {
  padding: 5px 12px;
  font-size: 0.82rem;
}

/* 导航右侧 BTC/ETH 现货(相对北京 08:00 开盘) */
.top-nav-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  min-width: 0;
}

.top-nav-spot-tickers {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  font-variant-numeric: tabular-nums;
}

.nav-spot-row {
  display: grid;
  grid-template-columns: 3px 18px minmax(4.6em, auto) minmax(5em, auto) minmax(3.6em, auto) minmax(3.8em, auto);
  align-items: center;
  column-gap: 7px;
  padding: 3px 9px 3px 5px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: rgba(16, 22, 36, 0.72);
  line-height: 1.2;
  white-space: nowrap;
  font-size: 0.88rem;
}

.nav-spot-row:hover {
  border-color: #3a4568;
}

.nav-spot-ribbon {
  width: 3px;
  height: 16px;
  border-radius: 1px 2px 2px 1px;
  background: #e24b6a;
  justify-self: center;
}

.nav-spot-icon {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: #fff;
}

.nav-spot-icon--eth {
  background: #627eea;
}

.nav-spot-icon--btc {
  background: #f2a900;
  color: #1a1200;
}

.nav-spot-sym {
  color: var(--inst-text, #e8ecff);
  font-weight: 600;
  letter-spacing: 0.01em;
}

.nav-spot-last,
.nav-spot-chg,
.nav-spot-pct {
  text-align: right;
  font-weight: 600;
}

.nav-spot--up .nav-spot-last,
.nav-spot--up .nav-spot-chg,
.nav-spot--up .nav-spot-pct {
  color: #2dd4a8;
}

.nav-spot--down .nav-spot-last,
.nav-spot--down .nav-spot-chg,
.nav-spot--down .nav-spot-pct {
  color: #ff6b7a;
}

.nav-spot--flat .nav-spot-last,
.nav-spot--flat .nav-spot-chg,
.nav-spot--flat .nav-spot-pct {
  color: #9aa3bf;
}

html[data-theme="light"] .nav-spot-row {
  background: rgba(255, 255, 255, 0.85);
  border-color: #d5e0ec;
}

html[data-theme="light"] .nav-spot-row:hover {
  border-color: #9bb4cc;
}

html[data-theme="light"] .nav-spot--up .nav-spot-last,
html[data-theme="light"] .nav-spot--up .nav-spot-chg,
html[data-theme="light"] .nav-spot--up .nav-spot-pct {
  color: #0a8f6c;
}

html[data-theme="light"] .nav-spot--down .nav-spot-last,
html[data-theme="light"] .nav-spot--down .nav-spot-chg,
html[data-theme="light"] .nav-spot--down .nav-spot-pct {
  color: #d12b3a;
}

@media (max-width: 1100px) {
  .nav-spot-row {
    grid-template-columns: 3px 16px minmax(4em, auto) minmax(4.2em, auto) minmax(3.2em, auto) minmax(3.4em, auto);
    column-gap: 5px;
    font-size: 0.8rem;
    padding: 2px 7px 2px 4px;
  }
}

.instance-header-stats-wrap {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border-soft, #2a3150);
}

.instance-header-stats {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 0;
  padding: 2px 0 0;
  min-height: 56px;
  align-items: stretch;
  scrollbar-width: thin;
}

.instance-header-stats--options .stat-strip-item {
  min-width: 72px;
}

.stat-strip-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  min-width: 64px;
  padding: 4px 8px;
  border-right: 1px solid var(--border-soft, #2a3150);
  text-align: center;
}

.stat-strip-item:first-child {
  padding-left: 4px;
}

.stat-strip-item:last-child {
  border-right: none;
  padding-right: 4px;
}

.stat-strip-item .label {
  font-size: 0.72rem;
  color: var(--inst-label);
  margin-bottom: 6px;
  white-space: nowrap;
}

.stat-strip-item .value {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--inst-text);
  line-height: 1.3;
  white-space: nowrap;
}

.stat-strip-item .value[data-funds-field="current-capital"],
.inst-phone-chip b[data-funds-field="current-capital"] {
  white-space: pre-line;
  line-height: 1.25;
  text-align: center;
}

.stat-strip-item--primary .label {
  font-size: 0.76rem;
}

.stat-strip-item--primary .value {
  font-size: 1.02rem;
  font-weight: 700;
}

.stat-strip-item--pnl .value.pnl-pos {
  color: #3dd68c;
}

.stat-strip-item--pnl .value.pnl-neg {
  color: #ff6b7a;
}

@media (max-width: 1100px) {
  .instance-header-stats {
    flex-wrap: nowrap;
  }

  .stat-strip-item {
    flex: 0 0 auto;
    min-width: 72px;
    border-right: none;
    padding: 6px 8px;
    border-right: 1px solid var(--border-soft, #2a3150);
  }

  .stat-strip-item:first-child {
    padding-left: 6px;
  }
}

/* 旧片段兼容(若仍被引用) */
.instance-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  margin-bottom: 12px;
}

.instance-toolbar-filter.list-window-bar {
  flex: 1 1 320px;
  margin-bottom: 0;
}

.stat-strip {
  margin-bottom: 12px;
  padding: 10px 14px;
}

.stat-strip-inner {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
}

html[data-theme="light"] .stat-strip-item .value {
  color: var(--inst-text);
}

html[data-theme="light"] .stat-strip-item .label,
html[data-theme="light"] .instance-header-toolbar-filter label {
  color: var(--inst-label) !important;
}

html[data-theme="light"] .list-window-hint {
  color: var(--inst-muted) !important;
}

html[data-theme="light"] .instance-header-stats {
  border-top-color: #c8d4e0;
}

html[data-theme="light"] .stat-strip-item {
  border-right-color: #d8e2ec;
}

html[data-theme="light"] .list-window-label {
  color: #1a2838;
}

.login-theme-bar {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  max-width: 400px;
  margin: 0 0 10px;
  flex-shrink: 0;
}

/* ── 交易执行 / 复盘 / 统计(index 内联样式覆盖)── */
html[data-theme="light"] .list-window-bar,
html[data-theme="light"] .export-bar a {
  background: #fff !important;
  border-color: #b8c8d8 !important;
  color: #1a2838 !important;
}

html[data-theme="light"] .list-window-bar label,
html[data-theme="light"] .export-bar {
  color: #4a6078 !important;
}

html[data-theme="light"] .stats-segment-block {
  border-top-color: #c8d4e0 !important;
}

html[data-theme="light"] .stats-segment-block h2,
html[data-theme="light"] .stats-period-block h3,
html[data-theme="light"] .key-history h3 {
  color: #142232 !important;
}

html[data-theme="light"] .stats-period-block .sub,
html[data-theme="light"] .key-history .sub,
html[data-theme="light"] .pos-section-title,
html[data-theme="light"] .pos-empty {
  color: #4a6078 !important;
}

html[data-theme="light"] .stats-period-block {
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .stats-period-tab {
  background: #f4f7fb !important;
  color: #4a6078 !important;
  border-color: #c8d4e0 !important;
}
html[data-theme="light"] .stats-period-tab:hover {
  background: #e8eef5 !important;
  color: #142232 !important;
}
html[data-theme="light"] .stats-period-tab.active {
  background: #dce8f5 !important;
  color: #0d4a7a !important;
  border-color: #7eb0d8 !important;
}
html[data-theme="light"] .stats-period-range,
html[data-theme="light"] .inst-stats-kpi-lbl,
html[data-theme="light"] .inst-stats-block-title,
html[data-theme="light"] .inst-stats-risk-item .k,
html[data-theme="light"] .inst-stats-empty {
  color: #4a6078 !important;
}
html[data-theme="light"] .inst-stats-kpi,
html[data-theme="light"] .inst-stats-block {
  background: #f8fafc !important;
  border-color: #c8d4e0 !important;
}
html[data-theme="light"] .inst-stats-ring::before {
  background: #f8fafc !important;
}
html[data-theme="light"] .inst-stats-stacked-bar {
  background: #e2e8f0 !important;
}
html[data-theme="light"] .inst-stats-risk-item .v,
html[data-theme="light"] .inst-stats-details > summary {
  color: #142232 !important;
}
html[data-theme="light"] .inst-stats-details[open] > summary {
  color: #0d4a7a !important;
}
html[data-theme="light"] .inst-stats-month-table th {
  color: #4a6078 !important;
}
html[data-theme="light"] .inst-stats-month-table td {
  color: #142232 !important;
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .key-history {
  border-top-color: #d0dae4 !important;
}

html[data-theme="light"] .pos-card,
html[data-theme="light"] .pos-empty {
  background: #fff !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .pos-card-symbol strong,
html[data-theme="light"] .pos-value,
html[data-theme="light"] .pos-value.price-flat {
  color: #142232 !important;
}

html[data-theme="light"] .pos-label,
html[data-theme="light"] .pos-meta,
html[data-theme="light"] .pos-footer,
html[data-theme="light"] .pos-ex-orders-title,
html[data-theme="light"] .pos-ex-order-row {
  color: #1e293b !important;
}

html[data-theme="light"] .pos-meta-item::after {
  color: #94a3b8 !important;
}

.pos-time-close-meta {
  color: #8fc8ff;
}
.pos-time-close-meta .pos-time-close-cd {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.pos-symbol-time-close {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  font-weight: 500;
  color: #8fc8ff;
  padding: 1px 6px;
  border-radius: 4px;
  background: rgba(143, 200, 255, 0.1);
  white-space: nowrap;
}
.pos-symbol-time-close .pos-time-close-cd {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
}
.force-close-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #ffc870;
  background: #2a2218;
  border: 1px solid #6a5020;
  padding: 4px 12px;
  border-radius: 999px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.force-close-badge .force-close-header-cd {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
}
.pos-force-close-meta {
  color: #ffc870;
}
.pos-symbol-force-close {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  font-weight: 500;
  color: #ffc870;
  padding: 1px 6px;
  border-radius: 4px;
  background: rgba(255, 200, 112, 0.12);
  white-space: nowrap;
}
.pos-symbol-force-close .pos-force-close-cd {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
}
html[data-theme="light"] .force-close-badge {
  color: #9a6200;
  background: #fff6e8;
  border-color: #d4a84a;
}
html[data-theme="light"] .pos-symbol-force-close,
html[data-theme="light"] .pos-force-close-meta {
  color: #9a6200;
  background: rgba(212, 168, 74, 0.14);
}
.key-time-close-wrap.is-disabled > label,
.order-time-close-wrap.is-disabled > label {
  opacity: 0.72;
}
.key-time-close-wrap select,
.order-time-close-wrap select {
  cursor: pointer;
}
html[data-theme="light"] .pos-meta-on {
  color: #006e9a !important;
}

html[data-theme="light"] .pos-side-long {
  background: #006e9a !important;
  color: #fff !important;
  border: 1px solid #005a82 !important;
}

html[data-theme="light"] .pos-side-short {
  background: #b03030 !important;
  color: #fff !important;
  border: 1px solid #8a2424 !important;
}

html[data-theme="light"] .pos-entrust-btn,
html[data-theme="light"] .stats-card .stats-toggle,
html[data-theme="light"] .btn-del[style*="1f3a5a"],
html[data-theme="light"] a.btn-del[style*="1f3a5a"],
html[data-theme="light"] .detail-modal .panel-fs,
html[data-theme="light"] .review-card-fs-btn {
  background: #e8eef5 !important;
  color: #006e9a !important;
}

html[data-theme="light"] .pos-ex-orders {
  border-top-color: #d0dae4 !important;
}

html[data-theme="light"] .pos-ex-cancel-btn {
  background: #eef3f8 !important;
  color: #5b4fc7 !important;
}

html[data-theme="light"] .tpsl-modal {
  background: #fff !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .tpsl-modal h3 {
  color: #142232 !important;
}

html[data-theme="light"] .tpsl-modal-cancel {
  background: #eef3f8 !important;
  color: #4a6078 !important;
}

html[data-theme="light"] .list-item {
  background: #f6f9fc !important;
  border-color: #d0dae4 !important;
}

html[data-theme="light"] .price-flat {
  color: #4a6078 !important;
}

html[data-theme="light"] .detail-modal .panel,
html[data-theme="light"] .ai-result {
  background: #fff !important;
}

html[data-theme="light"] .detail-modal .panel-title {
  color: #142232 !important;
}

/* 交易复盘详情:上方元数据(非 Markdown 区)浅色主题对比度 */
html[data-theme="light"] .detail-modal .panel-body:not(.md-review) {
  color: #1a2838 !important;
}

html[data-theme="light"] .detail-modal .panel {
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .detail-modal .panel-image {
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .detail-modal .panel-close {
  background: #f6f9fc !important;
  color: #4a6078 !important;
  border: 1px solid #b8c8d8 !important;
}

/* ── 交易记录:方向 / 结果徽章(浅底描边,避免黑底块)── */
html[data-theme="light"] .badge.direction-long,
html[data-theme="light"] .direction-long {
  background: rgba(8, 122, 80, 0.1) !important;
  color: #087a50 !important;
  border: 1px solid rgba(8, 122, 80, 0.28) !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .badge.direction-short,
html[data-theme="light"] .direction-short {
  background: rgba(192, 48, 48, 0.08) !important;
  color: #b03030 !important;
  border: 1px solid rgba(192, 48, 48, 0.25) !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .badge.profit {
  background: rgba(8, 122, 80, 0.1) !important;
  color: #087a50 !important;
  border: 1px solid rgba(8, 122, 80, 0.28) !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .badge.loss {
  background: rgba(192, 48, 48, 0.08) !important;
  color: #b03030 !important;
  border: 1px solid rgba(192, 48, 48, 0.25) !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .badge.miss {
  background: rgba(180, 130, 20, 0.1) !important;
  color: #8a6200 !important;
  border: 1px solid rgba(180, 130, 20, 0.28) !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .badge.direction {
  background: rgba(0, 110, 154, 0.08) !important;
  color: #006e9a !important;
  border: 1px solid rgba(0, 110, 154, 0.22) !important;
}

html[data-theme="light"] .table-del,
html[data-theme="light"] button.table-del {
  background: #fff5f5 !important;
  color: #b03030 !important;
  border: 1px solid rgba(176, 48, 48, 0.28) !important;
}

html[data-theme="light"] .pos-breakeven-badge {
  background: rgba(8, 122, 80, 0.1) !important;
  color: #087a50 !important;
  border: 1px solid rgba(8, 122, 80, 0.25) !important;
}

/* ── 实时持仓 / 行情:浮盈亏涨跌色 ── */
html[data-theme="light"] .price-up,
html[data-theme="light"] .pos-value.price-up {
  color: #087a50 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .price-down,
html[data-theme="light"] .pos-value.price-down {
  color: #c03030 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .journal-detail-meta {
  color: #1a2838 !important;
  line-height: 1.65 !important;
}

html[data-theme="light"] .journal-card .form-grid label,
html[data-theme="light"] .journal-card .sub {
  color: #4a6078 !important;
}

html[data-theme="light"] .btn-del:not([style*="1f3a5a"]) {
  background: #fff5f5 !important;
  color: #b03030 !important;
  border: 1px solid rgba(176, 48, 48, 0.25) !important;
}

html[data-theme="light"] table th {
  background: #eef3f8 !important;
}

html[data-theme="light"] .strategy-subnav {
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .strategy-subnav a {
  background: #fff !important;
  color: var(--inst-nav-idle) !important;
  border-color: rgba(0, 95, 140, 0.22) !important;
}

html[data-theme="light"] .strategy-subnav a.active {
  background: rgba(0, 110, 154, 0.12) !important;
  color: var(--inst-nav-active-fg) !important;
  border: 1px solid rgba(0, 95, 140, 0.28) !important;
  font-weight: 600;
}

/* ── 策略交易 / 策略记录(strategy_templates 内联)── */
html[data-theme="dark"] .strategy-records-page .sr-summary,
html[data-theme="dark"] .strategy-records-page .sr-detail {
  color: #cfd3ef !important;
}
html[data-theme="dark"] .strategy-records-page .sr-summary .sr-sym,
html[data-theme="dark"] .strategy-records-page .sr-detail-grid .val {
  color: #f0f2ff !important;
}
html[data-theme="dark"] .strategy-records-page .sr-summary .sr-dca-tag {
  color: #8892b0 !important;
}
html[data-theme="dark"] .strategy-records-page .sr-summary .sr-pnl.pos,
html[data-theme="dark"] .strategy-records-page .sr-pnl.pos {
  color: #4cd97f !important;
}
html[data-theme="dark"] .strategy-records-page .sr-summary .sr-pnl.neg,
html[data-theme="dark"] .strategy-records-page .sr-pnl.neg {
  color: #ff6666 !important;
}

html[data-theme="light"] .strategy-records-page h2,
html[data-theme="light"] .plan-card-title,
html[data-theme="light"] .sr-panel-title,
html[data-theme="light"] .sr-summary .sr-sym,
html[data-theme="light"] .sr-detail-grid .val,
html[data-theme="light"] .plan-cell .val:not(.pnl-profit):not(.pnl-loss) {
  color: #142232 !important;
}

html[data-theme="light"] .plan-cell .val.pnl-profit,
html[data-theme="light"] .pnl-profit {
  color: #087a50 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .plan-cell .val.pnl-loss,
html[data-theme="light"] .pnl-loss {
  color: #c03030 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .plan-dca-table td.st-done,
html[data-theme="light"] .plan-dca-table .st-done,
html[data-theme="light"] .sr-dca-table .st-done {
  color: #087a50 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .plan-dca-table .st-pending,
html[data-theme="light"] .sr-dca-table .st-pending {
  color: #6a7588 !important;
}

html[data-theme="light"] .strategy-records-tip,
html[data-theme="light"] .plan-card-meta,
html[data-theme="light"] .plan-cell .lbl,
html[data-theme="light"] .sr-panel-count,
html[data-theme="light"] .sr-empty,
html[data-theme="light"] .plan-dca-title {
  color: #4a6078 !important;
}

html[data-theme="light"] .plan-position-card,
html[data-theme="light"] .sr-filters,
html[data-theme="light"] .sr-panel {
  background: #fff !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .sr-filters select,
html[data-theme="light"] .sr-filters input[type="datetime-local"] {
  background: #f6f9fc !important;
  color: #142232 !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .sr-chip {
  background: #fff !important;
  color: #4a6078 !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .sr-chip.active {
  background: rgba(0, 110, 154, 0.12) !important;
  color: #006e9a !important;
  border-color: rgba(0, 95, 140, 0.35) !important;
}

html[data-theme="light"] .sr-item {
  background: #f6f9fc !important;
  border-color: #d0dae4 !important;
}

html[data-theme="light"] .sr-summary,
html[data-theme="light"] .sr-detail,
html[data-theme="light"] .plan-cell .val.pnl-neutral {
  color: #1a2838 !important;
}

html[data-theme="light"] .sr-summary:hover {
  background: rgba(0, 110, 154, 0.06) !important;
}

html[data-theme="light"] .sr-detail {
  border-top-color: #d0dae4 !important;
}

html[data-theme="light"] .plan-dca-block {
  border-top-color: #d0dae4 !important;
}

html[data-theme="light"] .plan-dca-table th,
html[data-theme="light"] .plan-dca-table td,
html[data-theme="light"] .sr-dca-table th,
html[data-theme="light"] .sr-dca-table td {
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .plan-dca-table th,
html[data-theme="light"] .sr-dca-table th {
  color: #4a6078 !important;
}

html[data-theme="light"] .trend-running-plans {
  border-top-color: #d0dae4 !important;
}

html[data-theme="light"] .plan-card-meta .accent,
html[data-theme="light"] .sr-panel-title.trend,
html[data-theme="light"] .sr-summary::before {
  color: #006e9a !important;
}

html[data-theme="light"] .sr-panel-title.roll {
  color: #a06010 !important;
}

html[data-theme="light"] .btn-close-plan {
  background: #fff5f5 !important;
  color: #b03030 !important;
}

html[data-theme="light"] .running-plans-stack .plan-position-card[style*="8892b0"] {
  color: #4a6078 !important;
  background: #f6f9fc !important;
}

html[data-theme="light"] button[style*="1f4a3a"] {
  background: #e8f5ef !important;
  color: #087a50 !important;
}

html[data-theme="light"] .strategy-trading-grid .card,
html[data-theme="light"] .dual-panel-grid .card {
  background: #fff !important;
}

/* ── AI 复盘(panel-list / ai-result)── */
html[data-theme="light"] .panel-item {
  background: #fff !important;
  border-color: #b8c8d8 !important;
  color: #1a2838 !important;
}

html[data-theme="light"] .panel-item strong {
  color: #142232 !important;
}

html[data-theme="light"] .panel-item .entry {
  border-bottom-color: #d0dae4 !important;
  color: #1a2838 !important;
}

html[data-theme="light"] .panel-item .entry div {
  color: #4a6078 !important;
}

html[data-theme="light"] .ai-result {
  background: #f6f9fc !important;
  border-color: #b8c8d8 !important;
  color: #1a2838 !important;
}

.ai-result.is-loading {
  color: #8fc8ff;
  font-style: italic;
  animation: ai-review-pulse 1.2s ease-in-out infinite;
}

html[data-theme="light"] .ai-result.is-loading {
  color: #006e9a !important;
}

@keyframes ai-review-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}

/* AI 日复盘 / 周复盘 Markdown(弹窗 + 内联结果区,三所共用) */
html[data-theme="light"] .ai-result-md,
html[data-theme="light"] .detail-modal .panel-body.md-review {
  color: #1a2838 !important;
}

html[data-theme="light"] .ai-result-md p,
html[data-theme="light"] .detail-modal .panel-body.md-review p,
html[data-theme="light"] .ai-result-md li,
html[data-theme="light"] .detail-modal .panel-body.md-review li,
html[data-theme="light"] .ai-result-md ol,
html[data-theme="light"] .ai-result-md ul,
html[data-theme="light"] .detail-modal .panel-body.md-review ol,
html[data-theme="light"] .detail-modal .panel-body.md-review ul {
  color: #1a2838 !important;
}

html[data-theme="light"] .ai-result-md strong,
html[data-theme="light"] .detail-modal .panel-body.md-review strong {
  color: #142232 !important;
}

html[data-theme="light"] .ai-result-md h2,
html[data-theme="light"] .detail-modal .panel-body.md-review h2,
html[data-theme="light"] .ai-result-md h3,
html[data-theme="light"] .detail-modal .panel-body.md-review h3,
html[data-theme="light"] .ai-result-md h4,
html[data-theme="light"] .detail-modal .panel-body.md-review h4 {
  color: #142232 !important;
}

html[data-theme="light"] .ai-result-md h2,
html[data-theme="light"] .detail-modal .panel-body.md-review h2 {
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .ai-result-md h3,
html[data-theme="light"] .detail-modal .panel-body.md-review h3 {
  color: #006e9a !important;
}

html[data-theme="light"] .ai-result-md code,
html[data-theme="light"] .detail-modal .panel-body.md-review code {
  background: #eef3f8 !important;
  color: #142232 !important;
}

html[data-theme="light"] .ai-result-md .md-raw-block-title,
html[data-theme="light"] .detail-modal .panel-body.md-review .md-raw-block-title {
  color: #4a6078 !important;
  border-top-color: #d0dae4 !important;
}

/* ── 统计分栏(机器人 / 趋势回调)── */
html[data-theme="light"] .stats-split-col {
  background: #fff !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .stats-split-head {
  color: #142232 !important;
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .stats-split-col .stat-item {
  background: #f6f9fc !important;
  border-color: #d0dae4 !important;
}

html[data-theme="light"] .stats-split-col .stat-item .label {
  color: #4a6078 !important;
}

html[data-theme="light"] .stats-split-col .stat-item .value {
  color: #142232 !important;
}

/* ── 可折叠说明(规则 / 划转 / 价格)── */
.tip-collapse {
  margin-bottom: 8px;
  border: 1px solid #2a3348;
  border-radius: 8px;
  background: rgba(20, 25, 35, 0.45);
  overflow: hidden;
}

.tip-collapse-summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 8px;
  padding: 8px 12px;
  cursor: pointer;
  list-style: none;
  font-size: 0.8rem;
  color: #95a2c2;
  line-height: 1.45;
}

.tip-collapse-summary::-webkit-details-marker {
  display: none;
}

.tip-collapse-summary::before {
  content: "▸";
  flex: 0 0 auto;
  color: #6d7a99;
  transition: transform 0.15s ease;
}

.tip-collapse[open] > .tip-collapse-summary::before {
  transform: rotate(90deg);
}

.tip-collapse-hint {
  color: #6d7a99;
  font-size: 0.74rem;
}

.tip-collapse-body {
  padding: 0 12px 10px;
  border-top: 1px solid #232b3d;
}

.tip-collapse-body.rule-tip {
  margin-bottom: 0;
  padding-top: 8px;
}

html[data-theme="light"] .tip-collapse {
  background: #f6f9fc !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .tip-collapse-summary {
  color: #4a6078 !important;
}

html[data-theme="light"] .tip-collapse-summary::before {
  color: #6a7588 !important;
}

html[data-theme="light"] .tip-collapse-hint {
  color: #6a7588 !important;
}

html[data-theme="light"] .tip-collapse-body {
  border-top-color: #d0dae4 !important;
}

html[data-theme="light"] .tip-collapse-body.rule-tip {
  color: #4a6078 !important;
}

html[data-theme="light"] .key-rule-table th,
html[data-theme="light"] .key-rule-table td {
  border-color: #d0dae4 !important;
}

html[data-theme="light"] .key-rule-table th {
  background: #eef3f8 !important;
  color: #4a6078 !important;
}

html[data-theme="light"] .key-rule-table td {
  color: #142232 !important;
}

html[data-theme="light"] .key-rule-table .key-rule-type {
  color: #142232 !important;
}

html[data-theme="light"] .key-rule-table .key-rule-sub {
  color: #006e9a !important;
}

html[data-theme="light"] .key-rule-foot {
  color: #6a7588 !important;
}

html[data-theme="light"] .key-rule-foot code {
  color: #006e9a !important;
}

/* ── 关键位折叠行(亮色)── */
html[data-theme="light"] .key-row-collapse {
  background: #f6f9fc !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .key-row-collapse-summary {
  color: #1a2838 !important;
}

html[data-theme="light"] .key-row-collapse-summary::before {
  color: #6a7588 !important;
}

html[data-theme="light"] .key-row-summary-title strong {
  color: #142232 !important;
}

html[data-theme="light"] .key-row-summary-line,
html[data-theme="light"] .key-history-brief {
  color: #4a6078 !important;
}

html[data-theme="light"] .key-row-summary-live {
  color: #006e9a !important;
}

html[data-theme="light"] .key-row-summary-live.key-row-summary-pending {
  color: #087a50 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .key-row-collapse-body {
  border-top-color: #d0dae4 !important;
}

html[data-theme="light"] .key-history-alert {
  color: #4a6078 !important;
}

html[data-theme="light"] .key-row-collapse .pos-side-badge[style*="2a3152"] {
  background: rgba(0, 110, 154, 0.1) !important;
  color: #006e9a !important;
}

html[data-theme="light"] .key-row-collapse.key-history-success {
  background: rgba(8, 122, 80, 0.08) !important;
  border-color: rgba(8, 122, 80, 0.35) !important;
}

html[data-theme="light"] .key-row-collapse.key-history-success .key-row-collapse-summary,
html[data-theme="light"] .key-row-collapse.key-history-success .key-row-summary-title strong {
  color: #142232 !important;
}

html[data-theme="light"] .key-row-collapse.key-history-success .key-history-brief,
html[data-theme="light"] .key-row-collapse.key-history-success .key-history-outcome-badge {
  color: #087a50 !important;
  background: rgba(8, 122, 80, 0.1) !important;
  border-color: rgba(8, 122, 80, 0.28) !important;
}

html[data-theme="light"] .key-row-collapse.key-history-manual {
  background: #f0f2f6 !important;
  border-color: #b8c0cc !important;
}

html[data-theme="light"] .key-row-collapse.key-history-manual .key-history-brief,
html[data-theme="light"] .key-row-collapse.key-history-manual .key-history-outcome-badge {
  color: #5a6478 !important;
  background: rgba(90, 100, 120, 0.1) !important;
  border-color: rgba(90, 100, 120, 0.22) !important;
}

html[data-theme="light"] .key-row-collapse.key-history-failed {
  background: rgba(192, 48, 48, 0.06) !important;
  border-color: rgba(192, 48, 48, 0.28) !important;
}

html[data-theme="light"] .key-row-collapse.key-history-failed .key-row-collapse-summary {
  color: #1a2838 !important;
}

html[data-theme="light"] .key-row-collapse.key-history-failed .key-history-brief,
html[data-theme="light"] .key-row-collapse.key-history-failed .key-history-outcome-badge {
  color: #b04040 !important;
  background: rgba(192, 48, 48, 0.08) !important;
  border-color: rgba(192, 48, 48, 0.22) !important;
}

html[data-theme="light"] .trd-label {
  color: #6a7588 !important;
}

html[data-theme="light"] .trd-value {
  color: #142232 !important;
}

html[data-theme="light"] .mobile-record-row {
  background: #fff !important;
  border-color: #b8c8d8 !important;
  color: #142232 !important;
}

html[data-theme="light"] .mobile-record-row:active {
  background: #eef3f8 !important;
}

html[data-theme="light"] .mrr-muted {
  color: #6a7588 !important;
}

html[data-theme="light"] .mobile-record-del {
  background: rgba(192, 48, 48, 0.08) !important;
  border-color: rgba(192, 48, 48, 0.28) !important;
  color: #b04040 !important;
}

html[data-theme="light"] .detail-actions {
  border-top-color: #d0dae4 !important;
}

/* ── 顺势加仓:表单字段按模式显隐(CSS 兜底,不依赖 JS)── */
#roll-form[data-add-mode="market"] .roll-field-fib,
#roll-form[data-add-mode="market"] .roll-field-breakout {
  display: none !important;
}

#roll-form[data-add-mode="fib_618"] .roll-field-breakout,
#roll-form[data-add-mode="fib_786"] .roll-field-breakout {
  display: none !important;
}

#roll-form[data-add-mode="breakout"] .roll-field-fib {
  display: none !important;
}

#roll-form[data-add-mode="fib_618"] .roll-field-fib,
#roll-form[data-add-mode="fib_786"] .roll-field-fib,
#roll-form[data-add-mode="breakout"] .roll-field-breakout {
  display: inline-flex !important;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

#roll-form[data-add-mode="fib_618"] #roll-preview-btn,
#roll-form[data-add-mode="fib_786"] #roll-preview-btn,
#roll-form[data-add-mode="breakout"] #roll-preview-btn {
  display: none !important;
}

#strategy-roll-panel .roll-risk-banner {
  margin-bottom: 8px;
  color: #8fc8ff;
}

html[data-theme="light"] #strategy-roll-panel .roll-risk-banner {
  color: #006e9a !important;
}

#strategy-roll-panel .roll-doc-link {
  color: #8fc8ff;
}

html[data-theme="light"] #strategy-roll-panel .roll-doc-link {
  color: #006e9a !important;
}

#strategy-roll-panel .roll-section-title {
  margin: 14px 0 8px;
  font-size: 0.95rem;
  color: #b8c4ff;
}

html[data-theme="light"] #strategy-roll-panel .roll-section-title {
  color: #006e9a !important;
}

#strategy-roll-panel .roll-active-groups-table .roll-tp-profit,
#strategy-roll-panel .roll-active-groups-table .roll-status-active {
  color: #4cd97f;
  font-weight: 600;
}

.pos-tp-profit {
  color: #4cd97f;
  font-weight: 600;
}

html[data-theme="light"] .pos-tp-profit {
  color: #1a8f4a !important;
}

html[data-theme="light"] #strategy-roll-panel .roll-active-groups-table .roll-tp-profit,
html[data-theme="light"] #strategy-roll-panel .roll-active-groups-table .roll-status-active {
  color: #1a8f4a !important;
}

#roll-preview-box.roll-preview-box {
  margin: 8px 0;
  padding: 10px;
  border: 1px solid #3a5a8a;
  border-radius: 8px;
  background: #141a28;
  color: #dde2ff;
}

#roll-preview-box.roll-preview-box.is-error {
  border-color: #8a3a4a;
  background: #1a1218;
  color: #ffb4b4;
}

#roll-preview-box.roll-preview-box.is-preview {
  border-color: #3a5a8a;
  background: #141a28;
  color: #dde2ff;
}

html[data-theme="light"] #roll-preview-box.roll-preview-box {
  background: #f6f9fc !important;
  border-color: #b8c8d8 !important;
  color: #1a2838 !important;
}

html[data-theme="light"] #roll-preview-box.roll-preview-box.is-error {
  background: #fff5f5 !important;
  border-color: #d8a0a8 !important;
  color: #8a2030 !important;
}

#roll-countdown.roll-countdown {
  margin-top: 6px;
  color: #ffb347;
}

html[data-theme="light"] #roll-countdown.roll-countdown {
  color: #a06010 !important;
}

/* ── 顺势加仓说明页 ── */
body.roll-doc-page {
  font-family: system-ui, sans-serif;
  margin: 0;
  padding: 16px;
  background: #0f1117;
  color: #e6e8ef;
}

html[data-theme="light"] body.roll-doc-page {
  background: #eef3f8 !important;
  color: #142232 !important;
}

.roll-doc-container {
  max-width: 920px;
  margin: 0 auto;
}

.roll-doc-nav {
  margin-bottom: 14px;
}

.roll-doc-nav a {
  color: #8fc8ff;
  text-decoration: none;
}

html[data-theme="light"] .roll-doc-nav a {
  color: #006e9a !important;
}

.roll-doc-body {
  background: #151a2a;
  border: 1px solid #2a3150;
  border-radius: 10px;
  padding: 18px 20px;
  line-height: 1.65;
  font-size: 0.92rem;
}

html[data-theme="light"] .roll-doc-body {
  background: #fff !important;
  border-color: #b8c8d8 !important;
  color: #1a2838 !important;
}

.roll-doc-body h1 {
  font-size: 1.35rem;
  margin: 0 0 12px;
  color: #f0f2ff;
}

html[data-theme="light"] .roll-doc-body h1 {
  color: #142232 !important;
}

.roll-doc-body h2 {
  font-size: 1.08rem;
  margin: 22px 0 10px;
  color: #b8c4ff;
  border-bottom: 1px solid #2a3150;
  padding-bottom: 6px;
}

html[data-theme="light"] .roll-doc-body h2 {
  color: #006e9a !important;
  border-bottom-color: #d0dae4 !important;
}

.roll-doc-body h3 {
  font-size: 0.98rem;
  margin: 16px 0 8px;
  color: #c9d4ff;
}

html[data-theme="light"] .roll-doc-body h3 {
  color: #142232 !important;
}

.roll-doc-body p,
.roll-doc-body li {
  color: #dde2ff;
}

html[data-theme="light"] .roll-doc-body p,
html[data-theme="light"] .roll-doc-body li {
  color: #1a2838 !important;
}

.roll-doc-body ul,
.roll-doc-body ol {
  margin: 8px 0 12px 1.25em;
}

.roll-doc-body code {
  background: #252538;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 0.88em;
}

html[data-theme="light"] .roll-doc-body code {
  background: #e8eef5 !important;
  color: #142232 !important;
}

.roll-doc-body pre {
  background: #0f1420;
  border: 1px solid #2a3150;
  border-radius: 8px;
  padding: 12px;
  overflow: auto;
  font-size: 0.84rem;
  line-height: 1.5;
  color: #dde2ff;
}

html[data-theme="light"] .roll-doc-body pre {
  background: #f6f9fc !important;
  border-color: #b8c8d8 !important;
  color: #142232 !important;
}

.roll-doc-body pre code {
  background: transparent;
  padding: 0;
}

.roll-doc-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0;
  font-size: 0.86rem;
}

.roll-doc-body th,
.roll-doc-body td {
  border: 1px solid #2a3150;
  padding: 6px 8px;
  text-align: left;
  color: #dde2ff;
}

html[data-theme="light"] .roll-doc-body th,
html[data-theme="light"] .roll-doc-body td {
  border-color: #b8c8d8 !important;
  color: #1a2838 !important;
}

.roll-doc-body th {
  background: #1a2030;
  color: #b8c4ff;
}

html[data-theme="light"] .roll-doc-body th {
  background: #e8eef5 !important;
  color: #142232 !important;
}

.roll-doc-body hr {
  border: none;
  border-top: 1px solid #2a3150;
  margin: 20px 0;
}

html[data-theme="light"] .roll-doc-body hr {
  border-top-color: #d0dae4 !important;
}

/* ── 实盘下单:预估风险/盈利/盈亏比条 ── */
html[data-theme="light"] .order-plan-preview {
  background: #f6f9fc !important;
  border-color: #b8c8d8 !important;
}

html[data-theme="light"] .order-monitor-form .om-field-lab {
  color: #5a6a82;
}

html[data-theme="light"] .order-monitor-form .om-check,
html[data-theme="light"] .order-monitor-form .om-time-close {
  color: #3a4a62;
}

html[data-theme="light"] .order-preview-rr {
  color: #4a6078 !important;
}

html[data-theme="light"] .order-preview-rr strong {
  color: #142232 !important;
}

html[data-theme="light"] .order-preview-risk strong {
  color: #b03030 !important;
}

html[data-theme="light"] .order-preview-profit strong {
  color: #087a50 !important;
}

/* ── 账户交易限制(方向 / 币种白名单)── */
.trade-policy-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  color: #8fc8ff;
  background: rgba(31, 58, 90, 0.55);
  border: 1px solid rgba(143, 200, 255, 0.35);
  line-height: 1.4;
}

.trade-policy-dir-lock {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #4cd97f;
  background: rgba(76, 217, 127, 0.1);
  border: 1px solid rgba(76, 217, 127, 0.28);
  white-space: nowrap;
}

html[data-theme="light"] .trade-policy-badge {
  color: #1a4a7a;
  background: #e8f2fb;
  border-color: #9ec5e8;
}

html[data-theme="light"] .trade-policy-dir-lock {
  color: #087a50;
  background: #e8f8f0;
  border-color: #9ed4b8;
}

/* ── 币种输入实时现价 ── */
.symbol-live-price {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 600;
  color: #8fc8ff;
  background: rgba(31, 58, 90, 0.35);
  border: 1px solid rgba(143, 200, 255, 0.22);
  white-space: nowrap;
  line-height: 1.35;
}

.symbol-live-price--ok {
  color: #4cd97f;
  border-color: rgba(76, 217, 127, 0.35);
  background: rgba(76, 217, 127, 0.08);
}

.symbol-live-price--loading {
  opacity: 0.75;
}

.symbol-live-price--err {
  color: #e8a090;
  border-color: rgba(232, 160, 144, 0.35);
}

.symbol-live-price-note {
  font-size: 0.72rem;
  color: #8892b0;
  white-space: nowrap;
}

html[data-theme="light"] .symbol-live-price {
  color: #1a4a7a;
  background: #eef4fb;
  border-color: #b8cfe8;
}

html[data-theme="light"] .symbol-live-price--ok {
  color: #087a50;
  background: #e8f8f0;
  border-color: #9ed4b8;
}

/* ── 复盘:字段按内容宽度;开仓类型与离场触发同一行 ── */
.journal-card #journal-form {
  min-width: 0;
  max-width: 100%;
}

.journal-card .form-grid {
  gap: 10px;
}

.journal-card .form-grid > input,
.journal-card .form-grid > select {
  box-sizing: border-box;
}

.journal-card .journal-form-row1 {
  grid-template-columns:
    minmax(11rem, 1.55fr)
    minmax(11rem, 1.55fr)
    minmax(4.2rem, 0.62fr)
    minmax(3.2rem, 0.48fr)
    minmax(4.8rem, 0.72fr)
    minmax(4rem, 0.55fr)
    minmax(4rem, 0.55fr);
  margin-bottom: 10px;
}

.journal-card .journal-form-row2 {
  grid-template-columns:
    minmax(6.5rem, 0.85fr)
    minmax(7.5rem, 1.15fr)
    minmax(7rem, 1fr)
    minmax(0, 1.35fr)
    minmax(6.5rem, 0.75fr);
  margin-bottom: 8px;
}

.journal-card .journal-form-row2 select[name="order_type"],
.journal-card .journal-form-row2 select[name="entry_reason"] {
  font-size: 0.8rem;
  line-height: 1.35;
}

.journal-card #journal-form textarea[name="note"] {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-top: 8px;
}

.journal-upload-slots {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  align-items: flex-start;
  margin-top: 8px;
}

.journal-upload-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  flex: 1 1 0;
  min-width: 0;
}

.journal-upload-slot-label {
  color: #9aa3c7;
  font-weight: 600;
  font-size: 0.78rem;
  letter-spacing: 0.02em;
}

.journal-upload-slot-input {
  width: 100%;
  min-width: 0;
  font-size: 0.72rem;
  padding: 3px 4px;
  line-height: 1.2;
}

.journal-upload-status {
  font-size: 0.68rem;
  color: #8892b0;
  min-height: 1.1em;
  line-height: 1.25;
  word-break: break-all;
}

.journal-upload-status--pending {
  color: #c9b458;
}

.journal-upload-status--ok {
  color: #6bc98a;
}

.journal-upload-status--err {
  color: #ff7b7b;
}

.journal-upload-hint {
  margin-top: 4px;
  margin-bottom: 0;
  font-size: 0.72rem;
  color: #8892b0;
}

.journal-card .journal-upload-slots {
  margin-bottom: 2px;
}

.journal-card .form-row.journal-chart-options {
  margin-top: 6px;
  margin-bottom: 6px;
  gap: 6px;
}

.journal-card .mood-grid {
  margin-top: 6px;
  gap: 8px;
}

@media (max-width: 960px) {
  .journal-card .journal-form-row1 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .journal-card .journal-form-row1 .journal-field-datetime {
    grid-column: span 2;
  }

  .journal-card .journal-form-row2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .journal-card .journal-form-row2 input[name="early_exit_note"] {
    grid-column: 1 / -1;
  }

  .journal-upload-slots {
    flex-wrap: wrap;
  }

  .journal-upload-row {
    flex: 1 1 calc(50% - 8px);
  }
}

@media (max-width: 560px) {
  .journal-card .journal-form-row1 {
    grid-template-columns: minmax(0, 1fr);
  }

  .journal-card .journal-form-row1 .journal-field-datetime {
    grid-column: auto;
  }

  .journal-card .journal-form-row2 {
    grid-template-columns: minmax(0, 1fr);
  }

  .journal-card .journal-form-row2 input[name="early_exit_note"] {
    grid-column: auto;
  }
}

@media (max-width: 560px) {
  .journal-upload-row {
    flex: 1 1 100%;
  }
}

.journal-detail-images {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 10px 14px 14px;
  border-top: 1px solid rgba(130, 145, 190, 0.25);
}

.journal-detail-img-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.journal-detail-img-label {
  font-size: 0.75rem;
  color: #9aa3c7;
  font-weight: 600;
}

.journal-detail-img-thumb {
  width: 100%;
  max-height: 220px;
  object-fit: contain;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 6px;
  cursor: zoom-in;
}

html[data-theme="light"] .journal-detail-images {
  border-top-color: #d0dae4;
}

html[data-theme="light"] .journal-detail-img-thumb {
  background: #eef2f7;
}

.nav-hidden {
  display: none !important;
}

/* ── env 配置页(Tab + 双列表单) ── */
.env-config-page {
  margin-top: 12px;
  width: 100%;
  min-width: 0;
  grid-column: 1 / -1;
}

.env-config-head {
  padding: 14px 16px;
  margin-bottom: 12px;
}

.env-config-head-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px 16px;
}

.env-config-head h2 {
  margin: 0 0 4px;
  font-size: 1rem;
}

.env-config-head-hint {
  margin: 0;
  font-size: 0.78rem;
  max-width: 42rem;
}

.env-config-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.env-config-body {
  padding: 0;
  overflow: hidden;
  position: relative;
}

.env-tab-radio {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.env-config-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  overflow-x: auto;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: 0 8px;
  scrollbar-width: thin;
}

.env-tab-btn {
  flex: 0 0 auto;
  display: inline-block;
  border: none;
  background: transparent;
  color: var(--muted, #8892b0);
  font-size: 0.8rem;
  padding: 10px 14px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  white-space: nowrap;
  transition: color 0.15s, border-color 0.15s;
  user-select: none;
}

.env-tab-btn:hover {
  color: #c5cae0;
}

.env-config-panels .env-panel {
  display: none;
}

#env-sec-0:checked ~ .env-config-tabs label[for="env-sec-0"],
#env-sec-1:checked ~ .env-config-tabs label[for="env-sec-1"],
#env-sec-2:checked ~ .env-config-tabs label[for="env-sec-2"],
#env-sec-3:checked ~ .env-config-tabs label[for="env-sec-3"],
#env-sec-4:checked ~ .env-config-tabs label[for="env-sec-4"],
#env-sec-5:checked ~ .env-config-tabs label[for="env-sec-5"],
#env-sec-6:checked ~ .env-config-tabs label[for="env-sec-6"],
#env-sec-7:checked ~ .env-config-tabs label[for="env-sec-7"],
#env-sec-8:checked ~ .env-config-tabs label[for="env-sec-8"],
#env-sec-9:checked ~ .env-config-tabs label[for="env-sec-9"],
#env-sec-10:checked ~ .env-config-tabs label[for="env-sec-10"],
#env-sec-11:checked ~ .env-config-tabs label[for="env-sec-11"] {
  color: #e8ecff;
  border-bottom-color: var(--accent, #7c6cf0);
  font-weight: 600;
}

#env-sec-0:checked ~ .env-config-panels .env-panel--0,
#env-sec-1:checked ~ .env-config-panels .env-panel--1,
#env-sec-2:checked ~ .env-config-panels .env-panel--2,
#env-sec-3:checked ~ .env-config-panels .env-panel--3,
#env-sec-4:checked ~ .env-config-panels .env-panel--4,
#env-sec-5:checked ~ .env-config-panels .env-panel--5,
#env-sec-6:checked ~ .env-config-panels .env-panel--6,
#env-sec-7:checked ~ .env-config-panels .env-panel--7,
#env-sec-8:checked ~ .env-config-panels .env-panel--8,
#env-sec-9:checked ~ .env-config-panels .env-panel--9,
#env-sec-10:checked ~ .env-config-panels .env-panel--10,
#env-sec-11:checked ~ .env-config-panels .env-panel--11 {
  display: block;
}

#settings-sec-0:checked ~ .env-config-tabs label[for="settings-sec-0"],
#settings-sec-1:checked ~ .env-config-tabs label[for="settings-sec-1"],
#settings-sec-2:checked ~ .env-config-tabs label[for="settings-sec-2"],
#settings-sec-3:checked ~ .env-config-tabs label[for="settings-sec-3"],
#settings-sec-4:checked ~ .env-config-tabs label[for="settings-sec-4"],
#settings-sec-5:checked ~ .env-config-tabs label[for="settings-sec-5"],
#settings-sec-6:checked ~ .env-config-tabs label[for="settings-sec-6"] {
  color: #e8ecff;
  border-bottom-color: var(--accent, #7c6cf0);
  font-weight: 600;
}

#settings-sec-0:checked ~ .env-config-panels .env-panel--0,
#settings-sec-1:checked ~ .env-config-panels .env-panel--1,
#settings-sec-2:checked ~ .env-config-panels .env-panel--2,
#settings-sec-3:checked ~ .env-config-panels .env-panel--3,
#settings-sec-4:checked ~ .env-config-panels .env-panel--4,
#settings-sec-5:checked ~ .env-config-panels .env-panel--5,
#settings-sec-6:checked ~ .env-config-panels .env-panel--6 {
  display: block;
}

.env-sensitive-current {
  margin: 0 0 6px;
  font-size: 0.75rem;
}

.env-masked-value {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: 0.04em;
  color: #c5cae0;
}

.settings-tab-panel h2 {
  margin: 0 0 8px;
  font-size: 1rem;
}

.settings-tab-inner h2 {
  margin: 0 0 8px;
  font-size: 1rem;
}

.settings-config-body {
  margin-top: 10px;
}

.env-config-panels {
  padding: 14px 16px 16px;
}

.env-panel-hint {
  margin: 0 0 12px;
  padding: 8px 10px;
  font-size: 0.75rem;
  border-radius: 6px;
  background: rgba(251, 191, 36, 0.08);
  color: #e8c468;
  border: 1px solid rgba(251, 191, 36, 0.15);
}

.env-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 20px;
  align-items: start;
}

.env-field-row {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

/* display:flex 会盖掉 UA [hidden];全仓复利开时隐藏单笔预算等依赖此规则 */
.env-field-row[hidden] {
  display: none !important;
}

.env-field-row--restart .env-field-label {
  color: #d4c4a0;
}

.env-field-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: #c5cae0;
  line-height: 1.3;
}

.env-restart-mark {
  color: #fbbf24;
  font-weight: 700;
  margin-left: 2px;
}

.env-field-note {
  font-size: 0.72rem;
  line-height: 1.35;
  margin-top: -2px;
}

.env-field-input {
  width: 100%;
  font-size: 0.82rem;
  padding: 7px 10px;
  border-radius: 6px;
  box-sizing: border-box;
}

.env-config-loading-wrap {
  padding: 24px;
  text-align: center;
}

/* 兼容旧结构 */
.env-config-grid {
  display: block;
}

.env-group-card,
.env-field-card,
.env-field-badge,
.env-badge-hot,
.env-badge-restart {
  display: none;
}

@media (max-width: 900px) {
  .env-form-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .env-config-head-row {
    flex-direction: column;
  }
  .env-config-toolbar {
    width: 100%;
  }
}

.display-prefs-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 8px;
}

.display-prefs-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.display-prefs-checks .chk-label {
  font-size: 0.82rem;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.settings-password-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  margin: 8px 0;
}

.settings-password-form label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.78rem;
  color: var(--muted, #8892b0);
}

.settings-actions-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
}

.settings-status-line.err {
  color: var(--danger, #f87171);
}

@media (max-width: 1100px) {
  .env-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .env-form-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .settings-password-form {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ── 风控说明页 ── */
.risk-policy-page {
  margin-top: 12px;
  width: 100%;
  min-width: 0;
  grid-column: 1 / -1;
}

.risk-policy-page .settings-card--risk {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  height: auto;
}

.settings-risk-sections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: 10px;
  margin-top: 10px;
  align-items: stretch;
}

.risk-policy-page .settings-subcard {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
  min-width: 0;
  margin: 0;
  width: 100%;
  box-sizing: border-box;
}

.settings-page--grid {
  margin-top: 12px;
}

.settings-grid-2col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.settings-grid-cell {
  min-width: 0;
}

.settings-grid-cell--full {
  grid-column: 1 / -1;
}

.settings-card--standalone {
  padding: 12px 14px;
  height: 100%;
}

.settings-card--standalone h2 {
  margin: 0 0 8px;
  font-size: 1.05rem;
}

.settings-card--export .settings-export-links-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-top: 8px;
}

.settings-page--ops {
  max-width: 720px;
}

.settings-page--ops .settings-card--side-panel {
  height: auto;
}

/* ── 系统设置页 ── */
.settings-page {
  margin-top: 12px;
  width: 100%;
  min-width: 0;
  grid-column: 1 / -1;
}

.settings-account-summary {
  margin-bottom: 16px;
  padding: 12px 14px 10px;
}

.settings-account-summary .instance-header-stats {
  border-top: none;
  margin-top: 0;
  padding-top: 4px;
}

.settings-account-summary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.settings-account-summary-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.settings-cards-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
}

.settings-cards-grid > .settings-card--risk,
.settings-cards-grid > .settings-side-col {
  min-height: 0;
}

.settings-side-col {
  display: flex;
  flex-direction: column;
  align-self: stretch;
}

.settings-card--side-panel {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
}

.settings-side-subcards {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 auto;
}

.settings-side-subcards > .settings-subcard {
  flex: 0 0 auto;
  padding: 8px 10px;
  margin: 0;
}

.settings-subcard-desc {
  font-size: 0.7rem;
  margin: 0 0 6px;
  line-height: 1.4;
  color: var(--muted, #8892b0);
}

.settings-card--risk {
  min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.settings-side-export {
  flex: 0 0 auto;
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px solid var(--border-soft, #2a3150);
}

.settings-side-export-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
}

.settings-side-export-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: #a8b0cc;
}

.settings-side-export-meta {
  font-size: 0.68rem;
}

.settings-export-links-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
}

.settings-export-links-inline a {
  font-size: 0.72rem;
  color: #8fc8ff;
  text-decoration: none;
  white-space: nowrap;
}

.settings-export-links-inline a:hover {
  text-decoration: underline;
}

.settings-card--compact {
  padding: 10px 12px;
}

.settings-card--compact h2 {
  margin: 0 0 6px;
  font-size: 0.88rem;
  font-weight: 600;
}

.settings-card--compact .settings-card-desc {
  font-size: 0.72rem;
  margin: 0 0 8px;
  line-height: 1.45;
}

.settings-card--compact .settings-transfer-auto,
.settings-card--compact .settings-transfer-form {
  font-size: 0.72rem;
}

.settings-card--compact .settings-transfer-form input,
.settings-card--compact .settings-transfer-form select,
.settings-card--compact .settings-transfer-form button {
  font-size: 0.75rem;
  padding: 4px 8px;
}

.settings-card--compact .settings-export-link {
  font-size: 0.75rem;
  padding: 5px 10px;
}

@media (max-width: 900px) {
  .settings-grid-2col {
    grid-template-columns: minmax(0, 1fr);
  }
  .settings-cards-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.settings-card h2 {
  margin: 0 0 10px;
  font-size: 1.05rem;
}

.settings-card-desc,
.settings-env-hint,
.settings-transfer-auto {
  color: var(--muted, #8892b0);
  font-size: 0.82rem;
  line-height: 1.5;
  margin: 0 0 12px;
}

.settings-live-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 0.88rem;
  margin: 0 0 10px;
}

.settings-status-reason,
.settings-policy-note {
  color: var(--muted, #8892b0);
  font-size: 0.8rem;
}

.settings-subcard-title {
  margin: 0 0 8px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #cfd3ef;
}

.settings-kv--compact .settings-kv-row {
  grid-template-columns: minmax(7em, auto) minmax(0, 1fr);
  gap: 6px 12px;
  padding: 4px 0;
  font-size: 0.75rem;
  align-items: start;
}

@media (max-width: 720px) {
  .settings-risk-sections {
    grid-template-columns: minmax(0, 1fr);
  }

  .settings-kv--compact .settings-kv-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }

  .settings-kv--compact .settings-kv-row dd {
    margin-bottom: 6px;
  }
}

.settings-section {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border-soft, #2a3150);
}

.settings-section h3 {
  margin: 0 0 8px;
  font-size: 0.92rem;
  color: #cfd3ef;
}

.settings-kv {
  margin: 0;
}

.settings-kv-row {
  display: grid;
  grid-template-columns: 9.5em 1fr;
  gap: 8px 12px;
  padding: 6px 0;
  font-size: 0.82rem;
  border-bottom: 1px dashed rgba(136, 146, 176, 0.15);
}

.settings-kv-row:last-child {
  border-bottom: none;
}

.settings-kv-row dt {
  margin: 0;
  color: #9aa3c7;
}

.settings-kv-row dd {
  margin: 0;
}

.settings-kv-value {
  color: #e8ecff;
  font-weight: 600;
}

.settings-kv-note {
  display: block;
  margin-top: 2px;
  color: #8892b0;
  font-size: 0.75rem;
  font-weight: 400;
}

.settings-link-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.settings-export-link {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--border-soft, #2a3150);
  background: var(--inset-surface, #12151f);
  color: #8fc8ff;
  text-decoration: none;
  font-size: 0.88rem;
}

.settings-export-link:hover {
  border-color: #3d4f7a;
  background: #1a2030;
}

.settings-transfer-form {
  margin-top: 10px;
}

html[data-theme="light"] .settings-section {
  border-top-color: #d0dae4;
}

html[data-theme="light"] .settings-subcard-title,
html[data-theme="light"] .settings-section h3,
html[data-theme="light"] .settings-kv-value {
  color: #142232;
}

html[data-theme="light"] .settings-export-link,
html[data-theme="light"] .settings-export-links-inline a {
  background: transparent;
  border-color: transparent;
  color: #1d4f8c;
}

html[data-theme="light"] .settings-side-export {
  border-top-color: #d0dae4;
}

html[data-theme="light"] .settings-side-export-label {
  color: #142232;
}

/* OKX 期权页 */
.options-page-wrap {
  font-size: 0.8rem;
}

.options-page-wrap .card {
  padding: 12px 14px;
}

.options-page-wrap .card h2,
.options-page-wrap .options-order-card h2,
.options-page-wrap .options-pos-card-wrap h2,
.options-page-wrap .options-pos-head h2 {
  font-size: 0.9rem;
  margin: 0 0 8px;
  font-weight: 600;
}
.options-page-wrap .options-pos-head h2 {
  margin: 0;
}
.options-page-wrap .options-hint,
.options-page-wrap #opt-index-line {
  font-size: 0.72rem;
  line-height: 1.45;
  margin-bottom: 6px;
}

.options-page-wrap .options-chain-toolbar .btn-secondary,
.options-page-wrap .options-chain-toolbar select {
  font-size: 0.72rem;
  padding: 4px 8px;
  min-height: 28px;
}

.options-page-wrap .options-pos-head .btn-secondary,
.options-page-wrap .options-pos-head .opt-pos-refresh-btn {
  font-size: 0.72rem;
  padding: 3px 10px;
  min-height: 26px;
}
.options-page-wrap .options-pos-head .opt-pos-refresh-btn {
  font-size: 1rem;
  line-height: 1;
  min-width: 32px;
  padding: 4px 10px;
}

.options-funds-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin: 12px 0 16px;
}
.options-funds-col {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  padding: 12px;
}
.options-fund-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin: 6px 0;
  font-size: 0.9rem;
}
.options-section {
  margin: 16px 0;
}
.options-section.card-nested {
  padding: 12px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.15);
}
.options-strike-table-wrap {
  overflow-x: auto;
  overflow-y: auto;
  max-height: 352px;
  margin-top: 8px;
}
.options-strike-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: rgba(18, 24, 38, 0.98);
}
/* 列表 / T 型表头互斥:类名 hidden 需显式隐藏(实例页无全局 .hidden) */
.options-strike-table thead tr.hidden {
  display: none !important;
}
.options-strike-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.75rem;
}
.options-page-wrap .options-strike-table {
  font-size: 0.74rem;
}
.options-strike-table th,
.options-strike-table td {
  padding: 6px 5px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  text-align: left;
}
.options-page-wrap .options-strike-table th,
.options-page-wrap .options-strike-table td {
  padding: 5px 4px;
}
.options-page-wrap .options-strike-table code {
  font-size: 0.66rem;
}
.opt-px-sz {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.opt-chain-lev {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-weight: 600;
  color: #b8c8ff;
}
html[data-theme="light"] .opt-chain-lev {
  color: #1a4a8a;
}
.opt-be-dist-up {
  color: #5ee89a;
}
.opt-be-dist-down {
  color: #ff8a8a;
}
html[data-theme="light"] .opt-be-dist-up {
  color: #0d7a45;
}
html[data-theme="light"] .opt-be-dist-down {
  color: #c62828;
}
.options-chain-toolbar .btn-secondary.active,
.opt-uly-btn.active,
.opt-type-btn.active,
.opt-money-btn.active,
.opt-view-btn.active,
.opt-pos-tab.active {
  border-color: #5b8cff;
  color: #cfe0ff;
  background: rgba(74, 124, 255, 0.28);
  box-shadow: inset 0 0 0 1px rgba(120, 160, 255, 0.45);
}
.opt-pick-btn.active {
  border-color: #5b8cff;
  color: #fff;
  background: rgba(74, 124, 255, 0.45);
  box-shadow: inset 0 0 0 1px rgba(140, 175, 255, 0.6);
}
.opt-strike-row.opt-row-selected td {
  background: rgba(74, 124, 255, 0.1);
}
.opt-strike-row.opt-row-selected td:first-child {
  box-shadow: inset 3px 0 0 #5b8cff;
}
.opt-chain-view-group {
  display: inline-flex;
  gap: 4px;
}
.opt-type-btn-group {
  display: inline-flex;
  gap: 4px;
}
.opt-strike-expand-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  color: var(--text-soft, #9aa4b2);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.opt-strike-expand-label input {
  margin: 0;
}
.options-strike-table-wrap--t {
  max-height: 380px;
}

/* 对冲计划 Tab：高对比选中态 */
.hedge-plan-page-wrap {
  font-size: 0.8rem;
}
.hedge-plan-page-wrap .card {
  padding: 12px 14px;
}
.hedge-plan-page-wrap .card h2,
.hedge-plan-page-wrap .hp-title {
  font-size: 0.9rem;
  margin: 0 0 8px;
  font-weight: 600;
}
.hedge-plan-page-wrap .hp-head-card {
  margin-bottom: 12px;
}
.hedge-plan-page-wrap .hp-rule-collapse {
  margin: 0 0 10px;
  border: none;
  background: transparent;
  box-shadow: none;
}
.hedge-plan-page-wrap .hp-rule-collapse > .tip-collapse-summary {
  padding: 4px 0;
  font-size: 0.78rem;
}
.hedge-plan-page-wrap .hp-rule-collapse .tip-collapse-body {
  padding: 6px 0 2px;
}
.hedge-plan-page-wrap .hp-rule-collapse .tip-collapse-body.rule-tip {
  margin: 0;
  border: none;
  background: transparent;
  padding: 0;
}
.hedge-plan-page-wrap .hp-rule-collapse .tip-collapse-body p {
  margin: 0 0 6px;
  font-size: 0.74rem;
  line-height: 1.45;
}
.hedge-plan-page-wrap .hp-rule-collapse .tip-collapse-body p:last-child {
  margin-bottom: 0;
}
.hedge-plan-page-wrap .hp-head-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.hedge-plan-page-wrap .hp-title {
  margin: 0;
}
.hedge-plan-page-wrap .hp-title-sub {
  font-size: 0.75rem;
  font-weight: 400;
}
.hedge-plan-page-wrap .hp-quote-line,
.hedge-plan-page-wrap .hp-acct-hint,
.hedge-plan-page-wrap #hp-sizing-line,
.hedge-plan-page-wrap #hp-gate-line {
  font-size: 0.72rem;
  line-height: 1.45;
  margin: 4px 0 6px;
}
.hedge-plan-page-wrap .hp-acct-tag {
  font-size: 0.68rem;
  font-weight: 500;
  margin-left: 4px;
}
.hedge-plan-page-wrap .hp-unit {
  font-size: 0.66rem;
  color: #8892b0;
  font-weight: 500;
  margin-right: 2px;
}
.hedge-plan-page-wrap .hp-unit-hint {
  font-size: 0.68rem;
  margin: 2px 0 6px;
  line-height: 1.4;
}
.hedge-plan-page-wrap #hp-perp-pnl-line {
  font-size: 0.74rem;
  margin: 4px 0 6px;
  line-height: 1.45;
}
.hedge-plan-page-wrap .hp-pnl-pos {
  color: #7ee787;
}
.hedge-plan-page-wrap .hp-plan-active {
  color: #7ee787;
  font-weight: 700;
}
.hedge-plan-page-wrap .hp-plan-partial {
  color: #ffb454;
  font-weight: 700;
}
.hedge-plan-page-wrap .hp-hist-actions .hp-btn-complete {
  margin-right: 6px;
  padding: 3px 8px;
  font-size: 0.72rem;
  min-height: 26px;
}
.hedge-plan-page-wrap .hp-pnl-neg {
  color: #ff8a8a;
}
.hedge-plan-page-wrap .hp-oo-legs {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hedge-plan-page-wrap .hp-oo-target-row {
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 10px 14px;
}
.hedge-plan-page-wrap .hp-oo-index {
  display: inline-flex;
  align-items: center;
  margin: 0 0 2px;
  padding: 4px 0;
  font-size: 0.9rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #3dd68c;
  white-space: nowrap;
}
.hedge-plan-page-wrap .hp-oo-transfer {
  margin: 10px 0 4px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.hedge-plan-page-wrap .hp-oo-transfer--compact {
  margin: 12px 0 8px;
  padding: 8px 10px;
}
.hedge-plan-page-wrap .hp-oo-transfer-bals {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 8px;
  margin-bottom: 6px;
  font-size: 0.76rem;
}
.hedge-plan-page-wrap .hp-oo-transfer-bals strong {
  color: var(--text, #e6edf3);
  font-variant-numeric: tabular-nums;
}
.hedge-plan-page-wrap .hp-oo-transfer-unit {
  opacity: 0.75;
}
.hedge-plan-page-wrap .hp-oo-transfer-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.hedge-plan-page-wrap .hp-oo-transfer-form select,
.hedge-plan-page-wrap .hp-oo-transfer-form input[type="number"] {
  font-size: 0.74rem;
}
.hedge-plan-page-wrap .hp-oo-transfer-form input[type="number"] {
  width: 96px;
  max-width: 30vw;
}
.hedge-plan-page-wrap #hp-oo-xfer-msg {
  margin-left: auto;
  font-size: 0.72rem;
  min-height: 1.1em;
}
.hedge-plan-page-wrap #hp-oo-xfer-msg.is-err {
  color: #ff8a8a;
}
.hedge-plan-page-wrap #hp-oo-xfer-msg.is-ok {
  color: #3dd68c;
}
.hedge-plan-page-wrap .hp-oo-controls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
  margin: 10px 0 4px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.hedge-plan-page-wrap .hp-oo-ctrl {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.hedge-plan-page-wrap .hp-oo-ctrl-lab {
  font-size: 0.72rem;
  color: var(--muted, #8b949e);
  letter-spacing: 0.02em;
}
.hedge-plan-page-wrap .hp-oo-seg {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.hedge-plan-page-wrap .hp-oo-seg .btn-secondary {
  flex: 1 1 auto;
  min-width: 4.5em;
  justify-content: center;
  padding: 5px 8px;
  position: relative;
}
.hedge-plan-page-wrap .hp-oo-check {
  display: none;
  margin-right: 4px;
  font-weight: 700;
}
.hedge-plan-page-wrap .hp-oo-size-mode.is-selected,
.hedge-plan-page-wrap .hp-oo-close-mode.is-selected,
.hedge-plan-page-wrap .hp-po-dir.is-selected,
.hedge-plan-page-wrap .hp-oo-size-mode.active,
.hedge-plan-page-wrap .hp-oo-close-mode.active,
.hedge-plan-page-wrap .hp-po-dir.active {
  border-color: var(--accent, #00d4ff);
  color: var(--text, #fff);
  background: rgba(0, 212, 255, 0.16);
  box-shadow: inset 0 0 0 1px rgba(0, 212, 255, 0.35);
  font-weight: 700;
}
.hedge-plan-page-wrap .hp-oo-size-mode.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-close-mode.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-po-dir.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-size-mode.active .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-close-mode.active .hp-oo-check,
.hedge-plan-page-wrap .hp-po-dir.active .hp-oo-check {
  display: inline;
  color: var(--accent, #00d4ff);
}
.hedge-plan-page-wrap .hp-po-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin: 8px 0 4px;
}
.hedge-plan-page-wrap .hp-po-dir-seg {
  flex: 1 1 180px;
  max-width: 220px;
}
.hedge-plan-page-wrap .hp-po-mark {
  font-size: 0.95rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #3dd68c;
  white-space: nowrap;
}
.hedge-plan-page-wrap .hp-po-meta {
  margin: 2px 0 8px;
  font-size: 0.74rem;
  line-height: 1.4;
}
.hedge-plan-page-wrap .hp-po-mode-badge {
  display: inline-block;
  margin-right: 6px;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #c4b5fd;
  background: rgba(139, 92, 246, 0.22);
  border: 1px solid rgba(167, 139, 250, 0.35);
  vertical-align: middle;
}
.hedge-plan-page-wrap .hp-po-mode-badge.is-insurance {
  color: #93c5fd;
  background: rgba(59, 130, 246, 0.18);
  border-color: rgba(96, 165, 250, 0.35);
}
.hedge-plan-page-wrap .hp-po-section {
  margin: 8px 0 10px;
}
.hedge-plan-page-wrap .hp-po-section-title {
  margin: 0 0 6px;
  font-size: 0.8rem;
  font-weight: 650;
  color: #c5cdd9;
  letter-spacing: 0.02em;
}
.hedge-plan-page-wrap .hp-po-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  margin: 8px 0 6px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.hedge-plan-page-wrap .hp-po-fields--section {
  margin: 0;
}
.hedge-plan-page-wrap .hp-po-fields--capital {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.hedge-plan-page-wrap .hp-po-fields--select {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: end;
}
.hedge-plan-page-wrap .hp-po-field--type {
  min-width: 0;
}
.hedge-plan-page-wrap .hp-po-field--type select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.hedge-plan-page-wrap .hp-plan-watching {
  color: #fbbf24;
  font-weight: 650;
}
@media (max-width: 720px) {
  .hedge-plan-page-wrap .hp-po-fields--capital,
  .hedge-plan-page-wrap .hp-po-fields--select {
    grid-template-columns: 1fr 1fr;
  }
  .hedge-plan-page-wrap .hp-po-field--type {
    grid-column: 1 / -1;
  }
  .hedge-plan-page-wrap .hp-po-type-seg {
    flex-wrap: wrap;
  }
}
.hedge-plan-page-wrap .hp-po-right-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  height: 100%;
}
.hedge-plan-page-wrap .hp-po-right-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  min-height: 0;
  flex: 1 1 auto;
}
.hedge-plan-page-wrap .hp-po-inner-card {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  min-width: 0;
  min-height: 0;
}
.hedge-plan-page-wrap .hp-po-inner-card > h2 {
  margin: 0 0 8px;
  font-size: 0.95rem;
}
.hedge-plan-page-wrap .hp-po-action-row {
  margin-top: auto;
  padding-top: 10px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
.hedge-plan-page-wrap .hp-po-strategy-status {
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  min-height: 1.2em;
}
.hedge-plan-page-wrap .hp-po-strategy-status.is-watching {
  color: #fbbf24;
}
.hedge-plan-page-wrap .hp-po-strategy-status.is-holding {
  color: #3dd68c;
}
.hedge-plan-page-wrap .hp-po-strategy-status.is-idle {
  color: #6b7388;
  font-weight: 500;
}
.hedge-plan-page-wrap .hp-po-quote-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
}
.hedge-plan-page-wrap .hp-po-ins-money {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}
.hedge-plan-page-wrap .hp-po-ins-money[hidden],
.hedge-plan-page-wrap .hp-po-ins-money.hidden {
  display: none !important;
}
/* display:grid 会盖掉 [hidden];模式切换必须显式 none */
.hedge-plan-page-wrap .hp-po-fields.hidden,
.hedge-plan-page-wrap .hp-po-fields[hidden],
.hedge-plan-page-wrap #hp-po-fields-option-primary.hidden,
.hedge-plan-page-wrap #hp-po-fields-option-primary[hidden] {
  display: none !important;
}
.hedge-plan-page-wrap .hp-strike-table-wrap--6 {
  max-height: 280px;
  min-height: 200px;
  overflow-y: auto;
  margin-top: 4px;
  flex: 1 1 auto;
}
.hedge-plan-page-wrap .hp-po-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  margin: 0;
  font-size: 0.78rem;
}
.hedge-plan-page-wrap .hp-po-field-lab {
  color: #9aa4b2;
  font-size: 0.72rem;
}
.hedge-plan-page-wrap .hp-po-field-lab em {
  font-style: normal;
  color: #6b7388;
  margin-left: 2px;
}
.hedge-plan-page-wrap .hp-po-field input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.hedge-plan-page-wrap .hp-po-field--tp input {
  border-color: rgba(61, 214, 140, 0.45);
}
.hedge-plan-page-wrap .hp-po-field--sl input {
  border-color: rgba(255, 138, 138, 0.45);
}
.hedge-plan-page-wrap .hp-po-summary {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 4px;
}
.hedge-plan-page-wrap .hp-po-pnl {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.hedge-plan-page-wrap .hp-po-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.76rem;
}
.hedge-plan-page-wrap .hp-po-sizing {
  font-size: 0.74rem;
  line-height: 1.4;
}
.hedge-plan-page-wrap .hp-po-opt-toolbar {
  align-items: center;
}
.hedge-plan-page-wrap .hp-po-index {
  margin-left: auto;
  font-size: 0.9rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #3dd68c;
  white-space: nowrap;
}
@media (max-width: 720px) {
  .hedge-plan-page-wrap .hp-po-fields {
    grid-template-columns: 1fr;
  }
  .hedge-plan-page-wrap .hp-po-index {
    margin-left: 0;
  }
}
.hedge-plan-page-wrap #hp-oo-close-mode-row.hidden {
  display: none !important;
}
.hedge-plan-page-wrap .hp-oo-controls:has(#hp-oo-close-mode-row.hidden) {
  grid-template-columns: 1fr;
}
.hedge-plan-page-wrap .hp-oo-meta {
  margin: 4px 0 0;
  font-size: 0.75rem;
  line-height: 1.4;
}
.hedge-plan-page-wrap #hp-oo-budget-line.hp-oo-budget-warn {
  color: #ff8a8a;
}
@media (max-width: 720px) {
  .hedge-plan-page-wrap .hp-oo-controls {
    grid-template-columns: 1fr;
  }
}
.hedge-plan-page-wrap .hp-oo-leg-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.hedge-plan-page-wrap .hp-oo-leg-row input[type="number"] {
  width: 72px;
}
.hedge-plan-page-wrap .form-row label,
.hedge-plan-page-wrap .form-row select,
.hedge-plan-page-wrap .form-row input,
.hedge-plan-page-wrap .form-row .btn-secondary,
.hedge-plan-page-wrap .form-row .primary {
  font-size: 0.74rem;
}
.hedge-plan-page-wrap .form-row input[type="number"] {
  max-width: 110px;
  padding: 4px 6px;
  min-height: 28px;
}
.hedge-plan-page-wrap .options-strike-table {
  font-size: 0.74rem;
}
.hedge-plan-page-wrap .options-strike-table th,
.hedge-plan-page-wrap .options-strike-table td {
  padding: 5px 4px;
}
.hedge-plan-page-wrap .options-strike-table code {
  font-size: 0.66rem;
}
.hedge-plan-page-wrap .hp-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 8px;
  padding: 6px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.hedge-plan-page-wrap .hp-tab {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: #aeb6c5;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 7px 14px;
  border-radius: 8px;
  cursor: pointer;
  line-height: 1.2;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.hedge-plan-page-wrap .hp-tab:hover {
  color: #eef3ff;
  border-color: rgba(120, 170, 255, 0.45);
  background: rgba(74, 124, 255, 0.16);
}
.hedge-plan-page-wrap .hp-tab.active {
  color: #0b1220;
  background: linear-gradient(180deg, #d7e6ff 0%, #8eb6ff 100%);
  border-color: #fff;
  box-shadow: 0 0 0 2px rgba(142, 182, 255, 0.55), 0 6px 16px rgba(0, 0, 0, 0.35);
}
.hedge-plan-page-wrap .hp-uly-btn,
.hedge-plan-page-wrap .hp-uly-btn-oo,
.hedge-plan-page-wrap .hp-money-btn,
.hedge-plan-page-wrap .hp-oo-money-btn,
.hedge-plan-page-wrap .hp-oo-recommend-btn,
.hedge-plan-page-wrap .hp-oo-expand-btn {
  min-width: 52px;
  font-weight: 600;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: #9aa4b2;
}
.hedge-plan-page-wrap .hp-uly-btn.active,
.hedge-plan-page-wrap .hp-uly-btn-oo.active,
.hedge-plan-page-wrap .hp-money-btn.active,
.hedge-plan-page-wrap .hp-oo-money-btn.is-selected,
.hedge-plan-page-wrap .hp-oo-money-btn.active,
.hedge-plan-page-wrap .hp-oo-recommend-btn.is-selected,
.hedge-plan-page-wrap .hp-oo-recommend-btn.active,
.hedge-plan-page-wrap .hp-oo-expand-btn.is-selected,
.hedge-plan-page-wrap .hp-oo-expand-btn.active {
  border-color: var(--accent, #00d4ff);
  color: var(--text, #fff);
  background: rgba(0, 212, 255, 0.16);
  box-shadow: inset 0 0 0 1px rgba(0, 212, 255, 0.35);
  font-weight: 700;
}
.hedge-plan-page-wrap .hp-oo-money-btn .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-recommend-btn .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-expand-btn .hp-oo-check {
  display: none;
  margin-right: 4px;
  font-weight: 700;
}
.hedge-plan-page-wrap .hp-oo-money-btn.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-money-btn.active .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-recommend-btn.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-recommend-btn.active .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-expand-btn.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-expand-btn.active .hp-oo-check {
  display: inline;
  color: var(--accent, #00d4ff);
}
.hedge-plan-page-wrap .hp-money-hint {
  font-size: 0.68rem;
  margin-left: 4px;
}
.hedge-plan-page-wrap .hp-opt-toolbar,
.hedge-plan-page-wrap .hp-pick-row {
  flex-wrap: wrap;
  gap: 6px;
  margin: 4px 0;
  align-items: center;
}
.hedge-plan-page-wrap .hp-opt-toolbar select {
  max-width: 168px;
  font-size: 0.72rem;
  padding: 3px 6px;
  min-height: 26px;
}
.hedge-plan-page-wrap .hp-opt-toolbar .btn-secondary,
.hedge-plan-page-wrap .hp-opt-toolbar .hp-money-btn,
.hedge-plan-page-wrap .hp-oo-money-btn,
.hedge-plan-page-wrap .hp-oo-recommend-btn,
.hedge-plan-page-wrap .hp-oo-expand-btn {
  padding: 3px 8px;
  min-height: 26px;
  font-size: 0.72rem;
}
/* 永期期权列表:视口约 5 行 + 表头,超出滚动 */
.hedge-plan-page-wrap .hp-strike-table-wrap--5 {
  max-height: 248px;
  min-height: 248px;
  overflow-y: auto;
  margin-top: 4px;
  flex: 1 1 auto;
}
/* 期期 T 型:默认 3+3 一页展示,无下滑框 */
.hedge-plan-page-wrap .hp-oo-table-wrap {
  max-height: none;
  min-height: 0;
  overflow: visible;
  margin-top: 4px;
  flex: 0 0 auto;
}
.hedge-plan-page-wrap .opt-chain-lev,
.hedge-plan-page-wrap .hp-oo-table-wrap .opt-chain-lev {
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.hedge-plan-page-wrap .hp-opt-bal-line {
  margin-top: 4px;
}
.hedge-plan-page-wrap .hp-acct-hint {
  display: none;
}
.hedge-plan-page-wrap .options-dual-grid {
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  margin-bottom: 28px;
}
.hedge-plan-page-wrap .options-dual-grid > .card {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.hedge-plan-page-wrap #hp-po-layout {
  align-items: stretch;
}
.hedge-plan-page-wrap #hp-po-layout > .card {
  align-self: stretch;
}
.hedge-plan-page-wrap .hp-po-right-stack > .hp-po-perp-quote-card {
  height: auto;
  flex: 0 0 auto;
}
.hedge-plan-page-wrap .hp-po-right-stack > .hp-opt-card {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.hedge-plan-page-wrap .hp-po-right-stack > .hp-opt-card .hp-strike-table-wrap--6 {
  flex: 1 1 auto;
}
.hedge-plan-page-wrap .hp-action-row {
  margin-top: 10px;
  gap: 8px;
  justify-content: flex-end;
}
.hedge-plan-page-wrap .hp-preview-modal {
  width: min(96vw, 920px);
}
.hedge-plan-page-wrap .hp-preview-summary {
  margin: 0 0 10px;
  font-size: 0.84rem;
  line-height: 1.45;
}
.hedge-plan-page-wrap .hp-preview-actions {
  margin-top: 14px;
  justify-content: flex-end;
  gap: 10px;
}
.hedge-plan-page-wrap .hp-pick.active,
.hedge-plan-page-wrap .opt-row-selected td {
  background: rgba(90, 140, 255, 0.18);
}
.hedge-plan-page-wrap .hp-oo-pick.is-selected,
.hedge-plan-page-wrap .hp-oo-pick.active {
  border-color: var(--accent, #00d4ff);
  color: var(--text, #fff);
  background: rgba(0, 212, 255, 0.22);
  box-shadow: inset 0 0 0 1px rgba(0, 212, 255, 0.45), 0 0 0 2px rgba(0, 212, 255, 0.2);
  font-weight: 700;
}
.hedge-plan-page-wrap .hp-oo-side-selected {
  background: rgba(0, 212, 255, 0.12);
}
.hedge-plan-page-wrap tr.hp-oo-row-selected td.opt-t-strike {
  color: var(--accent, #00d4ff);
}
.hedge-plan-page-wrap .hp-tab-panel.hidden,
.hedge-plan-page-wrap .hp-tab-panel[hidden] {
  display: none !important;
}
.hedge-plan-page-wrap .hp-placeholder {
  margin: 16px 0 4px;
  padding: 18px;
  text-align: center;
  border-radius: 8px;
  border: 1px dashed rgba(255, 255, 255, 0.16);
  color: #9aa4b2;
  background: rgba(255, 255, 255, 0.03);
  font-size: 0.78rem;
}
.hedge-plan-page-wrap .hp-target-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin: 6px 0;
}
.hedge-plan-page-wrap .hp-target-row label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
}
.hedge-plan-page-wrap .hp-target-row input {
  width: 110px;
}
.hedge-plan-page-wrap .hp-contracts-cell {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hedge-plan-page-wrap .hp-hist-actions {
  white-space: nowrap;
}
.hedge-plan-page-wrap .hp-hist-actions .btn-secondary {
  padding: 3px 8px;
  font-size: 0.72rem;
  min-height: 26px;
}
.hedge-plan-page-wrap .hp-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-top: 8px;
}
.hedge-plan-page-wrap .hp-stats-grid--sub {
  margin-top: 14px;
}
.hedge-plan-page-wrap .hp-stats-card {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  padding: 12px 14px;
  background: rgba(0, 0, 0, 0.22);
}
.hedge-plan-page-wrap .hp-stats-card h3 {
  margin: 0 0 8px;
  font-size: 0.92rem;
  color: #e8eefc;
}
.hedge-plan-page-wrap .hp-stats-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hedge-plan-page-wrap .hp-stats-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  margin: 5px 0;
  font-size: 0.8rem;
}
.hedge-plan-page-wrap .hp-stats-list li > span:first-child {
  color: #9aa4b2;
  min-width: 4.5em;
}
.hedge-plan-page-wrap .hp-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1300;
  background: rgba(0, 0, 0, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.hedge-plan-page-wrap .hp-modal-backdrop[hidden] {
  display: none !important;
}
.hedge-plan-page-wrap .hp-modal {
  width: min(96vw, 980px);
  max-height: 88vh;
  overflow: auto;
  background: #121726;
  border: 1px solid #2a3150;
  border-radius: 12px;
  padding: 14px 16px;
}
.hedge-plan-page-wrap .hp-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.hedge-plan-page-wrap .hp-modal-head h3 {
  margin: 0;
  font-size: 1rem;
  color: #dbe4ff;
}
.hedge-plan-page-wrap .hp-detail-summary {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
  font-size: 0.82rem;
  color: #e5e9ff;
}
.hedge-plan-page-wrap .hp-detail-legs {
  margin-top: 4px;
}
.hedge-plan-page-wrap .hp-ord {
  font-size: 0.62rem;
  word-break: break-all;
}
.hedge-plan-page-wrap .hp-detail-note {
  margin-top: 10px;
  font-size: 0.82rem;
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-modal {
  background: #f7f8fc;
  border-color: #c9d2e8;
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-modal-head h3 {
  color: #1a2438;
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-stats-card {
  background: rgba(255, 255, 255, 0.7);
  border-color: rgba(0, 0, 0, 0.08);
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-stats-card h3 {
  color: #1a2438;
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-tabs {
  background: rgba(15, 23, 42, 0.06);
  border-color: rgba(15, 23, 42, 0.1);
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-tab {
  background: #fff;
  color: #5b6472;
  border-color: rgba(15, 23, 42, 0.14);
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-tab.active {
  color: #0b1220;
  background: linear-gradient(180deg, #ffffff 0%, #b9d2ff 100%);
  border-color: #2f6fed;
  box-shadow: 0 0 0 2px rgba(47, 111, 237, 0.25);
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-uly-btn.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-uly-btn-oo.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-money-btn.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-money-btn.is-selected,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-money-btn.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-recommend-btn.is-selected,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-recommend-btn.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-expand-btn.is-selected,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-expand-btn.active {
  color: #0b1220;
  background: linear-gradient(180deg, #ffffff 0%, #b9d2ff 100%);
  border-color: #2f6fed;
  box-shadow: 0 0 0 2px rgba(47, 111, 237, 0.25);
}
html[data-theme="light"] .hedge-plan-page-wrap .hp-placeholder {
  border-color: rgba(15, 23, 42, 0.18);
  background: rgba(15, 23, 42, 0.03);
}
.options-strike-table--t thead th {
  text-align: center;
}
.options-strike-table--t .opt-t-head-call {
  text-align: center;
  color: #8ec5ff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.options-strike-table--t .opt-t-head-mid {
  text-align: center;
  color: #ffd48a;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.options-strike-table--t .opt-t-head-put {
  text-align: center;
  color: #ff9f9f;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.options-strike-table--t .opt-t-strike {
  text-align: center;
  font-variant-numeric: tabular-nums;
  background: rgba(255, 255, 255, 0.03);
}
.options-strike-table--t .opt-t-mid {
  text-align: center;
  background: rgba(255, 212, 138, 0.04);
}
.options-strike-table--t .opt-t-straddle-prem {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.options-strike-table--t .opt-t-straddle-band {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-size: 0.72rem;
  color: var(--text-soft, #9aa4b2);
}
.options-strike-table--t .opt-t-call,
.options-strike-table--t .opt-t-put {
  text-align: center;
}
.options-strike-table--t .opt-strike-row-atm td {
  background: rgba(255, 212, 138, 0.08);
}
.options-strike-table--t .opt-strike-row-atm .opt-t-strike strong {
  color: #ffd48a;
}
.options-strike-table--t .opt-strike-row.opt-row-selected td {
  background: rgba(74, 124, 255, 0.12);
}
.opt-strike-hint-row td {
  text-align: center;
  font-size: 0.72rem;
  padding: 8px 4px;
  border-bottom: none;
}
html[data-theme="light"] .options-strike-table--t .opt-t-head-call {
  color: #1565c0;
}
html[data-theme="light"] .options-strike-table--t .opt-t-head-mid {
  color: #e65100;
}
html[data-theme="light"] .options-strike-table--t .opt-t-head-put {
  color: #c62828;
}
html[data-theme="light"] .options-strike-table--t .opt-strike-row-atm td {
  background: rgba(255, 152, 0, 0.08);
}
.opt-order-inline-row td {
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}
.opt-order-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.72);
}
.opt-order-backdrop[hidden] {
  display: none !important;
}
.opt-order-dialog {
  width: min(96vw, 760px);
  max-height: 92vh;
  overflow: auto;
  background: var(--card-bg, #121726);
  color: inherit;
  border: 1px solid rgba(127, 127, 127, 0.35);
  border-radius: 14px;
  padding: 18px 20px 20px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.opt-order-layout {
  display: block;
}
.opt-order-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.opt-order-dialog #opt-order-inst,
.opt-order-dialog .options-order-inst {
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.4;
  word-break: break-all;
  margin: 0;
}
.opt-order-pending-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.opt-order-pending-title {
  margin: 0;
  font-size: 0.82rem;
  color: #9ec0ff;
  font-weight: 600;
}
.opt-pending-ttl-hint {
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 1.4;
}
.opt-order-pending-head .btn-secondary {
  font-size: 0.68rem;
  padding: 2px 8px;
}
.opt-pending-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 220px;
  overflow: auto;
}
.opt-pending-list--tab {
  max-height: min(52vh, 420px);
}
.opt-pos-pending-pane {
  padding: 4px 2px 8px;
}
.opt-pending-empty {
  font-size: 0.72rem;
}
.opt-pending-item {
  padding: 8px 9px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.opt-pending-item-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.opt-pending-side {
  font-size: 0.72rem;
  font-weight: 600;
}
.opt-pending-side.is-buy { color: #3dd68c; }
.opt-pending-side.is-sell { color: #ff6b7a; }
.opt-pending-inst {
  font-size: 0.68rem;
  color: #c5d0ee;
  word-break: break-all;
  margin-bottom: 4px;
}
.opt-pending-meta {
  font-size: 0.68rem;
  color: #8892b0;
  line-height: 1.35;
}
.opt-pending-item .opt-pending-cancel {
  font-size: 0.68rem;
  padding: 2px 8px;
}
html[data-theme="light"] .opt-pending-item {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.08);
}
@media (max-width: 900px) {
  .opt-pending-list--tab {
    max-height: min(46vh, 360px);
  }
}
.opt-order-dialog-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.opt-order-dialog-head .opt-order-title {
  margin: 0;
  margin-right: auto;
  font-size: 1.02rem;
  color: #9ec0ff;
  font-weight: 650;
}
.opt-order-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
.opt-order-dialog-actions .btn-primary,
.opt-order-dialog-actions .btn-secondary {
  flex: 1 1 140px;
  min-height: 38px;
  font-size: 0.86rem;
  padding: 8px 14px;
}
.opt-order-dialog #opt-order-msg {
  margin-top: 2px;
  min-height: 1.2em;
  line-height: 1.4;
}
.options-order-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap: 12px 14px;
  margin: 0;
  padding: 12px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.options-order-grid .k {
  display: block;
  font-size: 0.7rem;
  color: #8892b0;
  margin-bottom: 3px;
}
.options-order-grid .v,
.options-page-wrap .options-order-grid .v {
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.35;
}
.options-estimate-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin: 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px dashed rgba(255, 255, 255, 0.12);
  font-size: 0.78rem;
}
.opt-est-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
}
.opt-order-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  cursor: pointer;
  user-select: none;
  font-size: 0.76rem;
  padding: 6px 12px;
  min-height: 32px;
  line-height: 1.2;
  white-space: nowrap;
  border: 1px solid rgba(140, 160, 200, 0.35);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  color: inherit;
  box-sizing: border-box;
}
.opt-order-chip:hover {
  border-color: rgba(140, 170, 230, 0.55);
  background: rgba(255, 255, 255, 0.07);
}
.opt-size-mode-chip {
  position: relative;
}
.opt-size-mode-chip[hidden] {
  display: none !important;
}
.opt-size-mode-chip input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}
.opt-size-mode-chip:has(input:checked),
.opt-size-mode-chip.is-selected,
.opt-size-mode-chip.active {
  border-color: #5b8cff;
  color: #cfe0ff;
  background: rgba(74, 124, 255, 0.28);
  box-shadow: inset 0 0 0 1px rgba(120, 160, 255, 0.45);
}
.options-estimate-row .opt-target-idx {
  width: 140px;
  font-size: 0.8rem;
  padding: 6px 8px;
  min-height: 32px;
  box-sizing: border-box;
}
.options-estimate-row .opt-profit-exit-mult,
.options-page-wrap .opt-pos-profit-exit-mult {
  width: 4.5rem;
  min-width: 0;
  font-size: 0.8rem;
  padding: 6px 8px;
  min-height: 32px;
  box-sizing: border-box;
}
.options-page-wrap .opt-profit-exit-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.78rem;
  white-space: nowrap;
}
.options-estimate-row .k {
  color: #8892b0;
}
.options-estimate-row .v {
  font-size: 0.86rem;
  font-weight: 600;
}
.options-estimate-row .opt-est-note {
  display: block;
  font-size: 0.7rem;
  line-height: 1.45;
  opacity: 0.85;
}
html[data-theme="light"] .options-estimate-row,
html[data-theme="light"] .options-order-grid {
  background: rgba(0, 0, 0, 0.02);
  border-color: rgba(0, 0, 0, 0.1);
}
html[data-theme="light"] .opt-order-chip {
  border-color: rgba(0, 0, 0, 0.16);
  background: #fff;
}
.options-hint {
  font-size: 0.75rem;
  margin-bottom: 6px;
}
.options-page-wrap .options-order-mode-row {
  font-size: 0.78rem;
  gap: 10px;
}
.options-page-wrap .options-order-mode-row input[type="number"],
.options-page-wrap .options-order-mode-row input[type="text"] {
  font-size: 0.8rem;
  padding: 6px 8px;
  min-height: 32px;
  box-sizing: border-box;
}
.options-page-wrap .options-order-mode-row .btn-primary {
  font-size: 0.8rem;
  padding: 6px 12px;
}
.options-page-wrap .opt-row-actions .btn-primary,
.options-page-wrap .opt-row-actions .btn-secondary {
  font-size: 0.7rem;
  padding: 3px 7px;
  min-height: 24px;
}
#opt-order-msg.opt-error,
.opt-error {
  color: #ff6b6b;
}
.opt-success {
  color: #3ecf8e;
}
.opt-row-actions {
  white-space: nowrap;
}
.opt-row-actions .btn-primary,
.opt-row-actions .btn-secondary {
  margin-right: 4px;
}
.opt-moneyness {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 0.68rem;
  font-weight: 600;
}
.opt-moneyness-itm {
  color: #7ee787;
  background: rgba(46, 160, 67, 0.15);
}
.opt-moneyness-otm {
  color: #a8b3cf;
  background: rgba(136, 146, 176, 0.12);
}
.opt-moneyness-atm {
  color: #ffd166;
  background: rgba(255, 209, 102, 0.12);
}
.options-order-mode-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin: 0;
}
.opt-size-mode-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.options-order-mode-row input[type="number"] {
  width: 96px;
}
.options-order-mode-row .opt-signal-note,
.options-order-mode-row #opt-signal-note {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.options-order-mode-row .opt-order-chip {
  flex: 0 0 auto;
}
.options-dual-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: stretch;
}
.options-order-card,
.options-pos-card-wrap {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.options-funds-fold {
  flex-shrink: 0;
  margin-top: 10px;
}
.options-funds-fold-body {
  padding-top: 8px;
}
.options-funds-fold .options-settings-section + .options-settings-section {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--border-soft, #2a3150);
}
.options-funds-fold .options-settings-hint {
  margin: 0 0 6px;
  font-size: 0.72rem;
}
.options-funds-fold .options-funds-row--single {
  flex-wrap: nowrap;
  gap: 5px;
  align-items: center;
  overflow-x: auto;
}
.options-funds-fold .options-funds-row--single > select,
.options-funds-fold .options-funds-row--single > input[type="number"],
.options-funds-fold .options-funds-row--single > button {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  min-width: 0;
}
.options-funds-fold .options-funds-row--single > select {
  min-width: 4.5em;
  max-width: 7.5em;
  padding: 4px 6px;
  font-size: 0.72rem;
}
.options-funds-fold .options-funds-row--single > input[type="number"] {
  width: 5.5rem;
  min-width: 4.5rem;
  padding: 4px 6px;
  font-size: 0.72rem;
}
.options-funds-fold .options-funds-row--single > .btn-sm {
  padding: 4px 8px;
  white-space: nowrap;
}
.options-pos-stack,
.options-pos-tab-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
}
.options-pos-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 8px;
}
.opt-pos-tab {
  flex: 1;
  font-size: 0.78rem;
  padding: 6px 8px;
  min-height: 32px;
  white-space: nowrap;
}
.opt-pos-tab.active {
  border-color: #5b8cff;
  color: #cfe0ff;
  background: rgba(74, 124, 255, 0.28);
}
.options-pos-pane {
  display: none;
  flex: 1;
  flex-direction: column;
  min-height: 0;
}
.options-pos-pane.is-active {
  display: flex;
}
.options-pos-live-pane {
  flex: 1;
  min-height: 180px;
  max-height: 420px;
  overflow-y: auto;
}
.options-pos-live-pane.options-pos-live-pane--accordion {
  max-height: 480px;
}
.options-pos-subcard {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 8px 10px;
}
.options-pos-subcard h3 {
  margin: 0 0 6px;
  font-size: 0.8rem;
  font-weight: 600;
}
.options-page-wrap .options-pos-subcard h3 {
  font-size: 0.78rem;
  color: #b8c0dc;
}
.options-pos-stats-card {
  flex-shrink: 0;
}
.options-stats-pnl-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.options-stats-pnl-summary .options-stat-item {
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(127, 127, 127, 0.12);
}
.options-stats-pnl-summary .opt-stats-net-item .v {
  font-size: 1.15em;
  font-weight: 650;
}
html[data-theme="light"] .options-stats-pnl-summary .options-stat-item {
  background: rgba(0, 0, 0, 0.04);
}
.options-stats-panel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}
.options-stats-charts {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px 12px;
  align-items: center;
}
.opt-stats-chart--ring {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.opt-stats-ring {
  --win-pct: 0;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: conic-gradient(
    #4cd97f 0 calc(var(--win-pct) * 1%),
    #ff6b6b calc(var(--win-pct) * 1%) 100%
  );
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.opt-stats-ring::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: #141923;
}
.opt-stats-ring-label {
  position: relative;
  z-index: 1;
  font-size: 0.82rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.opt-stats-chart-caption,
.opt-stats-chart-title {
  font-size: 0.66rem;
  color: #9aa3bf;
  text-align: center;
}
.opt-stats-chart-title {
  margin-bottom: 4px;
  text-align: left;
}
.opt-stats-chart--pnl,
.opt-stats-chart--hold {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.opt-stats-bar-row {
  display: grid;
  grid-template-columns: 2.2em 1fr auto;
  gap: 6px;
  align-items: center;
  font-size: 0.72rem;
}
.opt-stats-bar-row .k {
  opacity: 0.8;
}
.opt-stats-bar-row .v {
  font-size: 0.7rem;
  font-weight: 600;
  white-space: nowrap;
}
.opt-stats-bar-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  overflow: hidden;
}
.opt-stats-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  transition: width 0.25s ease;
}
.opt-stats-bar-fill--profit {
  background: linear-gradient(90deg, #2f9f62, #4cd97f);
}
.opt-stats-bar-fill--loss {
  background: linear-gradient(90deg, #c44a4a, #ff6b6b);
}
.options-stats-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  padding: 4px 2px 8px;
}
.options-stat-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 52px;
}
.options-stat-item .k {
  font-size: 0.66rem;
  opacity: 0.75;
}
.options-stat-item .v {
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.25;
}
.options-page-wrap .options-stat-item .v {
  font-size: 0.8rem;
}
.options-history-table-wrap .opt-history-del {
  font-size: 0.68rem;
  padding: 2px 7px;
  min-height: 22px;
}
.options-page-wrap .opt-pos-card {
  font-size: 0.76rem;
  margin-bottom: 8px;
}
.opt-pos-cards--accordion {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.opt-pos-accordion-item {
  display: flex;
  flex-direction: column;
}
.opt-pos-bar {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: #141923;
  border: 1px solid #2a3348;
  border-radius: 8px;
  cursor: pointer;
  text-align: left;
  color: inherit;
  font: inherit;
  transition: border-color 0.15s, background 0.15s;
}
.opt-pos-bar:hover {
  border-color: #3d4d6e;
  background: #171d2a;
}
.opt-pos-accordion-item.is-expanded .opt-pos-bar {
  border-color: #4a6fd8;
  border-radius: 8px 8px 0 0;
  border-bottom-color: transparent;
  background: #171d2a;
}
.opt-pos-accordion-body {
  overflow: visible;
}
.opt-pos-card--inline {
  margin-bottom: 0 !important;
  border-top: none !important;
  border-radius: 0 0 8px 8px !important;
}
.opt-pos-bar-main {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
.opt-pos-bar-id-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-shrink: 1;
  overflow: hidden;
}
.opt-pos-bar .pos-side-badge {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  flex-shrink: 0;
  padding: 2px 6px;
  font-size: 0.62rem;
  line-height: 1;
}
.opt-source-badge {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  flex-shrink: 0;
  padding: 2px 7px;
  border-radius: 6px;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.2;
  border: 1px solid transparent;
}
.opt-source-badge--plain {
  background: rgba(255, 255, 255, 0.06);
  color: #9aa4b2;
  border-color: rgba(255, 255, 255, 0.1);
}
.opt-source-badge--po {
  background: rgba(100, 160, 255, 0.16);
  color: #8ec0ff;
  border-color: rgba(100, 160, 255, 0.35);
}
.opt-source-badge--oo {
  background: rgba(0, 212, 255, 0.14);
  color: #5ee4ff;
  border-color: rgba(0, 212, 255, 0.35);
}
.opt-pos-bar .opt-source-badge {
  padding: 2px 6px;
  font-size: 0.6rem;
}
html[data-theme="light"] .opt-source-badge--plain {
  background: rgba(15, 23, 42, 0.06);
  color: #5a6578;
  border-color: rgba(15, 23, 42, 0.12);
}
html[data-theme="light"] .opt-source-badge--po {
  background: rgba(37, 99, 235, 0.1);
  color: #1d4ed8;
  border-color: rgba(37, 99, 235, 0.25);
}
html[data-theme="light"] .opt-source-badge--oo {
  background: rgba(8, 145, 178, 0.1);
  color: #0e7490;
  border-color: rgba(8, 145, 178, 0.28);
}
.opt-pos-bar-meta {
  font-size: 0.66rem;
  color: #8b95b0;
  white-space: nowrap;
  flex-shrink: 0;
}
.opt-pos-bar-side {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  margin-left: 8px;
  font-variant-numeric: tabular-nums;
}
.opt-pos-bar-title {
  font-size: 0.68rem;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 0 1 auto;
  min-width: 0;
}
.opt-pos-bar-cd {
  font-size: 0.66rem;
  color: #8b95b0;
  white-space: nowrap;
}
.opt-pos-bar-pnl,
.opt-pos-bar-roi {
  font-size: 0.68rem;
  font-weight: 600;
  white-space: nowrap;
  line-height: 1.15;
}
.opt-pos-bar-chevron {
  display: inline-block;
  font-size: 0.58rem;
  color: #8b95b0;
  transition: transform 0.15s ease;
  flex-shrink: 0;
}
.opt-pos-accordion-item.is-expanded .opt-pos-bar-chevron {
  transform: rotate(90deg);
}
.options-page-wrap .opt-pos-card .pos-card-symbol strong {
  font-size: 0.78rem;
}
.options-page-wrap .opt-pos-card .pos-label,
.options-page-wrap .opt-pos-card .pos-meta-item {
  font-size: 0.7rem;
}
.options-page-wrap .opt-pos-card .pos-value {
  font-size: 0.78rem;
}
.options-page-wrap .opt-pos-cell--depth {
  grid-column: span 2;
}
.options-page-wrap .opt-target-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(67, 82, 118, 0.45);
}
.options-page-wrap .opt-target-row-label {
  font-size: 0.72rem;
  color: #9aa8c7;
  min-width: 2.5em;
}
.options-page-wrap .opt-pos-target-input {
  width: 110px;
  max-width: 36vw;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid #3a4660;
  background: #0f1420;
  color: #e8eefc;
  font-size: 0.82rem;
}
.options-page-wrap .opt-target-row .btn-secondary {
  padding: 4px 10px;
  font-size: 0.75rem;
}
.options-page-wrap .opt-target-row-hint {
  font-size: 0.7rem;
}
.options-page-wrap .opt-target-armed {
  font-size: 0.78rem;
  color: #9ad0ff;
  font-variant-numeric: tabular-nums;
}
.options-page-wrap .opt-target-row--managed {
  border-color: rgba(126, 231, 135, 0.38);
  background: rgba(46, 160, 67, 0.08);
}
.options-page-wrap .opt-target-row--managed .opt-target-armed,
.options-page-wrap .opt-target-mon-managed {
  color: #7ee787;
  font-weight: 600;
}
.options-page-wrap .opt-target-est {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  font-size: 0.78rem;
}
.options-page-wrap .opt-target-est--idle:empty {
  display: none;
}
.options-page-wrap .opt-target-est-item {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
}
.options-page-wrap .opt-target-est-item .k {
  color: #9aa8c7;
  font-size: 0.7rem;
}
.options-page-wrap .opt-target-est-item .v {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}
.opt-target-monitors {
  margin: 0 0 10px;
  padding: 10px 12px;
  border: 1px solid rgba(99, 118, 168, 0.45);
  border-radius: 10px;
  background: rgba(18, 28, 48, 0.75);
}
.opt-target-monitors-head {
  font-size: 0.78rem;
  font-weight: 600;
  color: #c9d6f5;
  margin-bottom: 8px;
}
.opt-target-mon-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  border-top: 1px solid rgba(67, 82, 118, 0.35);
}
.opt-target-mon-item:first-child {
  border-top: 0;
  padding-top: 0;
}
.opt-target-mon-inst {
  font-size: 0.72rem;
  color: #dbe6ff;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.opt-target-mon-rule {
  font-size: 0.78rem;
  color: #9ad0ff;
  font-variant-numeric: tabular-nums;
}
.opt-target-mon-item .btn-secondary {
  margin-left: auto;
  padding: 2px 8px;
  font-size: 0.7rem;
}
.opt-target-mon-item--managed {
  border-color: rgba(126, 231, 135, 0.28);
}
.opt-target-mon-managed {
  margin-left: auto;
  font-size: 0.72rem;
}
.options-page-wrap .opt-bid-plain {
  color: #dbe6ff;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  white-space: normal;
}
.options-page-wrap .opt-close-value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.options-page-wrap .opt-close-rule,
.options-page-wrap .opt-open-rule {
  margin-top: 8px;
  margin-bottom: 10px;
  padding: 0;
  border: 1px solid rgba(67, 82, 118, 0.55);
  border-radius: 10px;
  background: rgba(14, 19, 30, 0.58);
  overflow: hidden;
}
.options-page-wrap .opt-open-rule {
  margin-top: 4px;
}
.options-page-wrap .opt-close-rule summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  color: #c9d6f2;
  font-size: 0.72rem;
  font-weight: 650;
  cursor: pointer;
  user-select: none;
  list-style: none;
}
.options-page-wrap .opt-close-rule summary::-webkit-details-marker {
  display: none;
}
.options-page-wrap .opt-close-rule summary::after {
  content: "展开";
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(82, 101, 143, 0.25);
  color: #91a4cc;
  font-size: 0.62rem;
  font-weight: 600;
}
.options-page-wrap .opt-close-rule[open] summary {
  border-bottom: 1px solid rgba(67, 82, 118, 0.45);
  background: rgba(28, 38, 60, 0.55);
}
.options-page-wrap .opt-close-rule[open] summary::after {
  content: "收起";
}
.options-page-wrap .opt-close-rule-body {
  padding: 8px 10px 10px;
  color: #96a4bf;
  font-size: 0.7rem;
  line-height: 1.55;
}
.options-page-wrap .opt-close-rule-body p {
  margin: 0 0 6px;
  color: #b6c2dc;
}
.options-page-wrap .opt-close-rule-body ul {
  margin: 0;
  padding-left: 16px;
}
.options-page-wrap .opt-close-rule-body li + li {
  margin-top: 3px;
}
.options-page-wrap .opt-close-rule-body code {
  color: #dbe6ff;
  background: rgba(82, 101, 143, 0.22);
  border-radius: 4px;
  padding: 1px 4px;
}
.options-page-wrap .pos-empty {
  padding: 10px;
  font-size: 0.72rem;
}
.options-page-wrap #opt-order-msg {
  font-size: 0.72rem;
}
.options-pos-history-card {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.options-history-table-wrap {
  flex: 1;
  overflow-y: auto;
  overflow-x: auto;
  min-height: 180px;
  max-height: 420px;
}
.opt-history-table {
  table-layout: fixed;
  width: 100%;
}
.opt-history-table .opt-hist-inst code {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.opt-history-table th:nth-child(1),
.opt-history-table td:nth-child(1) {
  width: 34%;
}
.opt-history-table th:nth-child(2),
.opt-history-table td:nth-child(2) {
  width: 7%;
}
.opt-history-table th:nth-child(3),
.opt-history-table td:nth-child(3) {
  width: 11%;
}
.opt-history-table th:nth-child(4),
.opt-history-table td:nth-child(4) {
  width: 9%;
}
.opt-history-table th:nth-child(5),
.opt-history-table td:nth-child(5) {
  width: 11%;
}
.opt-history-table th:nth-child(6),
.opt-history-table td:nth-child(6) {
  width: 20%;
}
.opt-history-table th:nth-child(7),
.opt-history-table td:nth-child(7) {
  width: 8%;
  text-align: center;
}
.opt-hist-time {
  font-size: 0.64rem;
  white-space: nowrap;
}
.opt-hist-status {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 0.62rem;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
}
.opt-hist-status--closed {
  background: rgba(74, 124, 255, 0.2);
  color: #9ec0ff;
}
.opt-hist-status--expired {
  background: rgba(255, 179, 71, 0.15);
  color: #ffb347;
}
.opt-hist-status--open {
  background: rgba(94, 232, 154, 0.12);
  color: #5ee89a;
}
@media (max-width: 1100px) {
  .options-dual-grid {
    grid-template-columns: 1fr;
  }
}
.options-order-card h2,
.options-pos-card-wrap h2 {
  margin: 0 0 8px;
}
.options-pos-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.options-pos-head h2 {
  margin: 0;
  flex-shrink: 0;
}
.options-pos-head-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.opt-spot-sell-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.opt-spot-sell-avail {
  font-size: 0.78rem;
  color: #c9d6f5;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.options-page-wrap .opt-spot-sell-retry-btn {
  font-size: 0.72rem;
  padding: 4px 12px;
  min-height: 28px;
  white-space: nowrap;
}
.options-page-wrap .opt-pos-refresh-btn {
  font-size: 1rem;
  line-height: 1;
  padding: 4px 10px;
  min-width: 32px;
  min-height: 28px;
}
.opt-pos-card {
  margin-bottom: 10px;
}
.opt-expiry-cd {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}
.opt-expiry-cd--urgent {
  color: #ffb347;
}
.opt-expiry-cd--expired {
  color: var(--muted);
}
.settings-card--compact .options-settings-section {
  margin-bottom: 8px;
}

.settings-card--compact .options-settings-section:last-child {
  margin-bottom: 0;
}

.options-settings-block {
  margin-bottom: 14px;
}
.options-settings-section {
  margin-bottom: 10px;
}
.options-settings-section:last-child {
  margin-bottom: 0;
}
.options-settings-subtitle {
  font-size: 0.72rem;
  font-weight: 600;
  color: #a8b0cc;
  margin: 0 0 6px;
}
.options-settings-arrow {
  font-size: 0.75rem;
  color: #8892b0;
  align-self: center;
}
.options-settings-row {
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.options-settings-row select,
.options-settings-row input[type="number"] {
  font-size: 0.75rem;
  padding: 4px 7px;
  min-height: 28px;
}
.options-settings-row .btn-sm {
  font-size: 0.72rem;
  padding: 4px 10px;
  min-height: 28px;
}
.options-settings-hint {
  font-size: 0.72rem;
  margin: 0 0 6px;
  line-height: 1.45;
}
.options-settings-msg {
  font-size: 0.68rem;
  margin-top: 2px;
  min-height: 1em;
  line-height: 1.35;
}
html[data-theme="light"] .stat-strip-item--pnl .value.pnl-pos {
  color: #087a50 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] .stat-strip-item--pnl .value.pnl-neg {
  color: #c03030 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] .btn-secondary {
  background: #fff !important;
  color: #004d6e !important;
  border: 1px solid rgba(0, 95, 140, 0.32) !important;
}

html[data-theme="light"] .btn-secondary:hover {
  background: #eef3f8 !important;
}

html[data-theme="light"] .btn-primary {
  background: linear-gradient(90deg, #007aa8, #5b4fc7) !important;
  color: #fff !important;
  border: none !important;
}

html[data-theme="light"] code {
  background: #eef3f8;
  color: #142232;
  border: 1px solid #c8d4e0;
  padding: 1px 4px;
  border-radius: 4px;
  font-size: 0.92em;
}

html[data-theme="light"] .card-nested,
html[data-theme="light"] .options-section.card-nested,
html[data-theme="light"] .options-pos-subcard {
  background: #f6f9fc !important;
  border: 1px solid #c8d4e0 !important;
}

html[data-theme="light"] .options-strike-table thead th {
  background: #eef3f8 !important;
  color: #334155 !important;
  border-bottom: 1px solid #c8d4e0 !important;
}

html[data-theme="light"] .options-strike-table th,
html[data-theme="light"] .options-strike-table td {
  border-bottom-color: #d0dae4 !important;
  color: #142232 !important;
}

html[data-theme="light"] .options-page-wrap .options-pos-subcard h3,
html[data-theme="light"] .options-settings-subtitle {
  color: #142232 !important;
}

html[data-theme="light"] .opt-pos-bar {
  background: #f6f9fc;
  border-color: #c8d4e0;
  color: #142232;
}
html[data-theme="light"] .opt-pos-bar:hover,
html[data-theme="light"] .opt-pos-accordion-item.is-expanded .opt-pos-bar {
  background: #eef3f8;
  border-color: #9eb0c4;
}
html[data-theme="light"] .opt-pos-bar-title {
  color: #142232;
}
html[data-theme="light"] .opt-pos-bar-meta,
html[data-theme="light"] .opt-pos-bar-cd,
html[data-theme="light"] .opt-pos-bar-chevron {
  color: #5a6d82;
}
html[data-theme="light"] .opt-pos-accordion-body {
  background: #f6f9fc;
  border-color: #c8d4e0;
}

html[data-theme="light"] .options-page-wrap .options-hint,
html[data-theme="light"] .options-page-wrap #opt-index-line,
html[data-theme="light"] .options-order-grid .k,
html[data-theme="light"] .options-stat-item .k {
  color: #3a5068 !important;
  opacity: 1 !important;
}

html[data-theme="light"] .options-page-wrap .options-order-grid .v,
html[data-theme="light"] .options-page-wrap .options-stat-item .v {
  color: #142232 !important;
}

html[data-theme="light"] .options-chain-toolbar .btn-secondary.active,
html[data-theme="light"] .opt-uly-btn.active,
html[data-theme="light"] .opt-type-btn.active,
html[data-theme="light"] .opt-money-btn.active,
html[data-theme="light"] .opt-pos-tab.active,
html[data-theme="light"] .opt-size-mode-chip.is-selected,
html[data-theme="light"] .opt-size-mode-chip.active,
html[data-theme="light"] .opt-size-mode-chip:has(input:checked) {
  border-color: rgba(0, 95, 140, 0.45) !important;
  color: #004d6e !important;
  background: rgba(0, 110, 154, 0.14) !important;
  box-shadow: inset 0 0 0 1px rgba(0, 95, 140, 0.22) !important;
}

html[data-theme="light"] .opt-stats-ring::before {
  background: #f4f7fb;
}
html[data-theme="light"] .opt-stats-bar-track {
  background: rgba(20, 34, 50, 0.08);
}
html[data-theme="light"] .opt-stats-chart-caption,
html[data-theme="light"] .opt-stats-chart-title {
  color: #5a6a80 !important;
}
html[data-theme="light"] .opt-moneyness-itm {
  color: #087a50 !important;
  background: rgba(8, 122, 80, 0.12) !important;
}

html[data-theme="light"] .opt-moneyness-otm {
  color: #4a6078 !important;
  background: rgba(74, 96, 120, 0.1) !important;
}

html[data-theme="light"] .opt-moneyness-atm {
  color: #8a6200 !important;
  background: rgba(180, 130, 20, 0.12) !important;
}

html[data-theme="light"] .opt-strike-row.opt-row-selected td {
  background: rgba(0, 110, 154, 0.08) !important;
}

html[data-theme="light"] .pos-pnl-profit {
  color: #087a50 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .pos-pnl-loss {
  color: #c03030 !important;
  font-weight: 600 !important;
}

/* 期权持仓 · 亮色主题对比度 */
html[data-theme="light"] .options-page-wrap .opt-pos-card {
  background: #fff !important;
  border-color: #94a3b8 !important;
}

html[data-theme="light"] .options-page-wrap .opt-pos-card .pos-label,
html[data-theme="light"] .options-page-wrap .opt-pos-card .pos-meta,
html[data-theme="light"] .options-page-wrap .opt-pos-card .pos-meta-item {
  color: #0f172a !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

html[data-theme="light"] .options-page-wrap .opt-pos-card .pos-meta-item::after {
  color: #64748b !important;
}

html[data-theme="light"] .options-page-wrap .opt-pos-card .pos-value {
  color: #020617 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-bid-plain {
  color: #0f172a !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-value {
  color: #9f1239 !important;
}

html[data-theme="light"] .options-page-wrap .opt-bid-invalid-hint,
html[data-theme="light"] .options-page-wrap .opt-pos-card .muted {
  color: #334155 !important;
  opacity: 1 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-row {
  border-top-color: #94a3b8 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-row-label {
  color: #0f172a !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-pos-target-input {
  background: #fff !important;
  color: #0f172a !important;
  border-color: #64748b !important;
}

html[data-theme="light"] .options-page-wrap .opt-pos-target-input::placeholder {
  color: #64748b !important;
  opacity: 1 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-row .btn-secondary {
  color: #004d6e !important;
  border-color: #007aa8 !important;
  background: #e8f4fa !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-armed {
  color: #004d6e !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-est-item .k {
  color: #334155 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-est-item .v {
  color: #0f172a !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-row-hint {
  color: #334155 !important;
}

html[data-theme="light"] .options-page-wrap .opt-expiry-cd {
  color: #004d6e !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-expiry-cd--urgent {
  color: #9a6200 !important;
}

html[data-theme="light"] .options-page-wrap .opt-expiry-cd--expired {
  color: #475569 !important;
}

html[data-theme="light"] .options-page-wrap .opt-pos-tab:not(.active) {
  color: #0f172a !important;
  border-color: #64748b !important;
  background: #fff !important;
  font-weight: 500 !important;
}

html[data-theme="light"] .options-page-wrap .opt-pos-tab.active {
  color: #003d57 !important;
  border-color: #006e9a !important;
  background: rgba(0, 110, 154, 0.16) !important;
  font-weight: 700 !important;
}

html[data-theme="light"] .options-page-wrap .options-pos-head h2,
html[data-theme="light"] .options-page-wrap .options-pos-card-wrap h2 {
  color: #020617 !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule {
  border: 1px solid #64748b !important;
  background: #e2e8f0 !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule summary {
  color: #0f172a !important;
  background: #cbd5e1 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule summary::after {
  background: rgba(0, 95, 140, 0.18) !important;
  color: #003d57 !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule[open] summary {
  background: #b8c8d8 !important;
  border-bottom-color: #64748b !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule-body {
  color: #1e293b !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule-body p {
  color: #0f172a !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule-body li {
  color: #1e293b !important;
}

html[data-theme="light"] .options-page-wrap .opt-close-rule-body code {
  color: #0f172a !important;
  background: #fff !important;
  border: 1px solid #94a3b8 !important;
}

html[data-theme="light"] .options-page-wrap .pos-empty {
  color: #334155 !important;
}

html[data-theme="light"] .options-page-wrap .opt-spot-sell-avail {
  color: #334155 !important;
}
html[data-theme="light"] .options-page-wrap .opt-target-monitors {
  background: #eef4fa !important;
  border: 1px solid #94a3b8 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-monitors-head {
  color: #0f172a !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-mon-item {
  border-top-color: #cbd5e1 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-mon-inst {
  color: #1e293b !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-mon-rule {
  color: #004d6e !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .options-page-wrap .opt-target-mon-item .btn-secondary {
  color: #004d6e !important;
  border-color: #007aa8 !important;
  background: #fff !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .order-preview-profit {
  color: #087a50 !important;
}

html[data-theme="light"] .order-preview-risk {
  color: #c03030 !important;
}

html[data-theme="light"] .instance-header-panel {
  background: #fff !important;
  border: 1px solid #9eb0c4 !important;
  box-shadow: 0 1px 3px rgba(20, 34, 50, 0.06);
}

html[data-theme="light"] .settings-account-summary {
  background: #fff !important;
  border: 1px solid #9eb0c4 !important;
  box-shadow: 0 1px 3px rgba(20, 34, 50, 0.06);
}

/* 期权复盘 · 亮色主题（覆盖面板内暗色默认变量） */
html[data-theme="light"] .options-review-wrap {
  --or-section-bg: #fff;
  --or-section-shadow: 0 1px 3px rgba(20, 34, 50, 0.06);
  --or-border: #9eb0c4;
  --or-border-soft: #c8d4e0;
  --or-border-faint: #dce4ec;
  --or-text: #142232;
  --or-title: #142232;
  --or-muted: #3a5068;
  --or-filters-bg: #eef3f8;
  --or-tile-bg: #f6f9fc;
  --or-badge-bg: rgba(0, 110, 154, 0.1);
  --or-accent-bg: rgba(0, 110, 154, 0.12);
  --or-accent-fg: #004d6e;
  --or-accent-border: rgba(0, 95, 140, 0.28);
  --or-row-active-bg: rgba(0, 110, 154, 0.08);
  --or-row-hover-bg: rgba(0, 110, 154, 0.06);
  --or-modal-bg: #fff;
  --or-modal-shadow: 0 12px 40px rgba(20, 34, 50, 0.18);
  --or-backdrop: rgba(20, 34, 50, 0.45);
  --or-img-bg: #eef3f8;
  color: #142232;
}

html[data-theme="light"] .options-review-wrap .or-section {
  background: #fff !important;
  border-color: #9eb0c4 !important;
  box-shadow: 0 1px 3px rgba(20, 34, 50, 0.06);
  color: #142232 !important;
}

html[data-theme="light"] .options-review-wrap .or-section-title,
html[data-theme="light"] .options-review-wrap .or-detail-modal-head h3,
html[data-theme="light"] .options-review-wrap .or-page-head h2 {
  color: #142232 !important;
}

html[data-theme="light"] .options-review-wrap .or-section-desc,
html[data-theme="light"] .options-review-wrap .muted,
html[data-theme="light"] .options-review-wrap .sub {
  color: #3a5068 !important;
}

html[data-theme="light"] .options-review-wrap .or-filters {
  background: #eef3f8 !important;
  border-color: #c8d4e0 !important;
}

html[data-theme="light"] .options-review-wrap .or-kpi-tile,
html[data-theme="light"] .options-review-wrap .or-stat-card,
html[data-theme="light"] .options-review-wrap .or-detail-img-cell {
  background: #f6f9fc !important;
  border-color: #c8d4e0 !important;
}

html[data-theme="light"] .options-review-wrap .or-tab {
  background: #fff !important;
  color: #006e9a !important;
  border-color: rgba(0, 95, 140, 0.22) !important;
}

html[data-theme="light"] .options-review-wrap .or-tab.active {
  background: rgba(0, 110, 154, 0.12) !important;
  color: #004d6e !important;
  border-color: rgba(0, 95, 140, 0.28) !important;
}

html[data-theme="light"] .options-review-wrap .or-step {
  background: rgba(0, 110, 154, 0.12) !important;
  color: #004d6e !important;
  border-color: rgba(0, 95, 140, 0.28) !important;
}

html[data-theme="light"] .options-review-wrap .or-badge {
  background: rgba(0, 110, 154, 0.1) !important;
  color: #004d6e !important;
}

html[data-theme="light"] .options-review-wrap .or-detail-modal {
  background: #fff !important;
  color: #142232 !important;
  border-color: #9eb0c4 !important;
  box-shadow: 0 12px 40px rgba(20, 34, 50, 0.18);
}

html[data-theme="light"] .options-review-wrap .or-detail-backdrop {
  background: rgba(20, 34, 50, 0.45) !important;
}

html[data-theme="light"] .options-review-wrap .options-strike-table thead th {
  background: #eef3f8 !important;
  color: #334155 !important;
  border-bottom: 1px solid #c8d4e0 !important;
}

html[data-theme="light"] .options-review-wrap .options-strike-table th,
html[data-theme="light"] .options-review-wrap .options-strike-table td {
  color: #142232 !important;
  border-bottom-color: #d0dae4 !important;
}

html[data-theme="light"] .options-review-wrap .or-trades-table tr.or-row-active,
html[data-theme="light"] .options-review-wrap .or-reviewed-table tbody tr:hover {
  background: rgba(0, 110, 154, 0.08) !important;
}

.pos-pnl-profit {
  color: #7ee787;
}
.pos-pnl-loss {
  color: #ff8b8b;
}

/* —— 实例手机壳:底栏四件套(仅 ≤720px + body.inst-phone) —— */
.inst-mobile-tabbar,
.inst-mobile-more,
.instance-phone-only {
  display: none;
}

@media (max-width: 720px) {
  :root {
    --inst-m-tabbar-h: 56px;
    --inst-m-page-pad: calc(var(--inst-m-tabbar-h) + max(16px, env(safe-area-inset-bottom)) + 12px);
  }

  /* 仅手机壳:不碰 >720 桌面/平板。overflow 放 container,避免裁切 fixed 下单弹窗 */
  body.inst-phone {
    padding-bottom: var(--inst-m-page-pad) !important;
    box-sizing: border-box;
  }

  body.inst-phone .embed-top-nav.top-nav {
    display: none !important;
  }

  body.inst-phone .header {
    margin-bottom: 4px;
  }

  body.inst-phone .header h1 {
    display: none !important;
  }

  body.inst-phone .container {
    padding-bottom: 8px !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  body.inst-phone #embed-page-root,
  body.inst-phone .embed-tab-pane,
  body.inst-phone .embed-tab-pane.is-active-pane {
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
  }

  body.inst-phone .card {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.inst-phone .instance-header-toolbar {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  body.inst-phone .instance-header-toolbar-end {
    width: auto;
    margin-left: auto;
  }

  body.inst-phone .instance-phone-only {
    display: flex;
  }

  body.inst-phone .instance-header-phone-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    width: 100%;
  }

  html[data-theme="light"] body.inst-phone .instance-header-phone-strip {
    border-top-color: rgba(0, 0, 0, 0.08);
  }

  body.inst-phone .inst-phone-chip {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
    min-height: 32px;
    min-width: 0;
    padding: 6px 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 12px;
    color: var(--inst-text);
  }

  html[data-theme="light"] body.inst-phone .inst-phone-chip {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.08);
  }

  body.inst-phone .inst-phone-chip em {
    font-style: normal;
    color: var(--inst-muted);
    font-size: 11px;
    flex: 0 0 auto;
  }

  body.inst-phone .inst-phone-chip b {
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
  }

  body.inst-phone .inst-phone-chip--pnl b {
    color: var(--inst-nav-idle);
  }

  /* 实盘/关键位等表单:窄屏拉满,避免挤成一行裁切 */
  body.inst-phone #add-order-form.form-row,
  body.inst-phone form.form-row {
    align-items: stretch;
  }

  body.inst-phone #add-order-form.form-row > input:not([type="checkbox"]):not([type="radio"]),
  body.inst-phone #add-order-form.form-row > select,
  body.inst-phone #add-order-form #sltp-mode,
  body.inst-phone form.form-row > input:not([type="checkbox"]):not([type="radio"]),
  body.inst-phone form.form-row > select {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  body.inst-phone #add-order-form .order-entry-model-row,
  body.inst-phone #add-order-form .order-time-close-wrap,
  body.inst-phone #add-order-form > label,
  body.inst-phone #add-order-form > button {
    flex: 1 1 100%;
    max-width: 100%;
  }

  body.inst-phone #add-order-form .order-entry-model-row select {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
  }

  body.inst-phone .order-monitor-form .om-row {
    align-items: stretch;
  }

  body.inst-phone .order-monitor-form .om-row-policy > input:not([type="checkbox"]):not([type="radio"]),
  body.inst-phone .order-monitor-form .om-row-policy > select,
  body.inst-phone .order-monitor-form #sltp-mode,
  body.inst-phone .order-monitor-form .om-field,
  body.inst-phone .order-monitor-form .om-live-meta,
  body.inst-phone .order-monitor-form .om-check,
  body.inst-phone .order-monitor-form .om-time-close,
  body.inst-phone .order-monitor-form .order-entry-model-row,
  body.inst-phone .order-monitor-form .om-submit {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    box-sizing: border-box;
    margin-left: 0;
  }

  body.inst-phone .order-monitor-form .om-field input {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.inst-phone .order-monitor-form .om-live-meta {
    padding-bottom: 0;
  }

  body.inst-phone .order-plan-preview {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  /* 期权:防止宽表撑破页面;表内横向滑看「操作」 */
  body.inst-phone .options-page-wrap,
  body.inst-phone .options-dual-grid,
  body.inst-phone .options-order-card,
  body.inst-phone .options-pos-card-wrap {
    max-width: 100%;
    min-width: 0;
  }

  body.inst-phone .options-dual-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.inst-phone .options-chain-toolbar.form-row {
    flex-wrap: wrap;
    gap: 6px;
  }

  body.inst-phone .options-chain-toolbar .btn-secondary,
  body.inst-phone .options-chain-toolbar select,
  body.inst-phone .options-chain-toolbar .opt-chain-view-group,
  body.inst-phone .options-chain-toolbar .opt-type-btn-group {
    flex: 0 1 auto;
    max-width: 100%;
  }

  body.inst-phone .options-strike-table-wrap,
  body.inst-phone .options-strike-table-wrap--t,
  body.inst-phone .options-history-table-wrap,
  body.inst-phone .table-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
  }

  body.inst-phone .options-strike-table {
    width: max-content;
    min-width: 100%;
  }

  body.inst-phone .options-strike-table th,
  body.inst-phone .options-strike-table td {
    white-space: nowrap;
  }

  /* 列表视图:隐藏合约 / 买一 / 到期平衡 / 距平衡(保留行权价·类型·卖一·操作) */
  body.inst-phone #opt-strike-head-list th:nth-child(3),
  body.inst-phone #opt-strike-head-list th:nth-child(5),
  body.inst-phone #opt-strike-head-list th:nth-child(6),
  body.inst-phone #opt-strike-head-list th:nth-child(7),
  body.inst-phone .opt-strike-row:not(.opt-strike-row-t) > td:nth-child(3),
  body.inst-phone .opt-strike-row:not(.opt-strike-row-t) > td:nth-child(5),
  body.inst-phone .opt-strike-row:not(.opt-strike-row-t) > td:nth-child(6),
  body.inst-phone .opt-strike-row:not(.opt-strike-row-t) > td:nth-child(7) {
    display: none !important;
  }

  /* 选择后下单弹窗:盖过底栏,可滚动完整显示 */
  body.inst-phone .opt-order-backdrop {
    z-index: 2400;
    align-items: flex-end;
    justify-content: center;
    padding: 0;
    padding-bottom: env(safe-area-inset-bottom);
    background: rgba(0, 0, 0, 0.72);
  }

  body.inst-phone .opt-order-backdrop:not([hidden]) {
    display: flex !important;
  }

  body.inst-phone .opt-order-dialog {
    width: 100%;
    max-width: 100%;
    max-height: min(88vh, 720px);
    margin: 0;
    border-radius: 16px 16px 0 0;
    padding: 14px 14px calc(14px + env(safe-area-inset-bottom));
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.inst-phone .opt-order-dialog .options-order-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body.inst-phone .options-estimate-row .opt-est-main {
    flex-wrap: wrap;
  }

  body.inst-phone .opt-size-mode-bar {
    flex-wrap: wrap;
    width: 100%;
  }

  body.inst-phone .inst-mobile-tabbar {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 80;
    height: calc(var(--inst-m-tabbar-h) + env(safe-area-inset-bottom));
    padding: 0 max(8px, env(safe-area-inset-right)) env(safe-area-inset-bottom)
      max(8px, env(safe-area-inset-left));
    align-items: stretch;
    justify-content: space-around;
    gap: 2px;
    background: color-mix(in srgb, #12161f 92%, transparent);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-sizing: border-box;
  }

  html[data-theme="light"] body.inst-phone .inst-mobile-tabbar {
    background: color-mix(in srgb, #f4f7fb 94%, transparent);
    border-top-color: rgba(0, 0, 0, 0.1);
  }

  body.inst-phone .inst-mobile-tabbar .inst-m-tab.nav-hidden {
    display: none !important;
  }

  body.inst-phone .inst-m-tab {
    flex: 1 1 0;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 6px 2px;
    padding: 0 4px;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--inst-muted);
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  body.inst-phone .inst-m-tab:hover,
  body.inst-phone .inst-m-tab:focus-visible {
    color: var(--inst-text);
    background: rgba(255, 255, 255, 0.04);
    outline: none;
  }

  body.inst-phone .inst-m-tab.active {
    color: var(--inst-nav-idle);
    background: rgba(143, 200, 255, 0.12);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--inst-nav-idle) 35%, transparent);
  }

  body.inst-phone.inst-mobile-more-open .inst-mobile-more {
    display: block;
  }

  body.inst-phone .inst-mobile-more {
    position: fixed;
    inset: 0;
    z-index: 90;
  }

  body.inst-phone .inst-mobile-more-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
  }

  body.inst-phone .inst-mobile-more-sheet {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: min(78vh, 560px);
    overflow: auto;
    padding: 10px 16px calc(16px + env(safe-area-inset-bottom));
    border-radius: 16px 16px 0 0;
    background: #12161f;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: none;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
  }

  html[data-theme="light"] body.inst-phone .inst-mobile-more-sheet {
    background: #f4f7fb;
    border-color: rgba(0, 0, 0, 0.1);
  }

  body.inst-phone .inst-mobile-more-handle {
    width: 36px;
    height: 4px;
    margin: 2px auto 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
  }

  html[data-theme="light"] body.inst-phone .inst-mobile-more-handle {
    background: rgba(0, 0, 0, 0.15);
  }

  body.inst-phone .inst-mobile-more-title {
    margin: 0 0 4px;
    font-size: 1rem;
    color: var(--inst-text);
  }

  body.inst-phone .inst-mobile-more-hint {
    margin: 0 0 14px;
    font-size: 11px;
    color: var(--inst-muted);
  }

  body.inst-phone .inst-mobile-more-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  body.inst-phone .inst-mobile-more-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 8px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.03);
    color: var(--inst-text);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
  }

  html[data-theme="light"] body.inst-phone .inst-mobile-more-nav a {
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.03);
  }

  body.inst-phone .inst-mobile-more-nav a.nav-hidden {
    display: none !important;
  }

  body.inst-phone .inst-mobile-more-nav a.active {
    border-color: color-mix(in srgb, var(--inst-nav-idle) 45%, transparent);
    background: rgba(143, 200, 255, 0.12);
    color: var(--inst-nav-idle);
  }

  body.inst-phone .inst-mobile-more-close {
    width: 100%;
    margin-top: 14px;
    min-height: 44px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: transparent;
    color: var(--inst-text);
    font: inherit;
    font-size: 14px;
    cursor: pointer;
  }

  html[data-theme="light"] body.inst-phone .inst-mobile-more-close {
    border-color: rgba(0, 0, 0, 0.12);
  }
}